Skip to content

Commit 8581151

Browse files
committed
update site styles
1 parent b2436a8 commit 8581151

File tree

4 files changed

+72
-64
lines changed

4 files changed

+72
-64
lines changed

src/app.css

+9
Original file line numberDiff line numberDiff line change
@@ -6,6 +6,15 @@ button:not(.unstyled) {
66
@apply inline-flex items-center px-4 py-2 border border-gray-300 shadow-sm text-sm sm:text-lg font-medium rounded-md text-gray-700 bg-gray-100;
77
}
88

9+
pre,
10+
pre code {
11+
@apply !text-xs md:!text-sm;
12+
}
13+
14+
pre code[class*='language-'] {
15+
white-space: pre-wrap;
16+
}
17+
918
.prose {
1019
max-width: none;
1120
}

src/prism.css

+51-53
Original file line numberDiff line numberDiff line change
@@ -8,150 +8,148 @@
88

99
code[class*='language-'],
1010
pre[class*='language-'] {
11-
@apply text-sm md:text-base;
12-
color: #d6deeb;
13-
font-family: Consolas, Monaco, 'Andale Mono', 'Ubuntu Mono', monospace;
14-
text-align: left;
15-
white-space: pre;
16-
word-spacing: normal;
17-
word-break: normal;
18-
word-wrap: normal;
19-
line-height: 1.5;
20-
21-
-moz-tab-size: 4;
22-
-o-tab-size: 4;
23-
tab-size: 4;
24-
25-
-webkit-hyphens: none;
26-
-moz-hyphens: none;
27-
-ms-hyphens: none;
28-
hyphens: none;
11+
color: #d6deeb;
12+
font-family: Consolas, Monaco, 'Andale Mono', 'Ubuntu Mono', monospace;
13+
text-align: left;
14+
white-space: pre;
15+
word-spacing: normal;
16+
word-break: normal;
17+
word-wrap: normal;
18+
19+
-moz-tab-size: 4;
20+
-o-tab-size: 4;
21+
tab-size: 4;
22+
23+
-webkit-hyphens: none;
24+
-moz-hyphens: none;
25+
-ms-hyphens: none;
26+
hyphens: none;
2927
}
3028

3129
pre[class*='language-']::-moz-selection,
3230
pre[class*='language-'] ::-moz-selection,
3331
code[class*='language-']::-moz-selection,
3432
code[class*='language-'] ::-moz-selection {
35-
text-shadow: none;
36-
background: rgba(29, 59, 83, 0.99);
33+
text-shadow: none;
34+
background: rgba(29, 59, 83, 0.99);
3735
}
3836

3937
pre[class*='language-']::selection,
4038
pre[class*='language-'] ::selection,
4139
code[class*='language-']::selection,
4240
code[class*='language-'] ::selection {
43-
text-shadow: none;
44-
background: rgba(29, 59, 83, 0.99);
41+
text-shadow: none;
42+
background: rgba(29, 59, 83, 0.99);
4543
}
4644

4745
@media print {
48-
code[class*='language-'],
49-
pre[class*='language-'] {
50-
text-shadow: none;
51-
}
46+
code[class*='language-'],
47+
pre[class*='language-'] {
48+
text-shadow: none;
49+
}
5250
}
5351

5452
/* Code blocks */
5553
pre[class*='language-'] {
56-
padding: 1em;
57-
margin: 0.5em 0;
58-
overflow: auto;
54+
/* padding: 1em; */
55+
/* margin: 0.5em 0; */
56+
overflow: auto;
5957
}
6058

6159
:not(pre) > code[class*='language-'],
6260
pre[class*='language-'] {
63-
color: #d6deeb;
64-
background: #19212e;
61+
color: #d6deeb;
62+
background: #19212e;
6563
}
6664

6765
:not(pre) > code[class*='language-'] {
68-
padding: 0.1em;
69-
border-radius: 0.3em;
70-
white-space: normal;
66+
/* padding: 0.1em; */
67+
border-radius: 0.3em;
68+
white-space: normal;
7169
}
7270

7371
.token.comment,
7472
.token.prolog,
7573
.token.cdata {
76-
color: rgb(99, 119, 119);
74+
color: rgb(99, 119, 119);
7775
}
7876

7977
.token.punctuation {
80-
color: rgb(199, 146, 234);
78+
color: rgb(199, 146, 234);
8179
}
8280

8381
.namespace {
84-
color: rgb(178, 204, 214);
82+
color: rgb(178, 204, 214);
8583
}
8684

