diff --git a/bun.lock b/bun.lock index 9a3e5aa..3d48a10 100644 --- a/bun.lock +++ b/bun.lock @@ -7,7 +7,9 @@ "@astrojs/mdx": "^4.2.3", "@astrojs/rss": "^4.0.11", "@astrojs/sitemap": "^3.3.0", + "@fontsource-variable/alegreya": "^5.2.5", "@fontsource-variable/inter": "^5.2.5", + "@fontsource-variable/merriweather": "^5.2.2", "@fontsource-variable/newsreader": "^5.2.6", "@tailwindcss/vite": "^4.0.17", "astro": "^5.5.6", @@ -100,8 +102,12 @@ "@esbuild/win32-x64": ["@esbuild/win32-x64@0.25.3", "", { "os": "win32", "cpu": "x64" }, "sha512-ICgUR+kPimx0vvRzf+N/7L7tVSQeE3BYY+NhHRHXS1kBuPO7z2+7ea2HbhDyZdTephgvNvKrlDDKUexuCVBVvg=="], + "@fontsource-variable/alegreya": ["@fontsource-variable/alegreya@5.2.5", "", {}, "sha512-j3gDsSJmjWPwtuDxa0TBi0YULttywpB7BzKxdm585LtSbfzYkGb7Th1gX/hzmIack96H9tnFAQjeJL1Ubessgw=="], + "@fontsource-variable/inter": ["@fontsource-variable/inter@5.2.5", "", {}, "sha512-TrWffUAFOnT8zroE9YmGybagoOgM/HjRqMQ8k9R0vVgXlnUh/vnpbGPAS/Caz1KIlOPnPGh6fvJbb7DHbFCncA=="], + "@fontsource-variable/merriweather": ["@fontsource-variable/merriweather@5.2.2", "", {}, "sha512-DZjuulo723T3TTf9ibAuWA2y1jsLlA+zDSA6j5AdnJF5rvpjlE9B/IRFiHt5rmKMdAS8tHF5GTEfQ9dwBRMtow=="], + "@fontsource-variable/newsreader": ["@fontsource-variable/newsreader@5.2.6", "", {}, "sha512-FeYF9/TNdgLubdk7rqtwaIDk9Y2CJQC9Vrup+hDiO/POqprtq7US0qSZw7IoLVFcGw+bTGYvPSdVMmSsrPFJhw=="], "@img/sharp-darwin-arm64": ["@img/sharp-darwin-arm64@0.33.5", "", { "optionalDependencies": { "@img/sharp-libvips-darwin-arm64": "1.0.4" }, "os": "darwin", "cpu": "arm64" }, "sha512-UT4p+iz/2H4twwAoLCqfA9UH5pI6DggwKEGuaPy7nCVQ8ZsiY5PIcrRvD1DzuY3qYL07NtIQcWnBSY/heikIFQ=="], diff --git a/package.json b/package.json index 597b683..7e27fd0 100644 --- a/package.json +++ b/package.json @@ -13,7 +13,9 @@ "@astrojs/mdx": "^4.2.3", "@astrojs/rss": "^4.0.11", "@astrojs/sitemap": "^3.3.0", + "@fontsource-variable/alegreya": "^5.2.5", "@fontsource-variable/inter": "^5.2.5", + "@fontsource-variable/merriweather": "^5.2.2", "@fontsource-variable/newsreader": "^5.2.6", "@tailwindcss/vite": "^4.0.17", "astro": "^5.5.6", diff --git a/src/components/BaseHead.astro b/src/components/BaseHead.astro index 4b74a98..d72acf8 100644 --- a/src/components/BaseHead.astro +++ b/src/components/BaseHead.astro @@ -1,6 +1,6 @@ --- import interWoff2 from '@fontsource-variable/inter/files/inter-latin-wght-normal.woff2?url'; -import newsreaderWoff2 from '@fontsource-variable/newsreader/files/newsreader-latin-wght-normal.woff2?url'; +import alegreyaWoff2 from '@fontsource-variable/alegreya/files/alegreya-latin-wght-normal.woff2?url'; import siteConfig from '../data/site-config'; import '../styles/global.css'; @@ -44,7 +44,7 @@ function formatCanonicalURL(url: string | URL) { - + diff --git a/src/data/site-config.ts b/src/data/site-config.ts index 13ab8a1..918e616 100644 --- a/src/data/site-config.ts +++ b/src/data/site-config.ts @@ -83,19 +83,9 @@ const siteConfig: SiteConfig = { }, ], hero: { - title: "Hi There & Welcome to My Corner of the Web!", + title: "books. they're what's on tap here.", text: - "I'm **Ethan Donovan**, a web developer at Amazing Studio, dedicated to the realms of collaboration and artificial intelligence. My approach involves embracing intuition, conducting just enough research, and leveraging aesthetics as a catalyst for exceptional products. I have a profound appreciation for top-notch software, visual design, and the principles of product-led growth. Feel free to explore some of my coding endeavors on GitHub or follow me on Twitter/X.", - image: { - src: "/hero.jpeg", - alt: "A person sitting at a desk in front of a computer", - }, - actions: [ - { - text: "Get in Touch", - href: "/contact", - }, - ], + "I'm **tiff**, a dev during the day, mad electronics scientist at night, and a Linux enthusiast who sometimes writes but who wants to read more books. Here's where I'll dump my notes on the books I've read.", }, postsPerPage: 8, projectsPerPage: 8, diff --git a/src/styles/global.css b/src/styles/global.css index c8b3747..58f39f2 100644 --- a/src/styles/global.css +++ b/src/styles/global.css @@ -1,23 +1,22 @@ @import '@fontsource-variable/inter' layer(base); -@import '@fontsource-variable/newsreader' layer(base); -@import '@fontsource-variable/newsreader/wght-italic.css' layer(base); - +@import '@fontsource-variable/merriweather'; @import 'tailwindcss'; @plugin '@tailwindcss/typography'; @custom-variant dark (&:where(.dark, .dark *)); :root { - --text-main: #171717; - --bg-main: #f2f1ec; - --bg-muted: #eae9e1; - --border-main: #171717; + --text-main: #171717; + --bg-main: #f2f1ec; + --bg-muted: #eae9e1; + --border-main: #171717; } + html.dark { - --text-main: #f2f1ec; - --bg-main: #171717; - --bg-muted: #242424; - --border-main: #f2f1ec; + --text-main: #f2f1ec; + --bg-main: #171717; + --bg-muted: #242424; + --border-main: #f2f1ec; } /* Cyan */ @@ -53,46 +52,76 @@ html.dark { */ @theme inline { - --font-sans: 'Inter Variable', sans-serif; - --font-serif: 'Newsreader Variable', serif; - --text-color-main: var(--text-main); - --background-color-main: var(--bg-main); - --background-color-muted: var(--bg-muted); - --border-color-main: var(--border-main); + --font-sans: 'Inter Variable', sans-serif; + --text-color-main: var(--text-main); + --background-color-main: var(--bg-main); + --background-color-muted: var(--bg-muted); + --border-color-main: var(--border-main); } @layer utilities { - .prose { - --tw-prose-body: var(--text-color-main); - --tw-prose-headings: var(--text-color-main); - --tw-prose-lead: var(--text-color-main); - --tw-prose-links: var(--text-color-main); - --tw-prose-bold: var(--text-color-main); - --tw-prose-counters: var(--text-color-main); - --tw-prose-bullets: var(--text-color-main); - --tw-prose-hr: var(--border-color-main); - --tw-prose-quotes: var(--text-color-main); - --tw-prose-quote-borders: var(--border-color-main); - --tw-prose-captions: var(--text-color-main); - --tw-prose-kbd: var(--text-color-main); - --tw-prose-code: var(--text-color-main); - --tw-prose-th-borders: var(--border-color-main); - --tw-prose-td-borders: var(--border-color-main); - } + .prose { + --tw-prose-body: var(--text-color-main); + --tw-prose-headings: var(--text-color-main); + --tw-prose-lead: var(--text-color-main); + --tw-prose-links: var(--text-color-main); + --tw-prose-bold: var(--text-color-main); + --tw-prose-counters: var(--text-color-main); + --tw-prose-bullets: var(--text-color-main); + --tw-prose-hr: var(--border-color-main); + --tw-prose-quotes: var(--text-color-main); + --tw-prose-quote-borders: var(--border-color-main); + --tw-prose-captions: var(--text-color-main); + --tw-prose-kbd: var(--text-color-main); + --tw-prose-code: var(--text-color-main); + --tw-prose-th-borders: var(--border-color-main); + --tw-prose-td-borders: var(--border-color-main); + } - .prose a { - @apply underline font-normal decoration-1 underline-offset-2 decoration-dashed hover:decoration-solid; - } + .prose a { + @apply underline font-normal decoration-1 underline-offset-2 decoration-dashed hover:decoration-solid; + } - .prose :where(h1, h2, h3, h4, h5, h6) { - @apply font-serif font-medium; - } + .prose p { + font-family: "Merriweather", serif !important; + font-size: large !important; + } - .prose :where(code, strong) { - @apply font-medium; - } + .prose :where(h1, h2, h3, h4, h5, h6) { + @apply font-medium; + } - .prose blockquote { - @apply font-serif font-normal italic border-none pl-0 text-[1.375em] leading-snug sm:text-[1.66667em]; - } + h1 { + font-size: 2.6rem !important; + } + + h1, + h2, + h3, + h4, + h5, + h6 { + font-family: "Inter", sans-serif !important; + } + + .prose h1, + h2, + h3, + h4, + h5, + h6 { + font-family: "Inter", sans-serif !important; + } + + /* .prose :where(h1) { */ + /* font-size: xx-large !important; */ + /* } */ + /**/ + .prose :where(code, strong) { + @apply font-medium; + } + + .prose blockquote { + @apply font-serif font-normal italic border-none pl-0 text-[1.375em] leading-snug sm:text-[1.66667em]; + } } diff --git a/tailwind.config.mjs b/tailwind.config.mjs new file mode 100644 index 0000000..e69de29