syrell/homepage
1
0
Fork 0
Code Issues Pull Requests Packages Projects Releases Wiki Activity

Fixed darkmode button position to be responsive

Browse Source
This commit is contained in:
syrell 2023-06-29 18:55:59 +02:00
parent f8d4f03cf8
commit cf0104d387
Signed by: syrell
GPG Key ID: BC9570E849334AF9
2 changed files with 10 additions and 3 deletions
Show Stats Download Patch File Download Diff File Expand all files Collapse all files

11
css/skeleton-auto.css
View File

@ -278,13 +278,20 @@ hr {
url('../fonts/open-sans-v34-vietnamese_latin-ext_latin_hebrew_greek-ext_greek_cyrillic-ext_cyrillic-800.svg#OpenSans') format('svg'); /* Legacy iOS */ url('../fonts/open-sans-v34-vietnamese_latin-ext_latin_hebrew_greek-ext_greek_cyrillic-ext_cyrillic-800.svg#OpenSans') format('svg'); /* Legacy iOS */
} }
#darkmode-toggle {
display: none;
}
label { label {
width:70px; width:70px;
height:35px; height:35px;
position: relative; position: relative;
display: block; display: block;
top: -40px; top: -20px;
left: 265px; left: 44%;
/* left: 265px; */
text-align: center;
/* left: 44%; */
background: #ebebeb; background: #ebebeb;
border-radius: 20px; border-radius: 20px;
box-shadow: inset 0px 0px 10px rgba(0,0,0,0.4), inset 0px 0px 10px rgba(255,255,255,0.4); box-shadow: inset 0px 0px 10px rgba(0,0,0,0.4), inset 0px 0px 10px rgba(255,255,255,0.4);

2
index.html
View File

@ -103,7 +103,7 @@
This can improve the experience for assistive technology users by hiding what is essentially duplicated This can improve the experience for assistive technology users by hiding what is essentially duplicated
--> -->
<input class="button" type="checkbox" id="darkmode-toggle" onclick="setTheme()"/> <input type="checkbox" id="darkmode-toggle" onclick="setTheme()"/>
<label for="darkmode-toggle"></label> <label for="darkmode-toggle"></label>
<script> <script>