tweak feed icons and tag list styles
[~bandali/bndl.org] / static / style.css
1 body {
2 /* background: #fffffa; */
3 font-family: sans-serif;
4 line-height: 1.6;
5 padding: 2em;
6 }
7
8 nav, main, footer {
9 margin: auto;
10 max-width: 38rem;
11 }
12
13 nav {
14 font-size: 0.84em;
15 }
16 main {
17 margin-bottom: 2em;
18 }
19 p {
20 margin: 1em 0;
21 }
22 header {
23 margin-bottom: 1.5em;
24 }
25 header >:not(h1) {
26 font-size: 0.875em;
27 }
28 header > p {
29 margin: 0;
30 }
31 footer {
32 border-top: 1px solid #bbb;
33 font-size: 0.84em;
34 padding-top: 1em;
35 }
36 footer p {
37 margin: 0;
38 }
39
40 h1 {
41 font-size: 1.5em;
42 }
43 h1 + address {
44 margin-top: 0.75em;
45 }
46
47 h2 {
48 font-size: 1.25em;
49 }
50 h3 {
51 font-size: 1.125em;
52 }
53
54 a {
55 color: #004caa;
56 padding: 0.3em 0;
57 text-decoration: underline #ccc;
58 }
59 a:hover, a:focus {
60 text-decoration: underline #666;
61 }
62 a:active {
63 color: #a10029;
64 outline: 0;
65 }
66
67 h4 {
68 margin: 0.75em auto;
69 }
70
71 article h3 {
72 font-weight: normal;
73 color: #777;
74 }
75
76 .notice {
77 background-color: #efefef;
78 text-align: center;
79 position: relative;
80 }
81 .notice::before {
82 content: "↪";
83 position: absolute;
84 left: 0.5em;
85 bottom: 0.05em;
86 }
87 .notice::after {
88 content: "↩";
89 position: absolute;
90 right: 0.5em;
91 bottom: 0.05em;
92 }
93
94 pre, code {
95 background: #f3f3f3;
96 padding: 1em;
97 }
98 pre > code {
99 padding: 0;
100 background: initial;
101 }
102 code {
103 font: 1.15em monospace;
104 text-transform: none;
105 padding: .2em .3em;
106 }
107 strong {
108 font-weight: bold;
109 }
110 em {
111 font-style: italic;
112 }
113
114 table td {
115 padding: 0.125em 0.3em;
116 }
117 table td:first-child {
118 padding-left: 0;
119 }
120 table td:last-child {
121 padding-right: 0
122 }
123 #notes {
124 margin-top: 0.9em;
125 }
126 .post-list {
127 width: 100%;
128 }
129 .post-list tr:hover {
130 background: #fafafa;
131 }
132 .post-list td {
133 padding: 0.25em 0;
134 }
135 .post-list td:nth-child(2) {
136 text-align: right;
137 }
138
139 dt {
140 margin-bottom: 0.15em;
141 }
142 dd {
143 font-size: 0.875em;
144 margin-left: 1.5em;
145 margin-bottom: 0.75em;
146 }
147 dd:last-child {
148 margin-bottom: 1em;
149 }
150 small {
151 font-size: 0.875em;
152 }
153 .muted {
154 color: #666;
155 }
156 .inbox {
157 margin-top: 2em;
158 }
159
160 ul, ol {
161 list-style: none;
162 padding-left: 1.5em;
163 position: relative;
164 }
165
166 li {
167 margin-bottom: 0.25em;
168 }
169
170 ul > li::before {
171 content: '•';
172 position: absolute;
173 left: 0.5em;
174 }
175
176 h2 + ul, h2 + dl, h2 + table, h1 + table, pre + h2 {
177 margin-top: 1em;
178 }
179 table + h2, h2 + h3, ul + h3 {
180 margin-top: 0.7em;
181 }
182 p + table {
183 margin-top: -0.3em;
184 }
185
186 .feed-icon {
187 margin-right: 3px
188 }
189 .feed-icon-h2 {
190 margin-left: 5px;
191 position: relative;
192 top: 2px
193 }
194
195 .tag-list {
196 padding-left: 0;
197 }
198 .tag-list li {
199 margin-right: 0.75em;
200 white-space: nowrap;
201 display: inline-block;
202 }
203 .tag-list > li::before {
204 content: '';
205 }
206
207 sup, sub { font-size: 0.85em; }
208 sup { vertical-align: super; }
209 sub { vertical-align: sub; }