fix: website fonts

This commit is contained in:
iCrawl
2022-10-09 02:10:35 +02:00
parent a5d2ce2059
commit 5f72d8b645
6 changed files with 44 additions and 5 deletions

View File

@@ -1,4 +1,5 @@
---
import '../styles/main.css';
import '@code-hike/mdx/styles.css';
import '../styles/ch.css';
import type { MarkdownLayoutProps } from 'astro';

View File

@@ -0,0 +1,16 @@
@import url('https://rsms.me/inter/inter.css');
:root {
font-family: 'Inter', ui-sans-serif, system-ui, -apple-system, BlinkMacSystemFont, 'Segoe UI', Roboto,
'Helvetica Neue', Arial, 'Noto Sans', sans-serif, 'Apple Color Emoji', 'Segoe UI Emoji', 'Segoe UI Symbol',
'Noto Color Emoji';
font-feature-settings: 'cv02', 'cv03', 'cv04', 'cv11';
}
@supports (font-variation-settings: normal) {
:root {
font-family: 'Inter var', ui-sans-serif, system-ui, -apple-system, BlinkMacSystemFont, 'Segoe UI', Roboto,
'Helvetica Neue', Arial, 'Noto Sans', sans-serif, 'Apple Color Emoji', 'Segoe UI Emoji', 'Segoe UI Symbol',
'Noto Color Emoji';
}
}

View File

@@ -2,7 +2,10 @@ import type { PropsWithChildren } from 'react';
export function DiscordMessages({ rounded, children }: PropsWithChildren<{ rounded?: boolean }>) {
return (
<div className={`pt-0.1 bg-[rgb(54_57_63)] pb-4 ${rounded ? 'rounded' : ''}`} id="messages-wrapper">
<div
className={`font-source-sans-pro pt-0.1 bg-[rgb(54_57_63)] pb-4 ${rounded ? 'rounded' : ''}`}
id="messages-wrapper"
>
{children}
</div>
);

View File

@@ -22,7 +22,23 @@ export default defineConfig({
presetWebFonts({
provider: 'bunny',
fonts: {
mono: ['JetBrains Mono', 'JetBrains Mono:400,600,700'],
mono: ['JetBrains Mono:400,600,700'],
'source-sans-pro': [
'Source Sans Pro:300,400,500,600',
{ name: 'ui-sans-serif', provider: 'none' },
{ name: 'system-ui', provider: 'none' },
{ name: '-apple-system', provider: 'none' },
{ name: 'BlinkMacSystemFont', provider: 'none' },
{ name: 'Segoe UI', provider: 'none' },
{ name: 'Roboto', provider: 'none' },
{ name: 'Helvetica Neue', provider: 'none' },
{ name: 'Arial', provider: 'none' },
{ name: 'sans-serif', provider: 'none' },
{ name: 'Apple Color Emoji', provider: 'none' },
{ name: 'Segoe UI Emoji', provider: 'none' },
{ name: 'Segoe UI Symbol', provider: 'none' },
{ name: 'Noto Color Emoji', provider: 'none' },
],
},
}),
presetTypography({

View File

@@ -13,7 +13,7 @@
"dev": "yarn run --top-level docs && concurrently 'yarn dev:css' 'yarn dev:next'",
"dev:next": "next dev",
"dev:css": "yarn generate:css --watch",
"generate:css": "unocss 'src/**/*.tsx' '../ui/src/**/*.tsx' --out-file ./src/styles/unocss.css --config ../ui/unocss.config.ts",
"generate:css": "unocss 'src/**/*.tsx' '../ui/src/lib/components/**/*.tsx' --out-file ./src/styles/unocss.css --config ../ui/unocss.config.ts",
"lint": "prettier --check . && cross-env TIMING=1 eslint src --ext .mjs,.js,.cjs,.ts,.tsx",
"format": "prettier --write . && cross-env TIMING=1 eslint src --ext .mjs,.js,.cjs,.ts,.tsx --fix"
},

View File

@@ -1,13 +1,16 @@
@import url('https://rsms.me/inter/inter.css');
:root {
font-family: 'Inter', ui-sans-serif, system-ui, -apple-system, BlinkMacSystemFont, Segoe UI, Roboto, Helvetica Neue;
font-family: 'Inter', ui-sans-serif, system-ui, -apple-system, BlinkMacSystemFont, 'Segoe UI', Roboto,
'Helvetica Neue', Arial, 'Noto Sans', sans-serif, 'Apple Color Emoji', 'Segoe UI Emoji', 'Segoe UI Symbol',
'Noto Color Emoji';
font-feature-settings: 'cv02', 'cv03', 'cv04', 'cv11';
}
@supports (font-variation-settings: normal) {
:root {
font-family: 'Inter var', Arial, Noto Sans, sans-serif, 'Apple Color Emoji', 'Segoe UI Emoji', Segoe UI Symbol,
font-family: 'Inter var', ui-sans-serif, system-ui, -apple-system, BlinkMacSystemFont, 'Segoe UI', Roboto,
'Helvetica Neue', Arial, 'Noto Sans', sans-serif, 'Apple Color Emoji', 'Segoe UI Emoji', 'Segoe UI Symbol',
'Noto Color Emoji';
}
}