Skip to content

Commit ac4900a

Browse files
Rich-HarrisRich-Harris
authored
Simplify css (#231)
* simplify * more * more * banish --sk-text-m * more * more
1 parent f85b983 commit ac4900a

Some content is hidden

Large Commits have some content hidden by default. Use the searchbox below for content that may be hidden.

49 files changed

+152
-311
lines changed

‎apps/svelte.dev/src/routes/(authed)/apps/+page.svelte‎

Lines changed: 0 additions & 1 deletion
Original file line numberDiff line numberDiff line change
@@ -247,7 +247,6 @@
247247
248248
h2 {
249249
color: var(--sk-text-2);
250-
font-size: var(--sk-text-s);
251250
font-weight: 400;
252251
overflow: hidden;
253252
text-overflow: ellipsis;

‎apps/svelte.dev/src/routes/(authed)/playground/[id]/AppControls.svelte‎

Lines changed: 0 additions & 1 deletion
Original file line numberDiff line numberDiff line change
@@ -311,7 +311,6 @@ export default app;`
311311
border: none;
312312
color: currentColor;
313313
font-family: var(--sk-font-ui);
314-
font-size: var(--sk-text-m);
315314
opacity: 0.7;
316315
outline: none;
317316
flex: 1;

‎apps/svelte.dev/src/routes/+error.svelte‎

Lines changed: 1 addition & 1 deletion
Original file line numberDiff line numberDiff line change
@@ -62,7 +62,7 @@
6262
}
6363
6464
h1 {
65-
font-size: var(--sk-text-xxl);
65+
font-size: var(--sk-font-size-h1);
6666
margin: 0 0 0.5em 0;
6767
}
6868

‎apps/svelte.dev/src/routes/+page.svelte‎

Lines changed: 0 additions & 10 deletions
Original file line numberDiff line numberDiff line change
@@ -120,13 +120,3 @@
120120
{/snippet}
121121
</Footer>
122122
</div>
123-
124-
<style>
125-
h2 {
126-
line-height: 1.05;
127-
}
128-
129-
p {
130-
font-size: var(--sk-text-m);
131-
}
132-
</style>

‎apps/svelte.dev/src/routes/_home/Deployment.svelte‎

Lines changed: 4 additions & 2 deletions
Original file line numberDiff line numberDiff line change
@@ -145,7 +145,8 @@
145145
left: 0;
146146
width: 100%;
147147
color: var(--sk-text-3);
148-
font-size: var(--sk-text-xs);
148+
font-family: var(--sk-font-ui);
149+
font-size: var(--sk-font-size-ui-medium);
149150
}
150151
151152
.globe span::before {
@@ -180,7 +181,8 @@
180181
}
181182
182183
.platforms a span {
183-
font-size: var(--sk-text-xs);
184+
font-family: var(--sk-font-ui);
185+
font-size: var(--sk-font-size-ui-medium);
184186
color: var(--sk-text-3);
185187
text-align: center;
186188
}

‎apps/svelte.dev/src/routes/_home/Features.svelte‎

Lines changed: 8 additions & 14 deletions
Original file line numberDiff line numberDiff line change
@@ -34,10 +34,7 @@
3434
<strong>Deploy anywhere</strong> with adapters.
3535
</p>
3636

37-
<p>
38-
SvelteKit is the framework that
39-
<strong>grows with you</strong>, whatever you end up building.
40-
</p>
37+
<p>SvelteKit is the framework that grows with you, whatever you end up building.</p>
4138
</div>
4239
</div>
4340
</Section>
@@ -67,18 +64,19 @@
6764
6865
.wall {
6966
margin: 0;
70-
font-size: var(--sk-text-xs);
67+
font-family: var(--sk-font-ui);
68+
font-size: var(--sk-font-size-ui-small);
69+
color: var(--sk-text-4);
70+
71+
strong {
72+
color: var(--sk-text-1);
73+
}
7174
}
7275
7376
p + p {
7477
margin-top: 1em;
7578
}
7679
77-
p,
78-
strong {
79-
color: var(--sk-text-3);
80-
}
81-
8280
@media (min-width: 600px) {
8381
h2 {
8482
margin-top: 0.5em;
@@ -109,10 +107,6 @@
109107
margin-top: 0.1em;
110108
}
111109
112-
p {
113-
font-size: var(--sk-text-s);
114-
}
115-
116110
.features {
117111
padding-top: clamp(0px, calc(23.333vw - 210px), 70px);
118112
}

‎apps/svelte.dev/src/routes/_home/Hero.svelte‎

Lines changed: 2 additions & 3 deletions
Original file line numberDiff line numberDiff line change
@@ -72,7 +72,7 @@
7272
}
7373
7474
strong {
75-
font-size: var(--sk-text-l);
75+
font-size: var(--sk-font-size-h2);
7676
text-align: center;
7777
font-family: var(--sk-font-heading);
7878
text-transform: lowercase;
@@ -93,7 +93,7 @@
9393
gap: 0.1rem;
9494
background: var(--sk-theme-1);
9595
padding: 0.35em 0.8em;
96-
font-size: var(--sk-text-s);
96+
font-family: var(--sk-font-ui);
9797
letter-spacing: 0.05em;
9898
font-weight: 600;
9999
white-space: nowrap;
@@ -142,7 +142,6 @@
142142
143143
strong {
144144
text-align: left;
145-
font-size: calc(0.04 * var(--width));
146145
}
147146
148147
.hero {

‎apps/svelte.dev/src/routes/_home/HeroSvelteKit.svelte‎

Lines changed: 2 additions & 7 deletions
Original file line numberDiff line numberDiff line change
@@ -5,7 +5,7 @@
55
<section class="hero">
66
<div class="hero-contents">
77
<div class="hero-text">
8-
<div class="tagline">Go full-stack with</div>
8+
<h3 class="tagline">Go full-stack with</h3>
99
<div class="logotype" role="img" aria-label="SvelteKit">
1010
<Logotype />
1111
</div>
@@ -78,14 +78,9 @@
7878
}
7979
8080
.hero .tagline {
81-
font-size: var(--sk-text-l);
82-
font-weight: 200;
83-
line-height: 1.2;
81+
font-size: var(--sk-font-size-h2);
8482
color: var(--sk-text-2);
85-
font-family: var(--sk-font-body);
8683
margin-bottom: 2rem;
87-
/* max-width: 12em; */
88-
/* margin: 0 auto; */
8984
}
9085
9186
.logotype :global(svg) {

‎apps/svelte.dev/src/routes/_home/Showcase.svelte‎

Lines changed: 0 additions & 3 deletions
Original file line numberDiff line numberDiff line change
@@ -39,8 +39,6 @@
3939
h2 {
4040
color: white;
4141
margin-bottom: 1em;
42-
text-transform: uppercase;
43-
font-size: var(--sk-text-s);
4442
text-align: center;
4543
}
4644
@@ -81,7 +79,6 @@
8179
backdrop-filter: blur(3px);
8280
opacity: 0;
8381
transition: opacity 0.2s;
84-
font-size: var(--sk-text-s);
8582
filter: drop-shadow(0 0 0.5rem rgba(0, 0, 0, 0.5));
8683
}
8784

‎apps/svelte.dev/src/routes/_home/Supporters/index.svelte‎

Lines changed: 1 addition & 2 deletions
Original file line numberDiff line numberDiff line change
@@ -58,12 +58,11 @@
5858
<style>
5959
h3 {
6060
color: var(--sk-text-2);
61-
font-size: var(--sk-text-l);
6261
}
6362
6463
.intro {
65-
max-width: 28em; /* text balancing */
6664
margin: 1em 0 3.2rem 0;
65+
text-wrap: balance;
6766
}
6867
6968
.supporters-grid {

0 commit comments

Comments
 (0)