lewis/lewisdale.dev
1
0
Fork 0
Code Issues Pull Requests Actions Packages Projects Releases Wiki Activity

Move nav onto second header row. Improve colour contrast on colour scheme picker
All checks were successful
Build and copy to prod / build-and-copy (push) Successful in 2m15s
Details

Browse Source
This commit is contained in:
Lewis Dale 2024-05-23 07:43:21 +01:00
parent 13f3109078
commit e2c4e40a98
5 changed files with 30 additions and 11 deletions
Show Stats Download Patch File Download Diff File Expand all files Collapse all files

19
src/_includes/base.njk
View File

@ -43,15 +43,6 @@
<body>
<header class="wrapper-lg row space-between">
<a href="/" class="site-title">LD</a>
<nav>
<ul class="row" role='list'>
<li><a href="/">Home</a></li>
<li><a href="/blog">Blog</a></li>
<li><a href="/blogroll">Blogroll</a></li>
<li><a href="/events/2024">Events</a></li>
<li><a href="/links">Links</a></li>
</ul>
</nav>
<a href="/feed/" class="rss" aria-label="RSS feed">
<i class="fa-solid fa-rss"></i>
@ -71,6 +62,16 @@
System
</label>
</fieldset>
<nav class="main-nav">
<ul class="row" role='list'>
<li><a href="/">Home</a></li>
<li><a href="/blog">Blog</a></li>
<li><a href="/blogroll">Blogroll</a></li>
<li><a href="/events/2024">Events</a></li>
<li><a href="/links">Links</a></li>
</ul>
</nav>
</header>
{{ content | safe }}
<footer>

10
src/css/exceptions/main-nav.css Normal file
View File

@ -0,0 +1,10 @@
.main-nav {
width: 100%;
flex-grow: 1;
.row {
width: fit-content;
max-width: 100%;
margin: 0 auto;
}
}

1
src/css/exceptions/site-title.css
View File

@ -4,6 +4,7 @@
line-height: 1;
text-decoration: none;
place-self: start;
flex-grow: 1;
&:hover, &:focus, &:focus-visible {
outline: 0px transparent;

1
src/css/globals.css
View File

@ -156,6 +156,7 @@ header {
flex-wrap: wrap;
padding-top: var(--space-size-s);
padding-bottom: var(--space-size-s);
align-items: center;
}
p {

8
tailwind.config.js
View File

@ -14,7 +14,13 @@ module.exports = {
'2xl': '1536px',
'3xl': '1920px',
},
colors: colors,
colors: {
...colors,
neutral: {
...colors.neutral,
400: '#b1b1b1'
}
},
backgroundColor: ({theme}) => theme('colors'),
textColor: ({theme}) => theme('colors'),
spacing: {