HPR/hpr_generator
8
1
Fork 5
Code Issues 31 Pull Requests 4 Actions Packages Projects Releases Wiki Activity

Simplify header layout

Browse Source 
Remove QR code, improve contrast of header links.
This commit is contained in:
Roan Horning
2025-08-23 23:03:17 -04:00
parent 8a20ac971e
commit b12a7fb4e7
2 changed files with 47 additions and 22 deletions
Download Patch File Download Diff File Expand all files Collapse all files

57
public_html/css/hpr.css
View File

@@ -35,6 +35,7 @@ https://creativecommons.org/publicdomain/
--link-primary-hover: #b54c08/*#f8961e*/;
--link-secondary: #a8f8ff;
--link-secondary-hover: #f9e9c2;
--link-title-color: #00003e;
--lane-button-border: #80b4c0;
--input-border-primary: #4d4d4d;
@@ -118,7 +119,7 @@ body > header {
flex-direction: row;
flex-flow: wrap;
justify-content: space-between;
padding: 0.25rem;
padding: clamp(0.5rem, -0.25rem + 3vw, 1rem) 0.25rem;
background-image: url("/images/hpr-splatter-logo.svg"), url("/images/main-header-background.png");
background-size: 59%, cover;
background-repeat: no-repeat, no-repeat;
@@ -233,7 +234,13 @@ dd {
margin-bottom: 0.35rem;
margin-left: 1rem;
}
a {
color: var(--link-primary);
text-decoration-style: dotted;
text-decoration-color: inherit;
text-decoration-thickness: .125rem;
text-underline-offset: 0.2rem;
}
a:hover {
cursor: pointer;
@@ -347,30 +354,51 @@ a.lane-button img {
text-transform: uppercase;
}
#tag_line {
line-height: 1;
line-height: 1.1;
}
#tag_line *,
#title * {
margin: 0;
padding: 0;
}
#title h1 {
#title a {
color: var(--link-title-color);
}
#title a:hover {
color: var(--link-primary-hover);
}
#title #site_acronym {
font-size: 7.5rem;
letter-spacing: -0.65rem;
line-height: 0.75;
margin-bottom: 0.25rem;
}
#tag_line h2 {
#title #site_acronym a {
text-decoration: none;
text-shadow: 0 1px var(--link-secondary);
}
#title #site_name {
font-size: var(--default-header-2-font-size);
font-weight: bold;
}
#tag_line {
text-align: center;
}
#tag_line #tag1,
#tag_line #tag2 {
text-transform: uppercase;
font-family: "BebasNeue", sans-serif;
font-size: 1.15rem;
font-size: clamp(1.03rem, -0.25rem + 3vw, var(--default-header-4-font-size));
font-weight: var(--default-header-x-font-weight);
letter-spacing: 0.05rem;
}
#tag_line h2:first-child {
font-size: 2rem;
#tag_line #tag1 {
font-size: clamp(2.1rem, calc(100vw - 360px + 2.1rem), 2.3rem);
}
#tag_line h3 {
#tag_line #tag3 {
text-align: center;
text-transform: capitalize;
font-size: 1.15rem;
font-weight: var(--default-header-x-font-weight);
}
#site_url {
font-family: "GNUTypewriter", monospace;
@@ -461,22 +489,23 @@ fieldset > input {
justify-content: space-between;
}
#tag_line {
text-align: center;
line-height: 1.1;
}
#title h1 {
#title #tag1 {
font-size: 7.5rem;
letter-spacing: -0.65rem;
line-height: 0.75;
}
#tag_line h2 {
#tag_line #tag2 {
font-size: 1.82rem;
letter-spacing: 0.05rem;
}
#tag_line h2:first-child {
#tag_line #tag1 {
font-size: 4rem;
}
#tag_line h3 {
#tag_line #tag3 {
font-size: 1.85rem;
letter-spacing: 0.05rem;
margin-left: 5rem;
}
#qr_code {