testing the new settings page

This commit is contained in:
Sevi 2024-10-29 10:49:30 -07:00 committed by GitHub
parent d3ea3cd68e
commit c2cb6ea8c0
No known key found for this signature in database
GPG Key ID: B5690EEEBB952194
2 changed files with 46 additions and 0 deletions

View File

@ -191,3 +191,35 @@ button:hover {
font-weight: 500;
font-style: normal;
}
.clicker {
display: inline-block;
width: 100px;
height: 50px;
background-color: blue;
color:#FFF;
}
.clicker.hidden {
display: none;
}
.hiddendiv {
height: 0px;
background-color: green;
overflow: hidden;
transition: height 0.5s;
}
.hiddendiv.nr2 {
background-color: red;
}
#showdiv1:target ~ div a[href="#showdiv1"],
#showdiv2:target ~ div a[href="#showdiv2"] {
display: none;
}
#showdiv1:target ~ div a[href="#hidediv1"],
#showdiv2:target ~ div a[href="#hidediv2"] {
display: inline-block;
}
#showdiv1:target ~ div .hiddendiv.nr1,
#showdiv2:target ~ div .hiddendiv.nr2 {
height: 130px;
}

View File

@ -121,6 +121,20 @@
<a href="settings.html" target="_blank">
<button style="background-color: rgb(73, 73, 73);">Settings Page</button>
</a>
<div id="showdiv1"></div>
<div id="showdiv2"></div>
<div>
<a href="#showdiv1" class="clicker" tabindex="1">Click me 1</a>
<a href="#hidediv1" class="clicker hidden" tabindex="1">Click me 1</a>
<a href="#showdiv2" class="clicker" tabindex="2">Click me 2</a>
<a href="#hidediv2" class="clicker hidden" tabindex="2">Click me 2</a>
<div class="hiddendiv nr1"></div>
<div class="hiddendiv nr2"></div>
</div>
</div>
<div id="joinModal" class="modal" style="display: none;">
<div class="modal-content">