summaryrefslogtreecommitdiffstats
path: root/assets/css/_basics.scss
diff options
context:
space:
mode:
Diffstat (limited to 'assets/css/_basics.scss')
-rw-r--r--assets/css/_basics.scss194
1 files changed, 0 insertions, 194 deletions
diff --git a/assets/css/_basics.scss b/assets/css/_basics.scss
deleted file mode 100644
index 7689379..0000000
--- a/assets/css/_basics.scss
+++ /dev/null
@@ -1,194 +0,0 @@
1::selection {
2 background-color: prop(--colors --select --bg);
3 color: prop(--colors --select --fg);
4}
5
6img::selection {
7 background-color: prop(--colors --select --img-bg);
8}
9
10:focus {
11 outline: 2px solid prop(--colors --focus-ring);
12 outline-offset: 3px;
13}
14
15html,
16pre,
17code {
18 font-feature-settings: 'calt' 0, 'dlig' 1, 'ss09' 1;
19}
20
21html {
22 height: 100%;
23 background-color: prop(--colors --bg);
24 color: prop(--colors --fg);
25 font-family: $font-fam--text;
26 font-size: px-to-em($font-size);
27 line-height: $line-height;
28}
29
30body {
31 box-sizing: border-box;
32 min-height: 100%;
33 margin: 0;
34 padding: 0;
35}
36
37main {
38 @include iro-responsive-env(('sm', 'md')) {
39 font-size: iro-responsive-set((1rem, iro-px-to-rem(18px)));
40 }
41}
42
43pre,
44code {
45 font-family: $font-fam--mono;
46}
47
48code {
49 color: prop(--colors --code --fg);
50 font-size: px-to-em(15px);
51}
52
53pre {
54 margin: 0;
55 overflow-x: auto;
56 font-size: px-to-em(15px);
57 line-height: 1.4;
58
59 code {
60 color: currentColor;
61 font-size: 1em;
62 }
63
64 strong {
65 //font-weight: normal;
66 }
67}
68
69strong {
70 color: prop(--colors --fg-lo);
71 font-weight: bold;
72}
73
74small {
75 color: prop(--colors --fg-hi);
76 font-size: px-to-em(14px);
77}
78
79ul,
80ol {
81 margin: ($line-height * 1rem) 0 0;
82 padding: 0;
83 list-style: none;
84}
85
86li {
87 position: relative;
88 padding-left: prop(--dims --indent);
89
90 &::before {
91 display: inline-block;
92 position: absolute;
93 width: prop(--dims --indent);
94 margin-left: calc(-1 * #{prop(--dims --indent)});
95 color: prop(--colors --fg-hi);
96 }
97}
98
99ul > li::before {
100 content: '-';
101}
102
103ol {
104 counter-reset: cnt;
105
106 > li {
107 counter-increment: cnt;
108
109 &::before {
110 content: counter(cnt) '.';
111 }
112 }
113}
114
115ul ul {
116 margin-top: 0;
117}
118
119dl {
120 margin: ($line-height * 1rem) 0 0;
121 padding: 0;
122}
123
124dt,
125dd {
126 display: inline-block;
127}
128
129dt {
130 color: prop(--colors --fg-lo);
131 font-weight: bold;
132
133 &::after {
134 content: ':';
135 color: prop(--colors --fg);
136 font-weight: normal;
137 }
138}
139
140dd {
141 margin: 0 3ch 0 0;
142}
143
144h1,
145h2,
146h3,
147h4,
148h5,
149h6 {
150 @include iro-responsive-modular-scale(font-size, 0, $responsive-mod-scale);
151
152 margin: ($line-height * 2rem) 0 0;
153 color: prop(--colors --fg-lo);
154 font-weight: 700;
155 letter-spacing: 1px;
156 text-transform: uppercase;
157
158 & + & {
159 margin-top: $line-height * 1rem;
160 }
161
162 strong {
163 color: prop(--colors --accent --color, $global: true);
164 font-weight: 550;
165 }
166}
167
168p {
169 margin: ($line-height * 1rem) 0 0;
170}
171
172figure {
173 margin: ($line-height * 1rem) 0 0;
174 padding: 0;
175
176 img {
177 display: block;
178 max-width: 100%;
179 max-height: 70vh;
180 object-fit: contain;
181 }
182}
183
184:link,
185:visited {
186 color: prop(--colors --link --default);
187}
188
189hr {
190 height: 1px;
191 margin: ($line-height * 2rem) 0;
192 border: 0;
193 background-color: prop(--colors --obj-hi);
194}