-
Notifications
You must be signed in to change notification settings - Fork 1.1k
/
global.css
206 lines (179 loc) · 4.66 KB
/
global.css
1
2
3
4
5
6
7
8
9
10
11
12
13
14
15
16
17
18
19
20
21
22
23
24
25
26
27
28
29
30
31
32
33
34
35
36
37
38
39
40
41
42
43
44
45
46
47
48
49
50
51
52
53
54
55
56
57
58
59
60
61
62
63
64
65
66
67
68
69
70
71
72
73
74
75
76
77
78
79
80
81
82
83
84
85
86
87
88
89
90
91
92
93
94
95
96
97
98
99
100
101
102
103
104
105
106
107
108
109
110
111
112
113
114
115
116
117
118
119
120
121
122
123
124
125
126
127
128
129
130
131
132
133
134
135
136
137
138
139
140
141
142
143
144
145
146
147
148
149
150
151
152
153
154
155
156
157
158
159
160
161
162
163
164
165
166
167
168
169
170
171
172
173
174
175
176
177
178
179
180
181
182
183
184
185
186
187
188
189
190
191
192
193
194
195
196
197
198
199
200
201
202
203
204
205
206
@tailwind base;
@tailwind components;
@tailwind utilities;
@layer base {
/* Design System Theming */
html {
--color-default: 236 228 236;
--color-neutral: 29 40 58;
--color-primary: 112 64 255;
--color-secondary: 58 191 248;
--color-accent: 244 113 181;
--color-warning: 244 193 82;
--color-error: 251 111 132;
--color-success: 43 212 189;
--color-info: 12 166 233;
--color-foreground: 15 23 42;
--color-background: 236 228 236;
@apply bg-default text-slate-900;
}
html.dark {
--color-default: 15 23 41;
--color-neutral: 29 40 58;
--color-primary: 112 64 255;
--color-secondary: 58 191 248;
--color-accent: 244 113 181;
--color-warning: 244 193 82;
--color-error: 251 111 132;
--color-success: 43 212 189;
--color-info: 12 166 233;
--color-foreground: 232 221 255;
--color-background: 15 23 41;
@apply bg-default text-t3-purple-100;
}
html {
scroll-padding-top: 7rem;
scroll-behavior: smooth;
@apply scrollbar-thin scrollbar-track-transparent scrollbar-thumb-t3-purple-300 dark:scrollbar-track-transparent dark:scrollbar-thumb-t3-purple-300;
}
.t3-scrollbar {
@apply scrollbar-thin scrollbar-track-slate-300 scrollbar-thumb-t3-purple-300 dark:scrollbar-track-t3-purple-200/10 dark:scrollbar-thumb-t3-purple-300;
}
/* Typewriter */
.cursor::after {
display: block;
content: "";
position: absolute;
width: 4px;
height: 100%;
background-color: #fff;
animation: cursor 0.6s linear infinite alternate;
will-change: opacity;
}
@keyframes cursor {
0%,
40% {
opacity: 1;
}
60%,
100% {
opacity: 0;
}
}
/* Base stylings */
*:focus:not(:focus-visible) {
outline: none;
}
a:hover,
a:focus {
text-decoration: underline;
}
a:focus {
outline: 2px solid currentColor;
outline-offset: 0.25em;
}
article > section :is(ul, ol) > * + * {
margin-top: 0.75rem;
}
article > section li > :is(p, pre, blockquote):not(:first-child) {
margin-top: 1rem;
}
article > section :is(ul, ol) {
padding-left: 1em;
}
article > section nav :is(ul, ol) {
padding-left: inherit;
}
td,
th {
padding: 6px;
text-align: left;
}
.mobile-sidebar-toggle {
overflow: hidden;
height: 100vh;
}
.mobile-sidebar-toggle #grid-left {
display: block;
}
@media (min-width: 768px) {
.mobile-sidebar-toggle #grid-left {
display: none;
}
}
/* Markdown Styling */
.markdown {
@apply flex w-full flex-col items-start justify-start px-3 text-slate-900 selection:bg-t3-purple-200 selection:text-t3-purple-500 dark:text-t3-purple-100 dark:selection:bg-t3-purple-100 dark:selection:text-slate-900;
}
.markdown h1 {
@apply mt-8 mb-4 text-3xl font-extrabold;
}
.markdown h2 {
@apply mt-8 mb-4 text-2xl font-semibold;
}
.markdown h3 {
@apply mt-4 mb-0 text-xl font-semibold;
}
.markdown li {
@apply list-disc break-all lg:break-normal;
}
.markdown ol > li {
@apply list-decimal;
}
.markdown p {
@apply mb-4 dark:text-white;
}
.markdown a > p {
@apply mb-0 text-sm;
}
.markdown a:not(.heading-link--hidden---effects) {
@apply text-t3-purple-500 underline decoration-slate-500
decoration-dotted underline-offset-2
hover:text-t3-purple-700 dark:text-t3-purple-200
dark:decoration-t3-purple-200 dark:hover:text-t3-purple-300;
}
.markdown .remark-code-title {
@apply z-10 -mb-1 mt-3 w-full rounded-t-md border-b-2 border-t3-purple-200 bg-[#292D3E] px-2 py-1 font-mono text-t3-purple-200;
}
.markdown pre {
@apply mx-auto mb-3 rounded-md p-2 pl-3 font-mono sm:pt-2;
}
.markdown ol {
@apply w-full;
}
.markdown details {
@apply mt-2 w-full rounded-md bg-t3-purple-200/50 px-3 pb-0.5 ring
ring-t3-purple-200 transition-all duration-75 ease-in-out
dark:bg-slate-700 dark:ring-slate-500;
}
.markdown details > summary {
@apply cursor-pointer text-t3-purple-700 dark:text-slate-300;
}
.markdown details[open] > summary {
@apply border-b-2 border-t3-purple-200 dark:border-slate-500;
}
.markdown summary {
@apply py-3;
}
.markdown p > img {
@apply mt-8 text-sm;
}
.markdown table > tbody > tr > td > a {
overflow-wrap: anywhere;
}
.markdown table {
@apply max-w-full table-fixed;
}
.markdown table > tbody > tr > td {
@apply align-top;
}
.markdown blockquote a {
@apply text-slate-900 dark:text-t3-purple-50;
}
.DocSearch-SearchBar {
@apply my-3 rounded-md bg-purple-400 p-2 text-sm;
}
#DocSearch-SearchBar {
@apply my-3 rounded-md bg-purple-400 p-2 text-sm;
}
}