8785
.token.deleted {
88-
color: rgba(239, 83, 80, 0.56);
89-
font-style: italic;
86+
color: rgba(239, 83, 80, 0.56);
87+
font-style: italic;
9088
}
9189

9290
.token.symbol,
9391
.token.property {
94-
color: rgb(128, 203, 196);
92+
color: rgb(128, 203, 196);
9593
}
9694

9795
.token.tag,
9896
.token.operator,
9997
.token.keyword {
100-
color: rgb(127, 219, 202);
98+
color: rgb(127, 219, 202);
10199
}
102100

103101
.token.boolean {
104-
color: rgb(255, 88, 116);
102+
color: rgb(255, 88, 116);
105103
}
106104

107105
.token.number {
108-
color: rgb(247, 140, 108);
106+
color: rgb(247, 140, 108);
109107
}
110108

111109
.token.constant,
112110
.token.function,
113111
.token.builtin,
114112
.token.char {
115-
color: rgb(130, 170, 255);
113+
color: rgb(130, 170, 255);
116114
}
117115

118116
.token.selector,
119117
.token.doctype {
120-
color: rgb(199, 146, 234);
121-
font-style: italic;
118+
color: rgb(199, 146, 234);
119+
font-style: italic;
122120
}
123121

124122
.token.attr-name,
125123
.token.inserted {
126-
color: rgb(173, 219, 103);
127-
font-style: italic;
124+
color: rgb(173, 219, 103);
125+
font-style: italic;
128126
}
129127

130128
.token.string,
131129
.token.url,
132130
.token.entity,
133131
.language-css .token.string,
134132
.style .token.string {
135-
color: rgb(173, 219, 103);
133+
color: rgb(173, 219, 103);
136134
}
137135

138136
.token.class-name,
139137
.token.atrule,
140138
.token.attr-value {
141-
color: rgb(255, 203, 139);
139+
color: rgb(255, 203, 139);
142140
}
143141

144142
.token.regex,
145143
.token.important,
146144
.token.variable {
147-
color: rgb(214, 222, 235);
145+
color: rgb(214, 222, 235);
148146
}
149147

150148
.token.important,
151149
.token.bold {
152-
font-weight: bold;
150+
font-weight: bold;
153151
}
154152

155153
.token.italic {
156-
font-style: italic;
154+
font-style: italic;
157155
}

src/routes/__layout.svelte

+1-1
Original file line numberDiff line numberDiff line change
@@ -23,7 +23,7 @@
2323
<Sidebar />
2424
<main class="flex-1 w-0 flex flex-col md:px-8 xl:px-0 ">
2525
<div class="max-w-full flex-1 relative focus:outline-none">
26-
<div class="py-6 pb-24 px-4 sm:px-6 prose prose-sm sm:prose-lg">
26+
<div class="py-6 pb-24 px-4 sm:px-6 prose">
2727
<slot />
2828
</div>
2929
</div>

tailwind.config.cjs

+11-10
Original file line numberDiff line numberDiff line change
@@ -1,6 +1,5 @@
1-
module.exports = {
2-
darkMode: 'class',
3-
content: ['./src/**/*.{html,js,svelte,ts,md,svx}'],
1+
const config = {
2+
content: ['./src/**/*.{html,js,svelte,ts}'],
43
theme: {
54
extend: {
65
typography: ({ theme }) => {
@@ -15,14 +14,14 @@ module.exports = {
1514
},
1615
code: {
1716
borderRadius: theme('borderRadius.md'),
18-
paddingTop: theme('spacing.1'),
19-
paddingBottom: theme('spacing.1'),
20-
paddingLeft: theme('spacing.1'),
21-
paddingRight: theme('spacing.1'),
17+
paddingTop: '0.25rem',
18+
paddingBottom: '0.25rem',
19+
paddingLeft: '0.5rem',
20+
paddingRight: '0.5rem',
2221
fontFamily: 'inherit !important',
2322
fontWeight: '500 !important',
24-
color: theme('colors.slate.900'),
25-
backgroundColor: theme('colors.slate.300')
23+
color: theme('colors.slate.800'),
24+
backgroundColor: theme('colors.slate.200')
2625
},
2726
'code::before': {
2827
content: '""'
@@ -93,5 +92,7 @@ module.exports = {
9392
}
9493
}
9594
},
96-
plugins: [require('@tailwindcss/typography'), require('@tailwindcss/forms')]
95+
plugins: [require('@tailwindcss/typography')]
9796
}
97+
98+
module.exports = config

0 commit comments

Comments
 (0)