Add key links below monogram

This commit is contained in:
n loewen 2023-09-22 11:28:56 -07:00
parent edcd5a4a0a
commit ea52f6986b
2 changed files with 36 additions and 19 deletions

View File

@ -41,11 +41,18 @@
</div>
</div>
<div class="navigation">
<h1> Elizabeth Pankratz </h1>
<a href="#">about</a>
<a href="#">blog</a>
<a href="#">contact</a>
<div class="intro">
<div class="bio"> I'm <h1>Elizabeth Pankratz</h1>,<br>
a <a href="#">linguist</a>,
<a href="#">textile artist</a>,
<br>
and <a href="#">applied statistician</a>
</div>
<div class="links">
<a href="#">about</a>
<a href="#">blog</a>
<a href="#">contact</a>
</div>
</div>
</div>

View File

@ -92,33 +92,43 @@ body {
/* Title and links */
h1 {
display: inline;
font-weight: bold;
font-size: 1.7rem;
margin-top: 1em;
font-size: 1em;
}
.navigation {
.intro {
margin-top: 2em;
font-size: 1.4rem;
line-height: 1.4;
}
.navigation a {
.intro .bio {
margin-bottom: 1em;
}
.intro .links a {
gap: 1em; /* TODO */
margin-right: 0.5ch;
}
.intro a {
color: black;
text-decoration: none;
margin-left: -0.25ch;
border-left: 0.25ch solid rgba(0,0,0,0);
border-right: 0.25ch solid rgba(0,0,0,0);
margin-right: 0.75ch;
border-left: 0.33ch solid rgba(0,0,0,0);
border-right: 0.33ch solid rgba(0,0,0,0);
margin-left: -0.33ch;
margin-right: -0.33ch;
}
.navigation a:visited {
.intro a:visited {
color: black;
}
.navigation a:active,
.navigation a:hover {
.intro a:active,
.intro a:hover {
background-color:hsl(50, 100%, 70%);
border-left: 0.25ch solid hsl(50, 100%, 70%);
border-right: 0.25ch solid hsl(50, 100%, 70%);
border-left: 0.33ch solid hsl(50, 100%, 70%);
border-right: 0.33ch solid hsl(50, 100%, 70%);
}