Files
aircox-radiocampus/radiocampus/assets/src/styles/common.scss

99 lines
1.8 KiB
SCSS

@use "./vars" as v;
@import "./vendor";
@import "./helpers";
//-- helpers/modifiers
//-- forms
input.half-field:not(:active):not(:hover) {
border: none;
background-color: rgba(0,0,0,0);
cursor: pointer;
}
//-- general
:root {
--body-bg: #fff;
--text-color: black;
--text-color-light: #555;
--break-color: rgb(225, 225, 225, 0.8);
--main-color: #EFCA08;
--main-color-light: #F4da51;
--main-color-dark: #F49F0A;
--secondary-color: #00A6A6;
--secondary-color-light: #4cc0c0;
--secondary-color-dark: #007ba8;
--disabled-color: #aaa;
--disabled-bg: #eee;
--link-fg: #00A6A6;
--link-hv-fg: var(--text-color);
--nav-primary-height: 3rem;
--nav-secondary-height: 2.5rem;
--nav-fg: var(--text-color);
--nav-bg: var(--main-color);
--nav-secondary-bg: var(--main-color-light);
--nav-hv-fg: var(--button-hv-fg);
--nav-hv-bg: var(--button-hv-bg);
--nav-active-fg: var(--button-active-fg);
--nav-active-bg: var(--button-active-bg);
--nav-fs: 1rem;
--nav-2-fs: 0.9rem;
}
:root {
font-size: 14px;
}
body {
background-color: var(--body-bg);
}
@mixin mobile-small {
.grid { @include grid-1; }
}
body.mobile {
@include mobile-small;
}
@media screen and (max-width: v.$screen-smaller) {
@include mobile-small;
}
@media screen and (max-width: v.$screen-normal) {
html { font-size: 16px !important; }
}
@media screen and (max-width: v.$screen-wider) {
html { font-size: 20px !important; }
}
@media screen and (min-width: v.$screen-wider) {
html { font-size: 20px !important; }
}
h1, h2, h3, h4, h5, h6, .heading, .title, .subtitle {
font-family: var(--heading-font-family);
}
.container:empty {
display: none;
}
.header-cover {
display: flex;
flex-direction: column;
}
.modal .dropdown-menu {
z-index: 50,
}