minor changes to how layout works

This commit is contained in:
Pagwin 2024-12-22 11:52:13 -05:00
parent 2e6a2cb200
commit 9f018de170
No known key found for this signature in database
GPG key ID: 81137023740CA260
2 changed files with 23 additions and 20 deletions

View file

@ -20,7 +20,12 @@ a {
font-weight: bold; font-weight: bold;
text-decoration: none; text-decoration: none;
width: fit-content; width: fit-content;
height: fit-content;
} }
a.obj-wrapper{
display: block;
}
a:hover { a:hover {
text-decoration: underline; text-decoration: underline;
@ -80,11 +85,9 @@ header#header {
flex-flow: row nowrap; flex-flow: row nowrap;
gap: 0.5em; gap: 0.5em;
align-items: center; align-items: center;
width: 100%; justify-content: space-between;
font-size: 24px; width: 100vw;
padding: 0.5em 1em; padding: 0.5em 1em;
/*was a fun experiment but this just causes issues*/
/*position: fixed;*/
} }
#content { #content {
box-sizing: border-box; box-sizing: border-box;
@ -155,11 +158,7 @@ blockquote {
width: 2rem; width: 2rem;
height: 2rem; height: 2rem;
} }
/*https://stackoverflow.com/questions/35269947/how-can-i-align-one-item-right-with-flexbox#35270047*/
.back-shover {
margin-left:auto;
margin-top:auto;
}
/* div element with this class can be a bitch so need to select those as well as pre*/ /* div element with this class can be a bitch so need to select those as well as pre*/
.sourceCode { .sourceCode {
max-width: -moz-available; max-width: -moz-available;

View file

@ -23,17 +23,21 @@
<body> <body>
<!-- originally handled dark v light via js but decided it would be better to just do it all in css and have no toggle 8a7917a0cd34bd7637d9a9a8ad327e4b847cdeed is the last commit where I had the system setup --> <!-- originally handled dark v light via js but decided it would be better to just do it all in css and have no toggle 8a7917a0cd34bd7637d9a9a8ad327e4b847cdeed is the last commit where I had the system setup -->
<header id="header"> <header id="header" role="menubar">
<a class="" rel="prefetch" href="/"><object aria-hidden="true" tabindex="-1" class="icon svg" <div class="left">
data="/static/images/house.svg"> <a class="obj-wrapper" rel="prefetch" href="/" role="menuitem"><object aria-hidden="true" tabindex="-1"
class="icon svg" data="/static/images/house.svg">
<a href="/" class="nav-link" aria-hidden="true" tabindex="-1">home</a> <a href="/" class="nav-link" aria-hidden="true" tabindex="-1">home</a>
</object></a> </object></a>
<div class="back-shover"></div> </div>
<a class="" href="/index.xml"> <object aria-hidden="true" tabindex="-1" class="icon svg" <div class="right">
data="/static/images/rss.svg"> <a class="obj-wrapper" role="menuitem" href="/index.xml"> <object aria-hidden="true" tabindex="-1"
class="icon svg" data="/static/images/rss.svg">
<a href="/index.xml" class="nav-link" aria-hidden="true" tabindex="-1">web feed</a> <a href="/index.xml" class="nav-link" aria-hidden="true" tabindex="-1">web feed</a>
</object> </object>
</a> </a>
<!--TODO hamburger menu??-->
</div>
</header> </header>
<div id="content-outer"> <div id="content-outer">
<div id="content"> <div id="content">