149 lines
2.9 KiB
CSS
149 lines
2.9 KiB
CSS
|
.scrollable {
|
||
|
|
overflow-y: auto;
|
||
|
|
}
|
||
|
|
|
||
|
|
.window {
|
||
|
|
position : fixed;
|
||
|
|
background-color: rgba(0, 0, 0, 0.7);
|
||
|
|
width : 90%;
|
||
|
|
top : 0;
|
||
|
|
color : white;
|
||
|
|
font-family : 'Franklin Gothic Medium', 'Arial Narrow', Arial, sans-serif;
|
||
|
|
margin : auto;
|
||
|
|
margin-top : 20px;
|
||
|
|
right : 0;
|
||
|
|
left : 0;
|
||
|
|
padding : 15px;
|
||
|
|
box-sizing : border-box;
|
||
|
|
border-color : white;
|
||
|
|
border-style : solid;
|
||
|
|
border-width : 2px;
|
||
|
|
border-width : calc(0.15 * (1vw + 1vh));
|
||
|
|
font-size : 20px;
|
||
|
|
font-size : calc(14px + ((0.4 * (0.8vw + 1vh)) + 0.15rem));
|
||
|
|
max-height : 90%;
|
||
|
|
transition : 0.2s;
|
||
|
|
z-index : 10;
|
||
|
|
}
|
||
|
|
|
||
|
|
.window.flex {
|
||
|
|
display : flex;
|
||
|
|
flex-direction: column;
|
||
|
|
}
|
||
|
|
|
||
|
|
hr {
|
||
|
|
width: 100%;
|
||
|
|
}
|
||
|
|
|
||
|
|
.window button,
|
||
|
|
.window input {
|
||
|
|
background-color: rgba(0, 0, 0, 0.7);
|
||
|
|
color : white;
|
||
|
|
font-size : 20px;
|
||
|
|
font-size : 0.9em;
|
||
|
|
padding : 0.4rem;
|
||
|
|
transition : 0.2s;
|
||
|
|
border : 1px solid #fff;
|
||
|
|
border-radius : 5px;
|
||
|
|
}
|
||
|
|
|
||
|
|
h1 {
|
||
|
|
font-weight : normal;
|
||
|
|
margin-block-start: 0.5em;
|
||
|
|
margin-block-end : 0.5em;
|
||
|
|
transition : 0.2s;
|
||
|
|
}
|
||
|
|
|
||
|
|
canvas {
|
||
|
|
transition: 0.2s;
|
||
|
|
}
|
||
|
|
|
||
|
|
button:hover {
|
||
|
|
background-color: rgba(222, 222, 222, 0.52);
|
||
|
|
border-radius : 8px;
|
||
|
|
}
|
||
|
|
|
||
|
|
.window input:focus {
|
||
|
|
background-color: rgba(222, 222, 222, 0.36);
|
||
|
|
border-radius : 8px;
|
||
|
|
}
|
||
|
|
|
||
|
|
input#userna,
|
||
|
|
input#inputfilebtn {
|
||
|
|
transition: 0.2s
|
||
|
|
}
|
||
|
|
|
||
|
|
|
||
|
|
/* Checkbox */
|
||
|
|
label.checkbox {
|
||
|
|
display : block;
|
||
|
|
position : relative;
|
||
|
|
padding-left : 35px;
|
||
|
|
/*margin-bottom: 12px;*/
|
||
|
|
cursor : pointer;
|
||
|
|
}
|
||
|
|
|
||
|
|
label.checkbox input {
|
||
|
|
position: absolute;
|
||
|
|
opacity : 0;
|
||
|
|
cursor : pointer;
|
||
|
|
height : 0;
|
||
|
|
width : 0;
|
||
|
|
}
|
||
|
|
|
||
|
|
.checkmark {
|
||
|
|
position : absolute;
|
||
|
|
top : 0;
|
||
|
|
left : 0;
|
||
|
|
height : 25px;
|
||
|
|
width : 25px;
|
||
|
|
/*background-color: #eee;*/
|
||
|
|
background-color : rgb(255 255 255 / 70%);
|
||
|
|
}
|
||
|
|
|
||
|
|
label.checkbox:hover .checkmark {
|
||
|
|
background-color: #ccc;
|
||
|
|
}
|
||
|
|
|
||
|
|
label.checkbox input:checked~.checkmark {
|
||
|
|
/*background-color: #2196F3;*/
|
||
|
|
background-color: rgba(0, 255, 0, 0.5);
|
||
|
|
}
|
||
|
|
|
||
|
|
.checkmark::after {
|
||
|
|
content : "";
|
||
|
|
position: absolute;
|
||
|
|
display : none;
|
||
|
|
}
|
||
|
|
|
||
|
|
label.checkbox input:checked~.checkmark:after {
|
||
|
|
display: block;
|
||
|
|
}
|
||
|
|
|
||
|
|
label.checkbox .checkmark:after {
|
||
|
|
left : 9px;
|
||
|
|
top : 5px;
|
||
|
|
width : 5px;
|
||
|
|
height : 10px;
|
||
|
|
border : solid white;
|
||
|
|
border-width : 0 3px 3px 0;
|
||
|
|
-webkit-transform: rotate(45deg);
|
||
|
|
-ms-transform : rotate(45deg);
|
||
|
|
transform : rotate(45deg);
|
||
|
|
}
|
||
|
|
|
||
|
|
|
||
|
|
/* Custom Map Button */
|
||
|
|
::-webkit-file-upload-button {
|
||
|
|
color : white;
|
||
|
|
background-color: #120076;
|
||
|
|
border : 2px solid #fff;
|
||
|
|
top : 0;
|
||
|
|
bottom : 0;
|
||
|
|
padding-top : 20px;
|
||
|
|
padding-bottom : 20px;
|
||
|
|
padding-left : 20px;
|
||
|
|
padding-right : 20px;
|
||
|
|
font-family : 'Trebuchet MS', 'Arial Narrow', Arial, sans-serif;
|
||
|
|
text-align : center;
|
||
|
|
}
|