views/style.css (view raw)
1body {
2 background: #305;
3 color: #dde;
4 font-size: 1em;
5 word-wrap: break-word;
6}
7pre, code {
8 white-space: pre-wrap;
9}
10blockquote {
11 margin-left: 0em;
12 padding-left: 0.5em;
13 border-left: 1px solid #aab;
14}
15table {
16 display: block;
17 max-width: 100%;
18 overflow-x: auto;
19}
20a {
21 color: #dde;
22}
23form {
24 font-family: monospace;
25}
26p {
27 margin-top 1em;
28 margin-bottom: 1em;
29}
30input {
31 font-family: monospace;
32 background: #305;
33 color: #dde;
34 font-size: 1.0em;
35 line-height: 1.2em;
36 padding: 0.5em;
37}
38body > header {
39 max-width: 1200px;
40 margin: 1em auto;
41 font-size: 1.5em;
42 text-align: right;
43}
44body > header span {
45 margin-right: 2em;
46}
47main {
48 max-width: 1200px;
49 margin: auto;
50 font-size: 1.5em;
51}
52.info {
53 background: #002;
54 border: 1px solid #dde;
55 margin-bottom: 1em;
56 padding: 0em 1em 0em 1em;
57}
58.info div {
59 margin-top 1em;
60 margin-bottom: 1em;
61}
62.info label, button, form input[type=submit], select {
63 font-size: 16px;
64 font-family: monospace;
65 color: #dde;
66 background: #305;
67 border: 1px solid #dde;
68 padding: 0.5em;
69}
70button a {
71 text-decoration: none;
72}
73.info form {
74 margin-top: 1em;
75}
76.info textarea {
77 padding: 0.5em;
78 font-size: 1em;
79 background: #305;
80 color: #dde;
81 width: 600px;
82 height: 8em;
83 margin-bottom: 0.5em;
84 box-sizing: border-box;
85}
86.info input[type="checkbox"] {
87 position: fixed;
88 top: -9999px;
89}
90.info input[type="checkbox"] + span:after {
91 content: "no";
92}
93.info input[type="checkbox"]:checked + span:after {
94 content: "yes";
95}
96.info input[type="checkbox"]:focus + span:after {
97 outline: 1px solid #dde;
98}
99.info input[type=file] {
100 display: none;
101}
102
103.honk {
104 width: 90%;
105 margin: auto;
106 background: #002;
107 border: 1px solid #dde;
108 border-radius: 1em;
109 margin-bottom: 1em;
110 padding-left: 1em;
111 padding-right: 1em;
112 padding-top: 0;
113}
114.honk a {
115 color: #dde;
116}
117.honk header .clip a {
118 color: #88a;
119}
120.honk header {
121 white-space: nowrap;
122 overflow: hidden;
123 text-overflow: ellipsis;
124 font-size: 0.8em;
125 margin-top: 1em;
126 height: 64px;
127}
128.honk header img {
129 float: left;
130 margin-right: 1em;
131 width: 64px;
132 height: 64px;
133}
134.honk header p {
135 margin-top: 0px;
136}
137.honk button {
138 margin-right: 6em;
139}
140.tonked {
141}
142.tonked .noise {
143 color: #aab;
144 font-size: 0.8em;
145}
146.tonked .noise a {
147 color: #aab;
148}
149.limited {
150 border: 1px solid #a79;
151 color: #a79;
152}
153.limited .noise {
154 color: #a79;
155}
156.limited .noise a {
157 color: #a79;
158}
159.inlineform {
160 display: inline;
161}
162.inlineform select {
163}
164img {
165 max-width: 100%
166}
167img.emu {
168 width: 2em;
169 height: 2em;
170 vertical-align: middle;
171 margin: -2px;
172 object-fit: contain;
173}
174@media screen and (max-width: 740px) {
175 body {
176 font-size: 12px;
177 }
178 .info textarea {
179 width: 20em;
180 }
181 .honk header {
182 height: 48px;
183 }
184 .honk header img {
185 width: 48px;
186 height: 48px;
187 }
188 .honk button {
189 margin-right: 4em;
190 }
191}