RWD; Update a bunch of stuff which I've forgotten what it is I've done.
This commit is contained in:
@@ -17,7 +17,7 @@
|
||||
<include src="includes/nav_quick_links.html" />
|
||||
</nav>
|
||||
<div class="pane_main">
|
||||
<div class="main_body"><p>This page has not yet been filled out. Sorry!</p></div>
|
||||
<div class="body"><p>This page has not yet been filled out. Sorry!</p></div>
|
||||
<include src="includes/tailer.html" />
|
||||
</div>
|
||||
<div class="pane_spacer">
|
||||
|
||||
@@ -17,7 +17,7 @@
|
||||
<include src="includes/nav_quick_links.html" />
|
||||
</nav>
|
||||
<div class="pane_main">
|
||||
<div class="main_body">
|
||||
<div class="body">
|
||||
<p>There are currently no acknowledgements</p>
|
||||
<p>In terms of security, hopefully that means I'm doing a good-ish job.</p>
|
||||
<p>
|
||||
|
||||
@@ -17,7 +17,7 @@
|
||||
<include src="includes/nav_quick_links.html" />
|
||||
</nav>
|
||||
<div class="pane_main">
|
||||
<div class="main_body">
|
||||
<div class="body">
|
||||
<div class="header">
|
||||
<h1 class="title">Blog</h1>
|
||||
<p class="date">Last Edited: 03 August, 2025</p>
|
||||
|
||||
@@ -17,7 +17,7 @@
|
||||
<include src="includes/nav_quick_links.html" />
|
||||
</nav>
|
||||
<div class="pane_blog">
|
||||
<div class="blog_body">
|
||||
<div class="body">
|
||||
<div class="header">
|
||||
<h1 class="title">Divergent Pathways</h1>
|
||||
<p class="date">Posted: 29 July, 2025</p>
|
||||
|
||||
@@ -17,7 +17,7 @@
|
||||
<include src="includes/nav_quick_links.html" />
|
||||
</nav>
|
||||
<div class="pane_main">
|
||||
<div class="main_body">
|
||||
<div class="body">
|
||||
<div class="header">
|
||||
<h1 class="title">Disclosure</h1>
|
||||
<p class="date">Last Edited: 01 August, 2025</p>
|
||||
|
||||
@@ -17,7 +17,7 @@
|
||||
<include src="includes/nav_quick_links.html" />
|
||||
</nav>
|
||||
<div class="pane_error">
|
||||
<div class="error_body">
|
||||
<div class="body">
|
||||
<h1>400</h1>
|
||||
<h2>Bad Request!</h2>
|
||||
<hr />
|
||||
|
||||
@@ -17,7 +17,7 @@
|
||||
<include src="includes/nav_quick_links.html" />
|
||||
</nav>
|
||||
<div class="pane_error">
|
||||
<div class="error_body">
|
||||
<div class="body">
|
||||
<h1>401</h1>
|
||||
<h2>Unauthorized!</h2>
|
||||
</div>
|
||||
|
||||
@@ -17,7 +17,7 @@
|
||||
<include src="includes/nav_quick_links.html" />
|
||||
</nav>
|
||||
<div class="pane_error">
|
||||
<div class="error_body">
|
||||
<div class="body">
|
||||
<h1>403</h1>
|
||||
<h2>Forbidden!</h2>
|
||||
<hr />
|
||||
|
||||
@@ -17,7 +17,7 @@
|
||||
<include src="includes/nav_quick_links.html" />
|
||||
</nav>
|
||||
<div class="pane_error">
|
||||
<div class="error_body">
|
||||
<div class="body">
|
||||
<h1>404</h1>
|
||||
<h2>Page not found!</h2>
|
||||
</div>
|
||||
|
||||
@@ -17,7 +17,7 @@
|
||||
<include src="includes/nav_quick_links.html" />
|
||||
</nav>
|
||||
<div class="pane_error">
|
||||
<div class="error_body">
|
||||
<div class="body">
|
||||
<h1>500</h1>
|
||||
<h2>Internal Server Error!</h2>
|
||||
<hr />
|
||||
|
||||
@@ -17,7 +17,7 @@
|
||||
<include src="includes/nav_quick_links.html" />
|
||||
</nav>
|
||||
<div class="pane_error">
|
||||
<div class="error_body">
|
||||
<div class="body">
|
||||
<h1>501</h1>
|
||||
<h2>Not Implemented!</h2>
|
||||
<hr />
|
||||
|
||||
@@ -17,7 +17,7 @@
|
||||
<include src="includes/nav_quick_links.html" />
|
||||
</nav>
|
||||
<div class="pane_error">
|
||||
<div class="error_body">
|
||||
<div class="body">
|
||||
<h1>502</h1>
|
||||
<h2>Bad Gateway!</h2>
|
||||
<hr />
|
||||
|
||||
@@ -17,7 +17,7 @@
|
||||
<include src="includes/nav_quick_links.html" />
|
||||
</nav>
|
||||
<div class="pane_error">
|
||||
<div class="error_body">
|
||||
<div class="body">
|
||||
<h1>503</h1>
|
||||
<h2>Service Unavailable!</h2>
|
||||
<hr />
|
||||
|
||||
@@ -17,7 +17,7 @@
|
||||
<include src="includes/nav_quick_links.html" />
|
||||
</nav>
|
||||
<div class="pane_error">
|
||||
<div class="error_body">
|
||||
<div class="body">
|
||||
<h1>504</h1>
|
||||
<h2>Gateway Timeout!</h2>
|
||||
<hr />
|
||||
|
||||
@@ -17,7 +17,7 @@
|
||||
<include src="includes/nav_quick_links.html" />
|
||||
</nav>
|
||||
<div class="pane_main">
|
||||
<div class="main_body">
|
||||
<div class="body">
|
||||
<div class="header">
|
||||
<h1 class="title">Home</h1>
|
||||
<p class="date">Last Edited: 03 August, 2025</p>
|
||||
|
||||
@@ -1,16 +1,22 @@
|
||||
.chunk_list,
|
||||
.pane_main .main_body .chunk_list {
|
||||
display: flex;
|
||||
flex-direction: column;
|
||||
padding: 0;
|
||||
text-align: left;
|
||||
/*
|
||||
All specificities to do with Chunk Lists are a disaster.
|
||||
|
||||
Hopefully, I will attempt to clean up this steaming pile of shit so that I don't have to deal with conflicts (.main_body .body vs. .chunk .body in particular), but we'll see.
|
||||
*/
|
||||
|
||||
.chunk_list {
|
||||
display: grid;
|
||||
|
||||
width: 100%;
|
||||
|
||||
.chunk + .chunk {
|
||||
margin-top: var(--spacing-horizontal);
|
||||
}
|
||||
|
||||
.chunk {
|
||||
.header {
|
||||
width: inherit;
|
||||
|
||||
> .header {
|
||||
display: grid;
|
||||
grid-auto-flow: row;
|
||||
grid-template-columns: 1fr min-content;
|
||||
@@ -24,10 +30,7 @@
|
||||
|
||||
text-align: start;
|
||||
|
||||
/*width: calc(100% - calc(var(--spacing-horizontal) * 2));*/
|
||||
width: 100%;
|
||||
|
||||
margin: 0;
|
||||
width: inherit;
|
||||
|
||||
.name,
|
||||
.subtitle,
|
||||
@@ -35,10 +38,6 @@
|
||||
margin: inherit;
|
||||
}
|
||||
|
||||
.name {
|
||||
white-space: nowrap;
|
||||
}
|
||||
|
||||
.subtitle {
|
||||
display: inline-block;
|
||||
|
||||
@@ -58,7 +57,7 @@
|
||||
}
|
||||
}
|
||||
|
||||
.body {
|
||||
> .body {
|
||||
padding: 0 calc(var(--spacing-horizontal) * 2);
|
||||
|
||||
ul {
|
||||
@@ -71,3 +70,16 @@
|
||||
}
|
||||
}
|
||||
}
|
||||
|
||||
@media only screen and (max-width: 500px) {
|
||||
.chunk_list .chunk {
|
||||
> .header {
|
||||
column-gap: var(--spacing-horizontal);
|
||||
}
|
||||
|
||||
> .body {
|
||||
/* Collapse the L/R padding to maximize usable space */
|
||||
padding: 0;
|
||||
}
|
||||
}
|
||||
}
|
||||
|
||||
@@ -1,10 +1,9 @@
|
||||
.layout_row {
|
||||
display: flex;
|
||||
flex-wrap: wrap;
|
||||
justify-content: space-between;
|
||||
display: grid;
|
||||
grid-auto-flow: column;
|
||||
gap: var(--spacing-horizontal);
|
||||
|
||||
.item {
|
||||
margin: var(--spacing-horizontal);
|
||||
padding: calc(var(--spacing-horizontal) * 2);
|
||||
|
||||
background-color: var(--background-1);
|
||||
@@ -15,3 +14,13 @@
|
||||
}
|
||||
}
|
||||
}
|
||||
|
||||
.layout_row + .layout_row {
|
||||
margin-top: var(--spacing-horizontal);
|
||||
}
|
||||
|
||||
@media only screen and (max-width: 500px) {
|
||||
.layout_row {
|
||||
grid-auto-flow: row;
|
||||
}
|
||||
}
|
||||
|
||||
@@ -3,5 +3,6 @@
|
||||
|
||||
.recent_posts .chunk .header {
|
||||
background-color: var(--background-1);
|
||||
white-space: nowrap;
|
||||
}
|
||||
}
|
||||
|
||||
@@ -12,6 +12,5 @@
|
||||
|
||||
.location_page {
|
||||
margin: 0;
|
||||
padding: 0;
|
||||
}
|
||||
}
|
||||
|
||||
@@ -20,8 +20,10 @@
|
||||
}
|
||||
}
|
||||
|
||||
.nav_body {
|
||||
/* Need to force inheritence, otherwise <a> would require overrides for all color states from base styling for element. */
|
||||
.nav_item {
|
||||
/*
|
||||
Need to force inheritence, otherwise <a> would require overrides for all color states from base styling for element.
|
||||
*/
|
||||
color: inherit;
|
||||
text-decoration: none;
|
||||
|
||||
@@ -30,8 +32,8 @@
|
||||
transition: var(--transition-fade);
|
||||
}
|
||||
|
||||
.nav_body:hover,
|
||||
.nav_dropdown:hover .nav_body {
|
||||
.nav_item:hover,
|
||||
.nav_dropdown:hover .nav_item {
|
||||
transform: var(--transform-scale-x);
|
||||
transition: var(--transition-cut);
|
||||
|
||||
|
||||
@@ -11,7 +11,6 @@
|
||||
background-color: var(--background-2);
|
||||
|
||||
transition: var(--transition-fade);
|
||||
margin: 0;
|
||||
|
||||
ion-icon {
|
||||
width: var(--item-size);
|
||||
|
||||
@@ -9,7 +9,6 @@
|
||||
margin: inherit;
|
||||
padding: 0 var(--spacing-horizontal);
|
||||
transition: var(--transition-fade);
|
||||
/*text-transform: uppercase;*/
|
||||
display: block;
|
||||
}
|
||||
|
||||
|
||||
@@ -1,4 +1,11 @@
|
||||
.website_security,
|
||||
.cookies {
|
||||
max-width: 44%;
|
||||
width: calc(50% - calc(var(--spacing-horizontal) * 2));
|
||||
}
|
||||
|
||||
@media only screen and (max-width: 500px) {
|
||||
.website_security,
|
||||
.cookies {
|
||||
width: 100%;
|
||||
}
|
||||
}
|
||||
|
||||
@@ -8,12 +8,12 @@
|
||||
|
||||
justify-content: center;
|
||||
|
||||
.blog_body {
|
||||
> .body {
|
||||
background-color: var(--background-2);
|
||||
border-radius: var(--border-radius-leaf);
|
||||
padding-top: var(--spacing-horizontal);
|
||||
|
||||
.header {
|
||||
> .header {
|
||||
text-align: center;
|
||||
padding: var(--spacing-horizontal);
|
||||
width: min-content;
|
||||
@@ -38,11 +38,10 @@
|
||||
}
|
||||
}
|
||||
|
||||
.body {
|
||||
> .body {
|
||||
text-align: start;
|
||||
|
||||
padding: 0 calc(var(--margin-pane) * 4)
|
||||
calc(var(--margin-pane) * 4);
|
||||
padding: 0 var(--spacing-thicc) var(--spacing-thicc);
|
||||
|
||||
p {
|
||||
color: var(--white-1);
|
||||
@@ -50,3 +49,13 @@
|
||||
}
|
||||
}
|
||||
}
|
||||
|
||||
@media only screen and (max-width: 500px) {
|
||||
.pane_blog {
|
||||
width: 100%;
|
||||
|
||||
.body > .body {
|
||||
padding: var(--spacing-horizontal);
|
||||
}
|
||||
}
|
||||
}
|
||||
|
||||
@@ -5,7 +5,7 @@
|
||||
|
||||
margin: auto; /* center object */
|
||||
|
||||
.error_body,
|
||||
> .body,
|
||||
.tailer {
|
||||
background-color: var(--background-2);
|
||||
border-radius: var(--border-radius-leaf);
|
||||
@@ -14,3 +14,12 @@
|
||||
text-align: center;
|
||||
}
|
||||
}
|
||||
|
||||
@media only screen and (max-width: 500px) {
|
||||
.pane_error {
|
||||
width: 100%;
|
||||
|
||||
margin-top: var(--margin-pane);
|
||||
margin-bottom: var(--margin-pane);
|
||||
}
|
||||
}
|
||||
|
||||
@@ -1,24 +1,17 @@
|
||||
@use "a_tailer";
|
||||
|
||||
.pane_main {
|
||||
flex: 1;
|
||||
flex-direction: column;
|
||||
|
||||
margin: var(--margin-pane);
|
||||
|
||||
justify-content: center;
|
||||
|
||||
.main_body {
|
||||
> .body {
|
||||
background-color: var(--background-2);
|
||||
border-radius: var(--border-radius-leaf);
|
||||
padding: var(--spacing-horizontal);
|
||||
|
||||
.header {
|
||||
> .header {
|
||||
text-align: center;
|
||||
padding: var(--spacing-horizontal);
|
||||
width: min-content;
|
||||
|
||||
white-space: nowrap;
|
||||
width: max-content;
|
||||
|
||||
margin: 0 auto;
|
||||
|
||||
@@ -38,7 +31,7 @@
|
||||
}
|
||||
}
|
||||
|
||||
.body {
|
||||
> .body {
|
||||
text-align: start;
|
||||
|
||||
p {
|
||||
@@ -47,3 +40,9 @@
|
||||
}
|
||||
}
|
||||
}
|
||||
|
||||
@media only screen and (max-width: 500px) {
|
||||
.pane_main {
|
||||
width: 100%;
|
||||
}
|
||||
}
|
||||
|
||||
@@ -5,20 +5,25 @@
|
||||
|
||||
.pane_nav {
|
||||
margin: var(--margin-pane);
|
||||
padding: 0;
|
||||
|
||||
width: min-content;
|
||||
height: min-content;
|
||||
|
||||
display: grid;
|
||||
grid-auto-flow: row;
|
||||
grid-template-rows: auto auto auto 1fr max-content;
|
||||
grid-template-rows: repeat(4, min-content);
|
||||
gap: var(--spacing-menu-gap);
|
||||
align-content: start;
|
||||
|
||||
position: sticky;
|
||||
top: var(--margin-pane);
|
||||
bottom: var(--margin-pane);
|
||||
left: 0;
|
||||
left: var(--margin-pane);
|
||||
|
||||
color: var(--accent-pink);
|
||||
}
|
||||
|
||||
@media only screen and (max-width: 500px) {
|
||||
.pane_nav {
|
||||
width: 75%;
|
||||
}
|
||||
}
|
||||
|
||||
@@ -1,20 +1,18 @@
|
||||
.pane_spacer {
|
||||
margin: 0;
|
||||
padding: var(--margin-pane);
|
||||
margin: var(--margin-pane);
|
||||
|
||||
width: min-content;
|
||||
height: 100vh;
|
||||
height: calc(100vh - calc(var(--margin-pane) * 2));
|
||||
|
||||
display: grid;
|
||||
grid-auto-flow: row;
|
||||
grid-auto-flow: row dense;
|
||||
gap: var(--spacing-menu-gap);
|
||||
|
||||
position: sticky;
|
||||
top: 0;
|
||||
right: 0;
|
||||
top: var(--margin-pane);
|
||||
right: var(--margin-pane);
|
||||
|
||||
.spacer_container {
|
||||
margin: 0;
|
||||
padding: var(--spacing-horizontal);
|
||||
background-color: var(--background-2);
|
||||
height: 100%;
|
||||
@@ -31,3 +29,9 @@
|
||||
}
|
||||
}
|
||||
}
|
||||
|
||||
@media only screen and (max-width: 500px) {
|
||||
.pane_spacer {
|
||||
width: 100%;
|
||||
}
|
||||
}
|
||||
|
||||
Reference in New Issue
Block a user