template/src/main/css/common.css

125 lines
3.1 KiB
CSS

:root {
--fwdekker-theme-color: #0033cc;
}
html {
height: 100%;
}
body {
position: relative;
padding-top: 5rem;
padding-bottom: 9rem; /* Vertical footer paddings + 1 */
min-height: 100%;
}
.footer {
position: absolute;
bottom: 0;
padding-top: 5rem;
padding-bottom: 3rem;
width: 100%;
}
/* Make arrow next to dropdown visible */
select {
-webkit-appearance: menulist;
-moz-appearance: menulist;
appearance: auto;
}
/* Override color scheme */
/* Replaces #9b4dca with #0033cc */
.button,
button,
input[type='button'],
input[type='reset'],
input[type='submit'] {
background-color: var(--fwdekker-theme-color);
border: 0.1rem solid var(--fwdekker-theme-color);
}
.button[disabled]:focus, .button[disabled]:hover,
button[disabled]:focus,
button[disabled]:hover,
input[type='button'][disabled]:focus,
input[type='button'][disabled]:hover,
input[type='reset'][disabled]:focus,
input[type='reset'][disabled]:hover,
input[type='submit'][disabled]:focus,
input[type='submit'][disabled]:hover {
background-color: var(--fwdekker-theme-color);
border-color: var(--fwdekker-theme-color);
}
.button.button-outline,
button.button-outline,
input[type='button'].button-outline,
input[type='reset'].button-outline,
input[type='submit'].button-outline {
color: var(--fwdekker-theme-color);
}
.button.button-outline[disabled]:focus, .button.button-outline[disabled]:hover,
button.button-outline[disabled]:focus,
button.button-outline[disabled]:hover,
input[type='button'].button-outline[disabled]:focus,
input[type='button'].button-outline[disabled]:hover,
input[type='reset'].button-outline[disabled]:focus,
input[type='reset'].button-outline[disabled]:hover,
input[type='submit'].button-outline[disabled]:focus,
input[type='submit'].button-outline[disabled]:hover {
color: var(--fwdekker-theme-color);
}
.button.button-clear,
button.button-clear,
input[type='button'].button-clear,
input[type='reset'].button-clear,
input[type='submit'].button-clear {
color: var(--fwdekker-theme-color);
}
.button.button-clear[disabled]:focus, .button.button-clear[disabled]:hover,
button.button-clear[disabled]:focus,
button.button-clear[disabled]:hover,
input[type='button'].button-clear[disabled]:focus,
input[type='button'].button-clear[disabled]:hover,
input[type='reset'].button-clear[disabled]:focus,
input[type='reset'].button-clear[disabled]:hover,
input[type='submit'].button-clear[disabled]:focus,
input[type='submit'].button-clear[disabled]:hover {
color: var(--fwdekker-theme-color);
}
pre {
border-left: 0.3rem solid var(--fwdekker-theme-color);
}
input[type='email']:focus,
input[type='number']:focus,
input[type='password']:focus,
input[type='search']:focus,
input[type='tel']:focus,
input[type='text']:focus,
input[type='url']:focus,
input[type='color']:focus,
input[type='date']:focus,
input[type='month']:focus,
input[type='week']:focus,
input[type='datetime']:focus,
input[type='datetime-local']:focus,
input:not([type]):focus,
textarea:focus,
select:focus {
border-color: var(--fwdekker-theme-color);
}
a {
color: var(--fwdekker-theme-color);
}