simplify

Author: Rich-Harris

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

@@ -62,7 +62,7 @@
 	}
 
 	h1 {
-		font-size: var(--sk-text-xxl);
+		font-size: var(--sk-font-size-h1);
 		margin: 0 0 0.5em 0;
 	}
 

apps/svelte.dev/src/routes/_home/Svelte.svelte

@@ -78,7 +78,7 @@
 
 	.definition em {
 		font-style: normal;
-		font-size: var(--sk-text-xxl);
+		font-size: var(--sk-font-size-h1);
 		color: var(--sk-theme-1);
 	}
 

apps/svelte.dev/src/routes/_home/common.css

@@ -7,11 +7,6 @@
 	--background-2: var(--sk-theme-2);
 }
 
-.home h2 {
-	font-size: var(--sk-text-xl);
-	line-height: 1.2;
-}
-
 .home .grid {
 	display: grid;
 	gap: 1em;
@@ -23,10 +18,6 @@
 }
 
 @media (min-width: 900px) {
-	.home h2 {
-		font-size: var(--sk-text-xxl);
-	}
-
 	.home .grid {
 		grid-template-columns: repeat(var(--columns), 1fr);
 		gap: 7rem;

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

@@ -44,9 +44,8 @@
 		width: 100%;
 		height: 100%;
 		font-family: inherit;
-		font-size: var(--sk-text-xl);
+		font-size: var(--sk-font-size-h2);
 		border: none;
-		/* border: 1px solid var(--sk-back-5); */
 		border-radius: var(--sk-border-radius);
 		padding: 2rem 2rem 2rem 5rem;
 		background: no-repeat 1rem 50% / 3rem 3rem url(/icons/search.svg);

apps/svelte.dev/src/routes/tutorial/[slug]/Loading.svelte

@@ -160,7 +160,8 @@
 	}
 
 	h2 {
-		font-size: var(--sk-text-xl);
+		font-family: var(--sk-font-ui);
+		font-size: var(--sk-font-size-ui-large);
 	}
 
 	p {

packages/site-kit/src/lib/components/Text.svelte

@@ -68,22 +68,6 @@
 			font-size: var(--sk-text-m);
 		}
 
-		/* TODO is this still used? don't think so */
-		section {
-			max-width: var(--sk-line-max-width);
-			padding: 0 0 0 1rem;
-
-			h2,
-			h3,
-			h4 {
-				margin-left: -1rem;
-			}
-
-			a code {
-				color: inherit;
-			}
-		}
-
 		code {
 			white-space: pre-wrap;
 			padding: 0.2rem 0.4rem;
@@ -324,7 +308,7 @@
 				opacity: 0;
 				transition: opacity 0.2s;
 
-				:where(h2, h3, h4, h5, h6):hover & {
+				:where(h2, h3):hover & {
 					opacity: 1;
 				}
 			}

packages/site-kit/src/lib/home/Blurb.svelte

@@ -36,11 +36,6 @@
 		grid-gap: 1rem;
 	}
 
-	.grid :global(h2) {
-		font-size: var(--sk-text-xl);
-		line-height: 1.2;
-	}
-
 	.grid {
 		display: grid;
 		gap: 1em;
@@ -52,10 +47,6 @@
 	}
 
 	@media (min-width: 900px) {
-		.grid :global(h2) {
-			font-size: var(--sk-text-xl);
-		}
-
 		.grid {
 			--columns: 3;
 

packages/site-kit/src/lib/home/TrySection.svelte

@@ -74,7 +74,6 @@
 		display: inline-block;
 		width: 25rem;
 		margin: 0 0 1rem;
-		font-size: var(--sk-text-xl);
 	}
 
 	@media (min-width: 900px) {

packages/site-kit/src/lib/nav/Menu.svelte

@@ -430,10 +430,6 @@
 		padding-left: 1rem;
 	}
 
-	.viewport :global(a[aria-current='true']) {
-		background-color: hsla(var(--sk-theme-1-hsl), 0.05);
-	}
-
 	.viewport :global(a:hover),
 	.related-menu-arrow:hover {
 		border-radius: var(--sk-border-radius);
@@ -442,9 +438,4 @@
 
 		background-color: var(--sk-back-4);
 	}
-
-	.viewport :global(a[aria-current='true']:hover) {
-		background-color: hsla(var(--sk-theme-1-hsl), 0.05);
-		color: var(--sk-theme-1);
-	}
 </style>

packages/site-kit/src/lib/nav/NavContextMenu.svelte

@@ -34,16 +34,16 @@
 	{#if contents}
 		{#each contents as { sections, title }, index}
 			<section>
-				<h3>{title}</h3>
+				<h2>{title}</h2>
 
 				{#if sections.length !== 0}
 					<ul>
 						{#each sections as { title, sections: subsections }}
 							<li>
 								{#if title}
-									<h4>
+									<h3>
 										{title}
-									</h4>
+									</h3>
 								{/if}
 
 								<ul>
@@ -77,7 +77,7 @@
 	nav {
 		padding: 0.29rem;
 		padding-top: 0;
-		font-family: var(--sk-font-body);
+		font-family: var(--sk-font-ui);
 		overflow-y: auto;
 
 		height: 100%;
@@ -86,7 +86,6 @@
 	section > ul {
 		padding: 1rem;
 		padding-bottom: 0rem;
-
 		margin-bottom: 0;
 	}
 
@@ -104,8 +103,8 @@
 		transform: translateX(2.5%);
 	}
 
-	h3,
-	h4 {
+	h2,
+	h3 {
 		display: block;
 
 		padding-bottom: 0.8rem;
@@ -117,7 +116,7 @@
 		color: var(--sk-text-3);
 	}
 
-	h3 {
+	h2 {
 		position: sticky;
 		top: -1px;
 		z-index: 1;
@@ -160,7 +159,7 @@
 	}
 
 	[aria-current='true'] {
-		background-color: hsla(var(--sk-theme-1-hsl), 0.1) !important;
+		/* background-color: hsla(var(--sk-theme-1-hsl), 0.1) !important; */
 		color: var(--sk-theme-1) !important;
 		font-weight: 400;
 	}
@@ -174,7 +173,7 @@
 		font-size: 1.1rem;
 		font-weight: 600;
 		letter-spacing: 1px;
-		font-family: var(--sk-font-body);
+		font-family: var(--sk-font-ui);
 		line-height: 1;
 		color: var(--sk-theme-1);
 		background: hsla(var(--sk-theme-1-hsl), 0.1);