zepp
/
thiscat.rocks
1
0
Fork 0
Code Issues Activity

nav styling

This commit is contained in:
emma 2025-01-02 00:50:52 -05:00
parent 0ca56186b8
commit 04bef99ae7
2 changed files with 28 additions and 8 deletions
Show Stats Download Patch File Download Diff File Expand all files Collapse all files

2
includes/nav.php
View File

@ -1,5 +1,6 @@
<header id="top"> <header id="top">
<img src="../site-resources/assets/header-cat.svg" height="32px" width="32px"> <img src="../site-resources/assets/header-cat.svg" height="32px" width="32px">
<span>
<p>This cat rocks!</p> <p>This cat rocks!</p>
<p>A homepage for my fine feline friend, Baxter</p> <p>A homepage for my fine feline friend, Baxter</p>
<nav> <nav>
@ -8,4 +9,5 @@
<a href="behavior.php">Baxter's behaviors</a> <a href="behavior.php">Baxter's behaviors</a>
<a href="about.php">About this site</a> <a href="about.php">About this site</a>
</nav> </nav>
</span>
</header> </header>

18
style/style.css
View File

@ -1,6 +1,7 @@
:root { :root {
--section-color: #fccce4bb; --section-color: #fccce4bb;
--border-color: #f6da92; --border-color: #f6da92;
--header-color: #fc94bcbb;
} }
*, *::before, *::after { *, *::before, *::after {
@ -98,6 +99,23 @@ main {
object-fit: fill; object-fit: fill;
} }
header {
width: 100%;
height: auto;
display: flex;
justify-content: center;
align-items: center;
gap: 1rem;
padding: 1rem;
background-color: var(--header-color);
border-bottom: 4px solid var(--border-color);
}
header img {
height: 48px;
width: auto;
}
section { section {
background-color: var(--section-color); background-color: var(--section-color);
padding: 1.25rem; padding: 1.25rem;