'the system' mobile fixes

This commit is contained in:
nnwhen 2025-03-19 00:29:11 +02:00
parent af5f3d4a29
commit 3ce2b1fe29
6 changed files with 28 additions and 12 deletions

View file

@ -58,9 +58,9 @@
<nav> <nav>
<a aria-hidden="true" tabindex="-1" id="here" href="#">Home</a> <a aria-hidden="true" tabindex="-1" id="here" href="#">Home</a>
<a href="support.html">Support</a> <a href="support.html">Support</a>
<a href="subsystem/index.html" id="subsystem" onclick="disableInject()" <a href="subsystem/index.html" id="subsystem" onclick="disableInject()">
>SUBSYSTEM</a <p id="nonintrude">SUBSYSTEM</p>
> </a>
</nav> </nav>
<hgroup> <hgroup>
<h1>We Are <span class="dsre">The System</span></h1> <h1>We Are <span class="dsre">The System</span></h1>

View file

@ -56,7 +56,7 @@
<nav> <nav>
<a href="index.html">Home</a> <a href="index.html">Home</a>
<a href="support.html">Support</a> <a href="support.html">Support</a>
<a href="subsystem/index.html" id="subsystem">SUBSYSTEM</a> <a href="subsystem/index.html" id="subsystem"><div id="nonintrude">SUBSYSTEM</div></a>
</nav> </nav>
<hgroup> <hgroup>
<h1>We Are <span class="dsre">The System</span></h1> <h1>We Are <span class="dsre">The System</span></h1>

View file

@ -10,14 +10,15 @@
#ndx-decree, #ndx-decree,
#ndx-more { #ndx-more {
margin: 0; margin: 0;
margin-left: min(2%, 25px);
margin-right: min(2%, 25px);
} }
#ndx-news, #ndx-news,
#ndx-more { #ndx-more {
display: flex; display: flex;
flex-direction: column; flex-direction: column;
margin: auto; min-width: 270px;
margin-left: min(2%, 25px);
margin-right: min(2%, 25px);
} }
#ndx-news article, #ndx-news article,
#ndx-more article { #ndx-more article {
@ -64,7 +65,6 @@
width: 10%; width: 10%;
flex-grow: 1; flex-grow: 1;
max-width: 500px; max-width: 500px;
margin: auto;
} }
#ndx-more img { #ndx-more img {
width: 100%; width: 100%;

View file

@ -26,6 +26,8 @@
body { body {
background-color: var(--background); background-color: var(--background);
font-family: "playfair", serif; font-family: "playfair", serif;
margin: 0;
padding: 0;
} }
h1, h1,
h2 { h2 {
@ -84,8 +86,20 @@ nav a:hover {
} }
#subsystem { #subsystem {
position: relative;
height: 41px;
animation: glitch 1s infinite; animation: glitch 1s infinite;
} }
#nonintrude {
position: absolute;
height: 21px;
top: 0;
bottom: 0;
left: 0;
right: 0;
margin: auto;
vertical-align: middle;
}
hgroup { hgroup {
margin: 20px auto; margin: 20px auto;

View file

@ -14,11 +14,11 @@ function inject() {
"FO-CH&#xD3;RAS", "FO-CH&#xD3;RAS",
"K&#x100;N&#x100;WAI", "K&#x100;N&#x100;WAI",
"SUBSYSTEM", "SUBSYSTEM",
"&#x30B5;&#x30D6;&#x30B7;&#x30B9;&#x30C6;&#x30E0;",
"&#x3A5;&#x3A0;&#x39F;&#x3A3;&#x3A5;&#x3A3;&#x3A4;&#x395;&#x39C;&#x391;",
]; ];
// "&#x30B5;&#x30D6;&#x30B7;&#x30B9;&#x30C6;&#x30E0;", "&#x3A5;&#x3A0;&#x39F;&#x3A3;&#x3A5;&#x3A3;&#x3A4;&#x395;&#x39C;&#x391;", document.getElementById("nonintrude").innerHTML =
document.getElementById("subsystem").innerHTML =
terms[Math.floor(Math.random() * terms.length)]; terms[Math.floor(Math.random() * terms.length)];
} }

View file

@ -47,7 +47,9 @@
<nav> <nav>
<a href="index.html">Home</a> <a href="index.html">Home</a>
<a aria-hidden="true" tabindex="-1" id="here" href="#">Support</a> <a aria-hidden="true" tabindex="-1" id="here" href="#">Support</a>
<a href="subsystem/index.html" id="subsystem">SUBSYSTEM</a> <a href="subsystem/index.html" id="subsystem"
><div id="nonintrude">SUBSYSTEM</div></a
>
</nav> </nav>
<hgroup> <hgroup>
<h1><span class="dsre">System</span> Support</h1> <h1><span class="dsre">System</span> Support</h1>