bottom margin on large page

This commit is contained in:
Oliver Bryan
2025-10-26 15:49:21 +00:00
parent 42e28a67a3
commit eb3b7e702a
5 changed files with 28 additions and 58 deletions

View File

@@ -22,20 +22,6 @@ metadata.tags?.sort();
--- ---
<style> <style>
a {
text-decoration: none;
border-bottom: 1px solid var(--ayu-blue-500);
color: var(--ayu-blue-500);
transition:
color 0.1s,
border-color 0.1s;
margin-bottom: 16px;
}
a:hover {
color: var(--ayu-blue-600);
border-color: var(--ayu-blue-600);
}
.github { .github {
color: var(--ayu-green-500); color: var(--ayu-green-500);
border: none; border: none;
@@ -44,6 +30,10 @@ metadata.tags?.sort();
color: var(--ayu-green-500); color: var(--ayu-green-500);
text-decoration: underline; text-decoration: underline;
} }
.green {
color: var(--ayu-green-500);
}
</style> </style>
<Layout <Layout

View File

@@ -14,10 +14,10 @@ const { currentPage } = Astro.props;
<body> <body>
<Header <Header
currentPage={currentPage} currentPage={currentPage}
innerClass="px-4 max-w-6xl w-6xl mx-auto" innerClass="px-4 max-w-5xl w-5xl mx-auto"
/> />
<div <div
class="px-4 py-4 max-w-6xl lg:border-l-1 lg:border-r-1 lg:border-b-1 border-ayu-gutter mx-auto" class="px-4 py-4 max-w-5xl lg:mb-16 lg:border-l-1 lg:border-r-1 lg:border-b-1 border-ayu-gutter mx-auto"
> >
<slot /> <slot />
</div> </div>

View File

@@ -16,37 +16,19 @@ export const metadata = {
}; };
--- ---
<style>
.green {
color: var(--ayu-green-500);
}
a {
text-decoration: none;
border-bottom: 1px solid var(--ayu-blue-500);
color: var(--ayu-blue-500);
transition:
color 0.1s,
border-color 0.1s;
margin-bottom: 16px;
}
a:hover {
color: var(--ayu-blue-600);
border-color: var(--ayu-blue-600);
}
</style>
<ProjectPage metadata={metadata}> <ProjectPage metadata={metadata}>
<p> <p>
"factor-e" is an isometric factory sandbox prototype I built to learn "factor-e" is an isometric factory sandbox prototype I built to learn
C++ and <a C++ and <a
href="https://www.raylib.com/" href="https://www.raylib.com/"
target="_blank" target="_blank"
rel="noopener noreferrer">raylib</a rel="noopener noreferrer"
class="link-project-page">raylib</a
>. Inspired by Minecraft and <a >. Inspired by Minecraft and <a
href="https://store.steampowered.com/app/3433610/Terrafactor/" href="https://store.steampowered.com/app/3433610/Terrafactor/"
target="_blank" target="_blank"
rel="noopener noreferrer">Terrafactor</a rel="noopener noreferrer"
class="link-project-page">Terrafactor</a
>, it explores tile-based building, inventory management and procedural >, it explores tile-based building, inventory management and procedural
world generation. world generation.
</p> </p>

View File

@@ -25,26 +25,6 @@ export const metadata = {
}; };
--- ---
<style>
.green {
color: var(--ayu-green-500);
}
a {
text-decoration: none;
border-bottom: 1px solid var(--ayu-blue-500);
color: var(--ayu-blue-500);
transition:
color 0.1s,
border-color 0.1s;
margin-bottom: 16px;
}
a:hover {
color: var(--ayu-blue-600);
border-color: var(--ayu-blue-600);
}
</style>
<ProjectPage metadata={metadata}> <ProjectPage metadata={metadata}>
<p>watercooler description here</p> <p>watercooler description here</p>

View File

@@ -274,3 +274,21 @@ body {
-webkit-user-select: none; -webkit-user-select: none;
-o-user-select: none; -o-user-select: none;
} }
.green {
color: var(--ayu-green-500);
}
.link-project-page {
text-decoration: none;
border-bottom: 1px solid var(--ayu-blue-500);
color: var(--ayu-blue-500);
transition:
color 0.1s,
border-color 0.1s;
margin-bottom: 16px;
}
.link-project-page:hover {
color: var(--ayu-blue-600);
border-color: var(--ayu-blue-600);
}