cadf1aab0a1f1b541b2ceed3757cf3a00af4a7dc
[bookman] / bookmarks.css
1 * { /* RESET */
2   font-size: 12pt;
3   margin: 0;
4   padding: 0;
5   text-decoration: none;
6   font-weight: normal;
7   color: black;
8   background-color: white;
9   box-sizing: border-box;
10 }
11
12 html, body {
13   background-color: #DDD;
14 }
15
16 .folder, form.newfolder{
17   display: block;
18   width: 98%;
19   border: 1px solid black;
20   border-radius: .5em;
21   margin: 1em auto;
22   padding: 0;
23   overflow: hidden;
24   #column-width: 16em;
25   #column-rule: 1px solid #BBB;
26 }
27
28 .folder > h1 {
29   font-size: 1.25em;
30   font-weight: bold;
31   padding: .125em 1em .125em 2em;
32   border-bottom: 1px solid black;
33   background-color: #ACF;
34   border-radius: .375em .375em 0 0;
35   min-height: 1em;
36   #column-span: all;
37 }
38
39 .folder > h1 + a {
40   display: block;
41   position: relative;
42   top: -1.5em;
43   margin-left: 1em;
44   color: transparent;
45   background-color: transparent;
46   width: 0; height: 0;
47 }
48 .folder > h1 + a:before {
49   content: '\2699';
50   color: #333;
51 }
52
53 .modfolder {
54   display: block;
55   position: fixed;
56   left: 50%; margin: 0 -15em;
57   vertical-align: middle;
58   text-align: center;
59   width: 30em;
60   min-width: 240px;
61   z-index: 3;
62   border-radius: .5em;
63   border: 1px solid black;
64   padding: .125em 0;
65   min-height: 3em;
66   background-color: #ACF;
67 }
68 .modfolder:before {
69   display: block;
70   content: '';
71   border: 1px solid black;
72   border-radius: 0 0 .5em .5em;
73   border-top: 0px;
74   top: 1.75em; bottom: .125em; left: .5%; right: .5%;
75   position: absolute;
76   background-color: white;
77   z-index: -1;
78 }
79 .modfolder + *:after {
80   content: ' ';
81   position: fixed;
82   top: 0; bottom: 0; left: 0; right: 0;
83   background-color: rgba(0,0,0,.5);
84 }
85
86 .modfolder > label,
87 .modfolder > a {
88   display: inline-block;
89   width: 33%;
90   padding: .25em;
91   border: 1px solid black;
92   border-radius: .5em .5em 0 0;
93 }
94 .modfolder > label { border-bottom: 0px; }
95 .modfolder > a { background-color: #EEE; }
96
97 .modfolder > input {
98   display: block;
99   width: 28em;
100   max-width: 95%;
101   margin: 1em;
102 }
103 .modfolder > button {
104   display: inline-block;
105   float: right;
106   margin: .5em;
107   padding: 0 .5em;
108 }
109
110 .bookmark {
111   width: 16em;
112   display: inline-block;
113   margin: .5em 1em;
114 }
115
116 .bookmark > a.modify {
117   font-size: 0;
118   color: white;
119 }
120 .bookmark > a.modify:before {
121   content: '\2699';
122   color: #333;
123   font-size: initial;
124 }
125
126 .bookmark > a.link >  img {
127   height: 1.25em;
128   vertical-align: text-bottom;
129   margin: 0 .5ex;
130 }
131
132 form.newbookmark,
133 form.modbookmark {
134   margin: .5em 1em;
135   break-inside: avoid;
136 }