Fix issues on iOS devices

Fix issues on iOS (Webkit) devices

Thanks to @Aisuruneko for providing base code that fixed iOS issues on Discord, as well as my GF for helping me test iOS and other mobile changes <3
This commit is contained in:
Sophie Marie 2022-08-18 18:40:16 -05:00 committed by GitHub
commit bfa9aeaa62
No known key found for this signature in database
GPG key ID: 4AEE18F83AFDEB23
3 changed files with 65 additions and 9 deletions

BIN
img/github-32px.png Executable file

Binary file not shown.

After

Width:  |  Height:  |  Size: 1.5 KiB

View file

@ -12,20 +12,20 @@
</header> </header>
<div class="main"> <div class="main">
<div class="neko"> <div class="neko">
<script>NekoType="white"</script> <script>NekSoType="white"</script>
<h1 id=nl><script src="https://webneko.net/n20171213.js"></script><a href="https://webneko.net">Neko</a></h1> <h1 id=nl><script src="https://webneko.net/n20171213.js"></script><a href="https://webneko.net">Neko</a></h1>
</div> </div>
<p class="intro">Hi there, I'm Sophie!</p> <p class="intro">Hi there, I'm Sophie!</p>
<p class="info">she/they - trans - pan/polyam - 18</p> <p class="info">She/They, Trans MtF, 18, Artist, Developer, and Linux User</p>
<input type="button" onclick="location.href='https://en.pronouns.page/@IDeletedSystem64';" value="Pronouns.page"> <input type="button" onclick="location.href='https://en.pronouns.page/@IDeletedSystem64';" value="Pronouns.page">
<input type="button" onclick="location.href='https://twitter.com/IDeleteSystem64';" value="Twitter"> <input type="button" onclick="location.href='https://twitter.com/IDeleteSystem64';" value="Twitter">
<input type="button" onclick="location.href='https://twitter.com/system64art';" value="Twitter (Art)"> <input type="button" onclick="location.href='https://twitter.com/system64art';" value="Twitter (Art)">
<input type="button" onclick="location.href='https://glaceon.social/IDeletedSystem64';" value="glaceon.social"> <input type="button" onclick="location.href='https://glaceon.social/@IDeletedSystem64';" value="glaceon.social">
<input type="button" onclick="location.href='https://soundcloud.com/user-158504584';" value="SoundCloud"> <input type="button" onclick="location.href='https://soundcloud.com/user-158504584';" value="SoundCloud">
<input type="button" onclick="location.href='https://deviantart.com/IDeletedSystem64';" value="DeviantART"> <input type="button" onclick="location.href='https://deviantart.com/IDeletedSystem64';" value="DeviantART">
<input type="button" onclick="location.href='https://github.com/IDeletedSystem64';" value="GitHub"> <input type="button" onclick="location.href='https://github.com/IDeletedSystem64';" value="GitHub">
<input type="button" onclick="location.href='https://steamcommunity.com/id/system64_';" value="Steam"> <input type="button" onclick="location.href='https://steamcommunity.com/id/system64_';" value="Steam">
<input type="button" onclick="location.href='https://open.spotify.com/user/w2kr77l67qtystmkuza8k2mcs';" value="Spotify"> <input type="button" onclick="location.href='https://open.spotify.com/user/w2kr77l67qtystmkuza8k2mcs';" value="Spotify">
<a href="https://github.com/IDeletedSystem64/system64.neocities.org"><img class="githubico" src="/img/github-32px.png" alt="View source code on GitHub!"></a> <a href="https://github.com/IDeletedSystem64/system64.neocities.org"><img class="githubico" src="img/github-32px.png">
</div> </div>
</body> </body>

View file

@ -49,12 +49,67 @@ input {
background: #dad9d9; background: #dad9d9;
font-size: 170%; font-size: 170%;
font-family: 'Share Tech Mono', monospace; font-family: 'Share Tech Mono', monospace;
color: black;
box-shadow: inset -0.05em -0.05em black box-shadow: inset -0.05em -0.05em black
} }
input:active { input:active {
background: #acacac; background: #acacac;
box-shadow: inset 0em 0em box-shadow: inset 0em 0em
} }
a {
text-decoration: none;
}
.button {
display: inline-flex;
font-size: 16px;
text-align: center;
border: none;
border-radius: 4px;
outline: none;
box-shadow: none;
cursor: pointer;
transition: 0.3s ease-in-out;
}
.button.button1 {
border-radius: 0;
box-sizing: border-box;
min-height: 23px;
color: #000;
padding: 0 2px 2px 0;
border-top: 1px solid #CCCCCC;
border-right: 0.1px solid transparent;
border-bottom: 1px solid #333333;
border-left: 1px solid #CCCCCC;
background-color: #979797;
width: 15%;
}
.button.button1 span {
-webkit-appearance: none;
margin-left: auto;
margin-right: auto;
display: block;
width: 100%;
background: #dad9d9;
font-size: 170%;
font-family: 'Share Tech Mono', monospace;
box-shadow: inset -0.05em -0.05em black;
}
.button.button1 span:hover,
.button.button1:hover + .button.button1 span {
background-color: #ACACAC;
border-top: 1px solid transparent;
border-right: 0.1px solid #dad9d9;
border-bottom: 1px solid #dad9d9;
border-left: 1px solid transparent;
box-shadow: inset -0.05em -0.05em transparent;}
.button.button1:hover {
background-color: #ACACAC;
}
img.githubico { img.githubico {
left: 49%; left: 49%;
position: fixed; position: fixed;
@ -73,15 +128,16 @@ img.githubico {
padding-left: 25%; padding-left: 25%;
} }
input { input {
margin-left: -10%;
font-size: 7vw; font-size: 7vw;
min-width: 110%; -webkit-text-size-adjust:100%;
max-width: 110%; min-width: 125%;
/* I lack the understanding as to why I have to set a mix/max, but its also nearly midnight as I'm writing this and I should probably go to bed. */ max-width: 125;
} }
p.info { p.info {
font-family: 'Share Tech Mono', monospace; font-family: 'Share Tech Mono', monospace;
color: white; color: white;
font-size: 5vw; font-size: 4.5vw;
text-align: center; text-align: center;
} }
} }