all repos — site @ 2fb9cf6851bf708c9d3d0ab2bf37cf2dbb3f2fa7

source for my site, found at icyphox.sh

static/style.css (view raw)

  1html { font-family: sans-serif; }
  2
  3html,
  4body {
  5	background: #021012;
  6}
  7
  8.container {
  9	position: absolute;
 10	top: 0;
 11	bottom: 0;
 12	left: 0;
 13	right: 0;
 14	color: white;
 15
 16	-webkit-animation: fadein 3s;
 17	   -moz-animation: fadein 3s;
 18	    -ms-animation: fadein 3s;
 19	     -o-animation: fadein 3s;
 20	        animation: fadein 3s;
 21}
 22
 23.container-text {
 24  position: absolute;
 25	top: 0;
 26	bottom: 0;
 27	left: 0;
 28	right: 0;
 29	color: white;
 30
 31	-webkit-animation: fadein 1.5s;
 32	   -moz-animation: fadein 1.5s;
 33	    -ms-animation: fadein 1.5s;
 34	     -o-animation: fadein 1.5s;
 35	        animation: fadein 1.5s;
 36}
 37
 38@keyframes fadein {
 39	from { opacity: 0; }
 40	to   { opacity: 1; }
 41}
 42
 43@-moz-keyframes fadein {
 44	from { opacity: 0; }
 45	to   { opacity: 1; }
 46}
 47
 48@-webkit-keyframes fadein {
 49	from { opacity: 0; }
 50	to   { opacity: 1; }
 51}
 52
 53.introduction {
 54	position: absolute;
 55	top: 50%;
 56	transform: translateY(-50%);
 57	width: 100%;
 58}
 59
 60.content {
 61	position: relative;
 62	font-size: 17px;
 63	top: 10%;
 64  left: 30%;
 65  right: 30%;
 66  width: 40%;
 67  line-height: 1.8;
 68}
 69
 70pre {
 71  padding: 10px;
 72}
 73
 74pre, pre code {
 75    background: #041b1e;
 76    color: white;
 77    word-wrap: break-word;
 78    overflow-x: auto;
 79    white-space: pre-wrap;
 80    white-space: -moz-pre-wrap;
 81    white-space: -pre-wrap;
 82    white-space: -o-pre-wrap;
 83}
 84
 85code {
 86    color: cyan;
 87    background: #041b1e;
 88    padding: 1px;
 89}
 90
 91.logo {
 92	width: 220px;
 93}
 94
 95.footer {
 96	color: gray;
 97	bottom: 20px;
 98	position: absolute;
 99	width: 100%;
100	text-align: center;
101	margin-bottom: 20px;
102}
103
104.header {
105	color: cyan;
106	top: 30px;
107  display: inline-block;
108	position: absolute;
109	width: 100%;
110  align: center;
111	text-align: center;
112}
113
114.header a {
115  margin-right: 20px;
116}
117
118.header a:last-child {
119  margin-right: 0
120}
121
122.muted {
123  color: gray
124}
125
126.muted a {
127  color: cyan
128}
129
130table {
131  width: 100%;
132}
133
134td {
135  white-space: nowrap;
136}
137
138td:first-child {
139  width: 100%;
140  max-width: 1px;
141  white-space: nowrap;
142  text-overflow: ellipsis;
143  overflow: hidden;
144}
145
146a {
147	color: gray;
148	margin: 0;
149	transition: all 200ms;
150	text-decoration: none;
151}
152
153a:hover {
154	color: #021012;
155	background: cyan;
156}
157
158.left {
159	display: inline-block;
160	margin-bottom: 30px;
161	margin-left: 0;
162	margin-right: 30px;
163}
164
165.right {
166	display: inline-block;
167}
168
169.right a {
170	display: inline-block;
171	margin-right: 30px;
172}
173
174.noselect {
175  -webkit-touch-callout:none;
176  -webkit-user-select:none;
177  -khtml-user-select:none;
178  -moz-user-select:none;
179  -ms-user-select:none;
180  user-select:none
181}
182
183img {
184  height: auto;
185  width: 100%;
186
187  max-width: 720px;
188}
189
190footer img {
191  all: initial;
192}
193
194.footimgs {
195  max-height: 2rem;
196  display: inline-block;
197  vertical-align: text-top;
198  image-orientation: from-image;
199  max-width: 100%;
200  padding-bottom: 5px;
201}
202
203footer a:hover {
204  all: initial;
205}
206
207h1, h2, h3 {
208  font-weight: normal;
209}
210
211h2 { 
212  color: gray;
213}
214
215h3 {
216  color: cyan;
217}
218
219p {
220  bottom: 2em;
221}
222
223blockquote {
224  font-style: italic;
225  color: gray;
226}
227
228blockquote::before {
229  content: "\“";
230  font-size: 40px;
231  font-weight: bold;
232}
233
234blockquote::after {
235  content: "\”";
236  font-size: 40px;
237  font-weight: bold;
238  
239}
240
241::selection {
242  background-color: cyan;
243  color: #021012;
244}
245
246@media only screen and (max-width: 70em) {
247	.left {
248		display: block;
249		margin-right: 0;
250	}
251	.right {
252		display: block;
253	}
254  .right a {
255    margin-right: 15px;
256  }
257	.right a:last-child {
258		margin-right: 0;
259	}
260  
261/*  .container-text {
262    overflow-y: auto;
263  }*/
264
265	.content {
266		left: 5%;
267    right: 5%;
268    bottom: 10%;
269		width: 90%;
270	}
271
272  .content h1, h2, h3 {
273    line-height: 1.5;
274  }
275
276  pre {
277    overflow-x: auto;
278  }
279
280  .logo {
281    width: 180px;
282  }
283}