diff --git a/frontend/package.json b/frontend/package.json index 8a7623a21..80ec9f258 100755 --- a/frontend/package.json +++ b/frontend/package.json @@ -23,8 +23,8 @@ "babel-core": "^7.0.0-bridge.0", "babel-jest": "^27.3.1", "babel-preset-vue": "^2.0.2", - "bootstrap": "4.3.1", - "bootstrap-vue": "^2.5.0", + "bootstrap": "^4.5.3", + "bootstrap-vue": "^2.21.2", "es6-promise": "^4.1.1", "eslint": "^7.25.0", "eslint-config-prettier": "^8.1.0", @@ -45,6 +45,7 @@ "jest-canvas-mock": "^2.3.1", "jest-environment-jsdom-sixteen": "^2.0.0", "particles-bg-vue": "1.2.3", + "portal-vue": "^2.1.7", "prettier": "^2.2.1", "qrcode": "^1.4.4", "regenerator-runtime": "^0.13.7", diff --git a/frontend/src/assets/scss/argon.scss b/frontend/src/assets/scss/argon.scss deleted file mode 100644 index 1fa663a5f..000000000 --- a/frontend/src/assets/scss/argon.scss +++ /dev/null @@ -1,126 +0,0 @@ -/*! - -========================================================= -* Bootstrap Vue Gradido Wallet- v0.0.1 -========================================================= - -* Product Page: https://www.gradido.net -* Copyright 2020 Bernd Hückstädt - Gradido (https://www.gradido.net) - -* Coded by www.gradido.net - -========================================================= - -* The above copyright notice and this permission notice shall be included in all copies or substantial portions of the Software. - -*/ - -// Core - -@import "custom/functions"; -@import "custom/variables"; -@import "custom/mixins"; - -// Bootstrap (4.1.3) components - -@import "~bootstrap/scss/alert"; -@import "~bootstrap/scss/badge"; -@import "~bootstrap/scss/breadcrumb"; -@import "~bootstrap/scss/button-group"; -@import "~bootstrap/scss/buttons"; -@import "~bootstrap/scss/card"; -@import "~bootstrap/scss/carousel"; -@import "~bootstrap/scss/close"; -@import "~bootstrap/scss/code"; -@import "~bootstrap/scss/custom-forms"; -@import "~bootstrap/scss/dropdown"; -@import "~bootstrap/scss/forms"; -@import "~bootstrap/scss/grid"; -@import "~bootstrap/scss/images"; -@import "~bootstrap/scss/input-group"; -@import "~bootstrap/scss/jumbotron"; -@import "~bootstrap/scss/list-group"; -@import "~bootstrap/scss/media"; -@import "~bootstrap/scss/modal"; -@import "~bootstrap/scss/nav"; -@import "~bootstrap/scss/navbar"; -@import "~bootstrap/scss/pagination"; -@import "~bootstrap/scss/popover"; -@import "~bootstrap/scss/print"; -@import "~bootstrap/scss/progress"; -@import "~bootstrap/scss/reboot"; -@import "~bootstrap/scss/root"; -@import "~bootstrap/scss/tables"; -@import "~bootstrap/scss/toasts"; -@import "~bootstrap/scss/tooltip"; -@import "~bootstrap/scss/transitions"; -@import "~bootstrap/scss/type"; -@import "~bootstrap/scss/utilities"; -@import "~bootstrap/scss/variables"; - -// Utilities - -@import "~bootstrap/scss/utilities/align"; -@import "~bootstrap/scss/utilities/background"; -@import "~bootstrap/scss/utilities/borders"; -@import "~bootstrap/scss/utilities/clearfix"; -@import "~bootstrap/scss/utilities/display"; -@import "~bootstrap/scss/utilities/embed"; -@import "~bootstrap/scss/utilities/flex"; -@import "~bootstrap/scss/utilities/float"; -@import "~bootstrap/scss/utilities/overflow"; -@import "~bootstrap/scss/utilities/position"; -@import "~bootstrap/scss/utilities/screenreaders"; -@import "~bootstrap/scss/utilities/shadows"; -@import "~bootstrap/scss/utilities/sizing"; -@import "~bootstrap/scss/utilities/spacing"; -@import "~bootstrap/scss/utilities/stretched-link"; -@import "~bootstrap/scss/utilities/text"; -@import "~bootstrap/scss/utilities/visibility"; - - -// Mixins - -@import "~bootstrap/scss/mixins/alert"; -@import "~bootstrap/scss/mixins/badge"; -@import "~bootstrap/scss/mixins/border-radius"; -@import "~bootstrap/scss/mixins/box-shadow"; -@import "~bootstrap/scss/mixins/breakpoints"; -@import "~bootstrap/scss/mixins/buttons"; -@import "~bootstrap/scss/mixins/caret"; -@import "~bootstrap/scss/mixins/clearfix"; -@import "~bootstrap/scss/mixins/deprecate"; -@import "~bootstrap/scss/mixins/float"; -@import "~bootstrap/scss/mixins/forms"; -@import "~bootstrap/scss/mixins/gradients"; -@import "~bootstrap/scss/mixins/grid-framework"; -@import "~bootstrap/scss/mixins/grid"; -@import "~bootstrap/scss/mixins/hover"; -@import "~bootstrap/scss/mixins/image"; -@import "~bootstrap/scss/mixins/list-group"; -@import "~bootstrap/scss/mixins/lists"; -@import "~bootstrap/scss/mixins/nav-divider"; -@import "~bootstrap/scss/mixins/pagination"; -@import "~bootstrap/scss/mixins/reset-text"; -@import "~bootstrap/scss/mixins/resize"; -@import "~bootstrap/scss/mixins/screen-reader"; -@import "~bootstrap/scss/mixins/size"; -@import "~bootstrap/scss/mixins/table-row"; -@import "~bootstrap/scss/mixins/text-emphasis"; -@import "~bootstrap/scss/mixins/text-hide"; -@import "~bootstrap/scss/mixins/text-truncate"; -@import "~bootstrap/scss/mixins/transition"; -@import "~bootstrap/scss/mixins/visibility"; - - -// Argon utilities and components - -@import "custom/reboot"; -@import "custom/utilities"; -@import "custom/components"; - -// Vendor (Plugins) - -@import "custom/vendors"; - - diff --git a/frontend/src/assets/scss/core/alerts/_alert-dismissible.scss b/frontend/src/assets/scss/core/alerts/_alert-dismissible.scss deleted file mode 100644 index aa15ad1db..000000000 --- a/frontend/src/assets/scss/core/alerts/_alert-dismissible.scss +++ /dev/null @@ -1,39 +0,0 @@ -// -// Dismissible alert -// - -.alert-dismissible { - .close { - top: 50%; - right: $alert-padding-x; - padding: 0; - transform: translateY(-50%); - color: rgba($white, .6); - opacity: 1; - - &:hover, - &:focus { - color: rgba($white, .9); - opacity: 1 !important; - } - - @include media-breakpoint-down(xs) { - top: 1rem; - right: .5rem; - } - - &>span:not(.sr-only) { - font-size: 1.5rem; - background-color: transparent; - color: rgba($white, .6); - } - - &:hover, - &:focus { - &>span:not(.sr-only) { - background-color: transparent; - color: rgba($white, .9); - } - } - } -} diff --git a/frontend/src/assets/scss/core/alerts/_alert.scss b/frontend/src/assets/scss/core/alerts/_alert.scss deleted file mode 100644 index a9bc230a4..000000000 --- a/frontend/src/assets/scss/core/alerts/_alert.scss +++ /dev/null @@ -1,46 +0,0 @@ -// -// Alert -// - -.alert { - font-size: $font-size-sm; -} - -// Alert heading - -.alert-heading { - font-weight: $font-weight-bold; - font-size: $h4-font-size; - margin-top: .15rem; -} - - -// Alert icon -.alert-icon { - font-size: 1.25rem; - margin-right: 1.25rem; - display: inline-block; - vertical-align: middle; - - i.ni { - position: relative; - top: 1px; - } -} - - -// Alert text next to an alert icon -.alert-text { - display: inline-block; - vertical-align: middle; -} - - -// Alert links - -[class*="alert-"] { - .alert-link { - color: $white; - border-bottom: 1px dotted rgba($white, .5); - } -} diff --git a/frontend/src/assets/scss/core/avatars/_avatar-group.scss b/frontend/src/assets/scss/core/avatars/_avatar-group.scss deleted file mode 100644 index 0fcf4cf21..000000000 --- a/frontend/src/assets/scss/core/avatars/_avatar-group.scss +++ /dev/null @@ -1,22 +0,0 @@ -// -// Avatar group -// - -// General styles - -.avatar-group { - .avatar { - position: relative; - z-index: 2; - border: 2px solid $card-bg; - - &:hover { - z-index: 3; - } - } - - .avatar + .avatar { - margin-left: -1rem; - - } -} diff --git a/frontend/src/assets/scss/core/avatars/_avatar.scss b/frontend/src/assets/scss/core/avatars/_avatar.scss deleted file mode 100644 index 480fa8d8e..000000000 --- a/frontend/src/assets/scss/core/avatars/_avatar.scss +++ /dev/null @@ -1,42 +0,0 @@ -// -// Avatar -// - -// General styles - -.avatar { - color: $white; - background-color: $gray-500; - display: inline-flex; - align-items: center; - justify-content: center; - font-size: 1rem; - border-radius: 50%; - height: 48px; - width: 48px; - - img { - width: 100%; - border-radius: 50%; - } - - + .avatar-content { - display: inline-block; - margin-left: .75rem; - } -} - - -// Avatar size variations - -.avatar-lg { - width: 58px; - height: 58px; - font-size: $font-size-sm; -} - -.avatar-sm { - width: 36px; - height: 36px; - font-size: $font-size-sm; -} diff --git a/frontend/src/assets/scss/core/buttons/_button-brand.scss b/frontend/src/assets/scss/core/buttons/_button-brand.scss deleted file mode 100644 index 82a3dd7bb..000000000 --- a/frontend/src/assets/scss/core/buttons/_button-brand.scss +++ /dev/null @@ -1,12 +0,0 @@ -// -// Brand buttons -// - - -// Color variations - -@each $color, $value in $brand-colors { - .btn-#{$color} { - @include button-variant($value, $value); - } -} diff --git a/frontend/src/assets/scss/core/buttons/_button-icon.scss b/frontend/src/assets/scss/core/buttons/_button-icon.scss deleted file mode 100644 index 1aceddbf3..000000000 --- a/frontend/src/assets/scss/core/buttons/_button-icon.scss +++ /dev/null @@ -1,92 +0,0 @@ -// -// Icon buttons -// - -.btn-icon { - .btn-inner--icon { - img { - width: 20px; - } - } - - .btn-inner--text:not(:first-child) { - margin-left: 0.75em; - } - - .btn-inner--text:not(:last-child) { - margin-right: 0.75em; - } -} - - -// Button only with icon and NO text - -.btn-icon-only { - width: 2.375rem; - height: 2.375rem; - padding: 0; -} - -a.btn-icon-only { - line-height: 2.5; -} - -.btn-icon-only.btn-sm { - width: 2rem; - height: 2rem; -} - - -// -// Clipboard button -// dedicated element for copying icons -// - -.btn-icon-clipboard { - margin: 0; - padding: 1.5rem; - font-size: $font-size-base; - font-weight: $font-weight-normal; - line-height: 1.25; - color: $gray-800; - background-color: $gray-100; - border-radius: $border-radius; - border: 0; - text-align: left; - font-family: inherit; - display: inline-block; - vertical-align: middle; - text-decoration: none; - -moz-appearance: none; - cursor: pointer; - width: 100%; - margin: .5rem 0; - - &:hover { - background-color: $white; - box-shadow: rgba(0, 0, 0, .1) 0 0 0 1px, rgba(0, 0, 0, .1) 0 4px 16px; - } - - > div { - align-items: center; - display: flex; - } - - i { - box-sizing: content-box; - color: theme-color("primary"); - vertical-align: middle; - font-size: 1.5rem; - } - - span { - display: inline-block; - font-size: 0.875rem; - line-height: 1.5; - margin-left: 16px; - overflow: hidden; - white-space: nowrap; - text-overflow: ellipsis; - vertical-align: middle; - } -} diff --git a/frontend/src/assets/scss/core/buttons/_button.scss b/frontend/src/assets/scss/core/buttons/_button.scss deleted file mode 100644 index 9c19674b8..000000000 --- a/frontend/src/assets/scss/core/buttons/_button.scss +++ /dev/null @@ -1,91 +0,0 @@ -// -// Icon buttons -// - -// General styles - -.btn { - position: relative; - text-transform: $btn-text-transform; - transition: $transition-base; - letter-spacing: $btn-letter-spacing; - font-size: $input-btn-font-size; - will-change: transform; - - &:hover { - @include box-shadow($btn-hover-box-shadow); - transform: translateY($btn-hover-translate-y); - } - - &:not(:last-child) { - margin-right: .5rem; - } - - - // Icons - - i:not(:first-child), - svg:not(:first-child) { - margin-left: .5rem; - } - - i:not(:last-child), - svg:not(:last-child) { - margin-right: .5rem; - } -} - - -// Remove translateY and margin animation when btn is included in a btn-group or input-group - -.btn-group, -.input-group { - .btn { - margin-right: 0; - transform: translateY(0); - } -} - - -// Size variations - -.btn-sm { - font-size: $input-btn-font-size-sm; -} - -.btn-lg { - font-size: $input-btn-font-size-lg; -} - - -// Some quick fixes (to revise) - -// Fixes -[class*="btn-outline-"] { - border-width: 1px; -} - -.btn-outline-secondary { - color: darken(theme-color("secondary"), 50%); -} - -.btn-inner--icon { - i:not(.fa) { - position: relative; - top: 2px; - } -} - -.btn-link { - font-weight: $btn-font-weight; - box-shadow: none; - - &:hover { - box-shadow: none; - transform: none; - } -} - -.btn-neutral { - color: theme-color("primary"); -} diff --git a/frontend/src/assets/scss/core/cards/_card-animations.scss b/frontend/src/assets/scss/core/cards/_card-animations.scss deleted file mode 100644 index 4da8b7877..000000000 --- a/frontend/src/assets/scss/core/cards/_card-animations.scss +++ /dev/null @@ -1,10 +0,0 @@ -// -// Card with hover animations -// - -.card-lift--hover { - &:hover { - transform: translateY(-20px); - @include transition($transition-base); - } -} diff --git a/frontend/src/assets/scss/core/cards/_card-blockquote.scss b/frontend/src/assets/scss/core/cards/_card-blockquote.scss deleted file mode 100644 index 066bae597..000000000 --- a/frontend/src/assets/scss/core/cards/_card-blockquote.scss +++ /dev/null @@ -1,17 +0,0 @@ -// -// Card with blockquote -// - -.card-blockquote { - padding: 2rem; - position: relative; - - .svg-bg { - display: block; - width: 100%; - height: 95px; - position: absolute; - top: -94px; - left: 0; - } -} diff --git a/frontend/src/assets/scss/core/cards/_card-profile.scss b/frontend/src/assets/scss/core/cards/_card-profile.scss deleted file mode 100644 index 920f41155..000000000 --- a/frontend/src/assets/scss/core/cards/_card-profile.scss +++ /dev/null @@ -1,49 +0,0 @@ -// -// Profile card -// - -.card-profile-image { - position: relative; - - img { - max-width: 180px; - border-radius: $border-radius; - @extend .shadow; - transform: translate(-50%,-30%); - position: absolute; - left: 50%; - transition: $transition-base; - - &:hover { - transform: translate(-50%, -33%); - } - } -} - -.card-profile-stats { - padding: 1rem 0; - - > div { - text-align: center; - margin-right: 1rem; - padding: .875rem; - - &:last-child { - margin-right: 0; - } - - .heading { - font-size: 1.1rem; - font-weight: bold; - display: block; - } - .description { - font-size: .875rem; - color: $gray-500; - } - } -} - -.card-profile-actions { - padding: .875rem; -} diff --git a/frontend/src/assets/scss/core/cards/_card-stats.scss b/frontend/src/assets/scss/core/cards/_card-stats.scss deleted file mode 100644 index 1459304b7..000000000 --- a/frontend/src/assets/scss/core/cards/_card-stats.scss +++ /dev/null @@ -1,16 +0,0 @@ -// -// Card stats -// - -.card-stats { - .card-body { - padding: 1rem 1.5rem; - } - - .card-status-bullet { - position: absolute; - top: 0; - right: 0; - transform: translate(50%, -50%); - } -} diff --git a/frontend/src/assets/scss/core/cards/_card.scss b/frontend/src/assets/scss/core/cards/_card.scss deleted file mode 100644 index a593e4c3c..000000000 --- a/frontend/src/assets/scss/core/cards/_card.scss +++ /dev/null @@ -1,8 +0,0 @@ -// -// Card -// - - -.card-translucent { - background-color: rgba(18, 91, 152, 0.08); -} diff --git a/frontend/src/assets/scss/core/charts/_chart.scss b/frontend/src/assets/scss/core/charts/_chart.scss deleted file mode 100644 index 9ea3ecead..000000000 --- a/frontend/src/assets/scss/core/charts/_chart.scss +++ /dev/null @@ -1,69 +0,0 @@ -// -// Chart -// - -.chart { - position: relative; - height: $chart-height; -} - - -// Size variations - -.chart-sm { - height: $chart-height-sm; -} - - -// Legend - -.chart-legend { - display: flex; - justify-content: center; - margin-top: $chart-legend-margin-top; - font-size: $chart-legend-font-size; - text-align: center; - color: $chart-legend-color; -} - -.chart-legend-item { - display: inline-flex; - align-items: center; - - + .chart-legend-item { - margin-left: 1rem; - } -} - -.chart-legend-indicator { - display: inline-block; - width: 0.5rem; - height: 0.5rem; - margin-right: 0.375rem; - border-radius: 50%; -} - - -// Tooltip - -#chart-tooltip { - z-index: 0; - - .arrow { - top: 100%; - left: 50%; - transform: translateX(-50%) translateX(-.5rem); - } -} - - -// Chart info overlay - -.chart-info-overlay { - position: absolute; - top: 0; - left: 5%; - max-width: 350px; - padding: 20px; - z-index: 1; -} diff --git a/frontend/src/assets/scss/core/close/_close.scss b/frontend/src/assets/scss/core/close/_close.scss deleted file mode 100644 index 2c0672ae1..000000000 --- a/frontend/src/assets/scss/core/close/_close.scss +++ /dev/null @@ -1,34 +0,0 @@ -// -// Close -// - -.close { - @if $enable-transitions { - transition: $transition-base; - } - - &>span:not(.sr-only) { - background-color: $close-bg; - color: $close-color; - line-height: 17px; - height: 1.25rem; - width: 1.25rem; - border-radius: 50%; - font-size: 1.25rem; - display: block; - @if $enable-transitions { - transition: $transition-base; - } - } - - &:hover, - &:focus { - background-color: $close-hover-bg; - color: $close-hover-color; - outline: none; - - span:not(.sr-only) { - background-color: $close-hover-bg; - } - } -} diff --git a/frontend/src/assets/scss/core/custom-forms/_custom-checkbox.scss b/frontend/src/assets/scss/core/custom-forms/_custom-checkbox.scss deleted file mode 100644 index e808b5bb9..000000000 --- a/frontend/src/assets/scss/core/custom-forms/_custom-checkbox.scss +++ /dev/null @@ -1,37 +0,0 @@ -// -// Custom checkbox -// - -.custom-checkbox { - .custom-control-input ~ .custom-control-label { - cursor: pointer; - font-size: $font-size-sm; - } - - .custom-control-input { - &:checked { - ~ .custom-control-label { - &::before { - border-color: $custom-control-indicator-checked-border-color; - } - &::after { - background-image: $custom-checkbox-indicator-icon-checked; - } - } - } - - &:disabled { - ~ .custom-control-label { - &::before { - border-color: $custom-control-indicator-disabled-bg; - } - } - - &:checked { - &::before { - border-color: $custom-control-indicator-checked-disabled-bg; - } - } - } - } -} diff --git a/frontend/src/assets/scss/core/custom-forms/_custom-control.scss b/frontend/src/assets/scss/core/custom-forms/_custom-control.scss deleted file mode 100644 index 28610029d..000000000 --- a/frontend/src/assets/scss/core/custom-forms/_custom-control.scss +++ /dev/null @@ -1,51 +0,0 @@ -// -// Custom control -// additional styles for custom checkboxes, radios and other -// - -.custom-control-label { - // Background-color and (when enabled) gradient - &::before { - border: $custom-control-indicator-border-width solid $custom-control-indicator-border-color; - @if $enable-transitions { - transition: $input-transition; - } - } - - span { - position: relative; - top: 2px; - } -} - -.custom-control-label { - margin-bottom: 0; -} - - -// Alternative style - -.custom-control-alternative { - .custom-control-label { - // Background-color and (when enabled) gradient - &::before { - border: 0; - box-shadow: $input-alternative-box-shadow; - } - } - - .custom-control-input { - &:checked { - ~ .custom-control-label { - &::before { - box-shadow: $input-focus-alternative-box-shadow; - } - } - } - - &:active~.custom-control-label::before, - &:focus~.custom-control-label::before { - box-shadow: $input-alternative-box-shadow; - } - } -} diff --git a/frontend/src/assets/scss/core/custom-forms/_custom-form.scss b/frontend/src/assets/scss/core/custom-forms/_custom-form.scss deleted file mode 100644 index e808b5bb9..000000000 --- a/frontend/src/assets/scss/core/custom-forms/_custom-form.scss +++ /dev/null @@ -1,37 +0,0 @@ -// -// Custom checkbox -// - -.custom-checkbox { - .custom-control-input ~ .custom-control-label { - cursor: pointer; - font-size: $font-size-sm; - } - - .custom-control-input { - &:checked { - ~ .custom-control-label { - &::before { - border-color: $custom-control-indicator-checked-border-color; - } - &::after { - background-image: $custom-checkbox-indicator-icon-checked; - } - } - } - - &:disabled { - ~ .custom-control-label { - &::before { - border-color: $custom-control-indicator-disabled-bg; - } - } - - &:checked { - &::before { - border-color: $custom-control-indicator-checked-disabled-bg; - } - } - } - } -} diff --git a/frontend/src/assets/scss/core/custom-forms/_custom-radio.scss b/frontend/src/assets/scss/core/custom-forms/_custom-radio.scss deleted file mode 100644 index 3ce26f81a..000000000 --- a/frontend/src/assets/scss/core/custom-forms/_custom-radio.scss +++ /dev/null @@ -1,37 +0,0 @@ -// -// Custom radio -// - -.custom-radio { - .custom-control-input ~ .custom-control-label { - cursor: pointer; - font-size: $font-size-sm; - } - - .custom-control-input { - &:checked { - ~ .custom-control-label { - &::before { - border-color: $custom-control-indicator-checked-border-color; - } - &::after { - background-image: $custom-radio-indicator-icon-checked; - } - } - } - - &:disabled { - ~ .custom-control-label { - &::before { - border-color: $custom-control-indicator-disabled-bg; - } - } - - &:checked { - &::before { - border-color: $custom-control-indicator-checked-disabled-bg; - } - } - } - } -} diff --git a/frontend/src/assets/scss/core/custom-forms/_custom-toggle.scss b/frontend/src/assets/scss/core/custom-forms/_custom-toggle.scss deleted file mode 100644 index 88da14583..000000000 --- a/frontend/src/assets/scss/core/custom-forms/_custom-toggle.scss +++ /dev/null @@ -1,66 +0,0 @@ -// -// Custom toggle -// - -.custom-toggle { - position: relative; - display: inline-block; - width: $custom-toggle-width; - height: 1.5rem; - - input { - display: none; - - &:checked { - + .custom-toggle-slider { - border: $custom-control-indicator-border-width solid $custom-control-indicator-checked-border-color; - - &:before { - background: $custom-toggle-checked-bg; - transform: translateX(1.625rem); - } - } - } - - &:disabled { - + .custom-toggle-slider { - border: $custom-control-indicator-border-width solid $custom-control-indicator-disabled-bg; - } - - &:checked { - + .custom-toggle-slider { - border: $custom-control-indicator-border-width solid $custom-control-indicator-disabled-bg; - - &:before { - background-color: lighten($custom-control-indicator-checked-bg, 10%); - } - } - } - } - } -} - -.custom-toggle-slider { - position: absolute; - cursor: pointer; - top: 0; - left: 0; - right: 0; - bottom: 0; - border: $custom-control-indicator-border-width solid $input-border-color; - border-radius: 34px !important; - background-color: transparent; - - - &:before { - position: absolute; - content: ""; - height: 18px; - width: 18px; - left: 2px; - bottom: 2px; - border-radius: 50% !important; - background-color: $custom-toggle-slider-bg; - transition: $input-transition; - } -} diff --git a/frontend/src/assets/scss/core/dropdowns/_dropdown.scss b/frontend/src/assets/scss/core/dropdowns/_dropdown.scss deleted file mode 100644 index 6d3106e9f..000000000 --- a/frontend/src/assets/scss/core/dropdowns/_dropdown.scss +++ /dev/null @@ -1,79 +0,0 @@ -// -// Dropdown -// - -// General styles - -.dropdown, -.dropup, -.dropright, -.dropleft { - display: inline-block; -} - -.dropdown-menu { - min-width: 12rem; - - .dropdown-item { - padding: .5rem 1rem; - font-size: $font-size-sm; - > i, - > svg { - margin-right: 1rem; - font-size: 1rem; - vertical-align: -17%; - } - } -} - -.dropdown-header { - padding-left: 1rem; - padding-right: 1rem; - color: $gray-100; - font-size: .625rem; - text-transform: uppercase; - font-weight: 700; -} - - -// Media components inside dropdown link - -.dropdown-menu { - a.media { - - > div { - &:first-child { - line-height: 1; - } - } - - p { - color: $gray-600; - } - - &:hover { - .heading, - p { - color: theme-color("default") !important; - } - } - } -} - - -// Size variations - -.dropdown-menu-sm { - min-width: 100px; - border: $border-radius-lg; -} - -.dropdown-menu-lg { - min-width: 260px; - border-radius: $border-radius-lg; -} - -.dropdown-menu-xl { - min-width: 450px; - border-radius: $border-radius-lg; -} diff --git a/frontend/src/assets/scss/core/footers/_footer.scss b/frontend/src/assets/scss/core/footers/_footer.scss deleted file mode 100644 index a34180e9b..000000000 --- a/frontend/src/assets/scss/core/footers/_footer.scss +++ /dev/null @@ -1,98 +0,0 @@ -// -// Footer -// - - -// General styles - -.footer { - background: $footer-bg; - padding: $footer-padding-y $footer-padding-x; - - .col-footer { - .heading { - color: $footer-heading-color; - letter-spacing: 0; - font-size: $footer-heading-font-size; - text-transform: uppercase; - font-weight: $font-weight-bold; - margin-bottom: 1rem; - } - } - - .nav .nav-item .nav-link, - .footer-link { - color: $footer-link-color !important; - - &:hover { - color: $footer-link-hover-color !important; - } - } - - .list-unstyled li a { - display: inline-block; - padding: .125rem 0; - color: $footer-link-color; - font-size: $footer-link-font-size; - - &:hover { - color: $footer-link-hover-color; - } - } - - .copyright { - font-size: $font-size-sm; - } -} - - -// Dark footer - -.footer-dark { - .col-footer .heading { - color: $white; - } -} - - -// Footer nav used for copyright and some links, but not limited to this - -.nav-footer { - .nav-link { - font-size: $font-size-sm; - } - - .nav-item:last-child { - .nav-link { - padding-right: 0; - } - } -} - - -// Footer with cards over - -.footer.has-cards { - overflow: hidden; - padding-top: 500px; - margin-top: -420px; - position: relative; - background: transparent; - pointer-events: none; - - &:before { - content: ""; - position: absolute; - left: 0; - right: 0; - top: 600px; - height: 2000px; - background: theme-color("secondary"); - transform: skew(0,-8deg); - } - - .container { - pointer-events: auto; - position: relative; - } -} diff --git a/frontend/src/assets/scss/core/forms/_form-validation.scss b/frontend/src/assets/scss/core/forms/_form-validation.scss deleted file mode 100644 index bb97e39fa..000000000 --- a/frontend/src/assets/scss/core/forms/_form-validation.scss +++ /dev/null @@ -1,71 +0,0 @@ -// -// Form validation -// - -// Validation - -.has-success, -.has-danger { - position: relative; - - &:after, { - width: 19px; - height: 19px; - line-height: 19px; - text-align: center; - font-family: 'NucleoIcons'; - display: inline-block; - position: absolute; - right: 15px; - top: 2px; - transform: translateY(50%); - border-radius: 50%; - font-size: 9px; - opacity: 1; - } -} - -.has-success { - &:after { - content: "\ea26"; - color: daken($form-feedback-valid-color, 18%); - background-color: $form-feedback-valid-bg; - } - - .form-control { - background-color: $input-focus-bg; - - &:focus { - border-color: $input-focus-border-color; - } - - - // Placeholder - - &::placeholder { - color: $form-feedback-valid-color; - } - } -} - -.has-danger { - &:after { - content: "\ea53"; - color: daken($form-feedback-invalid-color, 18%); - background-color: $form-feedback-invalid-bg; - } - - .form-control { - background-color: $input-focus-bg; - - &:focus { - border-color: $input-focus-border-color; - } - - // Placeholder - - &::placeholder { - color: $form-feedback-invalid-color; - } - } -} diff --git a/frontend/src/assets/scss/core/forms/_form.scss b/frontend/src/assets/scss/core/forms/_form.scss deleted file mode 100644 index 8afeb8787..000000000 --- a/frontend/src/assets/scss/core/forms/_form.scss +++ /dev/null @@ -1,78 +0,0 @@ -// -// Forms -// - - -// Labels - -.form-control-label { - color: $gray-700; - font-size: $font-size-sm; - font-weight: $font-weight-bold; -} - - -// Text inputs - -.form-control { - font-size: $input-btn-font-size; - - &:focus { - &::placeholder { - color: $input-focus-placeholder-color; - } - } -} - - -// Textarea - -textarea[resize="none"] { - resize: none!important; -} - -textarea[resize="both"] { - resize: both!important; -} - -textarea[resize="vertical"] { - resize: vertical!important; -} - -textarea[resize="horizontal"] { - resize: horizontal!important; -} - - -// Form input variations - -// Muted input - -.form-control-muted { - background-color: $input-muted-bg; - border-color: $input-muted-bg; - box-shadow: none; - - &:focus { - background-color: $input-focus-muted-bg; - } -} - - -// Alternative input - -.form-control-alternative { - box-shadow: $input-alternative-box-shadow; - border: 0; - transition: box-shadow .15s ease; - - &:focus { - box-shadow: $input-focus-alternative-box-shadow; - } -} - -// Size variations: Fixes to the bootstrap defaults - -.form-control-lg { - font-size: $font-size-base; -} diff --git a/frontend/src/assets/scss/core/forms/_input-group.scss b/frontend/src/assets/scss/core/forms/_input-group.scss deleted file mode 100644 index 1ab48cffe..000000000 --- a/frontend/src/assets/scss/core/forms/_input-group.scss +++ /dev/null @@ -1,70 +0,0 @@ -// -// Input group -// - -.input-group { - box-shadow: $input-box-shadow; - border-radius: $input-border-radius; - transition: $transition-base; - - .form-control { - box-shadow: none; - - &:not(:first-child) { - border-left: 0; - padding-left: 0; - } - &:not(:last-child) { - border-right: 0; - padding-right: 0; - } - &:focus { - box-shadow: none; - } - } -} - -.input-group-text { - transition: $input-transition; -} - - -// Alternative input groups related to .form-control-alternative - - -.input-group-alternative { - box-shadow: $input-alternative-box-shadow; - border: 0; - transition: box-shadow .15s ease; - - .form-control, - .input-group-text { - border: 0; - box-shadow: none; - } -} - -.focused { - .input-group-alternative { - box-shadow: $input-focus-alternative-box-shadow !important; - } -} - - -// .focus class is applied dinamycally from theme.js - -.focused { - .input-group { - box-shadow: $input-focus-box-shadow; - } - - .input-group-text { - color: $input-group-addon-focus-color; - background-color: $input-group-addon-focus-bg; - border-color: $input-group-addon-focus-border-color; - } - - .form-control { - border-color: $input-group-addon-focus-border-color; - } -} diff --git a/frontend/src/assets/scss/core/headers/_header.scss b/frontend/src/assets/scss/core/headers/_header.scss deleted file mode 100644 index 3b0e9d2f5..000000000 --- a/frontend/src/assets/scss/core/headers/_header.scss +++ /dev/null @@ -1,7 +0,0 @@ -// -// Header -// - -.header { - position: relative; -} diff --git a/frontend/src/assets/scss/core/icons/_icon-shape.scss b/frontend/src/assets/scss/core/icons/_icon-shape.scss deleted file mode 100644 index 1747871ff..000000000 --- a/frontend/src/assets/scss/core/icons/_icon-shape.scss +++ /dev/null @@ -1,42 +0,0 @@ -// -// Icon shape -// - - -.icon-shape { - padding: 12px; - text-align: center; - display: inline-flex; - align-items: center; - justify-content: center; - border-radius: 50%; - - - i, svg { - font-size: 1.25rem; - } - - &.icon-lg { - i, svg { - font-size: 1.625rem; - } - } - - &.icon-sm { - i, svg { - font-size: .875rem; - } - } - - svg { - width: 30px; - height: 30px; - } - -} - -@each $color, $value in $theme-colors { - .icon-shape-#{$color} { - @include icon-shape-variant(theme-color($color)); - } -} diff --git a/frontend/src/assets/scss/core/icons/_icon.scss b/frontend/src/assets/scss/core/icons/_icon.scss deleted file mode 100644 index f7ed0de3c..000000000 --- a/frontend/src/assets/scss/core/icons/_icon.scss +++ /dev/null @@ -1,65 +0,0 @@ -// -// Icon -// - -.icon { - width: $icon-size; - height: $icon-size; - - i, svg { - font-size: $icon-size - .75; - } - - + .icon-text { - padding-left: 1rem; - width: calc(100% - #{$icon-size} - 1); - } -} - - -// Extra large icons - -.icon-xl { - width: $icon-size-xl; - height: $icon-size-xl; - - i, svg { - font-size: $icon-size-xl - .75; - } - - + .icon-text { - width: calc(100% - #{$icon-size-xl} - 1); - } -} - - -// Large icons - -.icon-lg { - width: $icon-size-lg; - height: $icon-size-lg; - - i, svg { - font-size: $icon-size-lg - .75; - } - - + .icon-text { - width: calc(100% - #{$icon-size-lg} - 1); - } -} - - -// Small icon - -.icon-sm { - width: $icon-size-sm; - height: $icon-size-sm; - - i, svg { - font-size: $icon-size-sm - .75; - } - - + .icon-text { - width: calc(100% - #{$icon-size-sm} - 1); - } -} diff --git a/frontend/src/assets/scss/core/list-groups/_list-group.scss b/frontend/src/assets/scss/core/list-groups/_list-group.scss deleted file mode 100644 index 0aa5cde63..000000000 --- a/frontend/src/assets/scss/core/list-groups/_list-group.scss +++ /dev/null @@ -1,46 +0,0 @@ -// -// List group -// - - -// Space list items - -.list-group-space { - .list-group-item { - margin-bottom: 1.5rem; - @include border-radius($list-group-border-radius); - } -} - - -// Extended list group components - -.list-group-img { - width: 3rem; - height: 3rem; - border-radius: 50%; - vertical-align: top; - margin: -.1rem 1.2rem 0 -.2rem; -} - -.list-group-content { - flex: 1; - min-width: 0; - - > p { - color: $gray-500; - line-height: 1.5; - margin: .2rem 0 0; - } -} - -.list-group-heading { - font-size: $font-size-base; - color: $gray-800; - - > small { - float: right; - color: $gray-500; - font-weight: 500; - } -} diff --git a/frontend/src/assets/scss/core/maps/_map.scss b/frontend/src/assets/scss/core/maps/_map.scss deleted file mode 100644 index 6c9cda7af..000000000 --- a/frontend/src/assets/scss/core/maps/_map.scss +++ /dev/null @@ -1,10 +0,0 @@ -// -// Map -// - -.map-canvas { - position: relative; - width: 100%; - height: $map-height; - border-radius: $border-radius; -} diff --git a/frontend/src/assets/scss/core/masks/_mask.scss b/frontend/src/assets/scss/core/masks/_mask.scss deleted file mode 100644 index 9df8ba0a4..000000000 --- a/frontend/src/assets/scss/core/masks/_mask.scss +++ /dev/null @@ -1,12 +0,0 @@ -// -// Mask -// - -.mask { - position: absolute; - top: 0; - left: 0; - width: 100%; - height: 100%; - @include transition($transition-base); -} diff --git a/frontend/src/assets/scss/core/mixins/_alert.scss b/frontend/src/assets/scss/core/mixins/_alert.scss deleted file mode 100644 index 1dbe85b61..000000000 --- a/frontend/src/assets/scss/core/mixins/_alert.scss +++ /dev/null @@ -1,13 +0,0 @@ -@mixin alert-variant($background, $border, $color) { - color: color-yiq($background); - @include gradient-bg($background); - border-color: $border; - - hr { - border-top-color: darken($border, 5%); - } - - .alert-link { - color: darken($color, 10%); - } -} \ No newline at end of file diff --git a/frontend/src/assets/scss/core/mixins/_background-variant.scss b/frontend/src/assets/scss/core/mixins/_background-variant.scss deleted file mode 100644 index 1b87864f1..000000000 --- a/frontend/src/assets/scss/core/mixins/_background-variant.scss +++ /dev/null @@ -1,30 +0,0 @@ -// Contextual backgrounds -@mixin bg-variant($parent, $color, $ignore-warning: true) { - #{$parent} { - background-color: $color !important; - } - a#{$parent}, - button#{$parent} { - @include hover-focus { - background-color: darken($color, 10%) !important; - } - } -} - -@mixin bg-gradient-variant($parent, $color, $ignore-warning: true) { - #{$parent} { - background: linear-gradient(87deg, $color 0, adjust-hue($color, 25%) 100%) !important; - } -} - -@mixin bg-translucent-variant($parent, $color, $ignore-warning: true) { - #{$parent} { - background-color: darken(rgba($color, $translucent-color-opacity), 7%) !important; - } - a#{$parent}, - button#{$parent} { - @include hover-focus { - background-color: darken(rgba($color, $translucent-color-opacity), 12%) !important; - } - } -} diff --git a/frontend/src/assets/scss/core/mixins/_badge.scss b/frontend/src/assets/scss/core/mixins/_badge.scss deleted file mode 100644 index f19044f91..000000000 --- a/frontend/src/assets/scss/core/mixins/_badge.scss +++ /dev/null @@ -1,12 +0,0 @@ -@mixin badge-variant($bg) { - color: saturate(darken($bg, 10%), 10); - background-color: transparentize(lighten($bg, 25%), .5); - - &[href] { - @include hover-focus { - color: color-yiq($bg); - text-decoration: none; - background-color: darken($bg, 10%); - } - } -} diff --git a/frontend/src/assets/scss/core/mixins/_buttons.scss b/frontend/src/assets/scss/core/mixins/_buttons.scss deleted file mode 100644 index 5cedd20ef..000000000 --- a/frontend/src/assets/scss/core/mixins/_buttons.scss +++ /dev/null @@ -1,105 +0,0 @@ -@mixin button-variant($background, $border, $hover-background: darken($background, 0%), $hover-border: darken($border, 0%), $active-background: darken($background, 10%), $active-border: darken($border, 0%)) { - color: color-yiq($background); - @include gradient-bg($background); - border-color: $border; - @include box-shadow($btn-box-shadow); - - @include hover { - color: color-yiq($hover-background); - @include gradient-bg($hover-background); - border-color: $hover-border; - } - - &:focus, - &.focus { - // Avoid using mixin so we can pass custom focus shadow properly - @if $enable-shadows { - box-shadow: $btn-box-shadow, 0 0 0 $btn-focus-width rgba($border, .5); - } - @else { - box-shadow: 0 0 0 $btn-focus-width rgba($border, .5); - } - } // Disabled comes first so active can properly restyle - &.disabled, - &:disabled { - color: color-yiq($background); - background-color: $background; - border-color: $border; - } - - &:not(:disabled):not(.disabled):active, - &:not(:disabled):not(.disabled).active, - .show>&.dropdown-toggle { - color: color-yiq($active-background); - background-color: $active-background; - @if $enable-gradients { - background-image: none; // Remove the gradient for the pressed/active state - } - border-color: $active-border; - - &:focus { - // Avoid using mixin so we can pass custom focus shadow properly - @if $enable-shadows { - box-shadow: $btn-active-box-shadow, 0 0 0 $btn-focus-width rgba($border, .5); - } - @else { - box-shadow: 0 0 0 $btn-focus-width rgba($border, .5); - } - } - } -} - -@mixin button-outline-variant($color, $color-hover: color-yiq($color), $active-background: $color, $active-border: $color) { - color: $color; - background-color: transparent; - background-image: none; - border-color: $color; - - &:hover { - color: $color-hover; - background-color: $active-background; - border-color: $active-border; - } - - &:focus, - &.focus { - box-shadow: 0 0 0 $btn-focus-width rgba($color, .5); - } - - &.disabled, - &:disabled { - color: $color; - background-color: transparent; - } - - &:not(:disabled):not(.disabled):active, - &:not(:disabled):not(.disabled).active, - .show>&.dropdown-toggle { - color: color-yiq($active-background); - background-color: $active-background; - border-color: $active-border; - - &:focus { - // Avoid using mixin so we can pass custom focus shadow properly - @if $enable-shadows and $btn-active-box-shadow !=none { - box-shadow: $btn-active-box-shadow, 0 0 0 $btn-focus-width rgba($color, .5); - } - @else { - box-shadow: 0 0 0 $btn-focus-width rgba($color, .5); - } - } - } -} - -// Button sizes -@mixin button-size($padding-y, $padding-x, $font-size, $line-height, $border-radius) { - padding: $padding-y $padding-x; - font-size: $font-size; - line-height: $line-height; // Manually declare to provide an override to the browser default - @if $enable-rounded { - border-radius: $border-radius; - } - @else { - border-radius: 0; - } -} \ No newline at end of file diff --git a/frontend/src/assets/scss/core/mixins/_forms.scss b/frontend/src/assets/scss/core/mixins/_forms.scss deleted file mode 100644 index 0c51a3be6..000000000 --- a/frontend/src/assets/scss/core/mixins/_forms.scss +++ /dev/null @@ -1,127 +0,0 @@ -@mixin form-control-focus($ignore-warning: true) { - &:focus { - color: $input-focus-color; - background-color: $input-focus-bg; - border-color: $input-focus-border-color; - outline: 0; - // Avoid using mixin so we can pass custom focus shadow properly - @if $enable-shadows { - box-shadow: $input-box-shadow, $input-focus-box-shadow; - } @else { - box-shadow: $input-focus-box-shadow; - } - } -} - - -@mixin form-validation-state($state, $color, $icon) { - .#{$state}-feedback { - display: none; - width: 100%; - margin-top: $form-feedback-margin-top; - font-size: $form-feedback-font-size; - color: $color; - } - - .#{$state}-tooltip { - position: absolute; - top: 100%; - z-index: 5; - display: none; - max-width: 100%; // Contain to parent when possible - padding: .5rem; - margin-top: .1rem; - font-size: .875rem; - line-height: 1; - color: #fff; - background-color: rgba($color, .8); - border-radius: .2rem; - } - - .form-control, - .custom-select { - .was-validated &:#{$state}, - &.is-#{$state} { - border-color: $color; - - &:focus { - border-color: $color; - //box-shadow: 0 1px $input-focus-width 0 rgba($color, .75); - } - - ~ .#{$state}-feedback, - ~ .#{$state}-tooltip { - display: block; - } - } - } - - .form-check-input { - .was-validated &:#{$state}, - &.is-#{$state} { - ~ .form-check-label { - color: $color; - } - - ~ .#{$state}-feedback, - ~ .#{$state}-tooltip { - display: block; - } - } - } - - .custom-control-input { - .was-validated &:#{$state}, - &.is-#{$state} { - ~ .custom-control-label { - color: $color; - - &::before { - background-color: lighten($color, 25%); - border-color: lighten($color, 25%); - } - } - - ~ .#{$state}-feedback, - ~ .#{$state}-tooltip { - display: block; - } - - &:checked { - ~ .custom-control-label::before { - @include gradient-bg(lighten($color, 10%)); - border-color: lighten($color, 25%); - } - } - - &:focus { - ~ .custom-control-label::before { - box-shadow: 0 0 0 1px $body-bg, 0 0 0 $input-focus-width rgba($color, .25); - } - } - } - } - - // custom file - .custom-file-input { - .was-validated &:#{$state}, - &.is-#{$state} { - ~ .custom-file-label { - border-color: $color; - - &::before { border-color: inherit; } - } - - ~ .#{$state}-feedback, - ~ .#{$state}-tooltip { - display: block; - } - - &:focus { - ~ .custom-file-label { - box-shadow: 0 0 0 $input-focus-width rgba($color, .25); - } - } - } - } -} diff --git a/frontend/src/assets/scss/core/mixins/_icon.scss b/frontend/src/assets/scss/core/mixins/_icon.scss deleted file mode 100644 index 88199859f..000000000 --- a/frontend/src/assets/scss/core/mixins/_icon.scss +++ /dev/null @@ -1,4 +0,0 @@ -@mixin icon-shape-variant($color) { - color: saturate(darken($color, 10%), 10); - background-color: transparentize(lighten($color, 10%), .5); -} \ No newline at end of file diff --git a/frontend/src/assets/scss/core/mixins/_modals.scss b/frontend/src/assets/scss/core/mixins/_modals.scss deleted file mode 100644 index f91249028..000000000 --- a/frontend/src/assets/scss/core/mixins/_modals.scss +++ /dev/null @@ -1,23 +0,0 @@ -@mixin modal-variant($background) { - .modal-title { - color: color-yiq($background); - } - .modal-header, - .modal-footer { - border-color: rgba(color-yiq($background), .075); - } - .modal-content { - background-color: $background; - color: color-yiq($background); - - .heading { - color: color-yiq($background); - } - } - - .close { - &>span:not(.sr-only) { - color: $white; - } - } -} \ No newline at end of file diff --git a/frontend/src/assets/scss/core/mixins/_popover.scss b/frontend/src/assets/scss/core/mixins/_popover.scss deleted file mode 100644 index e535b5379..000000000 --- a/frontend/src/assets/scss/core/mixins/_popover.scss +++ /dev/null @@ -1,36 +0,0 @@ -@mixin popover-variant($background) { - - background-color: $background; - - .popover-header { - background-color: $background; - color: color-yiq($background); - } - - .popover-body { - color: color-yiq($background); - } - .popover-header{ - border-color: rgba(color-yiq($background), .2); - } - &.bs-popover-top { - .arrow::after { - border-top-color: $background; - } - } - &.bs-popover-right { - .arrow::after { - border-right-color: $background; - } - } - &.bs-popover-bottom { - .arrow::after { - border-bottom-color: $background; - } - } - &.bs-popover-left { - .arrow::after { - border-left-color: $background; - } - } -} \ No newline at end of file diff --git a/frontend/src/assets/scss/core/modals/_modal.scss b/frontend/src/assets/scss/core/modals/_modal.scss deleted file mode 100644 index ed31d511e..000000000 --- a/frontend/src/assets/scss/core/modals/_modal.scss +++ /dev/null @@ -1,25 +0,0 @@ -// -// Modal -// - - -// Fluid modal - -.modal-fluid { - .modal-dialog { - margin-top: 0; - margin-bottom: 0; - } - .modal-content { - border-radius: 0; - } -} - - -// Background color variations - -@each $color, $value in $theme-colors { - .modal-#{$color} { - @include modal-variant($value); - } -} diff --git a/frontend/src/assets/scss/core/navbars/_navbar-collapse.scss b/frontend/src/assets/scss/core/navbars/_navbar-collapse.scss deleted file mode 100644 index ffd998af3..000000000 --- a/frontend/src/assets/scss/core/navbars/_navbar-collapse.scss +++ /dev/null @@ -1,125 +0,0 @@ -// -// Navabar collapse -// - -// Collapse - -.navbar-collapse-header { - display: none; -} - -@include media-breakpoint-down(sm) { - .navbar-nav { - .nav-link { - padding: .625rem 0; - color: theme-color("default") !important; - } - - .dropdown-menu { - box-shadow: none; - min-width: auto; - - .media { - svg { - width: 30px; - } - } - } - } - - .navbar-collapse { - width: calc(100% - 1.4rem); - position: absolute; - top: 0; - left: 0; - right: 0; - z-index: 1050; - margin: .7rem; - overflow-y: auto; - height: auto !important; - opacity: 0; - - .navbar-toggler { - width: 20px; - height: 20px; - position: relative; - cursor: pointer; - display: inline-block; - padding: 0; - - span { - display: block; - position: absolute; - width: 100%; - height: 2px; - border-radius: 2px; - opacity: 1; - background: #283448; - } - - :nth-child(1) { - transform: rotate(135deg); - } - - :nth-child(2) { - transform: rotate(-135deg); - } - } - - .navbar-collapse-header { - display: block; - padding-bottom: 1rem; - margin-bottom: 1rem; - border-bottom: 1px solid rgba(0, 0, 0, .1); - } - - .collapse-brand { - img { - height: 36px; - } - } - - .collapse-close { - text-align: right; - } - } - - .navbar-collapse.collapsing, - .navbar-collapse.show { - padding: 1.5rem; - border-radius: $border-radius; - background: #FFF; - box-shadow: 0 50px 100px rgba(50,50,93,.1),0 15px 35px rgba(50,50,93,.15),0 5px 15px rgba(0,0,0,.1); - animation: show-navbar-collapse .2s ease forwards; - } - - .navbar-collapse.collapsing-out { - animation: hide-navbar-collapse .2s ease forwards; - } -} - -@keyframes show-navbar-collapse { - 0% { - opacity: 0; - transform: scale(.95); - transform-origin: 100% 0; - } - - 100% { - opacity: 1; - transform: scale(1); - } -} - -@keyframes hide-navbar-collapse { - from { - opacity: 1; - transform: scale(1); - transform-origin: 100% 0; - } - - to { - opacity: 0; - transform: scale(.95); - } -} diff --git a/frontend/src/assets/scss/core/navbars/_navbar-dropdown.scss b/frontend/src/assets/scss/core/navbars/_navbar-dropdown.scss deleted file mode 100644 index 3db781c86..000000000 --- a/frontend/src/assets/scss/core/navbars/_navbar-dropdown.scss +++ /dev/null @@ -1,101 +0,0 @@ -// Dropdown menu - -@include media-breakpoint-up(md) { - .navbar { - .dropdown-menu { - opacity: 0; - pointer-events: none; - margin: 0; - } - - .dropdown-menu-arrow { - &:before { - background: $dropdown-bg; - box-shadow: none; - content: ''; - display: block; - height: 12px; - width: 12px; - left: 20px; - position: absolute; - bottom: 100%; - transform: rotate(-45deg) translateY(12px); - z-index: -5; - border-radius: 2px; - } - } - - .dropdown-menu-right { - &:before { - right: 20px; - left: auto; - } - } - - &:not(.navbar-nav-hover) { - .dropdown-menu { - &.show { - opacity: 1; - pointer-events: auto; - animation: show-navbar-dropdown .25s ease forwards; - } - - &.close { - display: block; - animation: hide-navbar-dropdown .15s ease backwards; - } - } - } - - &.navbar-nav-hover { - .dropdown-menu { - opacity: 0; - display: block; - pointer-events: none; - transform: translate(0, 10px) perspective(200px) rotateX(-2deg); - transition: visibility 0.25s, opacity 0.25s, transform 0.25s; - } - - .nav-item.dropdown:hover > .dropdown-menu { - display: block; - opacity: 1; - pointer-events: auto; - visibility: visible; - transform: translate(0, 0); - animation: none; - } - } - - .dropdown-menu-inner { - position: relative; - padding: 1rem; - } - - - // Keyframes - - @keyframes show-navbar-dropdown { - 0% { - opacity: 0; - transform: translate(0, 10px) perspective(200px) rotateX(-2deg); - transition: visibility 0.25s, opacity 0.25s, transform 0.25s; - } - - 100% { - transform: translate(0, 0); - opacity: 1; - } - } - - @keyframes hide-navbar-dropdown { - from { - opacity: 1; - } - - to { - opacity: 0; - transform: translate(0, 10px); - } - } - } -} diff --git a/frontend/src/assets/scss/core/navbars/_navbar-search.scss b/frontend/src/assets/scss/core/navbars/_navbar-search.scss deleted file mode 100644 index d95a1410a..000000000 --- a/frontend/src/assets/scss/core/navbars/_navbar-search.scss +++ /dev/null @@ -1,69 +0,0 @@ -// -// Navbar search -// - -.navbar-search { - .input-group { - border-radius: $navbar-search-border-radius; - border: $navbar-search-border-width solid; - background-color: transparent; - - .input-group-text { - background-color: transparent; - padding-left: 1rem; - } - } - - .form-control { - width: $navbar-search-width; - background-color: transparent; - } -} - -.navbar-search-dark { - .input-group { - border-color: $navbar-search-dark-border-color; - } - - .input-group-text { - color: $navbar-search-dark-color; - } - - .form-control { - color: $navbar-search-dark-focus-color; - - &::placeholder { - color: $navbar-search-dark-color; - } - } - - .focused { - .input-group { - border-color: $navbar-search-dark-focus-border-color; - } - } -} - -.navbar-search-light { - .input-group { - border-color: $navbar-search-light-border-color; - } - - .input-group-text { - color: $navbar-search-light-color; - } - - .form-control { - color: $navbar-search-light-focus-color; - - &::placeholder { - color: $navbar-search-light-color; - } - } - - .focused { - .input-group { - border-color: $navbar-search-light-focus-border-color; - } - } -} diff --git a/frontend/src/assets/scss/core/navbars/_navbar-vertical.scss b/frontend/src/assets/scss/core/navbars/_navbar-vertical.scss deleted file mode 100644 index 48e1fd7be..000000000 --- a/frontend/src/assets/scss/core/navbars/_navbar-vertical.scss +++ /dev/null @@ -1,286 +0,0 @@ -// -// Vertical navbar -// - - -// Vertical -// -// Creates a vertically aligned version of the navbar -.navbar-vertical { - box-shadow: $navbar-vertical-box-shadow; - - .navbar { - border-width: 0 0 1px 0; - border-style: solid; - } - - - // Navbar light - - .navbar-light { - background-color: $navbar-light-bg; - border-color: $navbar-light-border-color; - } - - - // Navbar brand - - .navbar-brand { - margin-right: 0; - } - - .navbar-brand-img, - .navbar-brand > img { - max-width: 100%; - max-height: 2rem; - } - - - // Navbar collapse - - @include media-breakpoint-up(md) { - .navbar-collapse { - margin-left: -$navbar-padding-x; - margin-right: -$navbar-padding-x; - padding-left: $navbar-padding-x; - padding-right: $navbar-padding-x; - - &:before { - content: ''; - display: block; - margin: $navbar-padding-y (-$navbar-padding-x); - } - } - } - - - - // Navbar navigaton - - .navbar-nav { - margin-left: -$navbar-padding-x; - margin-right: -$navbar-padding-x; - - - // Navbar link - - .nav-link { - padding-left: $navbar-padding-x; - padding-right: $navbar-padding-x; - font-size: $navbar-nav-link-font-size; - - &.active { - position: relative; - - &:before { - content: ''; - position: absolute; - left: 0; - top: $nav-link-padding-y; - bottom: $nav-link-padding-y; - border-left: 2px solid $primary; - } - } - - - // Icon - - > i { - min-width: $navbar-icon-min-width; - font-size: .9375rem; - line-height: ($font-size-base * $line-height-base); - } - - - // Dropdown - - .dropdown-menu { - border: none; - - .dropdown-menu { - margin-left: $dropdown-item-padding-x / 2; - } - } - } - } - - - // Navbar navigation - .navbar-nav .nav-link { - display: flex; - align-items: center; - } - - .navbar-nav .nav-link[data-toggle="collapse"] { - &:after { - display: inline-block; - font-style: normal; - font-variant: normal; - text-rendering: auto; - -webkit-font-smoothing: antialiased; - font-family: 'Font Awesome 5 Free'; - font-weight: 700; - content: "\f105"; - margin-left: auto; - color: $text-muted; - transition: $transition-base; - } // Expanded - &[aria-expanded="true"] { - - &:after { - transform: rotate(90deg); - } - } - } - - // Second level - .navbar-nav .nav .nav-link { - padding-left: $navbar-padding-x + $navbar-icon-min-width; - } - - // Third level - .navbar-nav .nav .nav .nav-link { - padding-left: $navbar-padding-x * 1.5 + $navbar-icon-min-width; - } - - - // Navbar heading - .navbar-heading { - padding-top: $nav-link-padding-y; - padding-bottom: $nav-link-padding-y; - font-size: $font-size-xs; - text-transform: uppercase; - letter-spacing: .04em; - } - - - // Expanded navbar specific styles - &.navbar-expand { - @each $breakpoint, - $dimension in $grid-breakpoints { - - &-#{$breakpoint} { - @include media-breakpoint-up(#{$breakpoint}) { - display: block; - position: fixed; - top: 0; - bottom: 0; - width: 100%; - max-width: $navbar-vertical-width; - padding-left: $navbar-vertical-padding-x; - padding-right: $navbar-vertical-padding-x; - - overflow-y: auto; - - // Container - >[class*="container"] { - flex-direction: column; - align-items: stretch; - min-height: 100%; - padding-left: 0; - padding-right: 0; // Target IE 10 & 11 - @media all and (-ms-high-contrast: none), (-ms-high-contrast: active) { - min-height: none; - height: 100%; - } - } - - - // Fixes the vertical navbar to the left - &.fixed-left { - left: 0; - border-width: 0 1px 0 0; - } - - - // Fixed the vertical navbar to the right - &.fixed-right { - right: 0; - border-width: 0 0 0 1px; - } - - - // Navbar collapse - .navbar-collapse { - flex: 1; - display: flex; - flex-direction: column; - align-items: stretch; - margin-left: -$navbar-vertical-padding-x; - margin-right: -$navbar-vertical-padding-x; - padding-left: $navbar-vertical-padding-x; - padding-right: $navbar-vertical-padding-x; - - > * { - min-width: 100%; - } - } - - - // Navbar navigation - .navbar-nav { - flex-direction: column; - margin-left: -$navbar-vertical-padding-x; - margin-right: -$navbar-vertical-padding-x; - } - - .navbar-nav .nav-link { - padding: $navbar-vertical-nav-link-padding-y $navbar-vertical-nav-link-padding-x; - - &.active { - &:before { - top: $nav-link-padding-y; - bottom: $nav-link-padding-y; - left: 0; - right: auto; - border-left: 2px solid $primary; - border-bottom: 0; - } - } - } - - - // Second level - .navbar-nav .nav .nav-link { - padding-left: $navbar-vertical-padding-x + $navbar-icon-min-width; - } - - - // Third level - .navbar-nav .nav .nav .nav-link { - padding-left: $navbar-vertical-padding-x * 1.5 + $navbar-icon-min-width; - } - - // Navbar brand - .navbar-brand { - display: block; - text-align: center; - padding-top: (2rem - $navbar-padding-y); - padding-bottom: (2rem - $navbar-padding-y); - } - - .navbar-brand-img { - max-height: 2.5rem; - } - - // Navbar user - .navbar-user { - margin-left: -$navbar-vertical-padding-x; - margin-right: -$navbar-vertical-padding-x; - padding-top: $spacer; - padding-bottom: $spacer - $navbar-padding-y; - padding-left: $navbar-vertical-padding-x; - padding-right: $navbar-vertical-padding-x; - border-top: 1px solid $border-color; - - // Dropup menu - .dropup .dropdown-menu { - left: 50%; - transform: translateX(-50%); - } - } - } - } - } - } -} diff --git a/frontend/src/assets/scss/core/navbars/_navbar.scss b/frontend/src/assets/scss/core/navbars/_navbar.scss deleted file mode 100644 index a2390b326..000000000 --- a/frontend/src/assets/scss/core/navbars/_navbar.scss +++ /dev/null @@ -1,153 +0,0 @@ -// -// Navbar -// - - -// Navbar links - -.navbar-horizontal { - .navbar-nav { - .nav-link { - font-size: $navbar-nav-link-font-size; - font-weight: $navbar-nav-link-font-weight; - text-transform: $navbar-nav-link-text-transform; - letter-spacing: $navbar-nav-link-letter-spacing; - @include transition($navbar-transition); - - .nav-link-inner--text { - margin-left: .25rem; - } - } - } - - - // Navbar brand (logo) - - .navbar-brand { - font-size: $font-size-sm; - font-weight: 600; - text-transform: uppercase; - font-size: .875rem; - letter-spacing: .05px; - - img { - height: 30px; - } - } - - .navbar-dark { - .navbar-brand { - color: $white; - } - } - - .navbar-light { - .navbar-brand { - color: $gray-800; - } - } - - .navbar-nav { - .nav-item { - .media:not(:last-child){ - margin-bottom: 1.5rem; - } - } - } - - @include media-breakpoint-up(lg) { - .navbar-nav { - .nav-item { - margin-right: .5rem; - - [data-toggle="dropdown"]::after { - transition: $transition-base; - } - - &.show { - [data-toggle="dropdown"]::after { - transform: rotate(180deg); - } - } - } - .nav-link { - padding-top: $navbar-nav-link-padding-y; - padding-bottom: $navbar-nav-link-padding-y; - border-radius: $navbar-nav-link-border-radius; - - i { - margin-right: .625rem; - } - } - - .nav-link-icon { - padding-left: .5rem !important; - padding-right: .5rem !important; - font-size: 1rem; - border-radius: $navbar-nav-link-border-radius; - - i { - margin-right: 0; - } - } - } - } - - - // Transparent navbar - - .navbar-transparent { - position: absolute; - top: 0; - width: 100%; - z-index: 100; - background-color: transparent; - border: 0; - box-shadow: none; - - .navbar-brand { - color: rgba(255, 255, 255, 1); - } - - .navbar-toggler { - color: rgba(255, 255, 255, 1); - } - - .navbar-toggler-icon { - background-image: $navbar-dark-toggler-icon-bg; - } - } - - @include media-breakpoint-up(md) { - .navbar-transparent { - .navbar-nav { - .nav-link { - color: $navbar-dark-color; - - @include hover-focus { - color: $navbar-dark-hover-color; - } - - &.disabled { - color: $navbar-dark-disabled-color; - } - } - - .show > .nav-link, - .active > .nav-link, - .nav-link.show, - .nav-link.active { - color: $navbar-dark-active-color; - } - } - - .navbar-brand { - color: $navbar-dark-color; - - @include hover-focus { - color: $navbar-dark-color; - } - } - } - } -} diff --git a/frontend/src/assets/scss/core/navs/_nav-pills.scss b/frontend/src/assets/scss/core/navs/_nav-pills.scss deleted file mode 100644 index 9fe2a3743..000000000 --- a/frontend/src/assets/scss/core/navs/_nav-pills.scss +++ /dev/null @@ -1,66 +0,0 @@ -// -// Nav pills -// - - -// General styles - -.nav-pills { - .nav-item:not(:last-child) { - padding-right: $nav-pills-space-x; - } - - .nav-link { - padding: $nav-pills-padding-y $nav-pills-padding-x; - color: $nav-pills-link-color; - font-weight: 500; - font-size: $font-size-sm; - box-shadow: $nav-pills-box-shadow; - background-color: $nav-pills-bg; - transition: $transition-base; - - &:hover { - color: $nav-pills-link-hover-color; - } - } - - .nav-link.active, - .show > .nav-link { - color: $nav-pills-link-active-color; - background-color: $nav-pills-link-active-bg; - } - - @include media-breakpoint-down(xs) { - .nav-item { - margin-bottom: $spacer; - } - } -} - -@include media-breakpoint-down(sm) { - .nav-pills:not(.nav-pills-circle) { - .nav-item { - padding-right: 0; - } - } -} - - -// Rounded circle nav pills - -.nav-pills-circle { - .nav-link { - text-align: center; - height: 60px; - width: 60px; - padding: 0; - line-height: 60px; - border-radius: 50%; - } - - .nav-link-icon { - i, svg { - font-size: 1rem; - } - } -} diff --git a/frontend/src/assets/scss/core/navs/_nav.scss b/frontend/src/assets/scss/core/navs/_nav.scss deleted file mode 100644 index ed1a9f3c9..000000000 --- a/frontend/src/assets/scss/core/navs/_nav.scss +++ /dev/null @@ -1,33 +0,0 @@ -// -// Nav -// - - -// Nav wrapper (container) - -// Nav wrapper -.nav-wrapper { - padding: 1rem 0; - @include border-top-radius($card-border-radius); - - + .card { - @include border-top-radius(0); - @include border-bottom-radius($card-border-radius); - } -} - - -// Nav links - -.nav-link { - color: $nav-link-color; - - &:hover { - color: $nav-link-hover-color; - } - - i.ni { - position: relative; - top: 2px; - } -} diff --git a/frontend/src/assets/scss/core/paginations/_pagination.scss b/frontend/src/assets/scss/core/paginations/_pagination.scss deleted file mode 100644 index 02f76275c..000000000 --- a/frontend/src/assets/scss/core/paginations/_pagination.scss +++ /dev/null @@ -1,48 +0,0 @@ -// -// Pagination -// - - -.page-item { - &.active .page-link { - box-shadow: $pagination-active-box-shadow; - } - - .page-link, - span { - display: flex; - align-items: center; - justify-content: center; - padding: 0; - margin: 0 3px; - border-radius: 50% !important; - width: 36px; - height: 36px; - font-size: $font-size-sm; - } -} - - -// Size variations - -.pagination-lg { - .page-item { - .page-link, - span { - width: 46px; - height: 46px; - line-height: 46px; - } - } -} - -.pagination-sm { - .page-item { - .page-link, - span { - width: 30px; - height: 30px; - line-height: 30px; - } - } -} diff --git a/frontend/src/assets/scss/core/popovers/_popover.scss b/frontend/src/assets/scss/core/popovers/_popover.scss deleted file mode 100644 index 52cedec0f..000000000 --- a/frontend/src/assets/scss/core/popovers/_popover.scss +++ /dev/null @@ -1,21 +0,0 @@ -// -// Popover -// - - -.popover { - border: 0; -} - -.popover-header { - font-weight: $font-weight-bold; -} - - -// Alternative colors - -@each $color, $value in $theme-colors { - .popover-#{$color} { - @include popover-variant($value); - } -} diff --git a/frontend/src/assets/scss/core/progresses/_progress.scss b/frontend/src/assets/scss/core/progresses/_progress.scss deleted file mode 100644 index 70a50432b..000000000 --- a/frontend/src/assets/scss/core/progresses/_progress.scss +++ /dev/null @@ -1,79 +0,0 @@ -// -// Progress -// - - -// Progress container - -.progress-wrapper { - position: relative; - padding-top: 1.5rem; -} - - -// General styles - -.progress { - height: 8px; - margin-bottom: $spacer; - overflow: hidden; - border-radius: $border-radius-sm; - background-color: $progress-bg; - box-shadow: inset 0 1px 2px rgba(0, 0, 0, 0.1); - - .sr-only { - width: auto; - height: 20px; - margin: 0 0 0 30px; - left: 0; - clip: auto; - line-height: 20px; - font-size: 13px; - } -} - - -// Progress inner elements - -.progress-heading { - font-size: 14px; - font-weight: 500; - margin: 0 0 2px; - padding: 0; -} - -.progress-bar { - box-shadow: none; - border-radius: 0; - height: auto; -} - -.progress-info{ - margin-bottom: .5rem; - display: flex; - align-items: center; - justify-content: space-between; -} - -.progress-label { - span { - display: inline-block; - color: $primary; - font-size: .625rem; - font-weight: 600; - text-transform: uppercase; - background: rgba($primary, .1); - padding: .25rem 1rem; - border-radius: 30px; - } -} - -.progress-percentage { - text-align: right; - span { - display: inline-block; - color: $gray-600; - font-size: .875rem; - font-weight: 600; - } -} diff --git a/frontend/src/assets/scss/core/separators/_separator.scss b/frontend/src/assets/scss/core/separators/_separator.scss deleted file mode 100644 index 4808dfb6c..000000000 --- a/frontend/src/assets/scss/core/separators/_separator.scss +++ /dev/null @@ -1,54 +0,0 @@ -// -// Separator -// add svg on top or bottom of a section for a more stylish visual -// - - -.separator { - position: absolute; - top: auto; - left: 0; - right: 0; - width: 100%; - height: 150px; - transform: translateZ(0); - overflow: hidden; - pointer-events: none; - - svg { - position: absolute; - pointer-events: none; - } -} - -.separator-top { - top: 0; - bottom: auto; - - svg { - top: 0; - } -} - -.separator-bottom { - top: auto; - bottom: 0; - - svg { - bottom: 0; - } -} - -.separator-inverse { - transform: rotate(180deg); -} - -// Styles - -.separator-skew { - height: 60px; - - @include media-breakpoint-up(xl) { - height: 70px; - } -} diff --git a/frontend/src/assets/scss/core/tables/_table.scss b/frontend/src/assets/scss/core/tables/_table.scss deleted file mode 100644 index 18475b5a5..000000000 --- a/frontend/src/assets/scss/core/tables/_table.scss +++ /dev/null @@ -1,118 +0,0 @@ -// -// Table -// - - -// General styles - -.table { - thead th { - padding-top: $table-head-spacer-y; - padding-bottom: $table-head-spacer-y; - font-size: $table-head-font-size; - text-transform: $table-head-text-transform; - letter-spacing: $table-head-letter-spacing; - border-bottom: $table-border-width solid $table-border-color; - } - - th { - font-weight: $table-head-font-weight; - } - - td { - .progress { - height: 3px; - width: 120px; - margin: 0; - } - } - - td, - th { - font-size: $table-body-font-size; - white-space: nowrap; - } - - - // Vetical align table content - - &.align-items-center { - td, - th { - vertical-align: middle; - } - } - - - // Styles for dark table - - .thead-dark { - th { - background-color: $table-dark-head-bg; - color: $table-dark-head-color; - } - } - - - // Styles for light table - - .thead-light { - th { - background-color: $table-head-bg; - color: $table-head-color; - } - } -} - - -// Add transition for hover state - -.table-hover { - tr { - @include transition($transition-base); - } -} - - -// Flush tables - -.table-flush { - td, - th { - border-left: 0; - border-right: 0; - } - - tbody { - tr { - &:first-child { - td, - th { - border-top: 0; - } - } - - &:last-child { - td, - th { - border-bottom: 0; - } - } - } - } -} - - -// Tables inside cards - -.card { - .table { - margin-bottom: 0; - - td, - th { - padding-left: $card-spacer-x; - padding-right: $card-spacer-x; - } - } -} diff --git a/frontend/src/assets/scss/core/type/_article.scss b/frontend/src/assets/scss/core/type/_article.scss deleted file mode 100644 index 47ac1c754..000000000 --- a/frontend/src/assets/scss/core/type/_article.scss +++ /dev/null @@ -1,22 +0,0 @@ -// -// Article -// - -article { - h4:not(:first-child), - h5:not(:first-child) { - margin-top: 3rem; - } - - h4, h5 { - margin-bottom: 1.5rem; - } - - figure { - margin: 3rem 0; - } - - h5 + figure { - margin-top: 0; - } -} diff --git a/frontend/src/assets/scss/core/type/_display.scss b/frontend/src/assets/scss/core/type/_display.scss deleted file mode 100644 index c0b1ec548..000000000 --- a/frontend/src/assets/scss/core/type/_display.scss +++ /dev/null @@ -1,14 +0,0 @@ -// -// Display -// - - -.display-1, -.display-2, -.display-3, -.display-4 { - span { - display: block; - font-weight: $font-weight-light; - } -} diff --git a/frontend/src/assets/scss/core/type/_heading.scss b/frontend/src/assets/scss/core/type/_heading.scss deleted file mode 100644 index eb028b7a6..000000000 --- a/frontend/src/assets/scss/core/type/_heading.scss +++ /dev/null @@ -1,52 +0,0 @@ -// -// Heading -// - - -// General styles - -.heading { - letter-spacing: $heading-letter-spacing; - font-size: $heading-font-size; - text-transform: $heading-text-transform; - font-weight: $heading-font-weight; -} - - -// Heading variations - -.heading-small { - padding-top: .25rem; - padding-bottom: .25rem; - font-size: .75rem; - text-transform: uppercase; - letter-spacing: .04em; -} - -.heading-title { - letter-spacing: $heading-title-letter-spacing; - font-size: $heading-title-font-size; - font-weight: $heading-title-font-weight; - text-transform: $heading-title-text-transform; -} - -.heading-section { - letter-spacing: $heading-section-letter-spacing; - font-size: $heading-section-font-size; - font-weight: $heading-section-font-weight; - text-transform: $heading-section-text-transform; - - img { - display: block; - width: 72px; - height: 72px; - margin-bottom: 1.5rem; - } - - &.text-center { - img { - margin-left: auto; - margin-right: auto; - } - } -} diff --git a/frontend/src/assets/scss/core/type/_type.scss b/frontend/src/assets/scss/core/type/_type.scss deleted file mode 100644 index 6512a7f5f..000000000 --- a/frontend/src/assets/scss/core/type/_type.scss +++ /dev/null @@ -1,27 +0,0 @@ -// -// Type -// - - -// Paragraphs - -p { - font-size: $paragraph-font-size; - font-weight: $paragraph-font-weight; - line-height: $paragraph-line-height; -} - -.lead { - font-size: $lead-font-size; - font-weight: $lead-font-weight; - line-height: $paragraph-line-height; - margin-top: 1.5rem; - - + .btn-wrapper { - margin-top: 3rem; - } -} - -.description { - font-size: $font-size-sm; -} diff --git a/frontend/src/assets/scss/core/utilities/_backgrounds.scss b/frontend/src/assets/scss/core/utilities/_backgrounds.scss deleted file mode 100644 index 45a9f0635..000000000 --- a/frontend/src/assets/scss/core/utilities/_backgrounds.scss +++ /dev/null @@ -1,51 +0,0 @@ -// -// Backgrounds -// - - -@each $color, $value in $colors { - @include bg-variant(".bg-#{$color}", $value, $ignore-warning: true); -} - -@each $color, $value in $theme-colors { - @include bg-gradient-variant(".bg-gradient-#{$color}", $value, $ignore-warning: true); -} - -@each $color, $value in $colors { - @include bg-gradient-variant(".bg-gradient-#{$color}", $value, $ignore-warning: true); -} - - -// Background colors with transparency - -@each $color, $value in $theme-colors { - @include bg-translucent-variant(".bg-translucent-#{$color}", $value, $ignore-warning: true); -} - - -// Sections backgrounds - -@each $color, $value in $section-colors { - @include bg-variant(".section-#{$color}", $value, $ignore-warning: true); -} - -@each $color, $value in $theme-colors { - @include bg-gradient-variant(".bg-gradient-#{$color}", $value, $ignore-warning: true); -} - - -// Shape (svg) fill colors - -@each $color, $value in $theme-colors { - .fill-#{$color} { - fill: $value; - } - - .stroke-#{$color} { - stroke: $value; - } -} - -.fill-opacity-8 { - fill-opacity: .8; -} diff --git a/frontend/src/assets/scss/core/utilities/_blurable.scss b/frontend/src/assets/scss/core/utilities/_blurable.scss deleted file mode 100644 index a558c0d44..000000000 --- a/frontend/src/assets/scss/core/utilities/_blurable.scss +++ /dev/null @@ -1,37 +0,0 @@ -// -// Blurable -// add a blue effect on hover on any element with .blur--hover class -// - -.blur--hover { - position: relative; - - .blur-item { - transition: 1s cubic-bezier(.19,1,.22,1); - will-change: transform; - filter: blur(0); - opacity: 1; - } - - .blur-hidden { - position: absolute; - top: calc(50% + 7px); - left: 50%; - transform: translate(-50%, -50%); - opacity: 0; - transition: $transition-base; - z-index: 100; - } - &:hover { - .blur-item { - opacity: .8; - filter: blur(10px); - transform: scale(.95); - z-index: 1; - } - .blur-hidden { - opacity: 1; - top: 50%; - } - } -} diff --git a/frontend/src/assets/scss/core/utilities/_floating.scss b/frontend/src/assets/scss/core/utilities/_floating.scss deleted file mode 100644 index eaa90fc9b..000000000 --- a/frontend/src/assets/scss/core/utilities/_floating.scss +++ /dev/null @@ -1,64 +0,0 @@ -// -// Floating -// floating animation utility class -// - - -.floating { - animation: floating 3s ease infinite; - will-change: transform; - - &:hover { - animation-play-state: paused; - } -} - - -// Size variations - -.floating-lg { - animation: floating-lg 3s ease infinite; -} - -.floating-sm { - animation: floating-sm 3s ease infinite; -} - - -// Keyframes - -@keyframes floating-lg { - 0% { - transform: translateY(0px) - } - 50% { - transform: translateY(15px) - } - 100% { - transform: translateY(0px) - } -} - -@keyframes floating { - 0% { - transform: translateY(0px) - } - 50% { - transform: translateY(10px) - } - 100% { - transform: translateY(0px) - } -} - -@keyframes floating-sm { - 0% { - transform: translateY(0px) - } - 50% { - transform: translateY(5px) - } - 100% { - transform: translateY(0px) - } -} diff --git a/frontend/src/assets/scss/core/utilities/_helper.scss b/frontend/src/assets/scss/core/utilities/_helper.scss deleted file mode 100644 index 013bd2890..000000000 --- a/frontend/src/assets/scss/core/utilities/_helper.scss +++ /dev/null @@ -1,18 +0,0 @@ -// -// Helper -// helper classes for different cases -// - - -// Clearfix for sections that use float property - -.floatfix { - &:before, - &:after { - content: ''; - display: table; - } - &:after { - clear: both; - } -} diff --git a/frontend/src/assets/scss/core/utilities/_image.scss b/frontend/src/assets/scss/core/utilities/_image.scss deleted file mode 100644 index 8bdfbbc0f..000000000 --- a/frontend/src/assets/scss/core/utilities/_image.scss +++ /dev/null @@ -1,9 +0,0 @@ -// -// Image -// - -.img-center { - display: block; - margin-left: auto; - margin-right: auto; -} diff --git a/frontend/src/assets/scss/core/utilities/_opacity.scss b/frontend/src/assets/scss/core/utilities/_opacity.scss deleted file mode 100644 index 812bfd8bc..000000000 --- a/frontend/src/assets/scss/core/utilities/_opacity.scss +++ /dev/null @@ -1,35 +0,0 @@ -// -// Opacity -// modify the transparency of an element with this quick modifier classes -// - -.opacity-1 { - opacity: .1 !important; -} -.opacity-2 { - opacity: .2 !important; -} -.opacity-3 { - opacity: .3 !important; -} -.opacity-4 { - opacity: .4 !important; -} -.opacity-5 { - opacity: .5 !important; -} -.opacity-6 { - opacity: .6 !important; -} -.opacity-7 { - opacity: .7 !important; -} -.opacity-8 { - opacity: .8 !important; -} -.opacity-8 { - opacity: .9 !important; -} -.opacity-10 { - opacity: 1 !important; -} diff --git a/frontend/src/assets/scss/core/utilities/_overflow.scss b/frontend/src/assets/scss/core/utilities/_overflow.scss deleted file mode 100644 index b4063fc31..000000000 --- a/frontend/src/assets/scss/core/utilities/_overflow.scss +++ /dev/null @@ -1,11 +0,0 @@ -// -// Overflow -// - -.overflow-visible { - overflow: visible !important; -} - -.overflow-hidden { - overflow: hidden !important; -} diff --git a/frontend/src/assets/scss/core/utilities/_position.scss b/frontend/src/assets/scss/core/utilities/_position.scss deleted file mode 100644 index 58aaa0929..000000000 --- a/frontend/src/assets/scss/core/utilities/_position.scss +++ /dev/null @@ -1,25 +0,0 @@ -// -// Position -// modifier classes to be applied on an abosolute positioned element -// use it next to .position-absolute class -// - -@each $size, $value in $spacers { - .top-#{$size} { - top: $value; - } - .right-#{$size} { - right: $value; - } - .bottom-#{$size} { - bottom: $value; - } - .left-#{$size} { - left: $value; - } -} - -.center { - left: 50%; - transform: translateX(-50%); -} diff --git a/frontend/src/assets/scss/core/utilities/_shadows.scss b/frontend/src/assets/scss/core/utilities/_shadows.scss deleted file mode 100644 index 8907c8b5b..000000000 --- a/frontend/src/assets/scss/core/utilities/_shadows.scss +++ /dev/null @@ -1,28 +0,0 @@ -// -// Shadows -// - -// General styles -[class*="shadow"] { - @if $enable-transitions { - transition: $transition-base; - } -} - - -// Size variations -.shadow-sm--hover:hover { - box-shadow: $box-shadow-sm !important; -} - -.shadow--hover:hover { - box-shadow: $box-shadow !important; -} - -.shadow-lg--hover:hover { - box-shadow: $box-shadow-lg !important; -} - -.shadow-none--hover:hover { - box-shadow: none !important; -} diff --git a/frontend/src/assets/scss/core/utilities/_sizing.scss b/frontend/src/assets/scss/core/utilities/_sizing.scss deleted file mode 100644 index 5dd6b2195..000000000 --- a/frontend/src/assets/scss/core/utilities/_sizing.scss +++ /dev/null @@ -1,7 +0,0 @@ -// -// Height -// - -.h-100vh { - height: 100vh !important; -} diff --git a/frontend/src/assets/scss/core/utilities/_spacing.scss b/frontend/src/assets/scss/core/utilities/_spacing.scss deleted file mode 100644 index b3fb9fa0e..000000000 --- a/frontend/src/assets/scss/core/utilities/_spacing.scss +++ /dev/null @@ -1,107 +0,0 @@ -// -// Spacing -// - -.row.row-grid > [class*="col-"] + [class*="col-"] { - margin-top: 3rem; -} - -@include media-breakpoint-up(lg) { - .row.row-grid > [class*="col-lg-"] + [class*="col-lg-"] { - margin-top: 0; - } -} -@include media-breakpoint-up(md) { - .row.row-grid > [class*="col-md-"] + [class*="col-md-"] { - margin-top: 0; - } -} -@include media-breakpoint-up(sm) { - .row.row-grid > [class*="col-sm-"] + [class*="col-sm-"] { - margin-top: 0; - } -} - -.row-grid + .row-grid { - margin-top: 3rem; -} - - -// Negative margins and paddings - -@media(min-width: 992px) { - [class*="mt--"], - [class*="mr--"], - [class*="mb--"], - [class*="ml--"] { - - } - - - // Large negative margins in pixels - - .mt--100 { - margin-top: -100px !important; - } - .mr--100 { - margin-right: -100px !important; - } - .mb--100 { - margin-bottom: -100px !important; - } - .ml--100 { - margin-left: -100px !important; - } - .mt--150 { - margin-top: -150px !important; - } - .mb--150 { - margin-bottom: -150px !important; - } - .mt--200 { - margin-top: -200px !important; - } - .mb--200 { - margin-bottom: -200px !important; - } - .mt--300 { - margin-top: -300px !important; - } - .mb--300 { - margin-bottom: -300px !important; - } - - - // Large margins in pixels - - .pt-100 { - padding-top: 100px !important; - } - .pb-100 { - padding-bottom: 100px !important; - } - .pt-150 { - padding-top: 150px !important; - } - .pb-150 { - padding-bottom: 150px !important; - } - .pt-200 { - padding-top: 200px !important; - } - .pb-200 { - padding-bottom: 200px !important; - } - .pt-250 { - padding-top: 250px !important; - } - .pb-250 { - padding-bottom: 250px !important; - } - .pt-300 { - padding-top: 300px!important; - } - .pb-300 { - padding-bottom: 300px!important; - } -} diff --git a/frontend/src/assets/scss/core/utilities/_text.scss b/frontend/src/assets/scss/core/utilities/_text.scss deleted file mode 100644 index 65c1f6cec..000000000 --- a/frontend/src/assets/scss/core/utilities/_text.scss +++ /dev/null @@ -1,49 +0,0 @@ -// Weight and italics - -.font-weight-300 { font-weight: 300 !important; } -.font-weight-400 { font-weight: 400 !important; } -.font-weight-500 { font-weight: 500 !important; } -.font-weight-600 { font-weight: 600 !important; } -.font-weight-700 { font-weight: 700 !important; } -.font-weight-800 { font-weight: 800 !important; } -.font-weight-900 { font-weight: 900 !important; } - - -// Text decorations - -.text-underline { text-decoration: underline; } -.text-through { text-decoration: line-through; } - - -// Text size - -.text-xs { font-size: $font-size-xs !important; } -.text-sm { font-size: $font-size-sm !important; } -.text-lg { font-size: $font-size-lg !important; } -.text-xl { font-size: $font-size-xl !important; } - - -// Line heights - -.lh-100 { line-height: 1; } -.lh-110 { line-height: 1.1; } -.lh-120 { line-height: 1.2; } -.lh-130 { line-height: 1.3; } -.lh-140 { line-height: 1.4; } -.lh-150 { line-height: 1.5; } -.lh-160 { line-height: 1.6; } -.lh-170 { line-height: 1.7; } -.lh-180 { line-height: 1.8; } - - -// Letter spacings - -.ls-1 { letter-spacing: .0625rem; } -.ls-15 { letter-spacing: .09375rem; } -.ls-2 { letter-spacing: 0.125rem; } - -// Color variations - -@each $color, $value in $colors { - @include text-emphasis-variant(".text-#{$color}", $value); -} diff --git a/frontend/src/assets/scss/core/utilities/_transform.scss b/frontend/src/assets/scss/core/utilities/_transform.scss deleted file mode 100644 index e595bf8b4..000000000 --- a/frontend/src/assets/scss/core/utilities/_transform.scss +++ /dev/null @@ -1,13 +0,0 @@ -// -// Tranform -// - - -@include media-breakpoint-up(lg) { - .transform-perspective-right { - transform: scale(1) perspective(1040px) rotateY(-11deg) rotateX(2deg) rotate(2deg); - } - .transform-perspective-left{ - transform: scale(1) perspective(2000px) rotateY(11deg) rotateX(2deg) rotate(-2deg) - } -} diff --git a/frontend/src/assets/scss/core/vendors/_flatpickr.scss b/frontend/src/assets/scss/core/vendors/_flatpickr.scss deleted file mode 100644 index 655e982c7..000000000 --- a/frontend/src/assets/scss/core/vendors/_flatpickr.scss +++ /dev/null @@ -1,72 +0,0 @@ -%active-day { - background: $datepicker-active-background; - color: $datepicker-active-color; - box-shadow: $datepicker-active-box-shadow; - border: none; -} -.flatpickr-calendar { - @include box-shadow($dropdown-box-shadow); - padding: $datepicker-dropdown-padding; - width: 347px; - color: $gray-700; - - .flatpickr-weekday { - text-align: center; - font-size: $font-size-sm; - color: $gray-700; - font-weight: normal; - } - .flatpickr-day { - border: none; - } - .flatpickr-day:hover { - @extend %active-day; - } - .flatpickr-day.selected { - @extend %active-day; - &:hover { - @extend %active-day; - } - } - - .flatpickr-day.today { - border: 1px solid $datepicker-active-background; - &:hover { - background: $datepicker-active-background; - color: $datepicker-active-color; - } - } - .flatpickr-day.inRange { - background: $datepicker-active-background !important; - color: $datepicker-active-color; - box-shadow: -5px 0 0 $datepicker-active-background, 5px 0 0 $datepicker-active-background; - border: none !important; - } - - .flatpickr-day.startRange, .flatpickr-day.endRange { - background: $datepicker-active-background; - } - - .flatpickr-day.selected.startRange + .endRange:not(:nth-child(7n+1)), - .flatpickr-day.startRange.startRange + .endRange:not(:nth-child(7n+1)), - .flatpickr-day.endRange.startRange + .endRange:not(:nth-child(7n+1)) { - box-shadow: -10px 0 0 $datepicker-active-background; - } - - .flatpickr-months .flatpickr-prev-month:hover svg, - .flatpickr-months .flatpickr-next-month:hover svg{ - fill: $datepicker-active-background; - } - - .flatpickr-current-month span.cur-month, - .flatpickr-current-month input.cur-year{ - padding: 0 10px; - color: $gray-700; - font-size: $font-size-sm; - font-weight: 500; - &:hover { - background: $gray-200; - border-radius: $datepicker-header-cell-border-radius; - } - } -} diff --git a/frontend/src/assets/scss/core/vendors/_headroom.scss b/frontend/src/assets/scss/core/vendors/_headroom.scss deleted file mode 100644 index 3542e4a1e..000000000 --- a/frontend/src/assets/scss/core/vendors/_headroom.scss +++ /dev/null @@ -1,25 +0,0 @@ -// -// Headroom -// - - -.headroom { - will-change: transform; - background-color: inherit; - @include transition($transition-base); -} -.headroom--pinned { - @extend .position-fixed; - transform: translateY(0%); -} -.headroom--unpinned { - @extend .position-fixed; - transform: translateY(-100%); -} - -.headroom--not-top { - padding-top: .5rem; - padding-bottom: .5rem; - background-color: theme-color("default") !important; - box-shadow: 0 1px 10px rgba(130, 130, 134, 0.1); -} diff --git a/frontend/src/assets/scss/core/vendors/_nouislider.scss b/frontend/src/assets/scss/core/vendors/_nouislider.scss deleted file mode 100644 index cb99d7705..000000000 --- a/frontend/src/assets/scss/core/vendors/_nouislider.scss +++ /dev/null @@ -1,410 +0,0 @@ -// -// NoUi Slider -// - - -// Original styles - -.noUi-target, -.noUi-target * { - -webkit-touch-callout: none; - -webkit-tap-highlight-color: rgba(0, 0, 0, 0); - -webkit-user-select: none; - touch-action: none; - user-select: none; - box-sizing: border-box; -} - -.noUi-target { - position: relative; - direction: ltr; -} - -.noUi-base, -.noUi-connects { - width: 100%; - height: 100%; - position: relative; - z-index: 1; -} - - -// Wrapper for all connect elements - -.noUi-connects { - overflow: hidden; - z-index: 0; -} - -.noUi-connect, -.noUi-origin { - will-change: transform; - position: absolute; - z-index: 1; - top: 0; - left: 0; - height: 100%; - width: 100%; - transform-origin: 0 0; -} - - -html:not([dir="rtl"]) .noUi-horizontal .noUi-origin { - left: 100%; - width: 10%; - right: 0; -} - -.noUi-vertical .noUi-origin { - width: 0; -} - -.noUi-horizontal .noUi-origin { - height: 0; -} - -.noUi-handle { - position: absolute; -} - -.noUi-state-tap .noUi-connect, -.noUi-state-tap .noUi-origin { - transition: transform .3s; -} - -.noUi-state-drag * { - cursor: inherit !important; -} - -.noUi-horizontal { - height: $noui-target-thickness; -} - -.noUi-horizontal .noUi-handle { - width: 34px; - height: 28px; - left: -17px; - top: -6px; -} - -.noUi-vertical { - width: $noui-target-thickness; -} - -.noUi-vertical .noUi-handle { - width: 28px; - height: 34px; - left: -6px; - top: -17px; -} - -html:not([dir="rtl"]) .noUi-horizontal .noUi-handle { - left: auto; -} - -.noUi-connects { - border-radius: 3px; -} - -.noUi-connect { - background: $noui-slider-connect-bg; -} - -.noUi-draggable { - cursor: ew-resize; -} - -.noUi-vertical .noUi-draggable { - cursor: ns-resize; -} - -.noUi-handle { - border: 1px solid #D9D9D9; - border-radius: 3px; - background: #FFF; - cursor: default; - box-shadow: inset 0 0 1px #FFF, inset 0 1px 7px #EBEBEB, 0 3px 6px -3px #BBB; - outline: none; -} - -.noUi-active { - outline: none; -} - - -/* Disabled state; - */ - -[disabled] .noUi-connect { - background: #B8B8B8; -} - -[disabled].noUi-target, -[disabled].noUi-handle, -[disabled] .noUi-handle { - cursor: not-allowed; -} - - -/* Base; - * - */ - -.noUi-pips, -.noUi-pips * { - -moz-box-sizing: border-box; - box-sizing: border-box; -} - -.noUi-pips { - position: absolute; - color: #999; -} - - -/* Values; - * - */ - -.noUi-value { - position: absolute; - white-space: nowrap; - text-align: center; -} - -.noUi-value-sub { - color: #ccc; - font-size: 10px; -} - - -/* Markings; - * - */ - -.noUi-marker { - position: absolute; - background: #CCC; -} - -.noUi-marker-sub { - background: #AAA; -} - -.noUi-marker-large { - background: #AAA; -} - - -/* Horizontal layout; - * - */ - -.noUi-pips-horizontal { - padding: 10px 0; - height: 80px; - top: 100%; - left: 0; - width: 100%; -} - -.noUi-value-horizontal { - transform: translate(-50%, 50%); -} - -.noUi-rtl .noUi-value-horizontal { - transform: translate(50%, 50%); -} - -.noUi-marker-horizontal.noUi-marker { - margin-left: -1px; - width: 2px; - height: 5px; -} - -.noUi-marker-horizontal.noUi-marker-sub { - height: 10px; -} - -.noUi-marker-horizontal.noUi-marker-large { - height: 15px; -} - - -/* Vertical layout; - * - */ - -.noUi-pips-vertical { - padding: 0 10px; - height: 100%; - top: 0; - left: 100%; -} - -.noUi-value-vertical { - -webkit-transform: translate(0, -50%); - transform: translate(0, -50%, 0); - padding-left: 25px; -} - -.noUi-rtl .noUi-value-vertical { - -webkit-transform: translate(0, 50%); - transform: translate(0, 50%); -} - -.noUi-marker-vertical.noUi-marker { - width: 5px; - height: 2px; - margin-top: -1px; -} - -.noUi-marker-vertical.noUi-marker-sub { - width: 10px; -} - -.noUi-marker-vertical.noUi-marker-large { - width: 15px; -} - -.noUi-tooltip { - display: block; - position: absolute; - border: 1px solid #D9D9D9; - border-radius: 3px; - background: #fff; - color: #000; - padding: 5px; - text-align: center; - white-space: nowrap; -} - -.noUi-horizontal .noUi-tooltip { - -webkit-transform: translate(-50%, 0); - transform: translate(-50%, 0); - left: 50%; - bottom: 120%; -} - -.noUi-vertical .noUi-tooltip { - -webkit-transform: translate(0, -50%); - transform: translate(0, -50%); - top: 50%; - right: 120%; -} - - -// Custom styles - -.noUi-target { - background: $noui-target-bg; - border-radius: $noui-target-border-radius; - border: 0; - box-shadow: $noui-target-box-shadow; - margin: 15px 0; - cursor: pointer; -} - -.noUi-horizontal { - height: $noui-target-thickness; -} - - -.noUi-vertical { - width: $noui-target-thickness; -} - -.noUi-connect { - background: theme-color("primary"); - box-shadow: none; -} - -.noUi-handle { - -} - -.noUi-horizontal .noUi-handle, -.noUi-vertical .noUi-handle { - top: -$noui-target-thickness; - width: $noui-handle-width; - height: $noui-handle-width; - border-radius: 100%; - box-shadow: none; - cursor: pointer; - background-color: $noui-handle-bg; - border: $noui-handle-border; - transition: box-shadow .15s, transform .15s; -} - -.noUi-horizontal .noUi-handle.noUi-active, -.noUi-vertical .noUi-handle.noUi-active { - box-shadow: 0px 0px 0px 2px rgba($noui-handle-bg, 1); -} - -.input-slider--cyan .noUi-connect { - background: $cyan; -} - - -/* Disabled state */ - -[disabled] .noUi-connect, -[disabled].noUi-connect { - background: $noui-slider-connect-disabled-bg; -} - -[disabled] .noUi-handle, -[disabled].noUi-origin { - cursor: not-allowed; -} - -/* Range slider value labels */ - -.range-slider-value { - font-size: $font-size-xs; - font-weight: 500; - background-color: rgba($dark, .7); - color: color-yiq($dark); - border-radius: 10px; - padding: .4em .8em .3em .85em; -} - -.range-slider-wrapper .upper-info { - font-weight: 400; - margin-bottom: 5px; -} - -.input-slider-value-output { - background: #333; - color: #fff; - padding: 4px 8px; - position: relative; - top: 12px; - font-size: 11px; - border-radius: 2px; -} - -.input-slider-value-output:after { - bottom: 100%; - left: 10px; - border: solid transparent; - content: " "; - height: 0; - width: 0; - position: absolute; - pointer-events: none; - border-color: rgba(136, 183, 213, 0); - border-bottom-color: #333; - border-width: 4px; - margin-left: -4px; -} - -.input-slider-value-output.left:after { - left: 10px; - right: auto; -} - -.input-slider-value-output.right:after { - right: 10px; - left: auto; -} diff --git a/frontend/src/assets/scss/core/vendors/_scrollbar.scss b/frontend/src/assets/scss/core/vendors/_scrollbar.scss deleted file mode 100644 index 4aff7d92d..000000000 --- a/frontend/src/assets/scss/core/vendors/_scrollbar.scss +++ /dev/null @@ -1,35 +0,0 @@ -// -// Custom scrollbar -// - -.scrollbar-inner { - height: 100%; - - &:not(:hover) .scroll-element { - opacity: 0; - } - - .scroll-element { - transition: opacity 300ms; - margin-right: 2px; - - .scroll-bar, - .scroll-element_track { - transition: background-color 300ms; - } - - .scroll-element_track { - background-color: transparent; - } - } - - .scroll-element.scroll-y { - width: 3px; - right: 0; - } - - .scroll-element.scroll-x { - height: 3px; - bottom: 0; - } -} diff --git a/frontend/src/assets/scss/custom/_alert.scss b/frontend/src/assets/scss/custom/_alert.scss deleted file mode 100644 index 2ef0b7c2f..000000000 --- a/frontend/src/assets/scss/custom/_alert.scss +++ /dev/null @@ -1,6 +0,0 @@ -// -// Alert -// - -@import "../core/alerts/alert"; -@import "../core/alerts/alert-dismissible"; diff --git a/frontend/src/assets/scss/custom/_avatar.scss b/frontend/src/assets/scss/custom/_avatar.scss deleted file mode 100644 index 98818a6d6..000000000 --- a/frontend/src/assets/scss/custom/_avatar.scss +++ /dev/null @@ -1,6 +0,0 @@ -// -// Avatar -// - -@import "../core/avatars/avatar"; -@import "../core/avatars/avatar-group"; diff --git a/frontend/src/assets/scss/custom/_badge.scss b/frontend/src/assets/scss/custom/_badge.scss deleted file mode 100644 index 2682e1a2f..000000000 --- a/frontend/src/assets/scss/custom/_badge.scss +++ /dev/null @@ -1,7 +0,0 @@ -// -// Badge -// - -@import "../core/badges/badge"; -@import "../core/badges/badge-circle"; -@import "../core/badges/badge-dot"; diff --git a/frontend/src/assets/scss/custom/_buttons.scss b/frontend/src/assets/scss/custom/_buttons.scss deleted file mode 100644 index 4f2888c65..000000000 --- a/frontend/src/assets/scss/custom/_buttons.scss +++ /dev/null @@ -1,7 +0,0 @@ -// -// Button -// - -@import "../core/buttons/button"; -@import "../core/buttons/button-icon"; -@import "../core/buttons/button-brand"; diff --git a/frontend/src/assets/scss/custom/_card.scss b/frontend/src/assets/scss/custom/_card.scss deleted file mode 100644 index 1eb5ff336..000000000 --- a/frontend/src/assets/scss/custom/_card.scss +++ /dev/null @@ -1,9 +0,0 @@ -// -// Cards -// - -@import "../core/cards/card"; -@import "../core/cards/card-profile"; -@import "../core/cards/card-blockquote"; -@import "../core/cards/card-animations"; -@import "../core/cards/card-stats"; diff --git a/frontend/src/assets/scss/custom/_chart.scss b/frontend/src/assets/scss/custom/_chart.scss deleted file mode 100644 index 836ade8b7..000000000 --- a/frontend/src/assets/scss/custom/_chart.scss +++ /dev/null @@ -1,5 +0,0 @@ -// -// Chart -// - -@import "../core/charts/chart"; diff --git a/frontend/src/assets/scss/custom/_close.scss b/frontend/src/assets/scss/custom/_close.scss deleted file mode 100644 index 292d6a090..000000000 --- a/frontend/src/assets/scss/custom/_close.scss +++ /dev/null @@ -1,5 +0,0 @@ -// -// Close -// - -@import "../core/close/close" diff --git a/frontend/src/assets/scss/custom/_components.scss b/frontend/src/assets/scss/custom/_components.scss deleted file mode 100644 index e6815e903..000000000 --- a/frontend/src/assets/scss/custom/_components.scss +++ /dev/null @@ -1,30 +0,0 @@ -// -// Components -// - -@import "alert"; -@import "avatar"; -@import "buttons"; -@import "card"; -@import "chart"; -@import "close"; -@import "content"; -@import "custom-forms"; -@import "dropdown"; -@import "footer"; -@import "forms"; -@import "header"; -@import "icons"; -@import "input-group"; -@import "list-group"; -@import "map"; -@import "mask"; -@import "modal"; -@import "nav"; -@import "navbar"; -@import "pagination"; -@import "popover"; -@import "progress"; -@import "separator"; -@import "tables"; -@import "type"; diff --git a/frontend/src/assets/scss/custom/_content.scss b/frontend/src/assets/scss/custom/_content.scss deleted file mode 100644 index d0e638bb0..000000000 --- a/frontend/src/assets/scss/custom/_content.scss +++ /dev/null @@ -1,47 +0,0 @@ -.main-content { - position: relative; - - // Navbar - .navbar-top { - position: absolute; - left: 0; - top: 0; - width: 100%; - z-index: 1; - background-color: transparent; - padding-left: 0 !important; - padding-right: 0 !important; - } - - // Container - .container-fluid { - @include media-breakpoint-up(md) { - padding-left: ($main-content-padding-x + $grid-gutter-width / 2) !important; - padding-right: ($main-content-padding-x + $grid-gutter-width / 2) !important; - } - } -} - - -// Offsets the main content depending on the sidebar positioning - -.navbar-vertical.navbar-expand { - - @each $breakpoint, - $dimension in $grid-breakpoints { - - &-#{$breakpoint} { - - @include media-breakpoint-up(#{$breakpoint}) { - - // Left - &.fixed-left + .main-content { - margin-left: $navbar-vertical-width; - } // Right - &.fixed-right + .main-content { - margin-right: $navbar-vertical-width; - } - } - } - } -} diff --git a/frontend/src/assets/scss/custom/_custom-forms.scss b/frontend/src/assets/scss/custom/_custom-forms.scss deleted file mode 100644 index 92d8290be..000000000 --- a/frontend/src/assets/scss/custom/_custom-forms.scss +++ /dev/null @@ -1,9 +0,0 @@ -// -// Custom form -// - -@import "../core/custom-forms/custom-form"; -@import "../core/custom-forms/custom-control"; -@import "../core/custom-forms/custom-checkbox"; -@import "../core/custom-forms/custom-radio"; -@import "../core/custom-forms/custom-toggle"; diff --git a/frontend/src/assets/scss/custom/_dropdown.scss b/frontend/src/assets/scss/custom/_dropdown.scss deleted file mode 100644 index 54314b6d3..000000000 --- a/frontend/src/assets/scss/custom/_dropdown.scss +++ /dev/null @@ -1,5 +0,0 @@ -// -// Dropdown -// - -@import "../core/dropdowns/dropdown"; diff --git a/frontend/src/assets/scss/custom/_footer.scss b/frontend/src/assets/scss/custom/_footer.scss deleted file mode 100644 index 9b65604a7..000000000 --- a/frontend/src/assets/scss/custom/_footer.scss +++ /dev/null @@ -1,5 +0,0 @@ -// -// Footer -// - -@import "../core/footers/footer"; diff --git a/frontend/src/assets/scss/custom/_forms.scss b/frontend/src/assets/scss/custom/_forms.scss deleted file mode 100644 index 835edea84..000000000 --- a/frontend/src/assets/scss/custom/_forms.scss +++ /dev/null @@ -1,7 +0,0 @@ -// -// Forms -// - -@import "../core/forms/form"; -@import "../core/forms/form-validation"; -@import "../core/forms/input-group"; diff --git a/frontend/src/assets/scss/custom/_functions.scss b/frontend/src/assets/scss/custom/_functions.scss deleted file mode 100644 index d0b556c56..000000000 --- a/frontend/src/assets/scss/custom/_functions.scss +++ /dev/null @@ -1,33 +0,0 @@ -// -// Functions -// - -// Bootstrap default functions - -@import "~bootstrap/scss/functions"; - - -// Retrieve color Sass maps - -@function section-color($key: "primary") { - @return map-get($section-colors, $key); -} - - -// Lines colors - -@function shapes-primary-color($key: "step-1-gradient-bg") { - @return map-get($shapes-primary-colors, $key); -} - -@function shapes-default-color($key: "step-1-gradient-bg") { - @return map-get($shapes-default-colors, $key); -} - -@function lines-light-color($key: "step-1-gradient-bg") { - @return map-get($shapes-light-colors, $key); -} - -@function shapes-dark-color($key: "step-1-gradient-bg") { - @return map-get($shapes-dark-colors, $key); -} diff --git a/frontend/src/assets/scss/custom/_header.scss b/frontend/src/assets/scss/custom/_header.scss deleted file mode 100644 index d3fb2bb42..000000000 --- a/frontend/src/assets/scss/custom/_header.scss +++ /dev/null @@ -1,5 +0,0 @@ -// -// Header -// - -@import "../core/headers/header"; diff --git a/frontend/src/assets/scss/custom/_icons.scss b/frontend/src/assets/scss/custom/_icons.scss deleted file mode 100644 index 86df08e38..000000000 --- a/frontend/src/assets/scss/custom/_icons.scss +++ /dev/null @@ -1,6 +0,0 @@ -// -// Icon -// - -@import "../core/icons/icon"; -@import "../core/icons/icon-shape"; diff --git a/frontend/src/assets/scss/custom/_input-group.scss b/frontend/src/assets/scss/custom/_input-group.scss deleted file mode 100644 index cc8f3dcef..000000000 --- a/frontend/src/assets/scss/custom/_input-group.scss +++ /dev/null @@ -1,5 +0,0 @@ -// -// Input group -// - -@import "../core/forms/input-group"; diff --git a/frontend/src/assets/scss/custom/_list-group.scss b/frontend/src/assets/scss/custom/_list-group.scss deleted file mode 100644 index c630aa9ab..000000000 --- a/frontend/src/assets/scss/custom/_list-group.scss +++ /dev/null @@ -1,5 +0,0 @@ -// -// List group -// - -@import "../core/list-groups/list-group"; diff --git a/frontend/src/assets/scss/custom/_map.scss b/frontend/src/assets/scss/custom/_map.scss deleted file mode 100644 index 85983c632..000000000 --- a/frontend/src/assets/scss/custom/_map.scss +++ /dev/null @@ -1,5 +0,0 @@ -// -// Maps -// - -@import "../core/maps/map"; diff --git a/frontend/src/assets/scss/custom/_mask.scss b/frontend/src/assets/scss/custom/_mask.scss deleted file mode 100644 index 7b2788745..000000000 --- a/frontend/src/assets/scss/custom/_mask.scss +++ /dev/null @@ -1,5 +0,0 @@ -// -// Mask -// - -@import "../core/masks/mask"; diff --git a/frontend/src/assets/scss/custom/_mixins.scss b/frontend/src/assets/scss/custom/_mixins.scss deleted file mode 100644 index 89e370a42..000000000 --- a/frontend/src/assets/scss/custom/_mixins.scss +++ /dev/null @@ -1,19 +0,0 @@ -// -// Mixins -// - -// Bootstrap default mixins - -@import "~bootstrap/scss/mixins"; - - -// Custom mixins - -@import "../core/mixins/alert"; -@import "../core/mixins/badge"; -@import "../core/mixins/background-variant"; -@import "../core/mixins/buttons"; -@import "../core/mixins/forms"; -@import "../core/mixins/icon"; -@import "../core/mixins/modals"; -@import "../core/mixins/popover"; diff --git a/frontend/src/assets/scss/custom/_modal.scss b/frontend/src/assets/scss/custom/_modal.scss deleted file mode 100644 index a33f2e9d8..000000000 --- a/frontend/src/assets/scss/custom/_modal.scss +++ /dev/null @@ -1,5 +0,0 @@ -// -// Modal -// - -@import "../core/modals/modal"; diff --git a/frontend/src/assets/scss/custom/_nav.scss b/frontend/src/assets/scss/custom/_nav.scss deleted file mode 100644 index b7c7a0b04..000000000 --- a/frontend/src/assets/scss/custom/_nav.scss +++ /dev/null @@ -1,7 +0,0 @@ -// -// Nav -// - - -@import "../core/navs/nav"; -@import "../core/navs/nav-pills"; diff --git a/frontend/src/assets/scss/custom/_navbar.scss b/frontend/src/assets/scss/custom/_navbar.scss deleted file mode 100644 index db24441ff..000000000 --- a/frontend/src/assets/scss/custom/_navbar.scss +++ /dev/null @@ -1,9 +0,0 @@ -// -// Navbar -// - -@import "../core/navbars/navbar"; -@import "../core/navbars/navbar-vertical"; -@import "../core/navbars/navbar-search"; -@import "../core/navbars/navbar-dropdown"; -@import "../core/navbars/navbar-collapse"; diff --git a/frontend/src/assets/scss/custom/_pagination.scss b/frontend/src/assets/scss/custom/_pagination.scss deleted file mode 100644 index 557a8e0cd..000000000 --- a/frontend/src/assets/scss/custom/_pagination.scss +++ /dev/null @@ -1,5 +0,0 @@ -// -// Pagination -// - -@import "../core/paginations/pagination"; diff --git a/frontend/src/assets/scss/custom/_popover.scss b/frontend/src/assets/scss/custom/_popover.scss deleted file mode 100644 index 5e062c459..000000000 --- a/frontend/src/assets/scss/custom/_popover.scss +++ /dev/null @@ -1,6 +0,0 @@ -// -// Popover -// - - -@import "../core/popovers/popover"; diff --git a/frontend/src/assets/scss/custom/_progress.scss b/frontend/src/assets/scss/custom/_progress.scss deleted file mode 100644 index bf5840643..000000000 --- a/frontend/src/assets/scss/custom/_progress.scss +++ /dev/null @@ -1,5 +0,0 @@ -// -// Progress -// - -@import "../core/progresses/progress"; diff --git a/frontend/src/assets/scss/custom/_reboot.scss b/frontend/src/assets/scss/custom/_reboot.scss deleted file mode 100644 index 4a49a6984..000000000 --- a/frontend/src/assets/scss/custom/_reboot.scss +++ /dev/null @@ -1,13 +0,0 @@ -iframe { - border: 0; -} - -figcaption, -figure, -main { - display: block; -} - -main { - overflow: hidden; -} diff --git a/frontend/src/assets/scss/custom/_section.scss b/frontend/src/assets/scss/custom/_section.scss deleted file mode 100644 index db88d4025..000000000 --- a/frontend/src/assets/scss/custom/_section.scss +++ /dev/null @@ -1,139 +0,0 @@ -// -// Sections -// - - -// Nucleo icons for presentation purpose - -.section-nucleo-icons { - - --icon-size: 5rem; - --icon-sm-size: 3.75rem; - --gutter: 7rem; - - .icons-container { - position: relative; - max-width: 100%; - height: 360px; - margin: 0 auto; - z-index: 1; - - i { - position: absolute; - display: inline-flex; - align-items: center; - justify-content: center; - border-radius: 50%; - background: $white; - z-index: 1; - transform: translate(-50%, -50%); - @include box-shadow($box-shadow); - transition: all .2s cubic-bezier(.25,.65,.9,.75); - - &.icon { - width: var(--icon-size); - height: var(--icon-size); - font-size: 1.7em; - } - - &.icon-sm { - width: var(--icon-sm-size); - height: var(--icon-sm-size); - font-size: 1.5em; - } - - &:nth-child(1) { - font-size: 42px; - color: theme-color("warning"); - z-index: 2; - } - } - - &:not(.on-screen) { - i { - transform: translate(-50%, -50%); - left: 50%; - top: 50%; - - &:not(:nth-child(1)) { - opacity: 0; - } - } - } - - &.on-screen { - - i { - opacity: 1; - - &:nth-child(1) { - left: 50%; - top: 50%; - font-size: 42px; - color: theme-color("warning"); - } - - &:nth-child(2) { - left: calc(50% + (var(--gutter) * 1.7)); - top: 50%; - } - - &:nth-child(3) { - left: calc(50% + var(--gutter)); - top: calc(50% + var(--gutter)); - } - - &:nth-child(4) { - left: calc(50% + var(--gutter)); - top: calc(50% - var(--gutter)); - } - - &:nth-child(5) { - left: calc(50% + (var(--gutter) * 4)); - top: 50%; - } - - &:nth-child(6) { - left: calc(50% + (var(--gutter) * 2.7)); - top: calc(50% + (var(--gutter) * 1.5)); - } - - &:nth-child(7) { - left: calc(50% + (var(--gutter) * 2.7)); - top: calc(50% - (var(--gutter) * 1.5)); - } - - &:nth-child(8) { - left: calc(50% - (var(--gutter) * 1.7)); - top: 50%; - } - - &:nth-child(9) { - left: calc(50% - var(--gutter)); - top: calc(50% + var(--gutter)); - } - - &:nth-child(10) { - left: calc(50% - var(--gutter)); - top: calc(50% - var(--gutter)); - } - - &:nth-child(11) { - left: calc(50% - (var(--gutter) * 4)); - top: 50%; - } - - &:nth-child(12) { - left: calc(50% - (var(--gutter) * 2.7)); - top: calc(50% + (var(--gutter) * 1.5)); - } - - &:nth-child(13) { - left: calc(50% - (var(--gutter) * 2.7)); - top: calc(50% - (var(--gutter) * 1.5)); - } - } - - } - } -} diff --git a/frontend/src/assets/scss/custom/_separator.scss b/frontend/src/assets/scss/custom/_separator.scss deleted file mode 100644 index b4df82a6c..000000000 --- a/frontend/src/assets/scss/custom/_separator.scss +++ /dev/null @@ -1,5 +0,0 @@ -// -// Separator -// - -@import "../core/separators/separator"; diff --git a/frontend/src/assets/scss/custom/_tables.scss b/frontend/src/assets/scss/custom/_tables.scss deleted file mode 100644 index be176ef0a..000000000 --- a/frontend/src/assets/scss/custom/_tables.scss +++ /dev/null @@ -1,5 +0,0 @@ -// -// Tables -// - -@import "../core/tables/table"; diff --git a/frontend/src/assets/scss/custom/_type.scss b/frontend/src/assets/scss/custom/_type.scss deleted file mode 100644 index 6be0c5a69..000000000 --- a/frontend/src/assets/scss/custom/_type.scss +++ /dev/null @@ -1,8 +0,0 @@ -// -// Typography -// - -@import "../core/type/type"; -@import "../core/type/heading"; -@import "../core/type/display"; -@import "../core/type/article"; diff --git a/frontend/src/assets/scss/custom/_utilities.scss b/frontend/src/assets/scss/custom/_utilities.scss deleted file mode 100644 index c73c09814..000000000 --- a/frontend/src/assets/scss/custom/_utilities.scss +++ /dev/null @@ -1,16 +0,0 @@ -// -// Utilities -// - -@import "../core/utilities/backgrounds"; -@import "../core/utilities/floating"; -@import "../core/utilities/helper"; -@import "../core/utilities/image"; -@import "../core/utilities/opacity"; -@import "../core/utilities/overflow"; -@import "../core/utilities/position"; -@import "../core/utilities/sizing"; -@import "../core/utilities/spacing"; -@import "../core/utilities/shadows"; -@import "../core/utilities/text"; -@import "../core/utilities/transform"; diff --git a/frontend/src/assets/scss/custom/_variables.scss b/frontend/src/assets/scss/custom/_variables.scss index 07cd1500e..8d698702c 100644 --- a/frontend/src/assets/scss/custom/_variables.scss +++ b/frontend/src/assets/scss/custom/_variables.scss @@ -1,643 +1,619 @@ - - - - - - - - - - - - - - - - - - - - - - - - - - - // // Variables // // Global settings - -$enable-caret: true !default; -$enable-rounded: true !default; -$enable-shadows: true !default; -$enable-gradients: false !default; -$enable-transitions: true !default; -$enable-grid-classes: true !default; -$enable-print-styles: true !default; +@import "gradido-custom/global"; +// $enable-caret: true !default; +// $enable-rounded: true !default; +// $enable-shadows: true !default; +// $enable-gradients: false !default; +// $enable-transitions: true !default; +// $enable-grid-classes: true !default; +// $enable-print-styles: true !default; // Color system - -$white: #fff !default; -$gray-100: #f6f9fc !default; -$gray-200: #e9ecef !default; -$gray-300: #dee2e6 !default; -$gray-400: #ced4da !default; -$gray-500: #adb5bd !default; -$gray-600: #8898aa !default; // Line footer color -$gray-700: #525f7f !default; // Line p color -$gray-800: #32325d !default; // Line heading color -$gray-900: #212529 !default; -$black: #000 !default; - -$grays: () !default; -$grays: map-merge(( - "100": $gray-100, - "200": $gray-200, - "300": $gray-300, - "400": $gray-400, - "500": $gray-500, - "600": $gray-600, - "700": $gray-700, - "800": $gray-800, - "900": $gray-900 -), $grays); - -$blue: #5e72e4 !default; -$indigo: #5603ad !default; -$purple: #8965e0 !default; -$pink: #f3a4b5 !default; -$red: #f5365c !default; -$orange: #fb6340 !default; -$yellow: #ffd600 !default; -$green: #2dce89 !default; -$teal: #11cdef !default; -$cyan: #2bffc6 !default; - -$colors: () !default; -$colors: map-merge(( - "blue": $blue, - "indigo": $indigo, - "purple": $purple, - "pink": $pink, - "red": $red, - "orange": $orange, - "yellow": $yellow, - "green": $green, - "teal": $teal, - "cyan": $cyan, - "white": $white, - "gray": $gray-600, - "light": $gray-400, - "lighter": $gray-200, - "gray-dark": $gray-800 -), $colors); - -$default: #172b4d !default; -$primary: #5e72e4 !default; -$secondary: #f7fafc !default; -$success: $green !default; -$info: $teal !default; -$warning: $orange !default; -$danger: $red !default; -$light: $gray-500 !default; -$dark: $gray-900 !default; -$darker: darken($gray-900, 15%) !default; - -$facebook: #3b5999 !default; -$twitter: #1da1f2 !default; -$google-plus: #dd4b39 !default; -$instagram: #e4405f !default; -$pinterest: #bd081c !default; -$youtube: #cd201f !default; -$slack: #3aaf85 !default; -$dribbble: #ea4c89 !default; -$github: #222222 !default; - -$theme-colors: () !default; -$theme-colors: map-merge(( - "default": $default, - "primary": $primary, - "secondary": $secondary, - "success": $success, - "info": $info, - "warning": $warning, - "danger": $danger, - "white": $white, - "neutral": $white, - "dark": $dark, - "darker": $darker -), $theme-colors); - -$brand-colors: () !default; -$brand-colors: map-merge(( - "facebook": $facebook, - "twitter": $twitter, - "google-plus": $google-plus, - "instagram": $instagram, - "pinterest": $pinterest, - "youtube": $youtube, - "slack": $slack, - "dribbble": $dribbble, - "github": $github -), $brand-colors); - -$shape-colors: () !default; -$shape-colors: map-merge(( - "default": #32325d, - "primary": #5533ff, - "secondary": #24b47e, - "neutral": #e9ecef, - "blue-gray": #b2cbe1, - -), $shape-colors); - -$shapes-primary-colors: () !default; -$shapes-primary-colors: map-merge(( - "step-1-gradient-bg": #281483, - "step-2-gradient-bg": #8f6ed5, - "step-3-gradient-bg": #d782d9, - "span-1-bg": #53f, - "span-2-bg": #4553ff, - "span-3-bg": #4f40ff, - "span-4-bg": #25ddf5, - "span-5-bg": #1fa2ff -), $shapes-primary-colors); - -$shapes-default-colors: () !default; -$shapes-default-colors: map-merge(( - "step-1-gradient-bg": #7795f8, - "step-2-gradient-bg": #6772e5, - "step-3-gradient-bg": #555abf, - "span-1-bg": #7795f8, - "span-2-bg": #7b9aff, - "span-3-bg": #6f8ff8, - "span-4-bg": #76eea7, - "span-5-bg": #6adaff -), $shapes-default-colors); - -$shapes-light-colors: () !default; -$shapes-light-colors: map-merge(( - "step-1-gradient-bg": #b2cbe1, - "step-2-gradient-bg": #f6f9fc, - "step-3-gradient-bg": #f6f9fc, - "span-1-bg": #b4cce1, - "span-2-bg": #c5dbef, - "span-3-bg": #b9d5ed, - "span-4-bg": #74e4a2, - "span-5-bg": #008169 -), $shapes-light-colors); - -$shapes-dark-colors: () !default; -$shapes-dark-colors: map-merge(( - "step-1-gradient-bg": #32325d, - "step-2-gradient-bg": #32325d, - "step-3-gradient-bg": #32325d, - "span-1-bg": #2e2e57, - "span-2-bg": #2b2b58, - "span-3-bg": #25254d, - "span-4-bg": #d782d9, - "span-5-bg": #008169 -), $shapes-dark-colors); - - -// Translucent color variations -$translucent-color-opacity: .6 !default; - -// Set a specific jump point for requesting color jumps -$theme-color-interval: 8% !default; - -// The yiq lightness value that determines when the lightness of color changes from "dark" to "light". Acceptable values are between 0 and 255. -$yiq-contrasted-threshold: 200 !default; - -// Customize the light and dark text colors for use in our YIQ color contrast function. -$yiq-text-dark: $gray-900 !default; -$yiq-text-light: $white !default; - -// Action colors - -$star-rating-color: $gray-400 !default; -$star-rating-color-active: $yellow !default; - -$favorite-color: $yellow !default; -$like-color: $blue !default; -$love-color: $red !default; - +@import "gradido-custom/color"; +// $white: #fff !default; +// $gray-100: #f6f9fc !default; +// $gray-200: #e9ecef !default; +// $gray-300: #dee2e6 !default; +// $gray-400: #ced4da !default; +// $gray-500: #adb5bd !default; +// $gray-600: #8898aa !default; // Line footer color +// $gray-700: #525f7f !default; // Line p color +// $gray-800: #32325d !default; // Line heading color +// $gray-900: #212529 !default; +// $black: #000 !default; +// +// $grays: () !default; +// $grays: map-merge(( +// "100": $gray-100, +// "200": $gray-200, +// "300": $gray-300, +// "400": $gray-400, +// "500": $gray-500, +// "600": $gray-600, +// "700": $gray-700, +// "800": $gray-800, +// "900": $gray-900 +// ), $grays); +// +// $blue: #5e72e4 !default; +// $indigo: #5603ad !default; +// $purple: #8965e0 !default; +// $pink: #f3a4b5 !default; +// $red: #f5365c !default; +// $orange: #fb6340 !default; +// $yellow: #ffd600 !default; +// $green: #2dce89 !default; +// $teal: #11cdef !default; +// $cyan: #2bffc6 !default; +// +// $colors: () !default; +// $colors: map-merge(( +// "blue": $blue, +// "indigo": $indigo, +// "purple": $purple, +// "pink": $pink, +// "red": $red, +// "orange": $orange, +// "yellow": $yellow, +// "green": $green, +// "teal": $teal, +// "cyan": $cyan, +// "white": $white, +// "gray": $gray-600, +// "light": $gray-400, +// "lighter": $gray-200, +// "gray-dark": $gray-800 +// ), $colors); +// +// $default: #172b4d !default; +// $primary: #5e72e4 !default; +// $secondary: #f7fafc !default; +// $success: $green !default; +// $info: $teal !default; +// $warning: $orange !default; +// $danger: $red !default; +// $light: $gray-500 !default; +// $dark: $gray-900 !default; +// $darker: darken($gray-900, 15%) !default; +// +// $facebook: #3b5999 !default; +// $twitter: #1da1f2 !default; +// $google-plus: #dd4b39 !default; +// $instagram: #e4405f !default; +// $pinterest: #bd081c !default; +// $youtube: #cd201f !default; +// $slack: #3aaf85 !default; +// $dribbble: #ea4c89 !default; +// $github: #222222 !default; +// +// $theme-colors: () !default; +// $theme-colors: map-merge(( +// "default": $default, +// "primary": $primary, +// "secondary": $secondary, +// "success": $success, +// "info": $info, +// "warning": $warning, +// "danger": $danger, +// "white": $white, +// "neutral": $white, +// "dark": $dark, +// "darker": $darker +// ), $theme-colors); +// +// $brand-colors: () !default; +// $brand-colors: map-merge(( +// "facebook": $facebook, +// "twitter": $twitter, +// "google-plus": $google-plus, +// "instagram": $instagram, +// "pinterest": $pinterest, +// "youtube": $youtube, +// "slack": $slack, +// "dribbble": $dribbble, +// "github": $github +// ), $brand-colors); +// +// $shape-colors: () !default; +// $shape-colors: map-merge(( +// "default": #32325d, +// "primary": #5533ff, +// "secondary": #24b47e, +// "neutral": #e9ecef, +// "blue-gray": #b2cbe1, +// +// ), $shape-colors); +// +// $shapes-primary-colors: () !default; +// $shapes-primary-colors: map-merge(( +// "step-1-gradient-bg": #281483, +// "step-2-gradient-bg": #8f6ed5, +// "step-3-gradient-bg": #d782d9, +// "span-1-bg": #53f, +// "span-2-bg": #4553ff, +// "span-3-bg": #4f40ff, +// "span-4-bg": #25ddf5, +// "span-5-bg": #1fa2ff +// ), $shapes-primary-colors); +// +// $shapes-default-colors: () !default; +// $shapes-default-colors: map-merge(( +// "step-1-gradient-bg": #7795f8, +// "step-2-gradient-bg": #6772e5, +// "step-3-gradient-bg": #555abf, +// "span-1-bg": #7795f8, +// "span-2-bg": #7b9aff, +// "span-3-bg": #6f8ff8, +// "span-4-bg": #76eea7, +// "span-5-bg": #6adaff +// ), $shapes-default-colors); +// +// $shapes-light-colors: () !default; +// $shapes-light-colors: map-merge(( +// "step-1-gradient-bg": #b2cbe1, +// "step-2-gradient-bg": #f6f9fc, +// "step-3-gradient-bg": #f6f9fc, +// "span-1-bg": #b4cce1, +// "span-2-bg": #c5dbef, +// "span-3-bg": #b9d5ed, +// "span-4-bg": #74e4a2, +// "span-5-bg": #008169 +// ), $shapes-light-colors); +// +// $shapes-dark-colors: () !default; +// $shapes-dark-colors: map-merge(( +// "step-1-gradient-bg": #32325d, +// "step-2-gradient-bg": #32325d, +// "step-3-gradient-bg": #32325d, +// "span-1-bg": #2e2e57, +// "span-2-bg": #2b2b58, +// "span-3-bg": #25254d, +// "span-4-bg": #d782d9, +// "span-5-bg": #008169 +// ), $shapes-dark-colors); +// +// +// // Translucent color variations +// $translucent-color-opacity: .6 !default; +// +// // Set a specific jump point for requesting color jumps +// $theme-color-interval: 8% !default; +// +// // The yiq lightness value that determines when the lightness of color changes from "dark" to "light". Acceptable values are between 0 and 255. +// $yiq-contrasted-threshold: 200 !default; +// +// // Customize the light and dark text colors for use in our YIQ color contrast function. +// $yiq-text-dark: $gray-900 !default; +// $yiq-text-light: $white !default; +// +// // Action colors +// +// $star-rating-color: $gray-400 !default; +// $star-rating-color-active: $yellow !default; +// +// $favorite-color: $yellow !default; +// $like-color: $blue !default; +// $love-color: $red !default; +// // Body +@import "gradido-custom/body"; - -$body-bg: #f8f9fe !default; -$body-color: $gray-700 !default; +// $body-bg: #f8f9fe !default; +// $body-color: $gray-700 !default; // Sections - -$section-colors: () !default; -$section-colors: map-merge(( - "primary": $body-bg, - "secondary": $secondary, - "light": $gray-400, - "dark": $dark, - "darker": $darker -), $section-colors); +@import "gradido-custom/sections"; +// $section-colors: () !default; +// $section-colors: map-merge(( +// "primary": $body-bg, +// "secondary": $secondary, +// "light": $gray-400, +// "dark": $dark, +// "darker": $darker +// ), $section-colors); // Links +@import "gradido-custom/links"; +// $link-color: $primary !default; +// $link-decoration: none !default; +// $link-hover-color: darken($link-color, 15%) !default; +// $link-hover-decoration: none !default; -$link-color: $primary !default; -$link-decoration: none !default; -$link-hover-color: darken($link-color, 15%) !default; -$link-hover-decoration: none !default; // Grid breakpoints - -$grid-breakpoints: ( - xs: 0, - sm: 576px, - md: 768px, - lg: 992px, - xl: 1200px -); - -@include _assert-ascending($grid-breakpoints, "$grid-breakpoints"); -@include _assert-starts-at-zero($grid-breakpoints); - - -// Grid containers -// -// Define the maximum width of `.container` for different screen sizes. +@import "gradido-custom/grid-breakpoint"; +// $grid-breakpoints: ( +// xs: 0, +// sm: 576px, +// md: 768px, +// lg: 992px, +// xl: 1200px +// ); +// +// @include _assert-ascending($grid-breakpoints, "$grid-breakpoints"); +// @include _assert-starts-at-zero($grid-breakpoints); +// +// +// // Grid containers +// // +// // Define the maximum width of `.container` for different screen sizes. // Spacing - -$spacer: 1rem !default; -$spacers: () !default; -$spacers: map-merge(( - -9: -($spacer * 10), - -8: -($spacer * 8), - -7: -($spacer * 6), - -6: -($spacer * 4.5), - -5: -($spacer * 3), - -4: -($spacer * 1.5), - -3: -$spacer, - -2: -($spacer * .5), - -1: -($spacer * .25), - 0: 0, - 1: ($spacer * .25), - 2: ($spacer * .5), - 3: $spacer, - 4: ($spacer * 1.5), - 5: ($spacer * 3), - 6: ($spacer * 4.5), - 7: ($spacer * 6), - 8: ($spacer * 8), - 9: ($spacer * 10) -), $spacers); - - -// This variable affects the `.h-*` and `.w-*` classes. - -$sizes: () !default; -$sizes: map-merge(( - 25: 25%, - 50: 50%, - 75: 75%, - 100: 100% -), $sizes); +@import "gradido-custom/spacing"; +// $spacer: 1rem !default; +// $spacers: () !default; +// $spacers: map-merge(( +// -9: -($spacer * 10), +// -8: -($spacer * 8), +// -7: -($spacer * 6), +// -6: -($spacer * 4.5), +// -5: -($spacer * 3), +// -4: -($spacer * 1.5), +// -3: -$spacer, +// -2: -($spacer * .5), +// -1: -($spacer * .25), +// 0: 0, +// 1: ($spacer * .25), +// 2: ($spacer * .5), +// 3: $spacer, +// 4: ($spacer * 1.5), +// 5: ($spacer * 3), +// 6: ($spacer * 4.5), +// 7: ($spacer * 6), +// 8: ($spacer * 8), +// 9: ($spacer * 10) +// ), $spacers); +// +// +// // This variable affects the `.h-*` and `.w-*` classes. +// +// $sizes: () !default; +// $sizes: map-merge(( +// 25: 25%, +// 50: 50%, +// 75: 75%, +// 100: 100% +// ), $sizes); // Components +@import "gradido-custom/components"; +// $shape-height-xl: 1.5 !default; +// $shape-height-lg: 1.5 !default; +// $shape-height-sm: 1.5 !default; +// +// $border-width: 1px !default; +// $border-color: $gray-200 !default; +// +// $border-radius: .375rem !default; +// $border-radius-xl: .5rem !default; +// $border-radius-lg: .4375rem !default; +// $border-radius-sm: .25rem !default; +// +// $box-shadow-sm: 0 0 .5rem rgba($gray-600, .075) !default; +// $box-shadow: 0 0 2rem 0 rgba($gray-600, .15) !default; +// $box-shadow-lg: 0 0 3rem rgba($gray-600, .175) !default; +// +// $component-active-color: $white !default; +// $component-active-bg: theme-color("primary") !default; +// $component-active-border-color: theme-color("primary") !default; +// +// $component-hover-color: $gray-300 !default; +// $component-hover-bg: $gray-300 !default; +// $component-hover-border-color: $gray-300 !default; +// +// $caret-width: .3em !default; -$shape-height-xl: 1.5 !default; -$shape-height-lg: 1.5 !default; -$shape-height-sm: 1.5 !default; - -$border-width: 1px !default; -$border-color: $gray-200 !default; - -$border-radius: .375rem !default; -$border-radius-xl: .5rem !default; -$border-radius-lg: .4375rem !default; -$border-radius-sm: .25rem !default; - -$box-shadow-sm: 0 0 .5rem rgba($gray-600, .075) !default; -$box-shadow: 0 0 2rem 0 rgba($gray-600, .15) !default; -$box-shadow-lg: 0 0 3rem rgba($gray-600, .175) !default; - -$component-active-color: $white !default; -$component-active-bg: theme-color("primary") !default; -$component-active-border-color: theme-color("primary") !default; - -$component-hover-color: $gray-300 !default; -$component-hover-bg: $gray-300 !default; -$component-hover-border-color: $gray-300 !default; - -$caret-width: .3em !default; - -$transition-base: all .15s ease !default; -$transition-fade: opacity .15s linear !default; -$transition-collapse: height .35s ease !default; +// $transition-base: all .15s ease !default; +// $transition-fade: opacity .15s linear !default; +// $transition-collapse: height .35s ease !default; // Fonts - -$font-family-sans-serif: Open Sans, sans-serif !default; -$font-family-base: $font-family-sans-serif !default; - -$font-size-base: 1rem !default; // Assumes the browser default, typically `16px` -$font-size-xl: ($font-size-base * 1.5); -$font-size-lg: ($font-size-base * 1.25); -$font-size-sm: ($font-size-base * .875); -$font-size-xs: ($font-size-base * .75); - -$font-weight-light: 300 !default; -$font-weight-normal: 400 !default; -$font-weight-bold: 600 !default; -$font-weight-extra-bold: 700 !default; - -$font-weight-base: $font-weight-normal !default; -$line-height-base: 1.5 !default; -$shape-height-base: 1.5 !default; - - -$h1-font-size: $font-size-base * 1.625 !default; -$h2-font-size: $font-size-base * 1.25 !default; -$h3-font-size: $font-size-base * 1.0625 !default; -$h4-font-size: $font-size-base * .9375 !default; -$h5-font-size: $font-size-base * .8125 !default; -$h6-font-size: $font-size-base * .625 !default; - - -$headings-margin-bottom: ($spacer / 2); -$headings-font-family: inherit !default; -$headings-font-weight: $font-weight-bold !default; -$headings-line-height: 1.5 !default; -$headings-color: $gray-800 !default; - -$heading-letter-spacing: .025em !default; -$heading-font-size: .95rem !default; -$heading-text-transform: uppercase !default; -$heading-font-weight: $headings-font-weight !default; - -$heading-title-letter-spacing: .025em !default; -$heading-title-font-size: 1.375rem !default; -$heading-title-font-weight: $font-weight-bold !default; -$heading-title-text-transform: uppercase !default; - -$heading-section-letter-spacing: .025em !default; -$heading-section-font-size: 1.375rem !default; -$heading-section-font-weight: $font-weight-bold !default; -$heading-section-text-transform: uppercase !default; - -$display1-size: 3.3rem !default; -$display2-size: 2.75rem !default; -$display3-size: 2.1875rem !default; -$display4-size: 1.6275rem !default; - -$display1-weight: $font-weight-bold !default; -$display2-weight: $font-weight-bold !default; -$display3-weight: $font-weight-bold !default; -$display4-weight: $font-weight-bold !default; -$display-line-height: $headings-line-height !default; - -$paragraph-font-size: 1rem !default; -$paragraph-font-weight: 300 !default; -$paragraph-line-height: 1.7 !default; - -$lead-font-size: ($paragraph-font-size * 1.25) !default; -$lead-font-weight: 300 !default; - -$small-font-size: 80% !default; - -$text-muted: $gray-600 !default; - -$blockquote-small-color: $gray-600 !default; -$blockquote-font-size: ($font-size-base * 1.25) !default; - -$hr-border-color: rgba($black, .1); -$hr-border-width: $border-width !default; - -$mark-padding: .2em !default; - -$dt-font-weight: $font-weight-bold !default; - -$list-inline-padding: .5rem !default; - -$mark-bg: #fcf8e3 !default; - -$hr-margin-y: $spacer * 2 !default; +@import "gradido-custom/fonts"; +// $font-family-sans-serif: Open Sans, sans-serif !default; +// $font-family-base: $font-family-sans-serif !default; +// +// $font-size-base: 1rem !default; // Assumes the browser default, typically `16px` +// $font-size-xl: ($font-size-base * 1.5); +// $font-size-lg: ($font-size-base * 1.25); +// $font-size-sm: ($font-size-base * .875); +// $font-size-xs: ($font-size-base * .75); +// +// $font-weight-light: 300 !default; +// $font-weight-normal: 400 !default; +// $font-weight-bold: 600 !default; +// $font-weight-extra-bold: 700 !default; +// +// $font-weight-base: $font-weight-normal !default; +// $line-height-base: 1.5 !default; +// $shape-height-base: 1.5 !default; +// +// +// $h1-font-size: $font-size-base * 1.625 !default; +// $h2-font-size: $font-size-base * 1.25 !default; +// $h3-font-size: $font-size-base * 1.0625 !default; +// $h4-font-size: $font-size-base * .9375 !default; +// $h5-font-size: $font-size-base * .8125 !default; +// $h6-font-size: $font-size-base * .625 !default; +// +// +// $headings-margin-bottom: ($spacer / 2); +// $headings-font-family: inherit !default; +// $headings-font-weight: $font-weight-bold !default; +// $headings-line-height: 1.5 !default; +// $headings-color: $gray-800 !default; +// +// $heading-letter-spacing: .025em !default; +// $heading-font-size: .95rem !default; +// $heading-text-transform: uppercase !default; +// $heading-font-weight: $headings-font-weight !default; +// +// $heading-title-letter-spacing: .025em !default; +// $heading-title-font-size: 1.375rem !default; +// $heading-title-font-weight: $font-weight-bold !default; +// $heading-title-text-transform: uppercase !default; +// +// $heading-section-letter-spacing: .025em !default; +// $heading-section-font-size: 1.375rem !default; +// $heading-section-font-weight: $font-weight-bold !default; +// $heading-section-text-transform: uppercase !default; +// +// $display1-size: 3.3rem !default; +// $display2-size: 2.75rem !default; +// $display3-size: 2.1875rem !default; +// $display4-size: 1.6275rem !default; +// +// $display1-weight: $font-weight-bold !default; +// $display2-weight: $font-weight-bold !default; +// $display3-weight: $font-weight-bold !default; +// $display4-weight: $font-weight-bold !default; +// $display-line-height: $headings-line-height !default; +// +// $paragraph-font-size: 1rem !default; +// $paragraph-font-weight: 300 !default; +// $paragraph-line-height: 1.7 !default; +// +// $lead-font-size: ($paragraph-font-size * 1.25) !default; +// $lead-font-weight: 300 !default; +// +// $small-font-size: 80% !default; +// +// $text-muted: $gray-600 !default; +// +// $blockquote-small-color: $gray-600 !default; +// $blockquote-font-size: ($font-size-base * 1.25) !default; +// +// $hr-border-color: rgba($black, .1); +// $hr-border-width: $border-width !default; +// +// $mark-padding: .2em !default; +// +// $dt-font-weight: $font-weight-bold !default; +// +// $list-inline-padding: .5rem !default; +// +// $mark-bg: #fcf8e3 !default; +// +// $hr-margin-y: $spacer * 2 !default; // Icons - -$icon-size: 3rem !default; -$icon-size-xl: 5rem !default; -$icon-size-lg: 4rem !default; -$icon-size-sm: 2rem !default; +@import "gradido-custom/icons"; +// $icon-size: 3rem !default; +// $icon-size-xl: 5rem !default; +// $icon-size-lg: 4rem !default; +// $icon-size-sm: 2rem !default; // Tables - -$table-cell-padding: 1rem !default; -$table-cell-padding-sm: .5rem !default; - -$table-bg: transparent !default; -$table-accent-bg: rgba($black, .05) !default; -$table-hover-bg: $gray-100 !default; -$table-active-bg: $table-hover-bg !default; - -$table-border-width: $border-width !default; -$table-border-color: $gray-200 !default; - -$table-head-bg: $gray-100 !default; -$table-head-color: $gray-600 !default; -$table-head-spacer-y: .75rem !default; - -$table-head-font-size: .65rem !default; -$table-head-font-weight: $font-weight-bold !default; -$table-head-text-transform: uppercase !default; -$table-head-letter-spacing: 1px !default; - -$table-body-font-size: .8125rem !default; - -$table-dark-bg: theme-color("default") !default; -$table-dark-accent-bg: rgba($white, .05) !default; -$table-dark-hover-bg: rgba($white, .075) !default; -$table-dark-border-color: lighten(theme-color("default"), 7%) !default; -$table-dark-color: $body-bg !default; - -$table-dark-head-bg: lighten(theme-color("default"), 4%) !default; -$table-dark-head-color: lighten(theme-color("default"), 35%) !default; +@import "gradido-custom/tables"; +// $table-cell-padding: 1rem !default; +// $table-cell-padding-sm: .5rem !default; +// +// $table-bg: transparent !default; +// $table-accent-bg: rgba($black, .05) !default; +// $table-hover-bg: $gray-100 !default; +// $table-active-bg: $table-hover-bg !default; +// +// $table-border-width: $border-width !default; +// $table-border-color: $gray-200 !default; +// +// $table-head-bg: $gray-100 !default; +// $table-head-color: $gray-600 !default; +// $table-head-spacer-y: .75rem !default; +// +// $table-head-font-size: .65rem !default; +// $table-head-font-weight: $font-weight-bold !default; +// $table-head-text-transform: uppercase !default; +// $table-head-letter-spacing: 1px !default; +// +// $table-body-font-size: .8125rem !default; +// +// $table-dark-bg: theme-color("default") !default; +// $table-dark-accent-bg: rgba($white, .05) !default; +// $table-dark-hover-bg: rgba($white, .075) !default; +// $table-dark-border-color: lighten(theme-color("default"), 7%) !default; +// $table-dark-color: $body-bg !default; +// +// $table-dark-head-bg: lighten(theme-color("default"), 4%) !default; +// $table-dark-head-color: lighten(theme-color("default"), 35%) !default; // Buttons + Forms +@import "gradido-custom/buttons-forms"; +// $input-btn-padding-y: .625rem !default; +// $input-btn-padding-x: .75rem !default; +// $input-btn-line-height: $shape-height-base !default; +// +// $input-btn-focus-width: 0 !default; +// $input-btn-focus-color: rgba($component-active-bg, 1) !default; +// $input-btn-focus-box-shadow: none !default; +// +// $input-btn-padding-y-sm: .25rem !default; +// $input-btn-padding-x-sm: .5rem !default; +// $input-btn-line-height-sm: $shape-height-sm !default; +// +// $input-btn-padding-y-lg: .875rem !default; +// $input-btn-padding-x-lg: 1rem !default; +// $input-btn-line-height-lg: $shape-height-lg !default; +// +// $input-btn-border-width: 1px !default; +// +// $input-btn-font-size-sm: .75rem !default; +// $input-btn-font-size: .875rem !default; +// $input-btn-font-size-lg: .875rem !default; -$input-btn-padding-y: .625rem !default; -$input-btn-padding-x: .75rem !default; -$input-btn-line-height: $shape-height-base !default; - -$input-btn-focus-width: 0 !default; -$input-btn-focus-color: rgba($component-active-bg, 1) !default; -$input-btn-focus-box-shadow: none !default; - -$input-btn-padding-y-sm: .25rem !default; -$input-btn-padding-x-sm: .5rem !default; -$input-btn-line-height-sm: $shape-height-sm !default; - -$input-btn-padding-y-lg: .875rem !default; -$input-btn-padding-x-lg: 1rem !default; -$input-btn-line-height-lg: $shape-height-lg !default; - -$input-btn-border-width: 1px !default; - -$input-btn-font-size-sm: .75rem !default; -$input-btn-font-size: .875rem !default; -$input-btn-font-size-lg: .875rem !default; // Buttons - -$btn-padding-y: $input-btn-padding-y !default; -$btn-padding-x: $input-btn-padding-x + 0.5 !default; -$btn-line-height: $input-btn-line-height !default; - -$btn-padding-y-sm: $input-btn-padding-y-sm !default; -$btn-padding-x-sm: $input-btn-padding-x-sm !default; -$btn-line-height-sm: $input-btn-line-height-sm !default; - -$btn-padding-y-lg: $input-btn-padding-y-lg !default; -$btn-padding-x-lg: $input-btn-padding-x-lg !default; -$btn-line-height-lg: $input-btn-line-height-lg !default; - -$btn-border-width: $input-btn-border-width !default; - -$btn-font-weight: 600 !default; - -$btn-text-transform: none !default; +@import "gradido-custom/buttons"; +// $btn-padding-y: $input-btn-padding-y !default; +// $btn-padding-x: $input-btn-padding-x + 0.5 !default; +// $btn-line-height: $input-btn-line-height !default; +// +// $btn-padding-y-sm: $input-btn-padding-y-sm !default; +// $btn-padding-x-sm: $input-btn-padding-x-sm !default; +// $btn-line-height-sm: $input-btn-line-height-sm !default; +// +// $btn-padding-y-lg: $input-btn-padding-y-lg !default; +// $btn-padding-x-lg: $input-btn-padding-x-lg !default; +// $btn-line-height-lg: $input-btn-line-height-lg !default; +// +// $btn-border-width: $input-btn-border-width !default; +// +// $btn-font-weight: 600 !default; +// +// $btn-text-transform: none !default; +// +// +// $btn-letter-spacing: .025em !default; +// $btn-box-shadow: 0 4px 6px rgba(50,50,93,.11), 0 1px 3px rgba(0,0,0,.08) !default; +// $btn-hover-box-shadow: 0 7px 14px rgba(50,50,93,.1), 0 3px 6px rgba(0,0,0,.08) !default; +// $btn-focus-box-shadow: $btn-hover-box-shadow !default; +// $btn-focus-width: $input-btn-focus-width !default; +// $btn-active-box-shadow: none !default; +// +// $btn-hover-translate-y: -1px !default; -$btn-letter-spacing: .025em !default; -$btn-box-shadow: 0 4px 6px rgba(50,50,93,.11), 0 1px 3px rgba(0,0,0,.08) !default; -$btn-hover-box-shadow: 0 7px 14px rgba(50,50,93,.1), 0 3px 6px rgba(0,0,0,.08) !default; -$btn-focus-box-shadow: $btn-hover-box-shadow !default; -$btn-focus-width: $input-btn-focus-width !default; -$btn-active-box-shadow: none !default; +// Input +@import "gradido-custom/input"; +// $input-padding-y: $input-btn-padding-y !default; +// $input-padding-x: $input-btn-padding-x !default; +// $input-line-height: $input-btn-line-height !default; +// +// $input-padding-y-sm: $input-btn-padding-y-sm !default; +// $input-padding-x-sm: $input-btn-padding-x-sm !default; +// $input-line-height-sm: $input-btn-line-height-sm !default; +// +// $input-padding-y-lg: $input-btn-padding-y-lg !default; +// $input-padding-x-lg: $input-btn-padding-x-lg !default; +// $input-line-height-lg: $input-btn-line-height-lg !default; +// +// $input-border-radius: $border-radius !default; +// $input-border-radius-xl: $border-radius-xl !default; +// $input-border-radius-lg: $border-radius-lg !default; +// $input-border-radius-sm: $border-radius-sm !default; +// +// $input-bg: $white !default; +// $input-disabled-bg: $gray-200 !default; +// +// $input-muted-bg: #F7FAFE !default; +// $input-focus-muted-bg: lighten($input-muted-bg, 1%) !default; -$btn-hover-translate-y: -1px !default; - -// Forms - -$input-padding-y: $input-btn-padding-y !default; -$input-padding-x: $input-btn-padding-x !default; -$input-line-height: $input-btn-line-height !default; - -$input-padding-y-sm: $input-btn-padding-y-sm !default; -$input-padding-x-sm: $input-btn-padding-x-sm !default; -$input-line-height-sm: $input-btn-line-height-sm !default; - -$input-padding-y-lg: $input-btn-padding-y-lg !default; -$input-padding-x-lg: $input-btn-padding-x-lg !default; -$input-line-height-lg: $input-btn-line-height-lg !default; - -$input-border-radius: $border-radius !default; -$input-border-radius-xl: $border-radius-xl !default; -$input-border-radius-lg: $border-radius-lg !default; -$input-border-radius-sm: $border-radius-sm !default; - -$input-bg: $white !default; -$input-disabled-bg: $gray-200 !default; - -$input-muted-bg: #F7FAFE !default; -$input-focus-muted-bg: lighten($input-muted-bg, 1%) !default; - -$input-alternative-box-shadow: 0 1px 3px rgba(50,50,93,.15), 0 1px 0 rgba(0,0,0,.02) !default; -$input-focus-alternative-box-shadow: 0 4px 6px rgba(50,50,93,.11),0 1px 3px rgba(0,0,0,.08) !default; - -$input-color: $gray-600 !default; -$input-border-color: #cad1d7 !default; -$input-border-width: $input-btn-border-width !default; -$input-box-shadow: none !default; // 0 1px 3px 0 $gray-400 !default; - -$input-focus-bg: $white !default; -$input-focus-border-color: rgba(50,151,211,.25) !default; -$input-focus-color: $input-color !default; -$input-focus-width: 0 !default; -$input-focus-box-shadow: none !default; //0 1px 3px 0 $gray-500 !default; - -$input-placeholder-color: $gray-500 !default; -$input-focus-placeholder-color: $gray-500 !default; - -$input-height-border: $input-border-width * 2 !default; - -$input-transition: all .2s cubic-bezier(0.68, -0.55, 0.265, 1.55) !default; +// $input-alternative-box-shadow: 0 1px 3px rgba(50,50,93,.15), 0 1px 0 rgba(0,0,0,.02) !default; +// $input-focus-alternative-box-shadow: 0 4px 6px rgba(50,50,93,.11),0 1px 3px rgba(0,0,0,.08) !default; +// +// $input-color: $gray-600 !default; +// $input-border-color: #cad1d7 !default; +// $input-border-width: $input-btn-border-width !default; +// $input-box-shadow: none !default; // 0 1px 3px 0 $gray-400 !default; +// +// $input-focus-bg: $white !default; +// $input-focus-border-color: rgba(50,151,211,.25) !default; +// $input-focus-color: $input-color !default; +// $input-focus-width: 0 !default; +// $input-focus-box-shadow: none !default; //0 1px 3px 0 $gray-500 !default; +// +// $input-placeholder-color: $gray-500 !default; +// $input-focus-placeholder-color: $gray-500 !default; +// +// $input-height-border: $input-border-width * 2 !default; +// +// $input-transition: all .2s cubic-bezier(0.68, -0.55, 0.265, 1.55) !default; // Input groups - -$input-group-addon-color: $input-placeholder-color !default; -$input-group-addon-bg: $input-bg !default; -$input-group-addon-border-color: $input-border-color !default; - -$input-group-addon-focus-color: $input-focus-color !default; -$input-group-addon-focus-bg: $input-focus-bg !default; -$input-group-addon-focus-border-color: $input-focus-border-color !default; +@import "gradido-custom/input-groups"; +// $input-group-addon-color: $input-placeholder-color !default; +// $input-group-addon-bg: $input-bg !default; +// $input-group-addon-border-color: $input-border-color !default; +// +// $input-group-addon-focus-color: $input-focus-color !default; +// $input-group-addon-focus-bg: $input-focus-bg !default; +// $input-group-addon-focus-border-color: $input-focus-border-color !default; // Form group - -$form-group-margin-bottom: 1.5rem !default; +@import "gradido-custom/form-groups"; +// $form-group-margin-bottom: 1.5rem !default; // Custom forms - -$custom-control-gutter: 1.75rem !default; -$custom-control-spacer-x: 1rem !default; -$custom-control-indicator-size: 1.25rem !default; - -$custom-control-indicator-bg: $input-bg !default; -$custom-control-indicator-border-width: 1px !default; -$custom-control-indicator-border-color: $input-border-color !default; -$custom-control-indicator-box-shadow: none !default; - -$custom-control-indicator-focus-box-shadow: $custom-control-indicator-box-shadow !default; - -$custom-control-indicator-hover-color: $component-hover-color !default; -$custom-control-indicator-hover-bg: $component-hover-bg !default; -$custom-control-indicator-hover-border-color: $component-hover-border-color !default; - -$custom-control-indicator-active-color: $component-active-color !default; -$custom-control-indicator-active-bg: $component-active-bg !default; -$custom-control-indicator-active-border-color: $component-active-border-color !default; -$custom-control-indicator-active-box-shadow: $custom-control-indicator-box-shadow !default; - -$custom-control-indicator-checked-color: $component-active-color !default; -$custom-control-indicator-checked-bg: $component-active-bg !default; -$custom-control-indicator-checked-border-color: $component-active-border-color !default; -$custom-control-indicator-checked-box-shadow: $custom-control-indicator-box-shadow !default; -$custom-control-indicator-checked-disabled-bg: rgba(theme-color("primary"), .5) !default; - -$custom-control-indicator-disabled-bg: $gray-200 !default; -$custom-control-label-disabled-color: $gray-600 !default; - -$custom-checkbox-indicator-border-radius: $border-radius-sm !default; -//$custom-checkbox-indicator-icon-checked: str-replace(url("data:image/svg+xml !default;charset=utf8,%3Csvg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 8 8'%3E%3Cpath fill='%23fff' d='M6.564.75l-3.59 3.612-1.538-1.55L0 4.26 2.974 7.25 8 2.193z'/%3E%3C/svg%3E"), "#", "%23") !default; +@import "gradido-custom/custom-forms"; +// custom-control-gutter: 1.75rem !default; +// custom-control-spacer-x: 1rem !default; +// custom-control-indicator-size: 1.25rem !default; +// +// custom-control-indicator-bg: $input-bg !default; +// custom-control-indicator-border-width: 1px !default; +// custom-control-indicator-border-color: $input-border-color !default; +// custom-control-indicator-box-shadow: none !default; +// +// custom-control-indicator-focus-box-shadow: $custom-control-indicator-box-shadow !default; +// +// custom-control-indicator-hover-color: $component-hover-color !default; +// custom-control-indicator-hover-bg: $component-hover-bg !default; +// custom-control-indicator-hover-border-color: $component-hover-border-color !default; +// +// custom-control-indicator-active-color: $component-active-color !default; +// custom-control-indicator-active-bg: $component-active-bg !default; +// custom-control-indicator-active-border-color: $component-active-border-color !default; +// custom-control-indicator-active-box-shadow: $custom-control-indicator-box-shadow !default; +// +// custom-control-indicator-checked-color: $component-active-color !default; +// custom-control-indicator-checked-bg: $component-active-bg !default; +// custom-control-indicator-checked-border-color: $component-active-border-color !default; +// custom-control-indicator-checked-box-shadow: $custom-control-indicator-box-shadow !default; +// custom-control-indicator-checked-disabled-bg: rgba(theme-color("primary"), .5) !default; +// +// custom-control-indicator-disabled-bg: $gray-200 !default; +// custom-control-label-disabled-color: $gray-600 !default; +// +// custom-checkbox-indicator-border-radius: $border-radius-sm !default; +// //$custom-checkbox-indicator-icon-checked: str-replace(url("data:image/svg+xml !default;charset=utf8,%3Csvg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 8 8'%3E%3Cpath fill='%23fff' d='M6.564.75l-3.59 3.612-1.538-1.55L0 4.26 2.974 7.25 8 2.193z'/%3E%3C/svg%3E"), "#", "%23") !default; // Custom toggle - -$custom-toggle-width: 50px !default; -$custom-toggle-slider-bg: $gray-200 !default; -$custom-toggle-checked-bg: theme-color("primary") !default; +@import "gradido-custom/custom-toogle"; +// $custom-toggle-width: 50px !default; +// $custom-toggle-slider-bg: $gray-200 !default; +// $custom-toggle-checked-bg: theme-color("primary") !default; // Form validation - -$form-feedback-valid-bg: lighten($success, 15%) !default; -$form-feedback-valid-color: theme-color("success") !default; -$form-feedback-invalid-bg: lighten($warning, 15%) !default; -$form-feedback-invalid-color: theme-color("warning") !default; +@import "gradido-custom/form-validation"; +// $form-feedback-valid-bg: lighten($success, 15%) !default; +// $form-feedback-valid-color: theme-color("success") !default; +// $form-feedback-invalid-bg: lighten($warning, 15%) !default; +// $form-feedback-invalid-color: theme-color("warning") !default; // Allows for customizing button radius independently from global border radius @@ -648,361 +624,364 @@ $btn-border-radius-lg: $input-border-radius-lg !default; $btn-border-radius-sm: $input-border-radius !default; - -$chart-height: 350px !default; -$chart-height-sm: 230px !default; - -$chart-legend-margin-top: 2.5rem !default; -$chart-legend-font-size: $font-size-sm !default; -$chart-legend-color: $text-muted !default; -$chart-legend-height: $chart-legend-margin-top + $chart-legend-font-size * $line-height-base !default; +// Chart +@import "gradido-custom/chart"; +// $chart-height: 350px !default; +// $chart-height-sm: 230px !default; +// +// $chart-legend-margin-top: 2.5rem !default; +// $chart-legend-font-size: $font-size-sm !default; +// $chart-legend-color: $text-muted !default; +// $chart-legend-height: $chart-legend-margin-top + $chart-legend-font-size * $line-height-base !default; // Map -$map-height: 500px !default; +@import "gradido-custom/map"; +// $map-height: 500px !default; // No UI Slider - -$noui-target-bg: #eceeef !default; -$noui-target-thickness: 5px !default; -$noui-target-border-radius: 5px !default; -$noui-target-border-color: 0 !default; -$noui-target-box-shadow: inset 0 1px 2px rgba(90,97,105,.1) !default; - -$noui-slider-connect-bg: $primary !default; -$noui-slider-connect-disabled-bg: #b2b2b2 !default; - -$noui-handle-width: 15px !default; -$noui-handle-bg: theme-color("primary") !default; -$noui-handle-border: 0 !default; -$noui-handle-border-radius: 100% !default; - -$noui-origin-border-radius: 2px !default; +@import "gradido-custom/nouislider"; +// $noui-target-bg: #eceeef !default; +// $noui-target-thickness: 5px !default; +// $noui-target-border-radius: 5px !default; +// $noui-target-border-color: 0 !default; +// $noui-target-box-shadow: inset 0 1px 2px rgba(90,97,105,.1) !default; +// +// $noui-slider-connect-bg: $primary !default; +// $noui-slider-connect-disabled-bg: #b2b2b2 !default; +// +// $noui-handle-width: 15px !default; +// $noui-handle-bg: theme-color("primary") !default; +// $noui-handle-border: 0 !default; +// $noui-handle-border-radius: 100% !default; +// +// $noui-origin-border-radius: 2px !default; // Dropdown - -$dropdown-bg: $white !default; -$dropdown-border-width: 0 !default; -$dropdown-border-color: rgba($black, .15) !default; -$dropdown-border-radius: $border-radius-lg !default; -$dropdown-box-shadow: 0 50px 100px rgba(50, 50, 93, .1), 0 15px 35px rgba(50, 50, 93, .15), 0 5px 15px rgba(0, 0, 0, .1) !default; +@import "gradido-custom/dropdown"; +// $dropdown-bg: $white !default; +// $dropdown-border-width: 0 !default; +// $dropdown-border-color: rgba($black, .15) !default; +// $dropdown-border-radius: $border-radius-lg !default; +// $dropdown-box-shadow: 0 50px 100px rgba(50, 50, 93, .1), 0 15px 35px rgba(50, 50, 93, .15), 0 5px 15px rgba(0, 0, 0, .1) !default; // Navs - -$nav-link-padding-y: .25rem !default; -$nav-link-padding-x: .75rem !default; -$nav-link-color: $gray-700 !default; -$nav-link-hover-color: theme-color("primary") !default; -$nav-link-disabled-color: $gray-600 !default; - -$nav-pills-padding-y: .75rem !default; -$nav-pills-padding-x: 1rem !default; - -$nav-pills-space-x: 1rem !default; - -$nav-pills-bg: $white !default; -$nav-pills-border-width: 1px !default; -$nav-pills-border-color: theme-color("primary") !default; -$nav-pills-border-radius: $border-radius !default; - -$nav-pills-link-color: theme-color("primary") !default; -$nav-pills-link-hover-color: darken(theme-color("primary"), 5%) !default; -$nav-pills-link-active-color: color-yiq(theme-color("primary")) !default; -$nav-pills-link-active-bg: theme-color("primary") !default; -$nav-pills-box-shadow: $btn-box-shadow !default; +@import "gradido-custom/navs"; +// $nav-link-padding-y: .25rem !default; +// $nav-link-padding-x: .75rem !default; +// $nav-link-color: $gray-700 !default; +// $nav-link-hover-color: theme-color("primary") !default; +// $nav-link-disabled-color: $gray-600 !default; +// +// $nav-pills-padding-y: .75rem !default; +// $nav-pills-padding-x: 1rem !default; +// +// $nav-pills-space-x: 1rem !default; +// +// $nav-pills-bg: $white !default; +// $nav-pills-border-width: 1px !default; +// $nav-pills-border-color: theme-color("primary") !default; +// $nav-pills-border-radius: $border-radius !default; +// +// $nav-pills-link-color: theme-color("primary") !default; +// $nav-pills-link-hover-color: darken(theme-color("primary"), 5%) !default; +// $nav-pills-link-active-color: color-yiq(theme-color("primary")) !default; +// $nav-pills-link-active-bg: theme-color("primary") !default; +// $nav-pills-box-shadow: $btn-box-shadow !default; // Navbar - -$navbar-transition: all .15s linear !default; -$navbar-padding-y: 1rem !default; -$navbar-padding-x: 1rem !default; - -$navbar-nav-link-padding-x: 1rem !default; -$navbar-nav-link-padding-y: 1rem !default; - -$navbar-nav-link-font-size: .9rem !default; -$navbar-nav-link-font-weight: 400 !default; -$navbar-nav-link-text-transform: normal !default; -$navbar-nav-link-letter-spacing: 0 !default; -$navbar-nav-link-border-radius: $border-radius !default; - -$navbar-search-width: 270px !default; -$navbar-search-bg: transparent !default; - -$navbar-search-border-radius: 2rem !default; -$navbar-search-border-width: 2px !default; - -$navbar-dark-bg: transparent !default; -$navbar-dark-hover-bg: rgba(255, 255, 255, .1) !default; -$navbar-dark-active-bg: rgba(255, 255, 255, .1) !default; -$navbar-dark-color: rgba($white, .95) !default; -$navbar-dark-hover-color: rgba($white, .65) !default; -$navbar-dark-active-color: rgba($white, .65) !default; -$navbar-dark-disabled-color: rgba($white, .25) !default; -$navbar-dark-toggler-border-color: transparent !default; - -$navbar-search-dark-border-color: rgba(255, 255, 255, .6) !default; -$navbar-search-dark-color: rgba(255, 255, 255, .6) !default; -$navbar-search-dark-focus-border-color: rgba(255, 255, 255, .9) !default; -$navbar-search-dark-focus-color: rgba(255, 255, 255, .9) !default; - -$navbar-light-bg: transparent !default; -$navbar-light-hover-bg: rgba(0, 0, 0, .1) !default; -$navbar-light-active-bg: rgba(0, 0, 0, .1) !default; -$navbar-light-border-color: $gray-100 !default; -$navbar-light-color: rgba($black, .5) !default; -$navbar-light-hover-color: rgba($black, .7) !default; -$navbar-light-active-color: rgba($black, .9) !default; -$navbar-light-disabled-color: rgba($black, .3) !default; -$navbar-light-toggler-border-color: transparent !default; - -$navbar-search-light-border-color: rgba(0, 0, 0, .6) !default; -$navbar-search-light-color: rgba(0, 0, 0, .6) !default; -$navbar-search-light-focus-border-color: rgba(0, 0, 0, .9) !default; -$navbar-search-light-focus-color: rgba(0, 0, 0, .9) !default; +@import "gradido-custom/navbar"; +// $navbar-transition: all .15s linear !default; +// $navbar-padding-y: 1rem !default; +// $navbar-padding-x: 1rem !default; +// +// $navbar-nav-link-padding-x: 1rem !default; +// $navbar-nav-link-padding-y: 1rem !default; +// +// $navbar-nav-link-font-size: .9rem !default; +// $navbar-nav-link-font-weight: 400 !default; +// $navbar-nav-link-text-transform: normal !default; +// $navbar-nav-link-letter-spacing: 0 !default; +// $navbar-nav-link-border-radius: $border-radius !default; +// +// $navbar-search-width: 270px !default; +// $navbar-search-bg: transparent !default; +// +// $navbar-search-border-radius: 2rem !default; +// $navbar-search-border-width: 2px !default; +// +// $navbar-dark-bg: transparent !default; +// $navbar-dark-hover-bg: rgba(255, 255, 255, .1) !default; +// $navbar-dark-active-bg: rgba(255, 255, 255, .1) !default; +// $navbar-dark-color: rgba($white, .95) !default; +// $navbar-dark-hover-color: rgba($white, .65) !default; +// $navbar-dark-active-color: rgba($white, .65) !default; +// $navbar-dark-disabled-color: rgba($white, .25) !default; +// $navbar-dark-toggler-border-color: transparent !default; +// +// $navbar-search-dark-border-color: rgba(255, 255, 255, .6) !default; +// $navbar-search-dark-color: rgba(255, 255, 255, .6) !default; +// $navbar-search-dark-focus-border-color: rgba(255, 255, 255, .9) !default; +// $navbar-search-dark-focus-color: rgba(255, 255, 255, .9) !default; +// +// $navbar-light-bg: transparent !default; +// $navbar-light-hover-bg: rgba(0, 0, 0, .1) !default; +// $navbar-light-active-bg: rgba(0, 0, 0, .1) !default; +// $navbar-light-border-color: $gray-100 !default; +// $navbar-light-color: rgba($black, .5) !default; +// $navbar-light-hover-color: rgba($black, .7) !default; +// $navbar-light-active-color: rgba($black, .9) !default; +// $navbar-light-disabled-color: rgba($black, .3) !default; +// $navbar-light-toggler-border-color: transparent !default; +// +// $navbar-search-light-border-color: rgba(0, 0, 0, .6) !default; +// $navbar-search-light-color: rgba(0, 0, 0, .6) !default; +// $navbar-search-light-focus-border-color: rgba(0, 0, 0, .9) !default; +// $navbar-search-light-focus-color: rgba(0, 0, 0, .9) !default; // Vertical navbar -$navbar-vertical-box-shadow: 0 0 2rem 0 rgba(136, 152, 170, .15) !important; -$navbar-vertical-width: 250px !default; -$navbar-vertical-padding-x: 1.5rem !default; -$navbar-vertical-nav-link-padding-x: 1.5rem !default; -$navbar-vertical-nav-link-padding-y: .65rem !default; - -$navbar-icon-min-width: 2.25rem !default; - -$navbar-breadcrumb-padding-y: $nav-link-padding-y !default; -$navbar-breadcrumb-padding-x: 0 !default; - -$navbar-light-bg: $white !default; -$navbar-light-border-color: $border-color !default; +@import "gradido-custom/vertical-navbar"; +// $navbar-vertical-box-shadow: 0 0 2rem 0 rgba(136, 152, 170, .15) !important; +// $navbar-vertical-width: 250px !default; +// $navbar-vertical-padding-x: 1.5rem !default; +// $navbar-vertical-nav-link-padding-x: 1.5rem !default; +// $navbar-vertical-nav-link-padding-y: .65rem !default; +// +// $navbar-icon-min-width: 2.25rem !default; +// +// $navbar-breadcrumb-padding-y: $nav-link-padding-y !default; +// $navbar-breadcrumb-padding-x: 0 !default; +// +// $navbar-light-bg: $white !default; +// $navbar-light-border-color: $border-color !default; // Main content - -$main-content-padding-y: 40px !default; -$main-content-padding-x: 24px !default; // in px to combine with $grid-gutter-width +@import "gradido-custom/main-content"; +// $main-content-padding-y: 40px !default; +// $main-content-padding-x: 24px !default; // in px to combine with $grid-gutter-width // Alerts - -$alert-padding-y: 1rem !default; -$alert-padding-x: 1.5rem !default; -$alert-border-radius: $border-radius !default; - -$alert-bg-level: -2 !default; -$alert-border-level: -2 !default; -$alert-color-level: 0 !default; +@import "gradido-custom/alerts"; +// $alert-padding-y: 1rem !default; +// $alert-padding-x: 1.5rem !default; +// $alert-border-radius: $border-radius !default; +// +// $alert-bg-level: -2 !default; +// $alert-border-level: -2 !default; +// $alert-color-level: 0 !default; // List group - -$list-group-bg: $white !default; -$list-group-border-color: $border-color !default; //rgba($black, .125); -$list-group-border-width: $border-width !default; -$list-group-border-radius: $border-radius !default; - -$list-group-item-padding-y: 1rem !default; -$list-group-item-padding-x: 1rem !default; - -$list-group-hover-bg: $gray-100 !default; -$list-group-active-color: $component-active-color !default; -$list-group-active-bg: $component-active-bg !default; -$list-group-active-border-color: $list-group-active-bg !default; - -$list-group-disabled-color: $gray-600 !default; -$list-group-disabled-bg: $list-group-bg !default; - -$list-group-action-color: $gray-700 !default; -$list-group-action-hover-color: $list-group-action-color !default; - -$list-group-action-active-color: $list-group-action-color !default; -$list-group-action-active-bg: $gray-200 !default; +@import "gradido-custom/list-group"; +// $list-group-bg: $white !default; +// $list-group-border-color: $border-color !default; //rgba($black, .125); +// $list-group-border-width: $border-width !default; +// $list-group-border-radius: $border-radius !default; +// +// $list-group-item-padding-y: 1rem !default; +// $list-group-item-padding-x: 1rem !default; +// +// $list-group-hover-bg: $gray-100 !default; +// $list-group-active-color: $component-active-color !default; +// $list-group-active-bg: $component-active-bg !default; +// $list-group-active-border-color: $list-group-active-bg !default; +// +// $list-group-disabled-color: $gray-600 !default; +// $list-group-disabled-bg: $list-group-bg !default; +// +// $list-group-action-color: $gray-700 !default; +// $list-group-action-hover-color: $list-group-action-color !default; +// +// $list-group-action-active-color: $list-group-action-color !default; +// $list-group-action-active-bg: $gray-200 !default; // Close - -$close-font-size: $font-size-base * 1.5 !default; -$close-font-weight: $font-weight-bold !default; -$close-bg: transparent !default; -$close-hover-bg: transparent !default; -$close-color: rgba(0, 0, 0, .6) !default !default; -$close-hover-color: rgba(0, 0, 0, .9) !default; -$close-text-shadow: none !default; +@import "gradido-custom/close"; +// $close-font-size: $font-size-base * 1.5 !default; +// $close-font-weight: $font-weight-bold !default; +// $close-bg: transparent !default; +// $close-hover-bg: transparent !default; +// $close-color: rgba(0, 0, 0, .6) !default !default; +// $close-hover-color: rgba(0, 0, 0, .9) !default; +// $close-text-shadow: none !default; // Popovers - -$popover-font-size: $font-size-sm !default; -$popover-bg: $white !default; -$popover-max-width: 276px !default; -$popover-border-width: 1px !default; -$popover-border-color: rgba($black, .05) !default; -$popover-border-radius: $border-radius-lg !default; -$popover-box-shadow: 0px .5rem 2rem 0px rgba($black, .2) !default; - -$popover-header-bg: $popover-bg !default; -$popover-header-color: $headings-color !default; -$popover-header-padding-y: .5rem !default; -$popover-header-padding-x: .95rem !default; - -$popover-body-color: $body-color !default; -$popover-body-padding-y: $popover-header-padding-y !default; -$popover-body-padding-x: $popover-header-padding-x !default; - -$popover-arrow-width: 1.5rem !default; -$popover-arrow-height: .75rem !default; -$popover-arrow-color: $popover-bg !default; - -$popover-arrow-outer-color: transparent !default; +@import "gradido-custom/popovers"; +// $popover-font-size: $font-size-sm !default; +// $popover-bg: $white !default; +// $popover-max-width: 276px !default; +// $popover-border-width: 1px !default; +// $popover-border-color: rgba($black, .05) !default; +// $popover-border-radius: $border-radius-lg !default; +// $popover-box-shadow: 0px .5rem 2rem 0px rgba($black, .2) !default; +// +// $popover-header-bg: $popover-bg !default; +// $popover-header-color: $headings-color !default; +// $popover-header-padding-y: .5rem !default; +// $popover-header-padding-x: .95rem !default; +// +// $popover-body-color: $body-color !default; +// $popover-body-padding-y: $popover-header-padding-y !default; +// $popover-body-padding-x: $popover-header-padding-x !default; +// +// $popover-arrow-width: 1.5rem !default; +// $popover-arrow-height: .75rem !default; +// $popover-arrow-color: $popover-bg !default; +// +// $popover-arrow-outer-color: transparent !default; // Badges - -$badge-font-size: 66% !default; -$badge-font-weight: $font-weight-bold !default; -$badge-padding-y: .35rem !default; -$badge-padding-x: .375rem !default; -$badge-border-radius: $border-radius !default; -$badge-text-transfom: uppercase; - -$badge-pill-padding-x: .875em !default; -$badge-pill-border-radius: 10rem !default; - -$badge-circle-size: 2rem !default; +@import "gradido-custom/badges"; +// $badge-font-size: 66% !default; +// $badge-font-weight: $font-weight-bold !default; +// $badge-padding-y: .35rem !default; +// $badge-padding-x: .375rem !default; +// $badge-border-radius: $border-radius !default; +// $badge-text-transfom: uppercase; +// +// $badge-pill-padding-x: .875em !default; +// $badge-pill-border-radius: 10rem !default; +// +// $badge-circle-size: 2rem !default; // Pagination - -// $pagination-padding-y: .5rem !default; -// $pagination-padding-x: .75rem !default; -// $pagination-padding-y-sm: .25rem !default; -// $pagination-padding-x-sm: .5rem !default; -// $pagination-padding-y-lg: .75rem !default; -// $pagination-padding-x-lg: 1.5rem !default; -// $pagination-line-height: 1.25 !default; - -$pagination-color: $gray-600 !default; -$pagination-bg: $white !default; -$pagination-border-width: $border-width !default; -$pagination-border-color: $gray-300 !default; - -//$pagination-focus-box-shadow: $btn-hover-box-shadow !default; - -$pagination-hover-color: $gray-600 !default; -$pagination-hover-bg: $gray-300 !default; -$pagination-hover-border-color: $gray-300 !default; - -$pagination-active-color: $component-active-color !default; -$pagination-active-bg: $component-active-bg !default; -$pagination-active-border-color: $pagination-active-bg !default; -$pagination-active-box-shadow: $btn-hover-box-shadow !default; - -$pagination-disabled-color: $gray-600 !default; -$pagination-disabled-bg: $white !default; -$pagination-disabled-border-color: $gray-300 !default; +@import "gradido-custom/pagination"; +// // $pagination-padding-y: .5rem !default; +// // $pagination-padding-x: .75rem !default; +// // $pagination-padding-y-sm: .25rem !default; +// // $pagination-padding-x-sm: .5rem !default; +// // $pagination-padding-y-lg: .75rem !default; +// // $pagination-padding-x-lg: 1.5rem !default; +// // $pagination-line-height: 1.25 !default; +// +// $pagination-color: $gray-600 !default; +// $pagination-bg: $white !default; +// $pagination-border-width: $border-width !default; +// $pagination-border-color: $gray-300 !default; +// +// //$pagination-focus-box-shadow: $btn-hover-box-shadow !default; +// +// $pagination-hover-color: $gray-600 !default; +// $pagination-hover-bg: $gray-300 !default; +// $pagination-hover-border-color: $gray-300 !default; +// +// $pagination-active-color: $component-active-color !default; +// $pagination-active-bg: $component-active-bg !default; +// $pagination-active-border-color: $pagination-active-bg !default; +// $pagination-active-box-shadow: $btn-hover-box-shadow !default; +// +// $pagination-disabled-color: $gray-600 !default; +// $pagination-disabled-bg: $white !default; +// $pagination-disabled-border-color: $gray-300 !default; // Cards - -$card-spacer-y: 1.25rem !default; -$card-spacer-x: 1.5rem !default; -$card-border-width: $border-width !default; -$card-border-radius: $border-radius !default; -$card-border-color: rgba($black, .05) !default; -$card-inner-border-radius: calc(#{$card-border-radius} - #{$card-border-width}) !default; -$card-cap-bg: $white !default; -$card-bg: $white !default; - -$card-img-overlay-padding: 1.25rem !default; - -//$card-group-margin: ($grid-gutter-width / 2); -//$card-deck-margin: $card-group-margin !default; - -$card-columns-count: 3 !default; -$card-columns-gap: 1.25rem !default; -$card-columns-margin: $card-spacer-y !default; +@import "gradido-custom/cards"; +// $card-spacer-y: 1.25rem !default; +// $card-spacer-x: 1.5rem !default; +// $card-border-width: $border-width !default; +// $card-border-radius: $border-radius !default; +// $card-border-color: rgba($black, .05) !default; +// $card-inner-border-radius: calc(#{$card-border-radius} - #{$card-border-width}) !default; +// $card-cap-bg: $white !default; +// $card-bg: $white !default; +// +// $card-img-overlay-padding: 1.25rem !default; +// +// //$card-group-margin: ($grid-gutter-width / 2); +// //$card-deck-margin: $card-group-margin !default; +// +// $card-columns-count: 3 !default; +// $card-columns-gap: 1.25rem !default; +// $card-columns-margin: $card-spacer-y !default; // Tooltips - -$tooltip-font-size: $font-size-sm !default; +// @import "tooltips"; +// $tooltip-font-size: $font-size-sm !default; // Modals - -$modal-inner-padding: 1.5rem !default; - -$modal-lg: 800px !default; -$modal-md: 500px !default; -$modal-sm: 380px !default; - -$modal-title-line-height: 1.1; - -$modal-content-bg: $white !default; -$modal-content-border-color: rgba($black, .2) !default; -$modal-content-border-width: 0 !default; -$modal-content-border-radius: $border-radius-lg !default; -$modal-content-box-shadow-xs: 0 15px 35px rgba(50,50,93,.2), 0 5px 15px rgba(0,0,0,.17); -$modal-content-box-shadow-sm-up: 0 15px 35px rgba(50,50,93,.2), 0 5px 15px rgba(0,0,0,.17); - -$modal-backdrop-bg: $black !default; -$modal-backdrop-opacity: .16 !default; -$modal-header-border-color: $gray-200 !default; -$modal-footer-border-color: $modal-header-border-color !default; -$modal-header-border-width: $modal-content-border-width !default; -$modal-footer-border-width: $modal-header-border-width !default; -$modal-header-padding: 1.25rem !default; +@import "gradido-custom/modals"; +// $modal-inner-padding: 1.5rem !default; +// +// $modal-lg: 800px !default; +// $modal-md: 500px !default; +// $modal-sm: 380px !default; +// +// $modal-title-line-height: 1.1; +// +// $modal-content-bg: $white !default; +// $modal-content-border-color: rgba($black, .2) !default; +// $modal-content-border-width: 0 !default; +// $modal-content-border-radius: $border-radius-lg !default; +// $modal-content-box-shadow-xs: 0 15px 35px rgba(50,50,93,.2), 0 5px 15px rgba(0,0,0,.17); +// $modal-content-box-shadow-sm-up: 0 15px 35px rgba(50,50,93,.2), 0 5px 15px rgba(0,0,0,.17); +// +// $modal-backdrop-bg: $black !default; +// $modal-backdrop-opacity: .16 !default; +// $modal-header-border-color: $gray-200 !default; +// $modal-footer-border-color: $modal-header-border-color !default; +// $modal-header-border-width: $modal-content-border-width !default; +// $modal-footer-border-width: $modal-header-border-width !default; +// $modal-header-padding: 1.25rem !default; // Datepicker - -$datepicker-border-radius: $card-border-radius !default; -$datepicker-dropdown-padding: 20px 22px !default; - -$datepicker-cell-transition: $transition-base !default; -$datepicker-cell-hover-background: lighten($gray-400, 55%); -$datepicker-cell-border-radius: 50% !default; -$datepicker-cell-width: 36px !default; -$datepicker-cell-height: 36px !default; - -$datepicker-disabled-cell-color: $gray-300 !default; -$datepicker-disabled-old-new-color: $gray-500 !default; - -$datepicker-header-cell-border-radius: $border-radius !default; - -$datepicker-active-color: $white !default; -$datepicker-active-background: theme-color("primary") !default; -$datepicker-active-box-shadow: none !default; - -$datepicker-range-background: theme-color("primary") !default; -$datepicker-range-cell-focused-background: darken($datepicker-range-background, 5%); -$datepicker-range-color: $white !default; -$datepicker-range-highlighted-bg: $gray-200 !default; - -$datepicker-dropdown-border: lighten($gray-400, 40%); -$datepicker-dropdown-bg: $white !default; -$datepicker-highlighted-bg: $datepicker-active-background !default; +@import "gradido-custom/datepicker"; +// $datepicker-border-radius: $card-border-radius !default; +// $datepicker-dropdown-padding: 20px 22px !default; +// +// $datepicker-cell-transition: $transition-base !default; +// $datepicker-cell-hover-background: lighten($gray-400, 55%); +// $datepicker-cell-border-radius: 50% !default; +// $datepicker-cell-width: 36px !default; +// $datepicker-cell-height: 36px !default; +// +// $datepicker-disabled-cell-color: $gray-300 !default; +// $datepicker-disabled-old-new-color: $gray-500 !default; +// +// $datepicker-header-cell-border-radius: $border-radius !default; +// +// $datepicker-active-color: $white !default; +// $datepicker-active-background: theme-color("primary") !default; +// $datepicker-active-box-shadow: none !default; +// +// $datepicker-range-background: theme-color("primary") !default; +// $datepicker-range-cell-focused-background: darken($datepicker-range-background, 5%); +// $datepicker-range-color: $white !default; +// $datepicker-range-highlighted-bg: $gray-200 !default; +// +// $datepicker-dropdown-border: lighten($gray-400, 40%); +// $datepicker-dropdown-bg: $white !default; +// $datepicker-highlighted-bg: $datepicker-active-background !default; // Footer +@import "gradido-custom/footer"; - -$footer-padding-y: 2.5rem; -$footer-padding-x: 0; - - -$footer-link-font-size: .85rem !default; -$footer-bg: theme-color("secondary") !default; -$footer-color: $gray-600 !default; -$footer-link-color: $gray-600 !default; -$footer-link-hover-color: $gray-700 !default; -$footer-heading-color: $gray-600 !default; -$footer-heading-font-size: $font-size-sm !default; +// $footer-padding-y: 2.5rem; +// $footer-padding-x: 0; +// +// +// $footer-link-font-size: .85rem !default; +// $footer-bg: theme-color("secondary") !default; +// $footer-color: $gray-600 !default; +// $footer-link-color: $gray-600 !default; +// $footer-link-hover-color: $gray-700 !default; +// $footer-heading-color: $gray-600 !default; +// $footer-heading-font-size: $font-size-sm !default; // Import Bootstrap variable defaults diff --git a/frontend/src/assets/scss/custom/_vendors.scss b/frontend/src/assets/scss/custom/_vendors.scss deleted file mode 100644 index 3060e4a02..000000000 --- a/frontend/src/assets/scss/custom/_vendors.scss +++ /dev/null @@ -1,9 +0,0 @@ -// -// Vendors -// include plugin styles -// - - -@import "../core/vendors/flatpickr"; -@import "../core/vendors/nouislider"; -@import "../core/vendors/scrollbar"; diff --git a/frontend/src/assets/scss/custom/gradido-custom/_alerts.scss b/frontend/src/assets/scss/custom/gradido-custom/_alerts.scss new file mode 100644 index 000000000..ce2659c33 --- /dev/null +++ b/frontend/src/assets/scss/custom/gradido-custom/_alerts.scss @@ -0,0 +1,10 @@ +// Alerts + +$alert-padding-y: 1rem !default; +$alert-padding-x: 1.5rem !default; +$alert-border-radius: $border-radius !default; + +$alert-bg-level: -2 !default; +$alert-border-level: -2 !default; +$alert-color-level: 0 !default; + diff --git a/frontend/src/assets/scss/custom/gradido-custom/_badges.scss b/frontend/src/assets/scss/custom/gradido-custom/_badges.scss new file mode 100644 index 000000000..6c2f64fb1 --- /dev/null +++ b/frontend/src/assets/scss/custom/gradido-custom/_badges.scss @@ -0,0 +1,14 @@ + +// Badges + +$badge-font-size: 66% !default; +$badge-font-weight: $font-weight-bold !default; +$badge-padding-y: .35rem !default; +$badge-padding-x: .375rem !default; +$badge-border-radius: $border-radius !default; +$badge-text-transfom: uppercase; + +$badge-pill-padding-x: .875em !default; +$badge-pill-border-radius: 10rem !default; + +$badge-circle-size: 2rem !default; diff --git a/frontend/src/assets/scss/custom/gradido-custom/_body.scss b/frontend/src/assets/scss/custom/gradido-custom/_body.scss new file mode 100644 index 000000000..02f0f4e52 --- /dev/null +++ b/frontend/src/assets/scss/custom/gradido-custom/_body.scss @@ -0,0 +1,5 @@ +// Body + + +$body-bg: #f8f9fe !default; +$body-color: $gray-700 !default; diff --git a/frontend/src/assets/scss/custom/gradido-custom/_buttons-forms.scss b/frontend/src/assets/scss/custom/gradido-custom/_buttons-forms.scss new file mode 100644 index 000000000..5b33bdbfb --- /dev/null +++ b/frontend/src/assets/scss/custom/gradido-custom/_buttons-forms.scss @@ -0,0 +1,23 @@ +// Buttons + Forms + +$input-btn-padding-y: .625rem !default; +$input-btn-padding-x: .75rem !default; +$input-btn-line-height: $shape-height-base !default; + +$input-btn-focus-width: 0 !default; +$input-btn-focus-color: rgba($component-active-bg, 1) !default; +$input-btn-focus-box-shadow: none !default; + +$input-btn-padding-y-sm: .25rem !default; +$input-btn-padding-x-sm: .5rem !default; +$input-btn-line-height-sm: $shape-height-sm !default; + +$input-btn-padding-y-lg: .875rem !default; +$input-btn-padding-x-lg: 1rem !default; +$input-btn-line-height-lg: $shape-height-lg !default; + +$input-btn-border-width: 1px !default; + +$input-btn-font-size-sm: .75rem !default; +$input-btn-font-size: .875rem !default; +$input-btn-font-size-lg: .875rem !default; diff --git a/frontend/src/assets/scss/custom/gradido-custom/_buttons.scss b/frontend/src/assets/scss/custom/gradido-custom/_buttons.scss new file mode 100644 index 000000000..e8514f83d --- /dev/null +++ b/frontend/src/assets/scss/custom/gradido-custom/_buttons.scss @@ -0,0 +1,29 @@ +// Buttons + +$btn-padding-y: $input-btn-padding-y !default; +$btn-padding-x: $input-btn-padding-x + 0.5 !default; +$btn-line-height: $input-btn-line-height !default; + +$btn-padding-y-sm: $input-btn-padding-y-sm !default; +$btn-padding-x-sm: $input-btn-padding-x-sm !default; +$btn-line-height-sm: $input-btn-line-height-sm !default; + +$btn-padding-y-lg: $input-btn-padding-y-lg !default; +$btn-padding-x-lg: $input-btn-padding-x-lg !default; +$btn-line-height-lg: $input-btn-line-height-lg !default; + +$btn-border-width: $input-btn-border-width !default; + +$btn-font-weight: 600 !default; + +$btn-text-transform: none !default; + + +$btn-letter-spacing: .025em !default; +$btn-box-shadow: 0 4px 6px rgba(50,50,93,.11), 0 1px 3px rgba(0,0,0,.08) !default; +$btn-hover-box-shadow: 0 7px 14px rgba(50,50,93,.1), 0 3px 6px rgba(0,0,0,.08) !default; +$btn-focus-box-shadow: $btn-hover-box-shadow !default; +$btn-focus-width: $input-btn-focus-width !default; +$btn-active-box-shadow: none !default; + +$btn-hover-translate-y: -1px !default; diff --git a/frontend/src/assets/scss/custom/gradido-custom/_cards.scss b/frontend/src/assets/scss/custom/gradido-custom/_cards.scss new file mode 100644 index 000000000..566031a26 --- /dev/null +++ b/frontend/src/assets/scss/custom/gradido-custom/_cards.scss @@ -0,0 +1,19 @@ +// Cards + +$card-spacer-y: 1.25rem !default; +$card-spacer-x: 1.5rem !default; +$card-border-width: $border-width !default; +$card-border-radius: $border-radius !default; +$card-border-color: rgba($black, .05) !default; +$card-inner-border-radius: calc(#{$card-border-radius} - #{$card-border-width}) !default; +$card-cap-bg: $white !default; +$card-bg: $white !default; + +$card-img-overlay-padding: 1.25rem !default; + +//$card-group-margin: ($grid-gutter-width / 2); +//$card-deck-margin: $card-group-margin !default; + +$card-columns-count: 3 !default; +$card-columns-gap: 1.25rem !default; +$card-columns-margin: $card-spacer-y !default; diff --git a/frontend/src/assets/scss/custom/gradido-custom/_chart.scss b/frontend/src/assets/scss/custom/gradido-custom/_chart.scss new file mode 100644 index 000000000..0b497e283 --- /dev/null +++ b/frontend/src/assets/scss/custom/gradido-custom/_chart.scss @@ -0,0 +1,9 @@ +// Chart + +$chart-height: 350px !default; +$chart-height-sm: 230px !default; + +$chart-legend-margin-top: 2.5rem !default; +$chart-legend-font-size: $font-size-sm !default; +$chart-legend-color: $text-muted !default; +$chart-legend-height: $chart-legend-margin-top + $chart-legend-font-size * $line-height-base !default; diff --git a/frontend/src/assets/scss/custom/gradido-custom/_close.scss b/frontend/src/assets/scss/custom/gradido-custom/_close.scss new file mode 100644 index 000000000..41870d798 --- /dev/null +++ b/frontend/src/assets/scss/custom/gradido-custom/_close.scss @@ -0,0 +1,9 @@ +// Close + +$close-font-size: $font-size-base * 1.5 !default; +$close-font-weight: $font-weight-bold !default; +$close-bg: transparent !default; +$close-hover-bg: transparent !default; +$close-color: rgba(0, 0, 0, .6) !default !default; +$close-hover-color: rgba(0, 0, 0, .9) !default; +$close-text-shadow: none !default; \ No newline at end of file diff --git a/frontend/src/assets/scss/custom/gradido-custom/_color.scss b/frontend/src/assets/scss/custom/gradido-custom/_color.scss new file mode 100644 index 000000000..b9749091a --- /dev/null +++ b/frontend/src/assets/scss/custom/gradido-custom/_color.scss @@ -0,0 +1,188 @@ + + +// Color system + +$white: #fff !default; +$gray-100: #f6f9fc !default; +$gray-200: #e9ecef !default; +$gray-300: #dee2e6 !default; +$gray-400: #ced4da !default; +$gray-500: #adb5bd !default; +$gray-600: #8898aa !default; // Line footer color +$gray-700: #525f7f !default; // Line p color +$gray-800: #32325d !default; // Line heading color +$gray-900: #212529 !default; +$black: #000 !default; + +$grays: () !default; +$grays: map-merge(( + "100": $gray-100, + "200": $gray-200, + "300": $gray-300, + "400": $gray-400, + "500": $gray-500, + "600": $gray-600, + "700": $gray-700, + "800": $gray-800, + "900": $gray-900 +), $grays); + +$blue: #5e72e4 !default; +$indigo: #5603ad !default; +$purple: #8965e0 !default; +$pink: #f3a4b5 !default; +$red: #f5365c !default; +$orange: #fb6340 !default; +$yellow: #ffd600 !default; +$green: #2dce89 !default; +$teal: #11cdef !default; +$cyan: #2bffc6 !default; + +$colors: () !default; +$colors: map-merge(( + "blue": $blue, + "indigo": $indigo, + "purple": $purple, + "pink": $pink, + "red": $red, + "orange": $orange, + "yellow": $yellow, + "green": $green, + "teal": $teal, + "cyan": $cyan, + "white": $white, + "gray": $gray-600, + "light": $gray-400, + "lighter": $gray-200, + "gray-dark": $gray-800 +), $colors); + +$default: #172b4d !default; +$primary: #5e72e4 !default; +$secondary: #f7fafc !default; +$success: $green !default; +$info: $teal !default; +$warning: $orange !default; +$danger: $red !default; +$light: $gray-500 !default; +$dark: $gray-900 !default; +$darker: darken($gray-900, 15%) !default; + +$facebook: #3b5999 !default; +$twitter: #1da1f2 !default; +$google-plus: #dd4b39 !default; +$instagram: #e4405f !default; +$pinterest: #bd081c !default; +$youtube: #cd201f !default; +$slack: #3aaf85 !default; +$dribbble: #ea4c89 !default; +$github: #222222 !default; + +$theme-colors: () !default; +$theme-colors: map-merge(( + "default": $default, + "primary": $primary, + "secondary": $secondary, + "success": $success, + "info": $info, + "warning": $warning, + "danger": $danger, + "white": $white, + "neutral": $white, + "dark": $dark, + "darker": $darker +), $theme-colors); + +$brand-colors: () !default; +$brand-colors: map-merge(( + "facebook": $facebook, + "twitter": $twitter, + "google-plus": $google-plus, + "instagram": $instagram, + "pinterest": $pinterest, + "youtube": $youtube, + "slack": $slack, + "dribbble": $dribbble, + "github": $github +), $brand-colors); + +$shape-colors: () !default; +$shape-colors: map-merge(( + "default": #32325d, + "primary": #5533ff, + "secondary": #24b47e, + "neutral": #e9ecef, + "blue-gray": #b2cbe1, + +), $shape-colors); + +$shapes-primary-colors: () !default; +$shapes-primary-colors: map-merge(( + "step-1-gradient-bg": #281483, + "step-2-gradient-bg": #8f6ed5, + "step-3-gradient-bg": #d782d9, + "span-1-bg": #53f, + "span-2-bg": #4553ff, + "span-3-bg": #4f40ff, + "span-4-bg": #25ddf5, + "span-5-bg": #1fa2ff +), $shapes-primary-colors); + +$shapes-default-colors: () !default; +$shapes-default-colors: map-merge(( + "step-1-gradient-bg": #7795f8, + "step-2-gradient-bg": #6772e5, + "step-3-gradient-bg": #555abf, + "span-1-bg": #7795f8, + "span-2-bg": #7b9aff, + "span-3-bg": #6f8ff8, + "span-4-bg": #76eea7, + "span-5-bg": #6adaff +), $shapes-default-colors); + +$shapes-light-colors: () !default; +$shapes-light-colors: map-merge(( + "step-1-gradient-bg": #b2cbe1, + "step-2-gradient-bg": #f6f9fc, + "step-3-gradient-bg": #f6f9fc, + "span-1-bg": #b4cce1, + "span-2-bg": #c5dbef, + "span-3-bg": #b9d5ed, + "span-4-bg": #74e4a2, + "span-5-bg": #008169 +), $shapes-light-colors); + +$shapes-dark-colors: () !default; +$shapes-dark-colors: map-merge(( + "step-1-gradient-bg": #32325d, + "step-2-gradient-bg": #32325d, + "step-3-gradient-bg": #32325d, + "span-1-bg": #2e2e57, + "span-2-bg": #2b2b58, + "span-3-bg": #25254d, + "span-4-bg": #d782d9, + "span-5-bg": #008169 +), $shapes-dark-colors); + + +// Translucent color variations +$translucent-color-opacity: .6 !default; + +// Set a specific jump point for requesting color jumps +$theme-color-interval: 8% !default; + +// The yiq lightness value that determines when the lightness of color changes from "dark" to "light". Acceptable values are between 0 and 255. +$yiq-contrasted-threshold: 200 !default; + +// Customize the light and dark text colors for use in our YIQ color contrast function. +$yiq-text-dark: $gray-900 !default; +$yiq-text-light: $white !default; + +// Action colors + +$star-rating-color: $gray-400 !default; +$star-rating-color-active: $yellow !default; + +$favorite-color: $yellow !default; +$like-color: $blue !default; +$love-color: $red !default; diff --git a/frontend/src/assets/scss/custom/gradido-custom/_components.scss b/frontend/src/assets/scss/custom/gradido-custom/_components.scss new file mode 100644 index 000000000..a670f3bcf --- /dev/null +++ b/frontend/src/assets/scss/custom/gradido-custom/_components.scss @@ -0,0 +1,31 @@ +// Components + +$shape-height-xl: 1.5 !default; +$shape-height-lg: 1.5 !default; +$shape-height-sm: 1.5 !default; + +$border-width: 1px !default; +$border-color: $gray-200 !default; + +$border-radius: .375rem !default; +$border-radius-xl: .5rem !default; +$border-radius-lg: .4375rem !default; +$border-radius-sm: .25rem !default; + +$box-shadow-sm: 0 0 .5rem rgba($gray-600, .075) !default; +$box-shadow: 0 0 2rem 0 rgba($gray-600, .15) !default; +$box-shadow-lg: 0 0 3rem rgba($gray-600, .175) !default; + +$component-active-color: $white !default; +$component-active-bg: theme-color("primary") !default; +$component-active-border-color: theme-color("primary") !default; + +$component-hover-color: $gray-300 !default; +$component-hover-bg: $gray-300 !default; +$component-hover-border-color: $gray-300 !default; + +$caret-width: .3em !default; + +$transition-base: all .15s ease !default; +$transition-fade: opacity .15s linear !default; +$transition-collapse: height .35s ease !default; diff --git a/frontend/src/assets/scss/custom/gradido-custom/_custom-forms.scss b/frontend/src/assets/scss/custom/gradido-custom/_custom-forms.scss new file mode 100644 index 000000000..4c9fb9ff5 --- /dev/null +++ b/frontend/src/assets/scss/custom/gradido-custom/_custom-forms.scss @@ -0,0 +1,33 @@ +// Custom forms + +$custom-control-gutter: 1.75rem !default; +$custom-control-spacer-x: 1rem !default; +$custom-control-indicator-size: 1.25rem !default; + +$custom-control-indicator-bg: $input-bg !default; +$custom-control-indicator-border-width: 1px !default; +$custom-control-indicator-border-color: $input-border-color !default; +$custom-control-indicator-box-shadow: none !default; + +$custom-control-indicator-focus-box-shadow: $custom-control-indicator-box-shadow !default; + +$custom-control-indicator-hover-color: $component-hover-color !default; +$custom-control-indicator-hover-bg: $component-hover-bg !default; +$custom-control-indicator-hover-border-color: $component-hover-border-color !default; + +$custom-control-indicator-active-color: $component-active-color !default; +$custom-control-indicator-active-bg: $component-active-bg !default; +$custom-control-indicator-active-border-color: $component-active-border-color !default; +$custom-control-indicator-active-box-shadow: $custom-control-indicator-box-shadow !default; + +$custom-control-indicator-checked-color: $component-active-color !default; +$custom-control-indicator-checked-bg: $component-active-bg !default; +$custom-control-indicator-checked-border-color: $component-active-border-color !default; +$custom-control-indicator-checked-box-shadow: $custom-control-indicator-box-shadow !default; +$custom-control-indicator-checked-disabled-bg: rgba(theme-color("primary"), .5) !default; + +$custom-control-indicator-disabled-bg: $gray-200 !default; +$custom-control-label-disabled-color: $gray-600 !default; + +$custom-checkbox-indicator-border-radius: $border-radius-sm !default; +//$custom-checkbox-indicator-icon-checked: str-replace(url("data:image/svg+xml !default;charset=utf8,%3Csvg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 8 8'%3E%3Cpath fill='%23fff' d='M6.564.75l-3.59 3.612-1.538-1.55L0 4.26 2.974 7.25 8 2.193z'/%3E%3C/svg%3E"), "#", "%23") !default; diff --git a/frontend/src/assets/scss/custom/gradido-custom/_custom-toogle.scss b/frontend/src/assets/scss/custom/gradido-custom/_custom-toogle.scss new file mode 100644 index 000000000..578e2e4e0 --- /dev/null +++ b/frontend/src/assets/scss/custom/gradido-custom/_custom-toogle.scss @@ -0,0 +1,5 @@ +// Custom toggle + +$custom-toggle-width: 50px !default; +$custom-toggle-slider-bg: $gray-200 !default; +$custom-toggle-checked-bg: theme-color("primary") !default; diff --git a/frontend/src/assets/scss/custom/gradido-custom/_datepicker.scss b/frontend/src/assets/scss/custom/gradido-custom/_datepicker.scss new file mode 100644 index 000000000..e4662636d --- /dev/null +++ b/frontend/src/assets/scss/custom/gradido-custom/_datepicker.scss @@ -0,0 +1,28 @@ +// Datepicker + +$datepicker-border-radius: $card-border-radius !default; +$datepicker-dropdown-padding: 20px 22px !default; + +$datepicker-cell-transition: $transition-base !default; +$datepicker-cell-hover-background: lighten($gray-400, 55%); +$datepicker-cell-border-radius: 50% !default; +$datepicker-cell-width: 36px !default; +$datepicker-cell-height: 36px !default; + +$datepicker-disabled-cell-color: $gray-300 !default; +$datepicker-disabled-old-new-color: $gray-500 !default; + +$datepicker-header-cell-border-radius: $border-radius !default; + +$datepicker-active-color: $white !default; +$datepicker-active-background: theme-color("primary") !default; +$datepicker-active-box-shadow: none !default; + +$datepicker-range-background: theme-color("primary") !default; +$datepicker-range-cell-focused-background: darken($datepicker-range-background, 5%); +$datepicker-range-color: $white !default; +$datepicker-range-highlighted-bg: $gray-200 !default; + +$datepicker-dropdown-border: lighten($gray-400, 40%); +$datepicker-dropdown-bg: $white !default; +$datepicker-highlighted-bg: $datepicker-active-background !default; diff --git a/frontend/src/assets/scss/custom/gradido-custom/_dropdown.scss b/frontend/src/assets/scss/custom/gradido-custom/_dropdown.scss new file mode 100644 index 000000000..f26ac8c00 --- /dev/null +++ b/frontend/src/assets/scss/custom/gradido-custom/_dropdown.scss @@ -0,0 +1,7 @@ +// Dropdown + +$dropdown-bg: $white !default; +$dropdown-border-width: 0 !default; +$dropdown-border-color: rgba($black, .15) !default; +$dropdown-border-radius: $border-radius-lg !default; +$dropdown-box-shadow: 0 50px 100px rgba(50, 50, 93, .1), 0 15px 35px rgba(50, 50, 93, .15), 0 5px 15px rgba(0, 0, 0, .1) !default; diff --git a/frontend/src/assets/scss/custom/gradido-custom/_fonts.scss b/frontend/src/assets/scss/custom/gradido-custom/_fonts.scss new file mode 100644 index 000000000..b9c2bf82a --- /dev/null +++ b/frontend/src/assets/scss/custom/gradido-custom/_fonts.scss @@ -0,0 +1,88 @@ + +// Fonts + +$font-family-sans-serif: Open Sans, sans-serif !default; +$font-family-base: $font-family-sans-serif !default; + +$font-size-base: 1rem !default; // Assumes the browser default, typically `16px` +$font-size-xl: ($font-size-base * 1.5); +$font-size-lg: ($font-size-base * 1.25); +$font-size-sm: ($font-size-base * .875); +$font-size-xs: ($font-size-base * .75); + +$font-weight-light: 300 !default; +$font-weight-normal: 400 !default; +$font-weight-bold: 600 !default; +$font-weight-extra-bold: 700 !default; + +$font-weight-base: $font-weight-normal !default; +$line-height-base: 1.5 !default; +$shape-height-base: 1.5 !default; + + +$h1-font-size: $font-size-base * 1.625 !default; +$h2-font-size: $font-size-base * 1.25 !default; +$h3-font-size: $font-size-base * 1.0625 !default; +$h4-font-size: $font-size-base * .9375 !default; +$h5-font-size: $font-size-base * .8125 !default; +$h6-font-size: $font-size-base * .625 !default; + + +$headings-margin-bottom: ($spacer / 2); +$headings-font-family: inherit !default; +$headings-font-weight: $font-weight-bold !default; +$headings-line-height: 1.5 !default; +$headings-color: $gray-800 !default; + +$heading-letter-spacing: .025em !default; +$heading-font-size: .95rem !default; +$heading-text-transform: uppercase !default; +$heading-font-weight: $headings-font-weight !default; + +$heading-title-letter-spacing: .025em !default; +$heading-title-font-size: 1.375rem !default; +$heading-title-font-weight: $font-weight-bold !default; +$heading-title-text-transform: uppercase !default; + +$heading-section-letter-spacing: .025em !default; +$heading-section-font-size: 1.375rem !default; +$heading-section-font-weight: $font-weight-bold !default; +$heading-section-text-transform: uppercase !default; + +$display1-size: 3.3rem !default; +$display2-size: 2.75rem !default; +$display3-size: 2.1875rem !default; +$display4-size: 1.6275rem !default; + +$display1-weight: $font-weight-bold !default; +$display2-weight: $font-weight-bold !default; +$display3-weight: $font-weight-bold !default; +$display4-weight: $font-weight-bold !default; +$display-line-height: $headings-line-height !default; + +$paragraph-font-size: 1rem !default; +$paragraph-font-weight: 300 !default; +$paragraph-line-height: 1.7 !default; + +$lead-font-size: ($paragraph-font-size * 1.25) !default; +$lead-font-weight: 300 !default; + +$small-font-size: 80% !default; + +$text-muted: $gray-600 !default; + +$blockquote-small-color: $gray-600 !default; +$blockquote-font-size: ($font-size-base * 1.25) !default; + +$hr-border-color: rgba($black, .1); +$hr-border-width: $border-width !default; + +$mark-padding: .2em !default; + +$dt-font-weight: $font-weight-bold !default; + +$list-inline-padding: .5rem !default; + +$mark-bg: #fcf8e3 !default; + +$hr-margin-y: $spacer * 2 !default; diff --git a/frontend/src/assets/scss/custom/gradido-custom/_footer.scss b/frontend/src/assets/scss/custom/gradido-custom/_footer.scss new file mode 100644 index 000000000..50bc8fecb --- /dev/null +++ b/frontend/src/assets/scss/custom/gradido-custom/_footer.scss @@ -0,0 +1,13 @@ +// Footer + +$footer-padding-y: 2.5rem; +$footer-padding-x: 0; + + +$footer-link-font-size: .85rem !default; +$footer-bg: theme-color("secondary") !default; +$footer-color: $gray-600 !default; +$footer-link-color: $gray-600 !default; +$footer-link-hover-color: $gray-700 !default; +$footer-heading-color: $gray-600 !default; +$footer-heading-font-size: $font-size-sm !default; \ No newline at end of file diff --git a/frontend/src/assets/scss/custom/gradido-custom/_form-groups.scss b/frontend/src/assets/scss/custom/gradido-custom/_form-groups.scss new file mode 100644 index 000000000..88bbfef4a --- /dev/null +++ b/frontend/src/assets/scss/custom/gradido-custom/_form-groups.scss @@ -0,0 +1,3 @@ +// Form group + +$form-group-margin-bottom: 1.5rem !default; diff --git a/frontend/src/assets/scss/custom/gradido-custom/_form-validation.scss b/frontend/src/assets/scss/custom/gradido-custom/_form-validation.scss new file mode 100644 index 000000000..644b49b9f --- /dev/null +++ b/frontend/src/assets/scss/custom/gradido-custom/_form-validation.scss @@ -0,0 +1,6 @@ +// Form validation + +$form-feedback-valid-bg: lighten($success, 15%) !default; +$form-feedback-valid-color: theme-color("success") !default; +$form-feedback-invalid-bg: lighten($warning, 15%) !default; +$form-feedback-invalid-color: theme-color("warning") !default; diff --git a/frontend/src/assets/scss/custom/gradido-custom/_forms.scss b/frontend/src/assets/scss/custom/gradido-custom/_forms.scss new file mode 100644 index 000000000..e69de29bb diff --git a/frontend/src/assets/scss/custom/gradido-custom/_global.scss b/frontend/src/assets/scss/custom/gradido-custom/_global.scss new file mode 100644 index 000000000..14961b56a --- /dev/null +++ b/frontend/src/assets/scss/custom/gradido-custom/_global.scss @@ -0,0 +1,11 @@ + +// Global settings + +$enable-caret: true !default; +$enable-rounded: true !default; +$enable-shadows: true !default; +$enable-gradients: false !default; +$enable-transitions: true !default; +$enable-grid-classes: true !default; +$enable-print-styles: true !default; + diff --git a/frontend/src/assets/scss/custom/gradido-custom/_grid-breakpoint.scss b/frontend/src/assets/scss/custom/gradido-custom/_grid-breakpoint.scss new file mode 100644 index 000000000..499e672a5 --- /dev/null +++ b/frontend/src/assets/scss/custom/gradido-custom/_grid-breakpoint.scss @@ -0,0 +1,17 @@ +// Grid breakpoints + +$grid-breakpoints: ( + xs: 0, + sm: 576px, + md: 768px, + lg: 992px, + xl: 1200px +); + +@include _assert-ascending($grid-breakpoints, "$grid-breakpoints"); +@include _assert-starts-at-zero($grid-breakpoints); + + +// Grid containers +// +// Define the maximum width of `.container` for different screen sizes. diff --git a/frontend/src/assets/scss/custom/gradido-custom/_icons.scss b/frontend/src/assets/scss/custom/gradido-custom/_icons.scss new file mode 100644 index 000000000..b4b520996 --- /dev/null +++ b/frontend/src/assets/scss/custom/gradido-custom/_icons.scss @@ -0,0 +1,7 @@ + +// Icons + +$icon-size: 3rem !default; +$icon-size-xl: 5rem !default; +$icon-size-lg: 4rem !default; +$icon-size-sm: 2rem !default; \ No newline at end of file diff --git a/frontend/src/assets/scss/custom/gradido-custom/_input-groups.scss b/frontend/src/assets/scss/custom/gradido-custom/_input-groups.scss new file mode 100644 index 000000000..7824bae28 --- /dev/null +++ b/frontend/src/assets/scss/custom/gradido-custom/_input-groups.scss @@ -0,0 +1,9 @@ +// Input groups + +$input-group-addon-color: $input-placeholder-color !default; +$input-group-addon-bg: $input-bg !default; +$input-group-addon-border-color: $input-border-color !default; + +$input-group-addon-focus-color: $input-focus-color !default; +$input-group-addon-focus-bg: $input-focus-bg !default; +$input-group-addon-focus-border-color: $input-focus-border-color !default; diff --git a/frontend/src/assets/scss/custom/gradido-custom/_input.scss b/frontend/src/assets/scss/custom/gradido-custom/_input.scss new file mode 100644 index 000000000..c3320ccc7 --- /dev/null +++ b/frontend/src/assets/scss/custom/gradido-custom/_input.scss @@ -0,0 +1,45 @@ +// Input + +$input-padding-y: $input-btn-padding-y !default; +$input-padding-x: $input-btn-padding-x !default; +$input-line-height: $input-btn-line-height !default; + +$input-padding-y-sm: $input-btn-padding-y-sm !default; +$input-padding-x-sm: $input-btn-padding-x-sm !default; +$input-line-height-sm: $input-btn-line-height-sm !default; + +$input-padding-y-lg: $input-btn-padding-y-lg !default; +$input-padding-x-lg: $input-btn-padding-x-lg !default; +$input-line-height-lg: $input-btn-line-height-lg !default; + +$input-border-radius: $border-radius !default; +$input-border-radius-xl: $border-radius-xl !default; +$input-border-radius-lg: $border-radius-lg !default; +$input-border-radius-sm: $border-radius-sm !default; + +$input-bg: $white !default; +$input-disabled-bg: $gray-200 !default; + +$input-muted-bg: #F7FAFE !default; +$input-focus-muted-bg: lighten($input-muted-bg, 1%) !default; + +$input-alternative-box-shadow: 0 1px 3px rgba(50,50,93,.15), 0 1px 0 rgba(0,0,0,.02) !default; +$input-focus-alternative-box-shadow: 0 4px 6px rgba(50,50,93,.11),0 1px 3px rgba(0,0,0,.08) !default; + +$input-color: $gray-600 !default; +$input-border-color: #cad1d7 !default; +$input-border-width: $input-btn-border-width !default; +$input-box-shadow: none !default; // 0 1px 3px 0 $gray-400 !default; + +$input-focus-bg: $white !default; +$input-focus-border-color: rgba(50,151,211,.25) !default; +$input-focus-color: $input-color !default; +$input-focus-width: 0 !default; +$input-focus-box-shadow: none !default; //0 1px 3px 0 $gray-500 !default; + +$input-placeholder-color: $gray-500 !default; +$input-focus-placeholder-color: $gray-500 !default; + +$input-height-border: $input-border-width * 2 !default; + +$input-transition: all .2s cubic-bezier(0.68, -0.55, 0.265, 1.55) !default; diff --git a/frontend/src/assets/scss/custom/gradido-custom/_links.scss b/frontend/src/assets/scss/custom/gradido-custom/_links.scss new file mode 100644 index 000000000..3cdd10dad --- /dev/null +++ b/frontend/src/assets/scss/custom/gradido-custom/_links.scss @@ -0,0 +1,6 @@ +// Links + +$link-color: $primary !default; +$link-decoration: none !default; +$link-hover-color: darken($link-color, 15%) !default; +$link-hover-decoration: none !default; \ No newline at end of file diff --git a/frontend/src/assets/scss/custom/gradido-custom/_list-group.scss b/frontend/src/assets/scss/custom/gradido-custom/_list-group.scss new file mode 100644 index 000000000..0109d4644 --- /dev/null +++ b/frontend/src/assets/scss/custom/gradido-custom/_list-group.scss @@ -0,0 +1,23 @@ +// List group + +$list-group-bg: $white !default; +$list-group-border-color: $border-color !default; //rgba($black, .125); +$list-group-border-width: $border-width !default; +$list-group-border-radius: $border-radius !default; + +$list-group-item-padding-y: 1rem !default; +$list-group-item-padding-x: 1rem !default; + +$list-group-hover-bg: $gray-100 !default; +$list-group-active-color: $component-active-color !default; +$list-group-active-bg: $component-active-bg !default; +$list-group-active-border-color: $list-group-active-bg !default; + +$list-group-disabled-color: $gray-600 !default; +$list-group-disabled-bg: $list-group-bg !default; + +$list-group-action-color: $gray-700 !default; +$list-group-action-hover-color: $list-group-action-color !default; + +$list-group-action-active-color: $list-group-action-color !default; +$list-group-action-active-bg: $gray-200 !default; diff --git a/frontend/src/assets/scss/custom/gradido-custom/_main-content.scss b/frontend/src/assets/scss/custom/gradido-custom/_main-content.scss new file mode 100644 index 000000000..d4787a666 --- /dev/null +++ b/frontend/src/assets/scss/custom/gradido-custom/_main-content.scss @@ -0,0 +1,4 @@ +// Main content + +$main-content-padding-y: 40px !default; +$main-content-padding-x: 24px !default; // in px to combine with $grid-gutter-width diff --git a/frontend/src/assets/scss/custom/gradido-custom/_map.scss b/frontend/src/assets/scss/custom/gradido-custom/_map.scss new file mode 100644 index 000000000..ded56e7cc --- /dev/null +++ b/frontend/src/assets/scss/custom/gradido-custom/_map.scss @@ -0,0 +1,3 @@ +// Map + +$map-height: 500px !default; diff --git a/frontend/src/assets/scss/custom/gradido-custom/_modals.scss b/frontend/src/assets/scss/custom/gradido-custom/_modals.scss new file mode 100644 index 000000000..3ef72f5bc --- /dev/null +++ b/frontend/src/assets/scss/custom/gradido-custom/_modals.scss @@ -0,0 +1,24 @@ +// Modals + +$modal-inner-padding: 1.5rem !default; + +$modal-lg: 800px !default; +$modal-md: 500px !default; +$modal-sm: 380px !default; + +$modal-title-line-height: 1.1; + +$modal-content-bg: $white !default; +$modal-content-border-color: rgba($black, .2) !default; +$modal-content-border-width: 0 !default; +$modal-content-border-radius: $border-radius-lg !default; +$modal-content-box-shadow-xs: 0 15px 35px rgba(50,50,93,.2), 0 5px 15px rgba(0,0,0,.17); +$modal-content-box-shadow-sm-up: 0 15px 35px rgba(50,50,93,.2), 0 5px 15px rgba(0,0,0,.17); + +$modal-backdrop-bg: $black !default; +$modal-backdrop-opacity: .16 !default; +$modal-header-border-color: $gray-200 !default; +$modal-footer-border-color: $modal-header-border-color !default; +$modal-header-border-width: $modal-content-border-width !default; +$modal-footer-border-width: $modal-header-border-width !default; +$modal-header-padding: 1.25rem !default; \ No newline at end of file diff --git a/frontend/src/assets/scss/custom/gradido-custom/_navbar.scss b/frontend/src/assets/scss/custom/gradido-custom/_navbar.scss new file mode 100644 index 000000000..39bd31dd7 --- /dev/null +++ b/frontend/src/assets/scss/custom/gradido-custom/_navbar.scss @@ -0,0 +1,49 @@ +// Navbar + +$navbar-transition: all .15s linear !default; +$navbar-padding-y: 1rem !default; +$navbar-padding-x: 1rem !default; + +$navbar-nav-link-padding-x: 1rem !default; +$navbar-nav-link-padding-y: 1rem !default; + +$navbar-nav-link-font-size: .9rem !default; +$navbar-nav-link-font-weight: 400 !default; +$navbar-nav-link-text-transform: normal !default; +$navbar-nav-link-letter-spacing: 0 !default; +$navbar-nav-link-border-radius: $border-radius !default; + +$navbar-search-width: 270px !default; +$navbar-search-bg: transparent !default; + +$navbar-search-border-radius: 2rem !default; +$navbar-search-border-width: 2px !default; + +$navbar-dark-bg: transparent !default; +$navbar-dark-hover-bg: rgba(255, 255, 255, .1) !default; +$navbar-dark-active-bg: rgba(255, 255, 255, .1) !default; +$navbar-dark-color: rgba($white, .95) !default; +$navbar-dark-hover-color: rgba($white, .65) !default; +$navbar-dark-active-color: rgba($white, .65) !default; +$navbar-dark-disabled-color: rgba($white, .25) !default; +$navbar-dark-toggler-border-color: transparent !default; + +$navbar-search-dark-border-color: rgba(255, 255, 255, .6) !default; +$navbar-search-dark-color: rgba(255, 255, 255, .6) !default; +$navbar-search-dark-focus-border-color: rgba(255, 255, 255, .9) !default; +$navbar-search-dark-focus-color: rgba(255, 255, 255, .9) !default; + +$navbar-light-bg: transparent !default; +$navbar-light-hover-bg: rgba(0, 0, 0, .1) !default; +$navbar-light-active-bg: rgba(0, 0, 0, .1) !default; +$navbar-light-border-color: $gray-100 !default; +$navbar-light-color: rgba($black, .5) !default; +$navbar-light-hover-color: rgba($black, .7) !default; +$navbar-light-active-color: rgba($black, .9) !default; +$navbar-light-disabled-color: rgba($black, .3) !default; +$navbar-light-toggler-border-color: transparent !default; + +$navbar-search-light-border-color: rgba(0, 0, 0, .6) !default; +$navbar-search-light-color: rgba(0, 0, 0, .6) !default; +$navbar-search-light-focus-border-color: rgba(0, 0, 0, .9) !default; +$navbar-search-light-focus-color: rgba(0, 0, 0, .9) !default; diff --git a/frontend/src/assets/scss/custom/gradido-custom/_navs.scss b/frontend/src/assets/scss/custom/gradido-custom/_navs.scss new file mode 100644 index 000000000..ba3083b02 --- /dev/null +++ b/frontend/src/assets/scss/custom/gradido-custom/_navs.scss @@ -0,0 +1,23 @@ +// Navs + +$nav-link-padding-y: .25rem !default; +$nav-link-padding-x: .75rem !default; +$nav-link-color: $gray-700 !default; +$nav-link-hover-color: theme-color("primary") !default; +$nav-link-disabled-color: $gray-600 !default; + +$nav-pills-padding-y: .75rem !default; +$nav-pills-padding-x: 1rem !default; + +$nav-pills-space-x: 1rem !default; + +$nav-pills-bg: $white !default; +$nav-pills-border-width: 1px !default; +$nav-pills-border-color: theme-color("primary") !default; +$nav-pills-border-radius: $border-radius !default; + +$nav-pills-link-color: theme-color("primary") !default; +$nav-pills-link-hover-color: darken(theme-color("primary"), 5%) !default; +$nav-pills-link-active-color: color-yiq(theme-color("primary")) !default; +$nav-pills-link-active-bg: theme-color("primary") !default; +$nav-pills-box-shadow: $btn-box-shadow !default; diff --git a/frontend/src/assets/scss/custom/gradido-custom/_nouislider.scss b/frontend/src/assets/scss/custom/gradido-custom/_nouislider.scss new file mode 100644 index 000000000..9ce346e35 --- /dev/null +++ b/frontend/src/assets/scss/custom/gradido-custom/_nouislider.scss @@ -0,0 +1,17 @@ +// No UI Slider + +$noui-target-bg: #eceeef !default; +$noui-target-thickness: 5px !default; +$noui-target-border-radius: 5px !default; +$noui-target-border-color: 0 !default; +$noui-target-box-shadow: inset 0 1px 2px rgba(90,97,105,.1) !default; + +$noui-slider-connect-bg: $primary !default; +$noui-slider-connect-disabled-bg: #b2b2b2 !default; + +$noui-handle-width: 15px !default; +$noui-handle-bg: theme-color("primary") !default; +$noui-handle-border: 0 !default; +$noui-handle-border-radius: 100% !default; + +$noui-origin-border-radius: 2px !default; diff --git a/frontend/src/assets/scss/custom/gradido-custom/_pagination.scss b/frontend/src/assets/scss/custom/gradido-custom/_pagination.scss new file mode 100644 index 000000000..5ec0f81f9 --- /dev/null +++ b/frontend/src/assets/scss/custom/gradido-custom/_pagination.scss @@ -0,0 +1,29 @@ +// Pagination + +// $pagination-padding-y: .5rem !default; +// $pagination-padding-x: .75rem !default; +// $pagination-padding-y-sm: .25rem !default; +// $pagination-padding-x-sm: .5rem !default; +// $pagination-padding-y-lg: .75rem !default; +// $pagination-padding-x-lg: 1.5rem !default; +// $pagination-line-height: 1.25 !default; + +$pagination-color: $gray-600 !default; +$pagination-bg: $white !default; +$pagination-border-width: $border-width !default; +$pagination-border-color: $gray-300 !default; + +//$pagination-focus-box-shadow: $btn-hover-box-shadow !default; + +$pagination-hover-color: $gray-600 !default; +$pagination-hover-bg: $gray-300 !default; +$pagination-hover-border-color: $gray-300 !default; + +$pagination-active-color: $component-active-color !default; +$pagination-active-bg: $component-active-bg !default; +$pagination-active-border-color: $pagination-active-bg !default; +$pagination-active-box-shadow: $btn-hover-box-shadow !default; + +$pagination-disabled-color: $gray-600 !default; +$pagination-disabled-bg: $white !default; +$pagination-disabled-border-color: $gray-300 !default; diff --git a/frontend/src/assets/scss/custom/gradido-custom/_popovers.scss b/frontend/src/assets/scss/custom/gradido-custom/_popovers.scss new file mode 100644 index 000000000..b667a294b --- /dev/null +++ b/frontend/src/assets/scss/custom/gradido-custom/_popovers.scss @@ -0,0 +1,24 @@ +// Popovers + +$popover-font-size: $font-size-sm !default; +$popover-bg: $white !default; +$popover-max-width: 276px !default; +$popover-border-width: 1px !default; +$popover-border-color: rgba($black, .05) !default; +$popover-border-radius: $border-radius-lg !default; +$popover-box-shadow: 0px .5rem 2rem 0px rgba($black, .2) !default; + +$popover-header-bg: $popover-bg !default; +$popover-header-color: $headings-color !default; +$popover-header-padding-y: .5rem !default; +$popover-header-padding-x: .95rem !default; + +$popover-body-color: $body-color !default; +$popover-body-padding-y: $popover-header-padding-y !default; +$popover-body-padding-x: $popover-header-padding-x !default; + +$popover-arrow-width: 1.5rem !default; +$popover-arrow-height: .75rem !default; +$popover-arrow-color: $popover-bg !default; + +$popover-arrow-outer-color: transparent !default; diff --git a/frontend/src/assets/scss/custom/gradido-custom/_sections.scss b/frontend/src/assets/scss/custom/gradido-custom/_sections.scss new file mode 100644 index 000000000..02f0f4e52 --- /dev/null +++ b/frontend/src/assets/scss/custom/gradido-custom/_sections.scss @@ -0,0 +1,5 @@ +// Body + + +$body-bg: #f8f9fe !default; +$body-color: $gray-700 !default; diff --git a/frontend/src/assets/scss/custom/gradido-custom/_spacing.scss b/frontend/src/assets/scss/custom/gradido-custom/_spacing.scss new file mode 100644 index 000000000..8b4cf5019 --- /dev/null +++ b/frontend/src/assets/scss/custom/gradido-custom/_spacing.scss @@ -0,0 +1,37 @@ + +// Spacing + +$spacer: 1rem !default; +$spacers: () !default; +$spacers: map-merge(( + -9: -($spacer * 10), + -8: -($spacer * 8), + -7: -($spacer * 6), + -6: -($spacer * 4.5), + -5: -($spacer * 3), + -4: -($spacer * 1.5), + -3: -$spacer, + -2: -($spacer * .5), + -1: -($spacer * .25), + 0: 0, + 1: ($spacer * .25), + 2: ($spacer * .5), + 3: $spacer, + 4: ($spacer * 1.5), + 5: ($spacer * 3), + 6: ($spacer * 4.5), + 7: ($spacer * 6), + 8: ($spacer * 8), + 9: ($spacer * 10) +), $spacers); + + +// This variable affects the `.h-*` and `.w-*` classes. + +$sizes: () !default; +$sizes: map-merge(( + 25: 25%, + 50: 50%, + 75: 75%, + 100: 100% +), $sizes); \ No newline at end of file diff --git a/frontend/src/assets/scss/custom/gradido-custom/_tables.scss b/frontend/src/assets/scss/custom/gradido-custom/_tables.scss new file mode 100644 index 000000000..64eb6056a --- /dev/null +++ b/frontend/src/assets/scss/custom/gradido-custom/_tables.scss @@ -0,0 +1,32 @@ +// Tables + +$table-cell-padding: 1rem !default; +$table-cell-padding-sm: .5rem !default; + +$table-bg: transparent !default; +$table-accent-bg: rgba($black, .05) !default; +$table-hover-bg: $gray-100 !default; +$table-active-bg: $table-hover-bg !default; + +$table-border-width: $border-width !default; +$table-border-color: $gray-200 !default; + +$table-head-bg: $gray-100 !default; +$table-head-color: $gray-600 !default; +$table-head-spacer-y: .75rem !default; + +$table-head-font-size: .65rem !default; +$table-head-font-weight: $font-weight-bold !default; +$table-head-text-transform: uppercase !default; +$table-head-letter-spacing: 1px !default; + +$table-body-font-size: .8125rem !default; + +$table-dark-bg: theme-color("default") !default; +$table-dark-accent-bg: rgba($white, .05) !default; +$table-dark-hover-bg: rgba($white, .075) !default; +$table-dark-border-color: lighten(theme-color("default"), 7%) !default; +$table-dark-color: $body-bg !default; + +$table-dark-head-bg: lighten(theme-color("default"), 4%) !default; +$table-dark-head-color: lighten(theme-color("default"), 35%) !default; \ No newline at end of file diff --git a/frontend/src/assets/scss/custom/gradido-custom/_tooltips.scss b/frontend/src/assets/scss/custom/gradido-custom/_tooltips.scss new file mode 100644 index 000000000..ea7868fef --- /dev/null +++ b/frontend/src/assets/scss/custom/gradido-custom/_tooltips.scss @@ -0,0 +1,3 @@ +// Tooltips + +$tooltip-font-size: $font-size-sm !default; diff --git a/frontend/src/assets/scss/custom/gradido-custom/_vertical-navbar.scss b/frontend/src/assets/scss/custom/gradido-custom/_vertical-navbar.scss new file mode 100644 index 000000000..6df40a4d6 --- /dev/null +++ b/frontend/src/assets/scss/custom/gradido-custom/_vertical-navbar.scss @@ -0,0 +1,15 @@ +// Vertical navbar + +$navbar-vertical-box-shadow: 0 0 2rem 0 rgba(136, 152, 170, .15) !important; +$navbar-vertical-width: 250px !default; +$navbar-vertical-padding-x: 1.5rem !default; +$navbar-vertical-nav-link-padding-x: 1.5rem !default; +$navbar-vertical-nav-link-padding-y: .65rem !default; + +$navbar-icon-min-width: 2.25rem !default; + +$navbar-breadcrumb-padding-y: $nav-link-padding-y !default; +$navbar-breadcrumb-padding-x: 0 !default; + +$navbar-light-bg: $white !default; +$navbar-light-border-color: $border-color !default; diff --git a/frontend/src/assets/scss/gradido.scss b/frontend/src/assets/scss/gradido.scss new file mode 100644 index 000000000..e29538807 --- /dev/null +++ b/frontend/src/assets/scss/gradido.scss @@ -0,0 +1,44 @@ + +// Bootstrap (4.5.3) functions + +@import "~bootstrap/scss/functions"; + + +@import "custom/variables"; +// @import "~bootstrap/scss/variables"; wird am +// ende der custom/variables angehangen + +// Bootstrap (4.5.3) mixins + +@import "~bootstrap/scss/mixins"; + +// Bootstrap (4.5.3) components + +@import "~bootstrap/scss/alert"; +@import "~bootstrap/scss/badge"; +@import "~bootstrap/scss/dropdown"; +@import "~bootstrap/scss/button-group"; +@import "~bootstrap/scss/buttons"; +@import "~bootstrap/scss/card"; +@import "~bootstrap/scss/custom-forms"; +@import "~bootstrap/scss/forms"; +@import "~bootstrap/scss/grid"; +@import "~bootstrap/scss/input-group"; +@import "~bootstrap/scss/list-group"; +@import "~bootstrap/scss/nav"; +@import "~bootstrap/scss/navbar"; +@import "~bootstrap/scss/pagination"; +@import "~bootstrap/scss/print"; +@import "~bootstrap/scss/progress"; +@import "~bootstrap/scss/reboot"; +@import "~bootstrap/scss/tables"; +@import "~bootstrap/scss/toasts"; +@import "~bootstrap/scss/tooltip"; +@import "~bootstrap/scss/transitions"; +@import "~bootstrap/scss/type"; +@import "~bootstrap/scss/utilities"; +@import "~bootstrap/scss/variables"; + + +// Bootstrap-vue (2.21.1) scss +@import '~bootstrap-vue/src/index.scss'; \ No newline at end of file diff --git a/frontend/src/assets/vendor/nucleo/css/nucleo-svg.css b/frontend/src/assets/vendor/nucleo/css/nucleo-svg.css deleted file mode 100644 index c68c10e35..000000000 --- a/frontend/src/assets/vendor/nucleo/css/nucleo-svg.css +++ /dev/null @@ -1,135 +0,0 @@ -/* Generated using nucleoapp.com */ -/* -------------------------------- - -Icon colors - --------------------------------- */ - -.icon { - display: inline-block; - /* icon primary color */ - color: #111111; - height: 1em; - width: 1em; -} - -.icon use { - /* icon secondary color - fill */ - fill: #7ea6f6; -} - -.icon.icon-outline use { - /* icon secondary color - stroke */ - stroke: #7ea6f6; -} - -/* -------------------------------- - -Change icon size - --------------------------------- */ - -.icon-xs { - height: 0.5em; - width: 0.5em; -} - -.icon-sm { - height: 0.8em; - width: 0.8em; -} - -.icon-lg { - height: 1.6em; - width: 1.6em; -} - -.icon-xl { - height: 2em; - width: 2em; -} - -/* -------------------------------- - -Align icon and text - --------------------------------- */ - -.icon-text-aligner { - /* add this class to parent element that contains icon + text */ - display: flex; - align-items: center; -} - -.icon-text-aligner .icon { - color: inherit; - margin-right: 0.4em; -} - -.icon-text-aligner .icon use { - color: inherit; - fill: currentColor; -} - -.icon-text-aligner .icon.icon-outline use { - stroke: currentColor; -} - -/* -------------------------------- - -Icon reset values - used to enable color customizations - --------------------------------- */ - -.icon { - fill: currentColor; - stroke: none; -} - -.icon.icon-outline { - fill: none; - stroke: currentColor; -} - -.icon use { - stroke: none; -} - -.icon.icon-outline use { - fill: none; -} - -/* -------------------------------- - -Stroke effects - Nucleo outline icons - -- 16px icons -> up to 1px stroke (16px outline icons do not support stroke changes) -- 24px, 32px icons -> up to 2px stroke -- 48px, 64px icons -> up to 4px stroke - --------------------------------- */ - -.icon-outline.icon-stroke-1 { - stroke-width: 1px; -} - -.icon-outline.icon-stroke-2 { - stroke-width: 2px; -} - -.icon-outline.icon-stroke-3 { - stroke-width: 3px; -} - -.icon-outline.icon-stroke-4 { - stroke-width: 4px; -} - -.icon-outline.icon-stroke-1 use, -.icon-outline.icon-stroke-3 use { - -webkit-transform: translateX(0.5px) translateY(0.5px); - -moz-transform: translateX(0.5px) translateY(0.5px); - -ms-transform: translateX(0.5px) translateY(0.5px); - -o-transform: translateX(0.5px) translateY(0.5px); - transform: translateX(0.5px) translateY(0.5px); -} \ No newline at end of file diff --git a/frontend/src/assets/vendor/nucleo/css/nucleo.css b/frontend/src/assets/vendor/nucleo/css/nucleo.css deleted file mode 100644 index 481bf62c8..000000000 --- a/frontend/src/assets/vendor/nucleo/css/nucleo.css +++ /dev/null @@ -1,572 +0,0 @@ -/*-------------------------------- - -hermes-dashboard-icons Web Font - built using nucleoapp.com -License - nucleoapp.com/license/ - --------------------------------- */ -@font-face { - font-family: 'NucleoIcons'; - src: url('../fonts/nucleo-icons.eot'); - src: url('../fonts/nucleo-icons.eot') format('embedded-opentype'), url('../fonts/nucleo-icons.woff2') format('woff2'), url('../fonts/nucleo-icons.woff') format('woff'), url('../fonts/nucleo-icons.ttf') format('truetype'), url('../fonts/nucleo-icons.svg') format('svg'); - font-weight: normal; - font-style: normal; -} -/*------------------------ - base class definition --------------------------*/ -.ni { - display: inline-block; - font: normal normal normal 14px/1 NucleoIcons; - font-size: inherit; - text-rendering: auto; - -webkit-font-smoothing: antialiased; - -moz-osx-font-smoothing: grayscale; -} -/*------------------------ - change icon size --------------------------*/ -.ni-lg { - font-size: 1.33333333em; - line-height: 0.75em; - vertical-align: -15%; -} -.ni-2x { - font-size: 2em; -} -.ni-3x { - font-size: 3em; -} -.ni-4x { - font-size: 4em; -} -.ni-5x { - font-size: 5em; -} - -/*---------------------------------- - add a square/circle background ------------------------------------*/ -.ni.square, -.ni.circle { - padding: 0.33333333em; - vertical-align: -16%; - background-color: #eee; -} -.ni.circle { - border-radius: 50%; -} -/*------------------------ - list icons --------------------------*/ -.ni-ul { - padding-left: 0; - margin-left: 2.14285714em; - list-style-type: none; -} -.ni-ul > li { - position: relative; -} -.ni-ul > li > .ni { - position: absolute; - left: -1.57142857em; - top: 0.14285714em; - text-align: center; -} -.ni-ul > li > .ni.lg { - top: 0; - left: -1.35714286em; -} -.ni-ul > li > .ni.circle, -.ni-ul > li > .ni.square { - top: -0.19047619em; - left: -1.9047619em; -} -/*------------------------ - spinning icons --------------------------*/ -.ni.spin { - -webkit-animation: nc-spin 2s infinite linear; - -moz-animation: nc-spin 2s infinite linear; - animation: nc-spin 2s infinite linear; -} -@-webkit-keyframes nc-spin { - 0% { - -webkit-transform: rotate(0deg); - } - 100% { - -webkit-transform: rotate(360deg); - } -} -@-moz-keyframes nc-spin { - 0% { - -moz-transform: rotate(0deg); - } - 100% { - -moz-transform: rotate(360deg); - } -} -@keyframes nc-spin { - 0% { - -webkit-transform: rotate(0deg); - -moz-transform: rotate(0deg); - -ms-transform: rotate(0deg); - -o-transform: rotate(0deg); - transform: rotate(0deg); - } - 100% { - -webkit-transform: rotate(360deg); - -moz-transform: rotate(360deg); - -ms-transform: rotate(360deg); - -o-transform: rotate(360deg); - transform: rotate(360deg); - } -} -/*------------------------ - rotated/flipped icons --------------------------*/ -.ni.rotate-90 { - filter: progid:DXImageTransform.Microsoft.BasicImage(rotation=1); - -webkit-transform: rotate(90deg); - -moz-transform: rotate(90deg); - -ms-transform: rotate(90deg); - -o-transform: rotate(90deg); - transform: rotate(90deg); -} -.ni.rotate-180 { - filter: progid:DXImageTransform.Microsoft.BasicImage(rotation=2); - -webkit-transform: rotate(180deg); - -moz-transform: rotate(180deg); - -ms-transform: rotate(180deg); - -o-transform: rotate(180deg); - transform: rotate(180deg); -} -.ni.rotate-270 { - filter: progid:DXImageTransform.Microsoft.BasicImage(rotation=3); - -webkit-transform: rotate(270deg); - -moz-transform: rotate(270deg); - -ms-transform: rotate(270deg); - -o-transform: rotate(270deg); - transform: rotate(270deg); -} -.ni.flip-y { - filter: progid:DXImageTransform.Microsoft.BasicImage(rotation=0); - -webkit-transform: scale(-1, 1); - -moz-transform: scale(-1, 1); - -ms-transform: scale(-1, 1); - -o-transform: scale(-1, 1); - transform: scale(-1, 1); -} -.ni.flip-x { - filter: progid:DXImageTransform.Microsoft.BasicImage(rotation=2); - -webkit-transform: scale(1, -1); - -moz-transform: scale(1, -1); - -ms-transform: scale(1, -1); - -o-transform: scale(1, -1); - transform: scale(1, -1); -} -/*------------------------ - font icons --------------------------*/ - -.ni-active-40::before { - content: "\ea02"; -} - -.ni-air-baloon::before { - content: "\ea03"; -} - -.ni-album-2::before { - content: "\ea04"; -} - -.ni-align-center::before { - content: "\ea05"; -} - -.ni-align-left-2::before { - content: "\ea06"; -} - -.ni-ambulance::before { - content: "\ea07"; -} - -.ni-app::before { - content: "\ea08"; -} - -.ni-archive-2::before { - content: "\ea09"; -} - -.ni-atom::before { - content: "\ea0a"; -} - -.ni-badge::before { - content: "\ea0b"; -} - -.ni-bag-17::before { - content: "\ea0c"; -} - -.ni-basket::before { - content: "\ea0d"; -} - -.ni-bell-55::before { - content: "\ea0e"; -} - -.ni-bold-down::before { - content: "\ea0f"; -} - -.ni-bold-left::before { - content: "\ea10"; -} - -.ni-bold-right::before { - content: "\ea11"; -} - -.ni-bold-up::before { - content: "\ea12"; -} - -.ni-bold::before { - content: "\ea13"; -} - -.ni-book-bookmark::before { - content: "\ea14"; -} - -.ni-books::before { - content: "\ea15"; -} - -.ni-box-2::before { - content: "\ea16"; -} - -.ni-briefcase-24::before { - content: "\ea17"; -} - -.ni-building::before { - content: "\ea18"; -} - -.ni-bulb-61::before { - content: "\ea19"; -} - -.ni-bullet-list-67::before { - content: "\ea1a"; -} - -.ni-bus-front-12::before { - content: "\ea1b"; -} - -.ni-button-pause::before { - content: "\ea1c"; -} - -.ni-button-play::before { - content: "\ea1d"; -} - -.ni-button-power::before { - content: "\ea1e"; -} - -.ni-calendar-grid-58::before { - content: "\ea1f"; -} - -.ni-camera-compact::before { - content: "\ea20"; -} - -.ni-caps-small::before { - content: "\ea21"; -} - -.ni-cart::before { - content: "\ea22"; -} - -.ni-chart-bar-32::before { - content: "\ea23"; -} - -.ni-chart-pie-35::before { - content: "\ea24"; -} - -.ni-chat-round::before { - content: "\ea25"; -} - -.ni-check-bold::before { - content: "\ea26"; -} - -.ni-circle-08::before { - content: "\ea27"; -} - -.ni-cloud-download-95::before { - content: "\ea28"; -} - -.ni-cloud-upload-96::before { - content: "\ea29"; -} - -.ni-compass-04::before { - content: "\ea2a"; -} - -.ni-controller::before { - content: "\ea2b"; -} - -.ni-credit-card::before { - content: "\ea2c"; -} - -.ni-curved-next::before { - content: "\ea2d"; -} - -.ni-delivery-fast::before { - content: "\ea2e"; -} - -.ni-diamond::before { - content: "\ea2f"; -} - -.ni-email-83::before { - content: "\ea30"; -} - -.ni-fat-add::before { - content: "\ea31"; -} - -.ni-fat-delete::before { - content: "\ea32"; -} - -.ni-fat-remove::before { - content: "\ea33"; -} - -.ni-favourite-28::before { - content: "\ea34"; -} - -.ni-folder-17::before { - content: "\ea35"; -} - -.ni-glasses-2::before { - content: "\ea36"; -} - -.ni-hat-3::before { - content: "\ea37"; -} - -.ni-headphones::before { - content: "\ea38"; -} - -.ni-html5::before { - content: "\ea39"; -} - -.ni-istanbul::before { - content: "\ea3a"; -} - -.ni-key-25::before { - content: "\ea3b"; -} - -.ni-laptop::before { - content: "\ea3c"; -} - -.ni-like-2::before { - content: "\ea3d"; -} - -.ni-lock-circle-open::before { - content: "\ea3e"; -} - -.ni-map-big::before { - content: "\ea3f"; -} - -.ni-mobile-button::before { - content: "\ea40"; -} - -.ni-money-coins::before { - content: "\ea41"; -} - -.ni-note-03::before { - content: "\ea42"; -} - -.ni-notification-70::before { - content: "\ea43"; -} - -.ni-palette::before { - content: "\ea44"; -} - -.ni-paper-diploma::before { - content: "\ea45"; -} - -.ni-pin-3::before { - content: "\ea46"; -} - -.ni-planet::before { - content: "\ea47"; -} - -.ni-ruler-pencil::before { - content: "\ea48"; -} - -.ni-satisfied::before { - content: "\ea49"; -} - -.ni-scissors::before { - content: "\ea4a"; -} - -.ni-send::before { - content: "\ea4b"; -} - -.ni-settings-gear-65::before { - content: "\ea4c"; -} - -.ni-settings::before { - content: "\ea4d"; -} - -.ni-single-02::before { - content: "\ea4e"; -} - -.ni-single-copy-04::before { - content: "\ea4f"; -} - -.ni-sound-wave::before { - content: "\ea50"; -} - -.ni-spaceship::before { - content: "\ea51"; -} - -.ni-square-pin::before { - content: "\ea52"; -} - -.ni-support-16::before { - content: "\ea53"; -} - -.ni-tablet-button::before { - content: "\ea54"; -} - -.ni-tag::before { - content: "\ea55"; -} - -.ni-tie-bow::before { - content: "\ea56"; -} - -.ni-time-alarm::before { - content: "\ea57"; -} - -.ni-trophy::before { - content: "\ea58"; -} - -.ni-tv-2::before { - content: "\ea59"; -} - -.ni-umbrella-13::before { - content: "\ea5a"; -} - -.ni-user-run::before { - content: "\ea5b"; -} - -.ni-vector::before { - content: "\ea5c"; -} - -.ni-watch-time::before { - content: "\ea5d"; -} - -.ni-world::before { - content: "\ea5e"; -} - -.ni-zoom-split-in::before { - content: "\ea5f"; -} - -.ni-collection::before { - content: "\ea60"; -} - -.ni-image::before { - content: "\ea61"; -} - -.ni-shop::before { - content: "\ea62"; -} - -.ni-ungroup::before { - content: "\ea63"; -} - -.ni-world-2::before { - content: "\ea64"; -} - -.ni-ui-04::before { - content: "\ea65"; -} - - -/* all icon font classes list here */ diff --git a/frontend/src/assets/vendor/nucleo/fonts/nucleo-icons.eot b/frontend/src/assets/vendor/nucleo/fonts/nucleo-icons.eot deleted file mode 100644 index ab96810ad..000000000 Binary files a/frontend/src/assets/vendor/nucleo/fonts/nucleo-icons.eot and /dev/null differ diff --git a/frontend/src/assets/vendor/nucleo/fonts/nucleo-icons.svg b/frontend/src/assets/vendor/nucleo/fonts/nucleo-icons.svg deleted file mode 100644 index 6654c1a2d..000000000 --- a/frontend/src/assets/vendor/nucleo/fonts/nucleo-icons.svg +++ /dev/null @@ -1,312 +0,0 @@ - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - diff --git a/frontend/src/assets/vendor/nucleo/fonts/nucleo-icons.ttf b/frontend/src/assets/vendor/nucleo/fonts/nucleo-icons.ttf deleted file mode 100644 index 1a5598505..000000000 Binary files a/frontend/src/assets/vendor/nucleo/fonts/nucleo-icons.ttf and /dev/null differ diff --git a/frontend/src/assets/vendor/nucleo/fonts/nucleo-icons.woff b/frontend/src/assets/vendor/nucleo/fonts/nucleo-icons.woff deleted file mode 100644 index cb1924708..000000000 Binary files a/frontend/src/assets/vendor/nucleo/fonts/nucleo-icons.woff and /dev/null differ diff --git a/frontend/src/assets/vendor/nucleo/fonts/nucleo-icons.woff2 b/frontend/src/assets/vendor/nucleo/fonts/nucleo-icons.woff2 deleted file mode 100644 index e294e0801..000000000 Binary files a/frontend/src/assets/vendor/nucleo/fonts/nucleo-icons.woff2 and /dev/null differ diff --git a/frontend/src/plugins/dashboard-plugin.js b/frontend/src/plugins/dashboard-plugin.js index 3d28fceab..e48da4e9e 100755 --- a/frontend/src/plugins/dashboard-plugin.js +++ b/frontend/src/plugins/dashboard-plugin.js @@ -2,13 +2,12 @@ import GlobalComponents from './globalComponents' import GlobalDirectives from './globalDirectives' import Toasted from 'vue-toasted' +import PortalVue from 'portal-vue' // vue-bootstrap import { BootstrapVue, IconsPlugin } from 'bootstrap-vue' -// asset imports -import '@/assets/scss/argon.scss' -import '@/assets/vendor/nucleo/css/nucleo.css' +import '@/assets/scss/gradido.scss' import FlatPickr from 'vue-flatpickr-component' import 'flatpickr/dist/flatpickr.css' @@ -27,6 +26,7 @@ export default { Vue.use(BootstrapVue) Vue.use(IconsPlugin) Vue.use(VueMoment) + Vue.use(PortalVue) Vue.use(FlatPickr) Vue.use(Loading) Vue.use(VueApollo) diff --git a/frontend/src/plugins/dashboard-plugin.test.js b/frontend/src/plugins/dashboard-plugin.test.js index 0c8a754a3..689855c12 100644 --- a/frontend/src/plugins/dashboard-plugin.test.js +++ b/frontend/src/plugins/dashboard-plugin.test.js @@ -6,6 +6,8 @@ import GlobalDirectives from './globalDirectives' import Toasted from 'vue-toasted' +import './assets/scss/app.scss' + jest.mock('./globalComponents') jest.mock('./globalDirectives') jest.mock('vue-toasted') @@ -27,7 +29,7 @@ describe('dashboard plugin', () => { }) describe('vue toasted', () => { - const toastedAction = vueUseMock.mock.calls[8][1].action.onClick + const toastedAction = vueUseMock.mock.calls[9][1].action.onClick const goAwayMock = jest.fn() const toastObject = { goAway: goAwayMock, diff --git a/frontend/yarn.lock b/frontend/yarn.lock index 244f8312e..2ceb33065 100644 --- a/frontend/yarn.lock +++ b/frontend/yarn.lock @@ -4129,7 +4129,7 @@ boolbase@^1.0.0, boolbase@~1.0.0: resolved "https://registry.yarnpkg.com/boolbase/-/boolbase-1.0.0.tgz#68dff5fbe60c51eb37725ea9e3ed310dcc1e776e" integrity sha1-aN/1++YMUes3cl6p4+0xDcwed24= -bootstrap-vue@^2.5.0: +bootstrap-vue@^2.21.2: version "2.21.2" resolved "https://registry.yarnpkg.com/bootstrap-vue/-/bootstrap-vue-2.21.2.tgz#ec38f66c3a2205becccddb6158a991d96509ed0b" integrity sha512-0Exe+4MZysqhZNXIKf4TzkvXaupxh9EHsoCRez0o5Dc0J7rlafayOEwql63qXv74CgZO8E4U8ugRNJko1vMvNw== @@ -4140,15 +4140,10 @@ bootstrap-vue@^2.5.0: portal-vue "^2.1.7" vue-functional-data-merge "^3.1.0" -bootstrap@4.3.1: - version "4.3.1" - resolved "https://registry.yarnpkg.com/bootstrap/-/bootstrap-4.3.1.tgz#280ca8f610504d99d7b6b4bfc4b68cec601704ac" - integrity sha512-rXqOmH1VilAt2DyPzluTi2blhk17bO7ef+zLLPlWvG494pDxcM234pJ8wTc/6R40UWizAIIMgxjvxZg5kmsbag== - -"bootstrap@>=4.5.3 <5.0.0": - version "4.6.0" - resolved "https://registry.yarnpkg.com/bootstrap/-/bootstrap-4.6.0.tgz#97b9f29ac98f98dfa43bf7468262d84392552fd7" - integrity sha512-Io55IuQY3kydzHtbGvQya3H+KorS/M9rSNyfCGCg9WZ4pyT/lCxIlpJgG1GXW/PswzC84Tr2fBYi+7+jFVQQBw== +"bootstrap@>=4.5.3 <5.0.0", bootstrap@^4.5.3: + version "4.6.1" + resolved "https://registry.yarnpkg.com/bootstrap/-/bootstrap-4.6.1.tgz#bc25380c2c14192374e8dec07cf01b2742d222a2" + integrity sha512-0dj+VgI9Ecom+rvvpNZ4MUZJz8dcX7WCX+eTID9+/8HgOkv3dsRzi8BGeZJCQU6flWQVYxwTQnEZFrmJSEO7og== brace-expansion@^1.1.7: version "1.1.11" @@ -10439,9 +10434,11 @@ node-environment-flags@^1.0.5: semver "^5.7.0" node-fetch@^2.6.1: - version "2.6.1" - resolved "https://registry.yarnpkg.com/node-fetch/-/node-fetch-2.6.1.tgz#045bd323631f76ed2e2b55573394416b639a0052" - integrity sha512-V4aYg89jEoVRxRb2fJdAg8FHvI7cEyYdVAh94HH0UIK8oJxUfkjlDQN9RbMx+bEjP7+ggMiFRprSti032Oipxw== + version "2.6.7" + resolved "https://registry.yarnpkg.com/node-fetch/-/node-fetch-2.6.7.tgz#24de9fba827e3b4ae44dc8b20256a379160052ad" + integrity sha512-ZjMPFEfVx5j+y2yF35Kzx5sF7kDzxuDj6ziH4FFbOp87zKDZNx8yExJIb05OGF4Nlt9IHFIMBkRl41VdvcNdbQ== + dependencies: + whatwg-url "^5.0.0" node-forge@^0.10.0: version "0.10.0" @@ -13631,6 +13628,11 @@ tr46@^2.1.0: dependencies: punycode "^2.1.1" +tr46@~0.0.3: + version "0.0.3" + resolved "https://registry.yarnpkg.com/tr46/-/tr46-0.0.3.tgz#8184fd347dac9cdc185992f3a6622e14b9d9ab6a" + integrity sha1-gYT9NH2snNwYWZLzpmIuFLnZq2o= + trim-newlines@^3.0.0: version "3.0.1" resolved "https://registry.yarnpkg.com/trim-newlines/-/trim-newlines-3.0.1.tgz#260a5d962d8b752425b32f3a7db0dcacd176c144" @@ -14344,6 +14346,11 @@ wcwidth@^1.0.1: dependencies: defaults "^1.0.3" +webidl-conversions@^3.0.0: + version "3.0.1" + resolved "https://registry.yarnpkg.com/webidl-conversions/-/webidl-conversions-3.0.1.tgz#24534275e2a7bc6be7bc86611cc16ae0a5654871" + integrity sha1-JFNCdeKnvGvnvIZhHMFq4KVlSHE= + webidl-conversions@^4.0.2: version "4.0.2" resolved "https://registry.yarnpkg.com/webidl-conversions/-/webidl-conversions-4.0.2.tgz#a855980b1f0b6b359ba1d5d9fb39ae941faa63ad" @@ -14537,6 +14544,14 @@ whatwg-mimetype@^2.1.0, whatwg-mimetype@^2.2.0, whatwg-mimetype@^2.3.0: resolved "https://registry.yarnpkg.com/whatwg-mimetype/-/whatwg-mimetype-2.3.0.tgz#3d4b1e0312d2079879f826aff18dbeeca5960fbf" integrity sha512-M4yMwr6mAnQz76TbJm914+gPpB/nCwvZbJU28cUD6dR004SAxDLOOSUaB1JDRqLtaOV/vi0IC5lEAGFgrjGv/g== +whatwg-url@^5.0.0: + version "5.0.0" + resolved "https://registry.yarnpkg.com/whatwg-url/-/whatwg-url-5.0.0.tgz#966454e8765462e37644d3626f6742ce8b70965d" + integrity sha1-lmRU6HZUYuN2RNNib2dCzotwll0= + dependencies: + tr46 "~0.0.3" + webidl-conversions "^3.0.0" + whatwg-url@^6.4.1: version "6.5.0" resolved "https://registry.yarnpkg.com/whatwg-url/-/whatwg-url-6.5.0.tgz#f2df02bff176fd65070df74ad5ccbb5a199965a8"