dzura/www/css/ui.css
2024-08-27 18:25:23 -07:00

146 lines
2.6 KiB
CSS

main>table.list{
width:100%;
border-collapse:collapse;
}
main>table.list tr{
height:2.5rem;
}
main>table.list th{
padding:0 1rem 0 1rem;
text-align:center;
font-size:1.2rem;
font-weight:bold;
background-color:#383838;
color:#f0f0f0;
border-bottom:1px solid #404040;
}
main>table.list td{
width:1px;
height:100%;
padding:0 2rem 0 2rem;
text-align:center;
white-space:nowrap;
background-color:#303030;
color:#f0f0f0;
border-right: 1px solid #383838;
}
main>table.list td:last-child{
display:flex;
flex-flow:row nowrap;
align-items:flex-start;
justify-content:flex-end;
width:auto;
border: 0;
}
main>table.list.session td:nth-child(1){ width:10rem; }
main>table.list.session td:nth-child(2){ width:10rem; }
main>table.list.challenge td:nth-child(2){ width:10rem; }
main>table.list td:last-child>button{
display:block;
position:relative;
width:auto;
height:100%;
padding:0 1rem 0 1rem;
text-align:left;
font-size:1.25rem;
cursor:pointer;
background-color:#303030;
color:#e0e0e0;
border:0;
outline:0;
}
main>table.list td:last-child>button.highlight {
background-color:#772d43;
}
main>table.list td:last-child>button:hover{
background-color:#343434;
}
main>article{
display:block;
position:relative;
width:100%;
flex-grow:1;
padding:1rem;
margin:0;
line-height:1.4em;
font-size:1.2rem;
color:#c0c0c0;
overflow:auto;
}
main>article>h1{
padding:0.5rem;
margin:0 0 0.5rem 0;
font-size:1.8rem;
font-weight:bold;
background-color:#a0a0a0;
color:#202020;
}
main>article>h2{
padding:0 0 0.5rem 0.25rem;
margin:1.5rem 0 0.5rem 0;
font-size:1.6rem;
font-weight:bold;
border-bottom:2px solid #c0c0c0;
color:#c0c0c0;
}
main>article>h3{
padding:0 0 0 0.25rem;
margin:1.5rem 0 0.5rem 0;
font-size:1.5rem;
font-weight:bold;
text-decoration:underline;
color:#b0b0b0;
}
main>article>h4{
padding:0 0 0 0.25rem;
margin:1.5rem 0 0.5rem 0;
font-size:1.3rem;
text-decoration:underline;
color:#a0a0a0;
}
main>article>p{
padding:0 0.5rem 0 0.5rem;
}
main>article a{
color:#db758e;
text-decoration:none;
}
main>article>a:hover{
text-decoration:underline;
}
main>div.turn-slider-padding{
display:block;
position:relative;
width:100%;
padding:0.25rem 0.5rem 0 0.5rem;
background-color:#101010;
}
input#turn-slider{
display:block;
position:relative;
width:100%;
height:1rem;
accent-color:#702e2e;
}