nzambello/nzambello.dev
1
0
Fork 0
Code Issues Pull requests Actions Packages Projects Releases Wiki Activity

perf: optimizations

Browse source
This commit is contained in:
Nicola Zambello 2023-09-08 11:50:24 +02:00
parent 7ddfa8a8a0
commit b8643204e0
Signed by: nzambello
GPG key ID: 56E4A92C2C1E50BA
3 changed files with 48 additions and 23 deletions
Show stats Download patch file Download diff file Expand all files Collapse all files

38
src/components/Logo.astro
View file

@ -1,12 +1,39 @@
<svg xmlns="http://www.w3.org/2000/svg" class="logo" width="456" height="94" viewBox="0 0 435 94" fill="none"> <svg
xmlns="http://www.w3.org/2000/svg"
class="logo"
width="456"
height="94"
viewBox="0 0 435 94"
fill="none"
>
<g class="text-container"> <g class="text-container">
<text x="43" y="79.45" dominant-baseline="ideographic" textLength="324" lengthAdjust="spacingAndGlyphs" class="fills">nzambello</text> <text
x="43"
y="79.45"
dominant-baseline="ideographic"
textLength="324"
lengthAdjust="spacingAndGlyphs"
class="fills">nzambello</text
>
</g> </g>
<g class="text-container text-container--light"> <g class="text-container text-container--light">
<text x="372" y="79.45" dominant-baseline="ideographic" textLength="72" lengthAdjust="spacingAndGlyphs" class="fills">/&gt;</text> <text
x="372"
y="79.45"
dominant-baseline="ideographic"
textLength="72"
lengthAdjust="spacingAndGlyphs"
class="fills">/&gt;</text
>
</g> </g>
<g class="text-container text-container--light"> <g class="text-container text-container--light">
<text y="79.45" dominant-baseline="ideographic" textLength="36" lengthAdjust="spacingAndGlyphs" class="fills">&lt;</text> <text
y="79.45"
dominant-baseline="ideographic"
textLength="36"
lengthAdjust="spacingAndGlyphs"
class="fills">&lt;</text
>
</g> </g>
</svg> </svg>
<style> <style>
@ -22,7 +49,8 @@
} }
} }
svg.logo .text-container { svg.logo .text-container {
font-family: 'Fira Code'; /* font-family: 'Source Code Pro'; */
font-family: monospace;
font-style: normal; font-style: normal;
font-weight: 700; font-weight: 700;
font-size: 72px; font-size: 72px;

Side by side Swipe Overlay

Before

Width:  |  Height:  |  Size: 1.3 KiB

After

Width:  |  Height:  |  Size: 1.5 KiB

14
src/layouts/BaseLayout.astro
View file

@ -1,4 +1,5 @@
--- ---
import '@picocss/pico/css/pico.min.css';
import '../styles/global.css'; import '../styles/global.css';
import Header from '../components/Header.astro'; import Header from '../components/Header.astro';
@ -51,19 +52,12 @@ const canonicalURL = new URL(Astro.url.pathname, Astro.site);
src="https://umami.nzambello.dev/script.js" src="https://umami.nzambello.dev/script.js"
data-website-id="5964d580-4baa-4c91-b4cd-6e2eae4a5bf3"></script> data-website-id="5964d580-4baa-4c91-b4cd-6e2eae4a5bf3"></script>
<link rel="preconnect" href="https://fonts.bunny.net" /> <!-- <link rel="preconnect" href="https://fonts.bunny.net" />
<link <link
href="https://fonts.bunny.net/css?family=fira-code:400,700&display=swap" href="https://fonts.bunny.net/css?family=source-code-pro:400,700&display=swap"
as="style" as="style"
rel="stylesheet" rel="stylesheet"
/> /> -->
<link rel="preconnect" href="https://cdn.jsdelivr.net" />
<link
rel="stylesheet"
as="style"
href="https://cdn.jsdelivr.net/npm/@picocss/pico@1/css/pico.min.css"
/>
</head> </head>
<body> <body>
<a class="skip-link" href="#navigation">Skip to navigation</a> <a class="skip-link" href="#navigation">Skip to navigation</a>

19
src/styles/global.css
View file

@ -72,20 +72,21 @@
--form-element-focus-color: var(--primary-focus); --form-element-focus-color: var(--primary-focus);
--switch-color: var(--primary-inverse); --switch-color: var(--primary-inverse);
--switch-checked-background-color: var(--primary); --switch-checked-background-color: var(--primary);
--font-family: 'Fira Code', 'Ubuntu', system-ui, -apple-system, "Segoe UI", "Roboto", "Ubuntu", /* --font-family: 'Source Code Pro', 'Ubuntu', system-ui, -apple-system, "Segoe UI", "Roboto", "Ubuntu",
"Cantarell", "Noto Sans", sans-serif, "Apple Color Emoji", "Segoe UI Emoji", "Cantarell", "Noto Sans", sans-serif, "Apple Color Emoji", "Segoe UI Emoji",
"Segoe UI Symbol", "Noto Color Emoji"; "Segoe UI Symbol", "Noto Color Emoji"; */
--font-family: monospace;
} }
body { body {
font-display: swap; /* font-family: var(--font-family, 'Source Code Pro'), sans-serif; */
font-family: var(--font-family, 'Fira Code'), sans-serif; font-family: monospace;
overflow-x: hidden; overflow-x: hidden;
} }
.headings>:last-child, .headings>:last-child,
hgroup>:last-child { hgroup>:last-child {
font-family: var(--font-family, 'Fira Code'), sans-serif !important; font-family: var(--font-family, 'Source Code Pro'), monospace !important;
} }
::-moz-selection, ::-moz-selection,
@ -101,11 +102,13 @@ pre,
code, code,
kbd, kbd,
samp { samp {
--font-family: 'Fira Code', 'Ubuntu Mono', "Menlo", "Consolas", "Roboto Mono", "Ubuntu Monospace", /* --font-family: 'Source Code Pro', 'Ubuntu Mono', "Menlo", "Consolas", "Roboto Mono", "Ubuntu Monospace",
"Noto Mono", "Oxygen Mono", "Liberation Mono", monospace, "Noto Mono", "Oxygen Mono", "Liberation Mono", monospace,
"Apple Color Emoji", "Segoe UI Emoji", "Segoe UI Symbol", "Noto Color Emoji"; "Apple Color Emoji", "Segoe UI Emoji", "Segoe UI Symbol", "Noto Color Emoji"; */
--font-family: monospace;
--code-color: var(--text-color); --code-color: var(--text-color);
font-family: 'Fira Code', var(--font-family); /* font-family: 'Source Code Pro', var(--font-family); */
font-family: monospace;
} }
.skip-link { .skip-link {