Font and some styling
This commit is contained in:
@@ -14,6 +14,7 @@
|
||||
"astro": "^0.20.7"
|
||||
},
|
||||
"dependencies": {
|
||||
"@auth0/auth0-react": "^1.8.0"
|
||||
"@auth0/auth0-react": "^1.8.0",
|
||||
"normalize.css": "^8.0.1"
|
||||
}
|
||||
}
|
||||
|
||||
BIN
site/public/assets/fonts/NotoSerif-Regular.ttf
Normal file
BIN
site/public/assets/fonts/NotoSerif-Regular.ttf
Normal file
Binary file not shown.
@@ -1,12 +0,0 @@
|
||||
<svg width="193" height="256" fill="none" xmlns="http://www.w3.org/2000/svg">
|
||||
<style>
|
||||
#flame { fill: #FF5D01; }
|
||||
#a { fill: #000014; }
|
||||
@media (prefers-color-scheme: dark) {
|
||||
#a { fill: #fff; }
|
||||
}
|
||||
</style>
|
||||
|
||||
<path id="a" fill-rule="evenodd" clip-rule="evenodd" d="M131.496 18.929c1.943 2.413 2.935 5.67 4.917 12.181l43.309 142.27a180.277 180.277 0 00-51.778-17.53L99.746 60.56a3.67 3.67 0 00-7.042.01l-27.857 95.232a180.224 180.224 0 00-52.01 17.557l43.52-142.281c1.989-6.502 2.983-9.752 4.927-12.16a15.999 15.999 0 016.484-4.798c2.872-1.154 6.271-1.154 13.07-1.154h31.085c6.807 0 10.211 0 13.085 1.157a16 16 0 016.488 4.806z" fill="url(#paint0_linear)"/>
|
||||
<path id="flame" fill-rule="evenodd" clip-rule="evenodd" d="M136.678 180.151c-7.14 6.105-21.39 10.268-37.804 10.268-20.147 0-37.033-6.272-41.513-14.707-1.602 4.835-1.962 10.367-1.962 13.902 0 0-1.055 17.355 11.016 29.426 0-6.268 5.081-11.349 11.349-11.349 10.743 0 10.731 9.373 10.721 16.977v.679c0 11.542 7.054 21.436 17.086 25.606a23.27 23.27 0 01-2.339-10.2c0-11.008 6.463-15.107 13.973-19.87 5.977-3.79 12.616-8.001 17.192-16.449a31.013 31.013 0 003.744-14.82c0-3.299-.513-6.479-1.463-9.463z" />
|
||||
</svg>
|
||||
|
Before Width: | Height: | Size: 1.2 KiB |
@@ -1 +0,0 @@
|
||||
https://rawcdn.githack.com/snowpackjs/astro/main/examples/starter/public/favicon.ico
|
||||
@@ -1,33 +0,0 @@
|
||||
* {
|
||||
box-sizing: border-box;
|
||||
margin: 0;
|
||||
}
|
||||
|
||||
:root {
|
||||
font-family: -apple-system, BlinkMacSystemFont, Segoe UI, Helvetica, Arial,
|
||||
sans-serif, Apple Color Emoji, Segoe UI Emoji;
|
||||
font-size: 1rem;
|
||||
--user-font-scale: 1rem - 16px;
|
||||
font-size: clamp(
|
||||
0.875rem,
|
||||
0.4626rem + 1.0309vw + var(--user-font-scale),
|
||||
1.125rem
|
||||
);
|
||||
}
|
||||
|
||||
body {
|
||||
padding: 4rem 2rem;
|
||||
width: 100%;
|
||||
min-height: 100vh;
|
||||
display: grid;
|
||||
justify-content: center;
|
||||
background: #f9fafb;
|
||||
color: #111827;
|
||||
}
|
||||
|
||||
@media (prefers-color-scheme: dark) {
|
||||
body {
|
||||
background: #111827;
|
||||
color: #fff;
|
||||
}
|
||||
}
|
||||
@@ -1,55 +0,0 @@
|
||||
:root {
|
||||
--font-mono: Consolas, "Andale Mono WT", "Andale Mono", "Lucida Console",
|
||||
"Lucida Sans Typewriter", "DejaVu Sans Mono", "Bitstream Vera Sans Mono",
|
||||
"Liberation Mono", "Nimbus Mono L", Monaco, "Courier New", Courier,
|
||||
monospace;
|
||||
--color-light: #f3f4f6;
|
||||
}
|
||||
|
||||
@media (prefers-color-scheme: dark) {
|
||||
:root {
|
||||
--color-light: #1f2937;
|
||||
}
|
||||
}
|
||||
|
||||
a {
|
||||
color: inherit;
|
||||
}
|
||||
|
||||
header > div {
|
||||
font-size: clamp(2rem, -0.4742rem + 6.1856vw, 2.75rem);
|
||||
}
|
||||
|
||||
header > div {
|
||||
display: flex;
|
||||
flex-direction: column;
|
||||
align-items: center;
|
||||
}
|
||||
|
||||
header h1 {
|
||||
font-size: 1em;
|
||||
font-weight: 500;
|
||||
}
|
||||
header img {
|
||||
width: 2em;
|
||||
height: 2.667em;
|
||||
}
|
||||
|
||||
h2 {
|
||||
font-weight: 500;
|
||||
font-size: clamp(1.5rem, 1rem + 1.25vw, 2rem);
|
||||
}
|
||||
|
||||
.counter {
|
||||
display: grid;
|
||||
grid-auto-flow: column;
|
||||
gap: 1em;
|
||||
font-size: 2rem;
|
||||
justify-content: center;
|
||||
padding: 2rem 1rem;
|
||||
}
|
||||
|
||||
.counter > pre {
|
||||
text-align: center;
|
||||
min-width: 3ch;
|
||||
}
|
||||
@@ -1,10 +1,15 @@
|
||||
---
|
||||
import AuthTest from '../components/AuthTest.jsx';
|
||||
|
||||
let { title } = Astro.props;
|
||||
---
|
||||
<style lang="scss">
|
||||
@use "../styles/base";
|
||||
@use "../styles/global";
|
||||
|
||||
body {
|
||||
background-color: base.$bg-color;
|
||||
padding: 10px;
|
||||
font-family: 'NotoSerif';
|
||||
}
|
||||
</style>
|
||||
|
||||
<html lang="en">
|
||||
@@ -16,7 +21,6 @@ let { title } = Astro.props;
|
||||
</head>
|
||||
<body>
|
||||
<header>
|
||||
<AuthTest client:only />
|
||||
</header>
|
||||
<main>
|
||||
<slot/>
|
||||
|
||||
@@ -0,0 +1 @@
|
||||
$bg-color: #fff;
|
||||
@@ -0,0 +1,4 @@
|
||||
@font-face {
|
||||
font-family: 'NotoSerif';
|
||||
src: url('/assets/fonts/NotoSerif-Regular.ttf');
|
||||
}
|
||||
@@ -1,9 +1,8 @@
|
||||
@use "normalize.css/normalize.css";
|
||||
@use "base";
|
||||
@use "tokens";
|
||||
@use "typography";
|
||||
@use "utils";
|
||||
|
||||
body {
|
||||
background-color: black;
|
||||
color: white;
|
||||
}
|
||||
Reference in New Issue
Block a user