all repos — honk @ 60166f362b42a3ce1f89df5cab4275b6f5f558b4

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}
  7pre, code {
  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}