re-implement all the things
[mdref/mdref] / public / index.css
1 * {
2 font-size: 99.9%;
3 }
4
5 body, code {
6 font-family: Inconsolata, Monospace, 'Courier New', Courier, monospace;
7 }
8 body {
9 font-size: 1.5em;
10 margin: 0;
11 padding: 0;
12 padding-bottom: 5em;
13 color: #3f3f3f;
14 }
15
16 body>* {
17 margin-left: 1em;
18 }
19 body>ul, body>div>ul {
20 margin-left: 2em;
21 }
22
23 .sidebar {
24 font-size: .9em;
25 float: right;
26 background: #f0f0f0;
27 border-bottom-left-radius: 10px;
28 padding: 0;
29 width: auto;
30 min-width: 200px;
31 padding-right: 1em;
32 }
33 .sidebar>ul {
34 }
35 .sidebar ul {
36 margin-left: 1em;
37 margin-top: .5em;
38 padding: 0;
39 list-style-type: none;
40 }
41
42 .sidebar .edit {
43 display: block;
44 position: absolute;
45 top: 2em;
46 right: 0.5em;
47 -webkit-transform: rotate(45deg);
48 transform: rotate(45deg);
49 text-decoration: none;
50 color: white;
51 font-weight: bold;
52 text-shadow: 0 0 5px red;
53 }
54
55 code {
56 display: inline-block;
57 border-radius: 2px;
58 padding: 0px 2px 2px 2px;
59 background: #e0e0e0;
60 color: #606060;
61 box-shadow: 0 0 1px #999;
62 }
63
64 code code {
65 display: inline;
66 padding: 0;
67 background: transparent;
68 border: none;
69 box-shadow: none;
70 }
71
72 pre>code {
73 padding: 1em;
74 }
75 pre>code, pre>code code {
76 background: #333;
77 color: #eee;
78 }
79
80 p, pre, table {
81 margin: 1em 2em 2em 2em;
82 }
83
84 li>p {
85 margin: 1em 0;
86 }
87
88 blockquote {
89 border-top: 1px solid #800000;
90 border-bottom: 1px solid #800000;
91 background: #ffe4e1;
92 margin: 2em 0;
93 }
94
95 ul {
96 margin-bottom: 2em;
97 }
98 li {
99 margin-bottom: .5em;
100 }
101 a, h1 code>a {
102 color: #2f4f4f;
103 }
104 a:hover {
105 text-decoration: none;
106 }
107 a[href^="http:"]:after, a[href^="https:"]:after {
108 content: " ⬈";
109 }
110
111 .var {
112 color: #800000;
113 }
114 .constant {
115 color: #2e8b57;
116 }
117
118 h1 {
119 line-height: 1.5;
120 }
121 h1 code {
122 font-weight: normal;
123 font-size: .9em;
124 line-height: 1.33;
125 }
126
127 footer, h1, li h3, th {
128 background: #708090;
129 color: #f5f5dc;
130 }
131
132 footer, h1 {
133 margin: 0;
134 padding: 1em;
135 }
136
137 li h3 {
138 border-radius: 4px;
139 display: inline-block;
140 width: auto;
141 padding: .2em;
142 margin: .5em 0 0 0;
143 }
144
145 body>h3, body>div>h3 {
146 margin-left: 2em;
147 }
148
149 h1 .constant, pre>code .consant, li h3 .constant {
150 color: #98fb98;
151 }
152
153 h1 .var, pre>code .var, li h3 .var {
154 color: #f4a460;
155 }
156
157 footer a, h1 a, pre>code a, li h3 a {
158 color: #b0e0e6;
159 }
160
161 li h3 a {
162 text-decoration: none;
163 }
164 li h3 a:hover {
165 text-decoration: underline;
166 }
167
168 #disqus_thread {
169 margin-top: 8em;
170 margin-right: 2em;
171 }
172
173 footer {
174 font-size: smaller;
175 text-align: center;
176 clear: both;
177 position: fixed;
178 bottom: 0;
179 width: 100%;
180 padding: 0;
181 }
182
183 footer ul {
184 margin: 0;
185 padding: 1em 0;
186 }
187
188 footer li {
189 list-style-type: none;
190 display: inline-block;
191 margin: 0 1em;
192 }
193
194 footer a {
195 text-decoration: none;
196 }
197
198 footer a:hover {
199 text-decoration: underline;
200 }
201
202 table {
203 border-collapse: collapse;
204 }
205 th, td {
206 padding: .4em;
207 }
208
209 h1, footer, table, .sidebar, pre>code, li h3 {
210 box-shadow: 0 0 4px #708090;
211 }