all repos — site @ 05461846fb6ac5f061262565a38f87e067b09b50

source for my site, found at icyphox.sh

static/style.css (view raw)

  1:root {
  2  --bg: #fff;
  3  --cyan: #1e9191;
  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  padding: 10px 0 10px 0;
 29}
 30
 31main h2, h3 {
 32  padding: 20px 0 15px 0;
 33}
 34
 35main h2:first-of-type {
 36  font-size: 20px;
 37  padding: 0 0 20px 0;
 38}
 39
 40.icons img {
 41  max-height: 2.5rem;
 42  display: inline-block;
 43  vertical-align: middle;
 44  image-orientation: from-image;
 45  max-width: 100%;
 46  padding: 0 0 5px 3px;
 47  cursor: pointer;
 48}
 49
 50a {
 51  margin: 0;
 52  padding: 0;
 53  box-sizing: border-box;
 54  text-decoration: none;
 55  color: #000;
 56  word-wrap: break-word;
 57}
 58
 59main a {
 60  color: var(--darker);
 61  text-decoration: underline;
 62}
 63
 64table a {
 65  text-decoration: none;
 66}
 67
 68table a:hover {
 69  text-decoration: underline;
 70}
 71
 72body {
 73  max-width: 640px;
 74  padding: 20px;
 75  margin: 0;
 76}
 77
 78main article img {
 79  max-width: 100%;
 80  display: block;
 81  margin: 0 0 15px 0;
 82}
 83
 84main ul, main ol {
 85	margin: 0 30px 7px 30px;
 86}
 87
 88main ul ul {
 89	margin-bottom: 0
 90}
 91
 92.subtitle {
 93  font-style: italic;
 94  font-weight: normal;
 95  font-variant: unset;
 96  color: var(--dark);
 97  padding-bottom: 20px;
 98}
 99
100.muted {
101  color: var(--gray);
102}
103.muted a {
104  color: var(--cyan);
105  text-decoration: underline;
106}
107
108article p {
109  padding: 7px 0 7px 0;
110}
111
112pre {
113  overflow-x: auto;
114  overflow-y: hidden;
115  padding: 10px;
116  min-width: 0;
117  background-color: var(--code-bg) !important;
118  font-size: 15px !important;
119  margin-bottom: 10px;
120}
121
122pre > code {
123  color: var(--code);
124}
125
126.post-date {
127  color: var(--gray);
128}
129
130table {
131  width: 100%;
132}
133
134.index-date {
135  white-space: nowrap;
136  vertical-align: baseline;
137  color: var(--gray);
138}
139
140.index-post {
141  padding-bottom: 7px;
142}
143
144nav {
145  float: right;
146  transform: translateY(30%);
147}
148
149hr {
150  max-width: 100%;
151  text-align: left;
152  margin: 20px 0 20px 0;
153}
154
155footer {
156  margin: 20px 0 40px 10px;
157}
158
159header img {
160  transform: translateY(-10%);
161}
162
163.post-date {
164  color: var(--gray);
165}
166
167blockquote {
168  margin: 7px 0 7px 0;
169}
170blockquote p {
171  font-style: italic;
172  color: var(--darker);
173  padding-left: 20px;
174  border-left: 3px solid var(--gray);
175}