all repos — honk @ 1e772429bbbd39e127ff737ccccc495b5755ebc6

my fork of honk

views/style.css (view raw)

  1body {
  2	background: #305;
  3	color: #dde;
  4	font-size: 1em;
  5	word-wrap: break-word;
  6	font-family: sans-serif, "Noto Color Emoji";
  7}
  8pre, code {
  9	white-space: pre-wrap;
 10}
 11blockquote {
 12	margin-left: 0em;
 13	padding-left: 0.5em;
 14	border-left: 1px solid #aab;
 15}
 16table {
 17	display: block;
 18	max-width: 100%;
 19	overflow-x: auto;
 20}
 21a {
 22	color: #dde;
 23}
 24form, input, textarea {
 25	font-family: monospace, "Noto Color Emoji";
 26}
 27p {
 28	margin-top 1em;
 29	margin-bottom: 1em;
 30}
 31input {
 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}
 47header details {
 48	display: inline;
 49}
 50header details[open] summary {
 51	display: none;
 52}
 53main {
 54	max-width: 1200px;
 55	margin: auto;
 56	font-size: 1.5em;
 57}
 58.info {
 59	background: #002;
 60	border: 1px solid #dde;
 61	margin-bottom: 1em;
 62	padding: 0em 1em 0em 1em;
 63}
 64.info div {
 65	margin-top 1em;
 66	margin-bottom: 1em;
 67}
 68label, button, form input[type=submit], select {
 69	font-size: 16px;
 70	font-family: monospace;
 71	color: #dde;
 72	background: #305;
 73	border: 1px solid #dde;
 74	padding: 0.5em;
 75}
 76button a {
 77	text-decoration: none;
 78}
 79form {
 80	margin-top: 1em;
 81}
 82textarea {
 83	padding: 0.5em;
 84	font-size: 1em;
 85	background: #305;
 86	color: #dde;
 87	width: 600px;
 88	height: 8em;
 89	margin-bottom: 0.5em;
 90	box-sizing: border-box;
 91	max-width: 100%;
 92}
 93input[type="checkbox"] {
 94	position: fixed;
 95	top: -9999px;
 96}
 97input[type="checkbox"] + span:after {
 98	content: "no";
 99}
100input[type="checkbox"]:checked + span:after {
101	content: "yes";
102}
103input[type="checkbox"]:focus + span:after {
104	outline: 1px solid #dde;
105}
106input[type=file] {
107	display: none;
108}
109
110.honk {
111	width: 90%;
112	margin: auto;
113	background: #002;
114	border: 1px solid #dde;
115	border-radius: 1em;
116	margin-bottom: 1em;
117	padding-left: 1em;
118	padding-right: 1em;
119	padding-top: 0;
120	overflow: hidden;
121}
122.honk #honkform {
123	padding: 1em;
124	border: 1px solid #dde;
125}
126
127.honk a {
128	color: #dde;
129}
130.honk header .clip a {
131	color: #88a;
132}
133.honk header {
134	white-space: nowrap;
135	overflow: hidden;
136	text-overflow: ellipsis;
137	font-size: 0.8em;
138	margin-top: 1em;
139	height: 64px;
140}
141.honk header img {
142	float: left;
143	margin-right: 1em;
144	width: 64px;
145	height: 64px;
146}
147.honk header p {
148	margin-top: 0px;
149}
150.honk button {
151	margin-left: 4em;
152	margin-top: 2em;
153}
154.subtle {
155}
156.subtle .noise {
157	color: #aab;
158	font-size: 0.8em;
159}
160.subtle .noise a {
161	color: #aab;
162}
163.limited {
164	border: 1px solid #a79;
165	color: #a79;
166}
167.limited .noise {
168	color: #a79;
169}
170.limited .noise a {
171	color: #a79;
172}
173details.noise[open] summary {
174	display: none;
175}
176.inlineform {
177	display: inline;
178}
179.inlineform select {
180}
181.honk details.actions summary {
182	color: #aab;
183}
184.limited details.actions summary {
185	color: #a79;
186}
187h1, h2 {
188	font-size: 1.2em;
189}
190h3, h4 {
191	font-size: 1.1em;
192}
193
194img:not(.emu) {
195	background: #305;
196}
197img, video {
198	max-width: 100%
199}
200img.emu {
201	width: 2em;
202	height: 2em;
203	vertical-align: middle;
204	margin: -2px;
205	object-fit: contain;
206}
207@media screen and (max-width: 740px) {
208	body {
209		font-size: 12px;
210	}
211	.honk header {
212		height: 52px;
213	}
214	.honk header img {
215		width: 48px;
216		height: 48px;
217	}
218}