testing the new settings page
This commit is contained in:
parent
d3ea3cd68e
commit
c2cb6ea8c0
@ -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;
|
||||
}
|
||||
|
14
index.html
14
index.html
@ -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">
|
||||
|
Loading…
x
Reference in New Issue
Block a user