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