blob: d45a04a9f6554c476519611a3084f19c38253341 (
plain) (
tree)
|
|
@import url('https://fonts.googleapis.com/css2?family=Raleway&display=swap');
body {
}
html {
--foreforeground: #3788ae;
--foreground: #082f41;
--background: #03141c;
color: white;
background: var(--background);
/*padding: 1cm;*/
font-size: 12pt;
font-family: 'Raleway', sans-serif;
height: 100%;
}
hr {
border: 0.5mm solid var(--foreforeground);
background: var(--foreforeground);
width: 100%;
height: 0%;
}
.filters::before {
content: "Pallette Search paths:";
}
.hide {display: none;}
input, button, details{
color: white;
background: var(--foreground);
padding: 1rem;
border: none;
border-radius: 0.5cm;
font-size: 13pt;
margin: 0.5rem;
}
input::placeholder {
color: var(--foreforeground);
}
details :is(input, button) {
background: var(--background);
}
/*input[type=checkbox] {
display: none;
}
input[type=checkbox] + label {
position: relative;
padding-left: 2.5rem;
padding-right: .5rem;
}
input[type=checkbox] + label::before {
background: var(--foreground);
width: 1.5rem;
height: 1.5rem;
margin: auto;
content: "";
position: absolute;
left: 0;
top: -0.33rem;
border-radius: 0.25rem;
border: 0.25rem var(--foreforeground) solid;
}
input[type=checkbox]:checked + label::before {
border-color: var(--foreground);
background: var(--foreforeground);
color: var(--foreground);
font-size: 16pt;
/*content: "✓";* /
align-content: center;
}*/
details {
padding: 1rem;
background: var(--foreground);
}
details.betaChip > summary::before {
content: "β ";
color: paleturquoise;
}
.returnedchip > summary {
position: relative;
}
.returnedchip > summary > button.addBtn {
padding: 0rem;
margin: 0;
height: 2rem;
width: 2rem;
position: absolute;
top: calc(50% - 1rem);
right: 0;
left: calc(100% - 2rem);
bottom: calc(50% - 1rem);
text-align: center;
background: #0000;
font-size: 2rem;
}
details[open] > summary {
border-bottom: 1mm var(--foreforeground) solid;
margin-bottom: 0.5rem;
}
body {
display: flex;
flex-flow: column;
height: calc(100% - 2cm);
margin: 1cm;
}
#resultslist {
overflow: auto;
}
#listcontrols {
display: flex;
flex-flow: row;
align-items: center;
}
#helpbox > summary {
height: 1.5cm;
width: 1.5cm;
display: flex;
background: #0000;
border: #fff7 solid 0.9mm;
color: #fff7;
border-radius: 1.5cm;
padding: 0;
font-size: 1.5cm;
align-items: center;
justify-content: center;
float: left;
position: absolute;
bottom: 0;
right: 0;
user-select: none;
}
#helpbox[open] > summary {
margin-bottom: 0;
background: #fff7;
border: #0000 solid 0.9mm;
color: #fff;
}
#helpbox {
position: fixed;
bottom: 2rem;
right: 2rem;
background: #0000;
border-radius: 0;
}
#helpbox > div {
background: var(--foreground);
border-radius: 0.5cm;
height: 60vh;
width: 10cm;
overflow-x: auto;
padding: 1rem;
position: relative;
bottom: 2cm;
box-shadow: black 1mm 1mm 3mm
}
a:link {
color: white;
}
a:visited {
color: var(--foreforeground);
}
.depbad, .depbad + summary {
color: palevioletred;
}
.depwarn, .depwarn + summary {
color: palegoldenrod;
}
kbd {
background: white;
color: black;
padding: 0.5mm;
border-radius: 1mm;
box-shadow: inset black -0.25mm -0.25mm 1mm;
}
input:not(:checked).selecttab + .tab {
display: none;
}
.tab {
position: absolute;
top: 2rem;
}
summary,
button,
:is(input[type=radio], input[type=checkbox]),
:is(input[type=radio], input[type=checkbox]) + label {
cursor: pointer;
}
@media (orientation: portrait) {
#listcontrols {
justify-content: space-between;
}
#form > details {
overflow: auto;
max-height: 20vh;
}
label::after {
content: "\a";
white-space: pre;
}
input[type=text] {
width: calc(100vw - 3.25cm);
}
#helpbox > div {
width: calc(100vw - 3.5cm);
height: 60vh;
}
}
|