Skip to content
Snippets Groups Projects
Commit 6f2e0b58 authored by metourneau's avatar metourneau
Browse files

REDMINE_ISSUE-21264 | La variable d'env HEADER COLOR n'est pas correctement prise en compt

parent e8eebdae
No related branches found
No related tags found
No related merge requests found
/* ---------------------------------- */
/* APP */
/* APP */
/* ---------------------------------- */
body {
height:100%;
width:100%;
height: 100%;
width: 100%;
margin: 0;
}
#app {
position: relative;
min-height: 100vh; /* keep the space for loader, before page contents are injected */
display: flex; /* used to fix height on sticky header and footer */
flex-direction: column; /* used to fix height on sticky header and footer */
min-height: 100vh;
/* keep the space for loader, before page contents are injected */
display: flex;
/* used to fix height on sticky header and footer */
flex-direction: column;
/* used to fix height on sticky header and footer */
}
#app-header {
position: sticky;
top: 0;
z-index: 1;
background: var(--primary-color, #373636);
background: var(--header-color, #373636);
.menu {
background: var(--header-color, #373636);
}
.item {
background: var(--header-color, #373636);
}
}
#app-content {
overflow: auto;
flex: 1 0 auto; /* used to fix height on sticky header and footer */
min-height: 61px; /* value by default of the header, defined here to be sync with anchor below, in order to keep the page stuck to top */
position: relative; /* for anchor below */
flex: 1 0 auto;
/* used to fix height on sticky header and footer */
min-height: 61px;
/* value by default of the header, defined here to be sync with anchor below, in order to keep the page stuck to top */
position: relative;
/* for anchor below */
}
#scroll-top-anchor {
......@@ -47,14 +60,16 @@ body {
width: 100%;
height: 100%;
min-height: 250px;
touch-action: none; /* workaround for modifying feature on mobile */
touch-action: none;
/* workaround for modifying feature on mobile */
}
#app-footer {
overflow: hidden;
background-color: #464646;
text-align: center;
flex-shrink: 0; /* used to fix height on sticky header and footer */
flex-shrink: 0;
/* used to fix height on sticky header and footer */
position: sticky;
bottom: 0;
z-index: 1000;
......@@ -74,65 +89,84 @@ body {
}
#app-footer .ui.text.menu .item:not(:first-child) {
border-left: 1px solid rgba(34,36,38,.15);
border-left: 1px solid rgba(34, 36, 38, .15);
}
/* ---------------------------------- */
/* UTILS */
/* UTILS */
/* ---------------------------------- */
.inline {
display: inline;
}
.no-margin {
margin: 0 !important;
}
.margin-top {
margin-top: 1rem;
}
.margin-bottom {
margin-bottom: 1rem;
}
.tiny-margin {
margin: 0.1rem 0 0.1rem 0.1rem !important;
margin: 0.1rem 0 0.1rem 0.1rem !important;
}
.tiny-margin-left {
margin-left: 0.1rem !important;
margin-left: 0.1rem !important;
}
.ellipsis {
text-overflow: ellipsis;
overflow: hidden;
}
.nowrap {
white-space: nowrap;
}
.important-flex {
display: flex !important;
}
.pointer:hover {
cursor: pointer !important;
}
.dimmer-anchor {
position: relative;
}
.full-width {
width: 100%;
}
/* ---------------------------------- */
/* MAIN */
/* MAIN */
/* ---------------------------------- */
.button-hover-orange:hover {
background: #fbbd08 !important;
}
.button-hover-green:hover {
background: #5bba21 !important;
}
.button-hover-red:hover {
background: #ee2e24 !important;
}
.ui.button.button-hover-red:hover, .ui.button.button-hover-red:hover i.icon,
.ui.button.button-hover-green:hover, .ui.button.button-hover-green:hover i.icon {
.ui.button.button-hover-red:hover,
.ui.button.button-hover-red:hover i.icon,
.ui.button.button-hover-green:hover,
.ui.button.button-hover-green:hover i.icon {
color: #fff !important;
}
.ui.button.button-hover-red:hover i.icon,
.ui.button.button-hover-green:hover i.icon {
transition: all 0.5s ease !important;
......@@ -143,7 +177,7 @@ body {
}
.ui.horizontal.divider {
color: var(--primary-color, #008c86)!important;
color: var(--primary-color, #008c86) !important;
padding-top: 1.5em;
}
......@@ -151,7 +185,7 @@ body {
display: none;
}
.ui.dropdown .menu > .header {
.ui.dropdown .menu>.header {
font-size: 1em;
text-transform: none;
}
......@@ -161,12 +195,12 @@ body {
overflow: auto;
}
.ui.dropdown .menu.text-wrap > .item {
.ui.dropdown .menu.text-wrap>.item {
white-space: normal;
word-wrap: normal;
}
.ui.checkbox.disabled > input {
.ui.checkbox.disabled>input {
cursor: default !important;
}
......@@ -176,13 +210,13 @@ body {
margin-right: 0.5em !important;
}
#form-layers .errorlist{
#form-layers .errorlist {
list-style: none;
padding-left: 0;
color: #9f3a38;
}
#form-layers .infoslist{
#form-layers .infoslist {
list-style: none;
padding-left: 0;
color: #38989f;
......@@ -203,9 +237,9 @@ body {
}
/* Thicker borders for each basemap segment */
#form-layers [data-segments=basemap_set-SEGMENTS] > .ui.segment {
#form-layers [data-segments=basemap_set-SEGMENTS]>.ui.segment {
margin-bottom: 3rem;
border: 1px solid rgba(34,36,38,.30);
border: 1px solid rgba(34, 36, 38, .30);
}
......@@ -225,17 +259,17 @@ body {
/* ---------------------------------- */
/* LEAFLET DRAW TOOLBAR */
/* LEAFLET DRAW TOOLBAR */
/* ---------------------------------- */
.leaflet-draw-toolbar a.leaflet-draw-draw-circlemarker,
.leaflet-draw-toolbar a.leaflet-draw-draw-polyline,
.leaflet-draw-toolbar a.leaflet-draw-draw-polygon {
background-color: #FFA19E;
background-color: #FFA19E;
}
/* ---------------------------------- */
/* ERROR LIST */
/* ERROR LIST */
/* ---------------------------------- */
.errorlist {
margin-top: 1rem;
......@@ -247,16 +281,16 @@ body {
padding: 0;
}
.errorlist > li {
.errorlist>li {
list-style: none;
color: rgb(177, 55, 55);
border: thin solid rgb(197, 157, 157);
border: thin solid rgb(197, 157, 157);
border-radius: 3px;
background-color: rgb(250, 241, 242);
padding: 0.5rem 1rem;
}
.infoslist > li {
.infoslist>li {
list-style: none;
color: #38989f;
border-radius: 3px;
......@@ -265,7 +299,7 @@ body {
}
/* ---------------------------------- */
/* PAGINATION */
/* PAGINATION */
/* ---------------------------------- */
.custom-pagination {
......@@ -275,12 +309,13 @@ body {
font-size: 1.2em;
}
.custom-pagination > .page-item > .page-link {
.custom-pagination>.page-item>.page-link {
border: none;
font-weight: 400;
color: #008080;
}
.custom-pagination > .page-item.active > .page-link {
.custom-pagination>.page-item.active>.page-link {
color: #008080;
background-color: transparent;
font-weight: bolder;
......@@ -288,18 +323,20 @@ body {
padding: 0.325em 0.75em;
pointer-events: none;
}
.custom-pagination > .page-item.disabled > .page-link {
.custom-pagination>.page-item.disabled>.page-link {
opacity: 0.5;
pointer-events: none;
}
.custom-pagination > div > .page-item > .page-link {
.custom-pagination>div>.page-item>.page-link {
border: none;
font-weight: 400;
color: #008080;
padding: 0.325em 0.75em;
}
.custom-pagination > div > .page-item.active > .page-link {
.custom-pagination>div>.page-item.active>.page-link {
color: #008080;
background-color: transparent;
font-weight: bolder;
......@@ -308,14 +345,15 @@ body {
padding: 0.325em 0.75em;
pointer-events: none;
}
.custom-pagination > div > .page-item.disabled > .page-link {
.custom-pagination>div>.page-item.disabled>.page-link {
opacity: 0.5;
padding: 0.325em 0.75em;
pointer-events: none;
}
/* ---------------------------------- */
/* MULTISELECT */
/* MULTISELECT */
/* ---------------------------------- */
.multiselect {
font-family: var(--font-family, 'Roboto Condensed', 'Lato', 'Helvetica Neue', Arial, Helvetica, sans-serif) !important;
......@@ -327,7 +365,8 @@ body {
font-family: var(--font-family, 'Roboto Condensed', 'Lato', 'Helvetica Neue', Arial, Helvetica, sans-serif) !important;
font-size: 1rem !important;
}
.multiselect__tags > .multiselect__input {
.multiselect__tags>.multiselect__input {
border: none !important;
font-size: 1rem !important;
overflow: hidden;
......@@ -340,7 +379,10 @@ body {
padding-top: 0;
}
.multiselect__single, .multiselect__tags, .multiselect__content, .multiselect__option {
.multiselect__single,
.multiselect__tags,
.multiselect__content,
.multiselect__option {
text-overflow: ellipsis;
white-space: nowrap;
overflow: hidden;
......@@ -352,9 +394,11 @@ body {
.multiselect__select {
z-index: 1 !important;
}
.multiselect__content-wrapper {
box-shadow: 0 2px 3px 0 rgba(34,36,38,.15);
box-shadow: 0 2px 3px 0 rgba(34, 36, 38, .15);
}
.multiselect__clear {
position: absolute;
right: 1px;
......@@ -365,6 +409,7 @@ body {
z-index: 9;
background-color: #fff;
}
.multiselect__spinner {
z-index: 2 !important;
background-color: #fff;
......@@ -372,10 +417,11 @@ body {
top: 2px;
}
.menu.projects > .item > .multiselect {
.menu.projects>.item>.multiselect {
min-height: 0px !important;
}
.menu.projects > .item > .multiselect > .multiselect__tags {
.menu.projects>.item>.multiselect>.multiselect__tags {
min-height: 0px !important;
}
......@@ -383,27 +429,33 @@ body {
background: #fff !important;
color: #35495e !important;
}
.multiselect__option--highlight {
background: #f3f3f3 !important;
color: #35495e !important;
}
.multiselect__option--selected.multiselect__option--highlight {
background: #f3f3f3 !important;
color: #35495e !important;
}
.multiselect__clear {
padding: 0 4px;
text-align: center;
}
.multiselect__clear i.icon {
font-size: .75em;
color: #999;
margin: 0;
}
/* ---------------------------------- */
/* OVERRIDE SEMANTIC STYLES */
/* OVERRIDE SEMANTIC STYLES */
/* ---------------------------------- */
.ui.page.dimmer { /* keep the dimmer above the dropdown (z-index 1001: above the map)*/
.ui.page.dimmer {
/* keep the dimmer above the dropdown (z-index 1001: above the map)*/
z-index: 1002;
}
}
\ No newline at end of file
0% Loading or .
You are about to add 0 people to the discussion. Proceed with caution.
Finish editing this message first!
Please register or to comment