troy/troylusty.com
1
0
Fork 0
Code Issues Pull requests Projects Releases Packages 1 Wiki Activity Actions

upgrade to tailwind v4.0 (#33)

Browse source 
* begin switching to tailwind v4

* remove old tw config file

* convert colors back to hex

* move all content out of tw config

* fixed colors

* better match colors

* remove abnormally large margins
This commit is contained in:
Troy 2025-01-23 18:48:20 +00:00 • committed by GitHub
parent fffc8cb13e
commit 90ef859c50
No known key found for this signature in database
GPG key ID: B5690EEEBB952194
24 changed files with 178 additions and 182 deletions
Download patch file Download diff file Expand all files Collapse all files

4
src/pages/404.astro
View file

@ -11,13 +11,13 @@ import Button from "@components/Button.astro";
>
<div>
<h2
class="animate-reveal break-words text-2xl font-semibold opacity-0"
class="animate-reveal text-2xl font-semibold break-words opacity-0"
id="featured-projects"
>
404
</h2>
<h3
class="mt-2 animate-reveal font-bold opacity-0 [animation-delay:0.1s]"
class="animate-reveal mt-2 font-bold opacity-0 [animation-delay:0.1s]"
>
Content not found
</h3>

28
src/pages/cv.astro
View file

@ -13,15 +13,15 @@ import Link from "@components/Link.astro";
<div
class="flex flex-col items-start justify-between gap-6 md:flex-row md:items-center"
>
<h1 class="animate-reveal break-words text-2xl font-semibold opacity-0">
<h1 class="animate-reveal text-2xl font-semibold break-words opacity-0">
Troy Lusty
</h1>
<div
class="mt-4 flex flex-col items-start gap-2 text-tertiary md:flex-row"
class="text-tertiary mt-4 flex flex-col items-start gap-2 md:flex-row"
>
<div class="flex animate-reveal items-center gap-2 opacity-0">
<div class="animate-reveal flex items-center gap-2 opacity-0">
<div
class="flex flex-row items-center gap-2 text-tertiary transition-colors hover:text-accent"
class="text-tertiary hover:text-accent flex flex-row items-center gap-2 transition-colors"
>
<Icon name="mdi:email" />
<Link href="mailto:hello@troylusty.com">
@ -29,7 +29,7 @@ import Link from "@components/Link.astro";
</Link>
</div>
<div
class="flex flex-row items-center gap-2 text-tertiary transition-colors hover:text-accent"
class="text-tertiary hover:text-accent flex flex-row items-center gap-2 transition-colors"
>
<Icon name="mdi:web" />
<Link href="/">
@ -40,8 +40,8 @@ import Link from "@components/Link.astro";
</div>
</div>
</section>
<section class="mt-16 animate-reveal opacity-0 [animation-delay:0.1s]">
<h2 class="mb-4 break-words text-2xl font-semibold capitalize">About me</h2>
<section class="animate-reveal opacity-0 [animation-delay:0.1s]">
<h2 class="mb-4 text-2xl font-semibold break-words capitalize">About me</h2>
<p class="mb-2">
Hi, my name is Troy and I’m a student 3D artist studying on a BA (Hons)
Game Arts and Design course in the UK.
@ -57,19 +57,19 @@ import Link from "@components/Link.astro";
<p class="mb-2">
My current portfolio of work can be found on my website at:
<a
class="text-secondary underline decoration-tertiary decoration-wavy"
class="text-secondary decoration-tertiary underline decoration-wavy"
href="/projects">troylusty.com/projects</a
>.
</p>
</section>
<section class="mt-16 animate-reveal opacity-0 [animation-delay:0.2s]">
<h2 class="mb-4 break-words text-2xl font-semibold capitalize">
<section class="animate-reveal opacity-0 [animation-delay:0.2s]">
<h2 class="mb-4 text-2xl font-semibold break-words capitalize">
Education
</h2>
<Education />
</section>
<section class="mt-16 animate-reveal opacity-0 [animation-delay:0.3s]">
<h2 class="mb-4 break-words text-2xl font-semibold capitalize">Skills</h2>
<section class="animate-reveal opacity-0 [animation-delay:0.3s]">
<h2 class="mb-4 text-2xl font-semibold break-words capitalize">Skills</h2>
<p class="mb-2">
My specific chosen area of focus is design, lighting, and rendering
focusing on 3D environments within software such as Blender and Unreal
@ -78,8 +78,8 @@ import Link from "@components/Link.astro";
</p>
<Skills />
</section>
<section class="mt-16 animate-reveal opacity-0 [animation-delay:0.4s]">
<h2 class="mb-4 break-words text-2xl font-semibold capitalize">
<section class="animate-reveal opacity-0 [animation-delay:0.4s]">
<h2 class="mb-4 text-2xl font-semibold break-words capitalize">
Experience
</h2>
<Work />

10
src/pages/index.astro
View file

@ -24,11 +24,11 @@ const projects = allProjects
<Layout title={HOME.TITLE} description={HOME.DESCRIPTION}>
<Hero />
<section class="mb-32" aria-labelledby="featured-projects">
<section aria-labelledby="featured-projects">
<div class="group flex w-fit flex-row items-center justify-between gap-6">
<a href="/projects">
<h2
class="animate-reveal break-words text-2xl font-semibold capitalize opacity-0 transition-colors duration-500 group-hover:text-tertiary"
class="animate-reveal group-hover:text-tertiary text-2xl font-semibold break-words capitalize opacity-0 transition-colors duration-500"
id="featured-projects"
>
Featured projects
@ -36,7 +36,7 @@ const projects = allProjects
</a>
</div>
<ol
class="mt-8 grid animate-reveal grid-cols-1 gap-4 opacity-0 [animation-delay:0.1s] md:grid-cols-2"
class="animate-reveal mt-8 grid grid-cols-1 gap-4 opacity-0 [animation-delay:0.1s] md:grid-cols-2"
>
{projects.map((project) => <ShowcaseProject collection={project} />)}
</ol>
@ -50,7 +50,7 @@ const projects = allProjects
<div class="group flex w-fit flex-row items-center justify-between gap-6">
<a href="/posts">
<h2
class="animate-reveal break-words text-2xl font-semibold capitalize opacity-0 transition-colors duration-500 [animation-delay:0.2s] group-hover:text-tertiary"
class="animate-reveal group-hover:text-tertiary text-2xl font-semibold break-words capitalize opacity-0 transition-colors duration-500 [animation-delay:0.2s]"
id="featured-projects"
>
Recent posts
@ -58,7 +58,7 @@ const projects = allProjects
</a>
</div>
<ol
class="mt-8 grid animate-reveal grid-cols-1 gap-6 opacity-0 [animation-delay:0.3s]"
class="animate-reveal mt-8 grid grid-cols-1 gap-6 opacity-0 [animation-delay:0.3s]"
>
{posts.map((post) => <ShowcasePost collection={post} />)}
</ol>

4
src/pages/posts/index.astro
View file

@ -10,11 +10,11 @@ const posts = (await getCollection("posts"))
---
<Layout title={SITE.TITLE} description={POSTS.DESCRIPTION}>
<h1 class="animate-reveal break-words text-2xl font-semibold opacity-0">
<h1 class="animate-reveal text-2xl font-semibold break-words opacity-0">
{POSTS.TITLE}
</h1>
<ol
class="mt-16 grid animate-reveal grid-cols-1 gap-6 opacity-0 [animation-delay:0.1s]"
class="animate-reveal mt-16 grid grid-cols-1 gap-6 opacity-0 [animation-delay:0.1s]"
>
{posts.map((article: any) => <ShowcasePost collection={article} />)}
</ol>

4
src/pages/projects/index.astro
View file

@ -10,11 +10,11 @@ const projects = (await getCollection("projects"))
---
<Layout title={SITE.TITLE} description={PROJECTS.DESCRIPTION}>
<h1 class="animate-reveal break-words text-2xl font-semibold opacity-0">
<h1 class="animate-reveal text-2xl font-semibold break-words opacity-0">
{PROJECTS.TITLE}
</h1>
<ol
class="mt-16 grid animate-reveal grid-cols-1 gap-4 opacity-0 [animation-delay:0.1s] md:grid-cols-2"
class="animate-reveal mt-16 grid grid-cols-1 gap-4 opacity-0 [animation-delay:0.1s] md:grid-cols-2"
>
{projects.map((article: any) => <ShowcaseProject collection={article} />)}
</ol>