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