all repos — site @ b112be9a0fb27b5d28269a91a1d5abaa2cccc36e

source for my site, found at icyphox.sh

static/style.css (view raw)

  1:root {
  2  --bg: #fff;
  3  --cyan: #509c93;
  4  --light-gray: #eee;
  5  --gray: #6a6a6a;
  6  --code: #666;
  7  --dark: #444;
  8  --darker: #222;
  9  --code-bg: #0000000a;
 10}
 11
 12* {
 13  box-sizing: border-box;
 14  text-decoration: none;
 15  padding: 0;
 16  margin: 0;
 17}
 18
 19main {
 20  font-family: serif;
 21  font-size: 16px;
 22  padding: 0;
 23  margin: 10px;
 24  line-height: 160%;
 25}
 26
 27main h1 {
 28  font-size: 25px;
 29  padding: 10px 0 10px 0;
 30}
 31
 32main h2, h3 {
 33  padding: 20px 0 15px 0;
 34}
 35
 36.logo {
 37  width: 75%;
 38  margin: 50px auto 50px auto;
 39  padding: 50px 0 20px 0;
 40  display: block;
 41}
 42
 43.footer img {
 44  max-height: 2.5rem;
 45  display: inline-block;
 46  vertical-align: middle;
 47  image-orientation: from-image;
 48  max-width: 100%;
 49  padding: 0 0 5px 5px;
 50  cursor: pointer;
 51}
 52
 53.footer span {
 54  display: inline-block;
 55  padding: 0 0 0 10px;
 56  margin-top: 10px;
 57  word-wrap: break-word;
 58}
 59
 60a {
 61  margin: 0;
 62  padding: 0;
 63  box-sizing: border-box;
 64  text-decoration: none;
 65  word-wrap: break-word;
 66}
 67
 68main a {
 69  color: var(--darker);
 70  text-decoration: underline;
 71}
 72
 73table a {
 74  text-decoration: none;
 75}
 76
 77table a:hover {
 78  text-decoration: underline;
 79}
 80
 81body {
 82  max-width: 640px;
 83  padding: 0 10px;
 84  margin: 40px auto;
 85}
 86
 87main article img {
 88  max-width: 100%;
 89  display: block;
 90  margin: 0 0 15px 0;
 91}
 92
 93main ul, main ol {
 94  margin: 0 30px 7px 30px;
 95}
 96
 97main ul ul {
 98  margin-bottom: 0
 99}
100
101.subtitle {
102  font-style: italic;
103  font-weight: normal;
104  font-variant: unset;
105  color: var(--dark);
106  padding: 0 0 20px 0;
107}
108
109.muted {
110  color: var(--gray);
111}
112.muted a {
113  color: var(--cyan);
114  text-decoration: underline;
115}
116
117article p {
118  padding: 7px 0 7px 0;
119}
120
121article a {
122  color: var(--cyan);
123}
124
125pre {
126  overflow-x: auto;
127  overflow-y: hidden;
128  padding: 10px;
129  min-width: 0;
130  background-color: var(--code-bg) !important;
131  font-size: 15px !important;
132  margin-bottom: 10px;
133}
134
135pre > code {
136  color: var(--code);
137}
138
139.post-date {
140  color: var(--gray);
141}
142
143table {
144  width: 100%;
145}
146
147.index-date {
148  white-space: nowrap;
149  vertical-align: baseline;
150  color: var(--gray);
151}
152
153.index-post {
154  padding-bottom: 7px;
155}
156
157nav {
158  float: right;
159  transform: translateY(30%);
160}
161
162hr {
163  max-width: 100%;
164  text-align: left;
165  margin: 20px 0 20px 0;
166}
167
168footer {
169  border-top: 1.5px solid;
170  margin: 20px 0 40px 10px;
171  padding-top: 30px;
172}
173
174header img {
175  transform: translateY(-10%);
176}
177
178.post-date {
179  color: var(--gray);
180}
181
182blockquote {
183  margin: 7px 0 7px 0;
184}
185
186blockquote p {
187  font-style: italic;
188  color: var(--darker);
189  padding-left: 20px;
190  border-left: 3px solid var(--gray);
191}
192
193