mirror of
https://github.com/DarrylNixon/binhop
synced 2024-04-22 12:37:06 -07:00
110 lines
2.2 KiB
CSS
110 lines
2.2 KiB
CSS
|
body {
|
|||
|
|
color: #fff;
|
|||
|
|
}
|
|||
|
|
.header {
|
|||
|
|
max-width: 600px;
|
|||
|
|
margin: 0 auto;
|
|||
|
|
text-align: center;
|
|||
|
|
}
|
|||
|
|
.container {
|
|||
|
|
max-width: 1200px;
|
|||
|
|
margin: 0 auto;
|
|||
|
|
}
|
|||
|
|
.logo {
|
|||
|
|
margin-top: 50px;
|
|||
|
|
margin-bottom: 30px;
|
|||
|
|
width: 200px;
|
|||
|
|
}
|
|||
|
|
.button-center {
|
|||
|
|
max-width: 600px;
|
|||
|
|
margin: 0 auto;
|
|||
|
|
text-align: center;
|
|||
|
|
}
|
|||
|
|
button {
|
|||
|
|
background-color: #3498db;
|
|||
|
|
color: #fff;
|
|||
|
|
border: none;
|
|||
|
|
padding: 10px 20px;
|
|||
|
|
font-size: 16px;
|
|||
|
|
}
|
|||
|
|
button:hover {
|
|||
|
|
background-color: #2980b9;
|
|||
|
|
}
|
|||
|
|
pre {
|
|||
|
|
white-space: pre-wrap;
|
|||
|
|
}
|
|||
|
|
#footer {
|
|||
|
|
position: fixed;
|
|||
|
|
bottom: 10px;
|
|||
|
|
right: 10px;
|
|||
|
|
background-color:#263745;
|
|||
|
|
padding: .2em;
|
|||
|
|
opacity: 0.4;
|
|||
|
|
}
|
|||
|
|
/* Yet unused, from https://iamkate.com/code/tree-views/ */
|
|||
|
|
/* .tree{
|
|||
|
|
--spacing : 1.5rem;
|
|||
|
|
--radius : 10px;
|
|||
|
|
}
|
|||
|
|
.tree li{
|
|||
|
|
display : block;
|
|||
|
|
position : relative;
|
|||
|
|
padding-left : calc(2 * var(--spacing) - var(--radius) - 2px);
|
|||
|
|
}
|
|||
|
|
.tree ul{
|
|||
|
|
margin-left : calc(var(--radius) - var(--spacing));
|
|||
|
|
padding-left : 0;
|
|||
|
|
}
|
|||
|
|
.tree ul li{
|
|||
|
|
border-left : 2px solid #ddd;
|
|||
|
|
}
|
|||
|
|
.tree ul li:last-child{
|
|||
|
|
border-color : transparent;
|
|||
|
|
}
|
|||
|
|
.tree ul li::before{
|
|||
|
|
content : '';
|
|||
|
|
display : block;
|
|||
|
|
position : absolute;
|
|||
|
|
top : calc(var(--spacing) / -2);
|
|||
|
|
left : -2px;
|
|||
|
|
width : calc(var(--spacing) + 2px);
|
|||
|
|
height : calc(var(--spacing) + 1px);
|
|||
|
|
border : solid #ddd;
|
|||
|
|
border-width : 0 0 2px 2px;
|
|||
|
|
}
|
|||
|
|
.tree summary{
|
|||
|
|
display : block;
|
|||
|
|
cursor : pointer;
|
|||
|
|
}
|
|||
|
|
.tree summary::marker, .tree summary::-webkit-details-marker{
|
|||
|
|
display : none;
|
|||
|
|
}
|
|||
|
|
.tree summary:focus{
|
|||
|
|
outline : none;
|
|||
|
|
}
|
|||
|
|
.tree summary:focus-visible{
|
|||
|
|
outline : 1px dotted #000;
|
|||
|
|
}
|
|||
|
|
.tree li::after, .tree summary::before{
|
|||
|
|
content : '';
|
|||
|
|
display : block;
|
|||
|
|
position : absolute;
|
|||
|
|
top : calc(var(--spacing) / 2 - var(--radius));
|
|||
|
|
left : calc(var(--spacing) - var(--radius) - 1px);
|
|||
|
|
width : calc(2 * var(--radius));
|
|||
|
|
height : calc(2 * var(--radius));
|
|||
|
|
border-radius : 50%;
|
|||
|
|
background : #ddd;
|
|||
|
|
}
|
|||
|
|
.tree summary::before{
|
|||
|
|
content : '+';
|
|||
|
|
z-index : 1;
|
|||
|
|
background : #696;
|
|||
|
|
color : #fff;
|
|||
|
|
line-height : calc(2 * var(--radius) - 2px);
|
|||
|
|
text-align : center;
|
|||
|
|
}
|
|||
|
|
.tree details[open] > summary::before{
|
|||
|
|
content : '−';
|
|||
|
|
} */
|