|
1
|
1 * {
|
|
|
2 box-sizing: border-box;
|
|
|
3 }
|
|
|
4
|
|
|
5 body {
|
|
|
6 font-family: Sans-Serif;
|
|
|
7 }
|
|
|
8
|
|
|
9 a {
|
|
|
10 text-decoration: none;
|
|
|
11 }
|
|
|
12 a:hover {
|
|
|
13 text-decoration: underline;
|
|
|
14 }
|
|
2
|
15
|
|
12
|
16 input[type="submit"],
|
|
9
|
17 [onclick] {
|
|
|
18 cursor: pointer;
|
|
|
19 }
|
|
|
20
|
|
|
21 [pulldown] {
|
|
|
22 position: relative;
|
|
|
23 }
|
|
|
24 [pulldown_menu] {
|
|
11
|
25 display: none; /* set to flex */
|
|
|
26 flex-direction: column;
|
|
9
|
27 z-index: 20;
|
|
|
28 position: absolute;
|
|
|
29 top: 40px;
|
|
|
30 border: 1px solid #DDDDDD;
|
|
|
31 text-align: left;
|
|
|
32 background-color: #ffffff;
|
|
11
|
33 white-space: nowrap;
|
|
9
|
34 }
|
|
|
35
|
|
2
|
36 div[header] {
|
|
|
37 display: flex;
|
|
|
38 justify-content: space-between;
|
|
|
39 align-items: center;
|
|
|
40 }
|
|
8
|
41
|
|
|
42 div[header] img {
|
|
|
43 width: 50px;
|
|
|
44 height: 50px;
|
|
|
45 object-fit: cover;
|
|
|
46 border-radius: 50%;
|
|
|
47 }
|
|
9
|
48
|
|
|
49 div[header] [pulldown_menu] {
|
|
|
50 right: 0;
|
|
|
51 margin-top: 20px;
|
|
|
52 }
|
|
12
|
53
|
|
|
54 [error] {
|
|
|
55 font-size: small;
|
|
|
56 color: firebrick;
|
|
|
57 }
|
|
|
58 [error][flash] {
|
|
|
59 color: red;
|
|
|
60 }
|
|
|
61 [error="success"] {
|
|
|
62 color: green;
|
|
|
63 }
|
|
|
64 [error="success"][flash] {
|
|
|
65 color: lime;
|
|
|
66 }
|
