radiocampus: style update

2024-05-31 14:40:31 +02:00
parent a323901d0e
commit f29cced5f5
66 changed files with 10589 additions and 10 deletions
--- a/radiocampus/assets/src/styles/common.scss
+++ b/radiocampus/assets/src/styles/common.scss
@ -0,0 +1,98 @@
+@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,
+}