Commit 8d54e1fc authored by Alexandre Delanoë's avatar Alexandre Delanoë

Merge remote-tracking branch 'origin/dev-509-improve-global-theme' into dev

parents c9007420 8f4c57e2
This diff is collapsed.
......@@ -6081,6 +6081,27 @@ h3 {
background-color: white;
}
.b-icon:not(.fa-exclamation-circle):not(.fa-circle):not(.fa-times):before, .fa:not(.fa-exclamation-circle):not(.fa-circle):not(.fa-times):before {
color: #005a9a;
}
.b-icon:not(.fa-exclamation-circle):not(.fa-circle):not(.fa-times):hover:before, .fa:not(.fa-exclamation-circle):not(.fa-circle):not(.fa-times):hover:before {
color: inherit;
}
.main-topbar .nav-item > a .fa,
.popup-container .card-footer .btn-primary {
color: #f8f9fa !important;
}
.main-topbar .nav-item > a .fa:before,
.popup-container .card-footer .btn-primary:before {
color: #f8f9fa !important;
}
.table .thead-dark th {
background-color: #005a9a;
border-color: #003c67;
}
.b-fieldset {
position: relative;
border: 1px solid rgba(0, 0, 0, 0.125);
......@@ -6429,6 +6450,10 @@ body {
background-color: #fff;
}
.font-family-theme {
font-family: -apple-system, BlinkMacSystemFont, "Segoe UI", Roboto, "Helvetica Neue", Arial, "Noto Sans", "Liberation Sans", sans-serif, "Apple Color Emoji", "Segoe UI Emoji", "Segoe UI Symbol", "Noto Color Emoji";
}
pre,
code,
kbd,
......@@ -9294,6 +9319,14 @@ input[type=range]:-moz-focusring {
margin-right: 8px;
}
.dropdown .dropdown-item {
padding-left: 1rem;
}
.dropdown .dropdown-item a span {
min-width: 24px;
text-align: center;
}
.graph-layout {
position: relative;
z-index: 0;
......
......@@ -5836,6 +5836,27 @@ h3 {
background-color: white;
}
.b-icon:not(.fa-exclamation-circle):not(.fa-circle):not(.fa-times):before, .fa:not(.fa-exclamation-circle):not(.fa-circle):not(.fa-times):before {
color: #2f3c48;
}
.b-icon:not(.fa-exclamation-circle):not(.fa-circle):not(.fa-times):hover:before, .fa:not(.fa-exclamation-circle):not(.fa-circle):not(.fa-times):hover:before {
color: inherit;
}
.main-topbar .nav-item > a .fa,
.popup-container .card-footer .btn-primary {
color: #eceeec !important;
}
.main-topbar .nav-item > a .fa:before,
.popup-container .card-footer .btn-primary:before {
color: #eceeec !important;
}
.table .thead-dark th {
background-color: #2f3c48;
border-color: #1b2229;
}
.b-fieldset {
position: relative;
border: 1px solid rgba(0, 0, 0, 0.125);
......@@ -6185,6 +6206,10 @@ body {
background-color: #fff;
}
.font-family-theme {
font-family: "Muli";
}
pre,
code,
kbd,
......@@ -9054,6 +9079,14 @@ input[type=range]:-moz-focusring {
margin-right: 8px;
}
.dropdown .dropdown-item {
padding-left: 1rem;
}
.dropdown .dropdown-item a span {
min-width: 24px;
text-align: center;
}
.graph-layout {
position: relative;
z-index: 0;
......
......@@ -6084,6 +6084,27 @@ h3 {
background-color: white;
}
.b-icon:not(.fa-exclamation-circle):not(.fa-circle):not(.fa-times):before, .fa:not(.fa-exclamation-circle):not(.fa-circle):not(.fa-times):before {
color: #083358;
}
.b-icon:not(.fa-exclamation-circle):not(.fa-circle):not(.fa-times):hover:before, .fa:not(.fa-exclamation-circle):not(.fa-circle):not(.fa-times):hover:before {
color: inherit;
}
.main-topbar .nav-item > a .fa,
.popup-container .card-footer .btn-primary {
color: #F2F2F0 !important;
}
.main-topbar .nav-item > a .fa:before,
.popup-container .card-footer .btn-primary:before {
color: #F2F2F0 !important;
}
.table .thead-dark th {
background-color: #083358;
border-color: #041829;
}
.b-fieldset {
position: relative;
border: 1px solid rgba(0, 0, 0, 0.125);
......@@ -6433,6 +6454,10 @@ body {
background-color: #fff;
}
.font-family-theme {
font-family: "Nunito";
}
pre,
code,
kbd,
......@@ -9302,6 +9327,14 @@ input[type=range]:-moz-focusring {
margin-right: 8px;
}
.dropdown .dropdown-item {
padding-left: 1rem;
}
.dropdown .dropdown-item a span {
min-width: 24px;
text-align: center;
}
.graph-layout {
position: relative;
z-index: 0;
......
......@@ -6085,6 +6085,27 @@ h3 {
background-color: white;
}
.b-icon:not(.fa-exclamation-circle):not(.fa-circle):not(.fa-times):before, .fa:not(.fa-exclamation-circle):not(.fa-circle):not(.fa-times):before {
color: #222222;
}
.b-icon:not(.fa-exclamation-circle):not(.fa-circle):not(.fa-times):hover:before, .fa:not(.fa-exclamation-circle):not(.fa-circle):not(.fa-times):hover:before {
color: inherit;
}
.main-topbar .nav-item > a .fa,
.popup-container .card-footer .btn-primary {
color: #eceeec !important;
}
.main-topbar .nav-item > a .fa:before,
.popup-container .card-footer .btn-primary:before {
color: #eceeec !important;
}
.table .thead-dark th {
background-color: #222222;
border-color: #090909;
}
.b-fieldset {
position: relative;
border: 1px solid rgba(0, 0, 0, 0.125);
......@@ -6434,6 +6455,10 @@ body {
background-color: #fff;
}
.font-family-theme {
font-family: "Montserrat";
}
pre,
code,
kbd,
......@@ -9303,6 +9328,14 @@ input[type=range]:-moz-focusring {
margin-right: 8px;
}
.dropdown .dropdown-item {
padding-left: 1rem;
}
.dropdown .dropdown-item a span {
min-width: 24px;
text-align: center;
}
.graph-layout {
position: relative;
z-index: 0;
......
......@@ -319,7 +319,7 @@ searchBarCpt = here.component "searchBar" cpt
pure unit
searchButton query queryText' =
H.button { className: "btn btn-primary"
H.button { className: "btn btn-light"
, on: { click: \_ -> T.write_ queryText' query }
, type: "submit" }
[ H.span {className: "fa fa-search"} [] ]
......
......@@ -30,7 +30,10 @@ actionDocCpt = here.component "actionDoc" cpt where
infoTitle :: NodeType -> R.Element
infoTitle nt = H.div { style: {margin: "10px"}}
[ H.h3 {} [H.text "Documentation about " ]
, H.h3 {className: GT.fldr nt true} [ H.text $ show nt ]
, H.h3 {className: GT.fldr nt true}
[ H.span {className: "font-family-theme mx-1"}
[ H.text $ show nt ]
]
]
-- | TODO add documentation of all NodeType
......
......@@ -257,13 +257,14 @@ submitButton action dispatch =
, title: show action
, on: {click: \_ -> launchAff $ dispatch action}
}
[ H.text $ " " <> text action]
[ H.span {className: "font-family-theme mx-1"} [ H.text $ " " <> text action] ]
type Href = String
submitButtonHref :: Action -> Href -> R.Element
submitButtonHref action href =
H.a { className, href, target: "_blank" } [ H.text $ " " <> text action ]
H.a { className, href, target: "_blank" }
[ H.span {className: "font-family-theme mx-1"} [ H.text $ " " <> text action ] ]
where
className = "btn btn-primary fa fa-" <> icon action
......
......@@ -101,3 +101,12 @@
.fa
margin-right: space-x(1)
.dropdown
.dropdown-item
padding-left: 1rem
a
span
min-width: 24px
text-align: center
......@@ -15,6 +15,10 @@ body {
background-color: $body-bg;
}
.font-family-theme {
font-family: $font-family-base;
}
/// from "_reboot.scss"
pre,
code,
......
......@@ -88,7 +88,6 @@
/// Button
///-----------------------------------------------------------------------------
.b-button {
$spinner-size: 20px;
$self: &;
......@@ -237,6 +236,38 @@
}
}
/// Simple icons (in Forest action buttons or not clickable or in modal, etc.)
/// ----------------------------------------------------------------------------
.b-icon, .fa {
&:not(.fa-exclamation-circle):not(.fa-circle):not(.fa-times) {
&:before {
color: $primary;
}
&:hover:before {
color: inherit;
}
}
}
.main-topbar .nav-item > a .fa,
.popup-container .card-footer .btn-primary {
color: $light !important;
&:before {
color: $light !important;
}
}
/// Table headings with bg color
/// ----------------------------------------------------------------------------
.table .thead-dark th {
background-color: $primary;
border-color: darken($primary, 10%);
}
/// Fieldset
///-----------------------------------------------------------------------------
......
......@@ -10,18 +10,165 @@
@import "./abstract";
// Fonts
@import url(https://fonts.googleapis.com/css?family=Comfortaa:200,300,400,700);
// @import url(https://fonts.googleapis.com/css?family=Comfortaa:200,300,400,700);
/* cyrillic-ext */
@font-face {
font-family: 'Comfortaa';
font-style: normal;
font-weight: 300;
src: url(/fonts/comfortaa/1Ptsg8LJRfWJmhDAuUs4QIFqPfE.woff2) format('woff2');
unicode-range: U+0460-052F, U+1C80-1C88, U+20B4, U+2DE0-2DFF, U+A640-A69F, U+FE2E-FE2F;
}
/* cyrillic */
@font-face {
font-family: 'Comfortaa';
font-style: normal;
font-weight: 300;
src: url(/fonts/comfortaa/1Ptsg8LJRfWJmhDAuUs4SYFqPfE.woff2) format('woff2');
unicode-range: U+0301, U+0400-045F, U+0490-0491, U+04B0-04B1, U+2116;
}
/* greek */
@font-face {
font-family: 'Comfortaa';
font-style: normal;
font-weight: 300;
src: url(/fonts/comfortaa/1Ptsg8LJRfWJmhDAuUs4ToFqPfE.woff2) format('woff2');
unicode-range: U+0370-03FF;
}
/* vietnamese */
@font-face {
font-family: 'Comfortaa';
font-style: normal;
font-weight: 300;
src: url(/fonts/comfortaa/1Ptsg8LJRfWJmhDAuUs4QoFqPfE.woff2) format('woff2');
unicode-range: U+0102-0103, U+0110-0111, U+0128-0129, U+0168-0169, U+01A0-01A1, U+01AF-01B0, U+1EA0-1EF9, U+20AB;
}
/* latin-ext */
@font-face {
font-family: 'Comfortaa';
font-style: normal;
font-weight: 300;
src: url(/fonts/comfortaa/1Ptsg8LJRfWJmhDAuUs4Q4FqPfE.woff2) format('woff2');
unicode-range: U+0100-024F, U+0259, U+1E00-1EFF, U+2020, U+20A0-20AB, U+20AD-20CF, U+2113, U+2C60-2C7F, U+A720-A7FF;
}
/* latin */
@font-face {
font-family: 'Comfortaa';
font-style: normal;
font-weight: 300;
src: url(/fonts/comfortaa/1Ptsg8LJRfWJmhDAuUs4TYFq.woff2) format('woff2');
unicode-range: U+0000-00FF, U+0131, U+0152-0153, U+02BB-02BC, U+02C6, U+02DA, U+02DC, U+2000-206F, U+2074, U+20AC, U+2122, U+2191, U+2193, U+2212, U+2215, U+FEFF, U+FFFD;
}
/* cyrillic-ext */
@font-face {
font-family: 'Comfortaa';
font-style: normal;
font-weight: 400;
src: url(/fonts/comfortaa/1Ptsg8LJRfWJmhDAuUs4QIFqPfE.woff2) format('woff2');
unicode-range: U+0460-052F, U+1C80-1C88, U+20B4, U+2DE0-2DFF, U+A640-A69F, U+FE2E-FE2F;
}
/* cyrillic */
@font-face {
font-family: 'Comfortaa';
font-style: normal;
font-weight: 400;
src: url(/fonts/comfortaa/1Ptsg8LJRfWJmhDAuUs4SYFqPfE.woff2) format('woff2');
unicode-range: U+0301, U+0400-045F, U+0490-0491, U+04B0-04B1, U+2116;
}
/* greek */
@font-face {
font-family: 'Comfortaa';
font-style: normal;
font-weight: 400;
src: url(/fonts/comfortaa/1Ptsg8LJRfWJmhDAuUs4ToFqPfE.woff2) format('woff2');
unicode-range: U+0370-03FF;
}
/* vietnamese */
@font-face {
font-family: 'Comfortaa';
font-style: normal;
font-weight: 400;
src: url(/fonts/comfortaa/1Ptsg8LJRfWJmhDAuUs4QoFqPfE.woff2) format('woff2');
unicode-range: U+0102-0103, U+0110-0111, U+0128-0129, U+0168-0169, U+01A0-01A1, U+01AF-01B0, U+1EA0-1EF9, U+20AB;
}
/* latin-ext */
@font-face {
font-family: 'Comfortaa';
font-style: normal;
font-weight: 400;
src: url(/fonts/comfortaa/1Ptsg8LJRfWJmhDAuUs4Q4FqPfE.woff2) format('woff2');
unicode-range: U+0100-024F, U+0259, U+1E00-1EFF, U+2020, U+20A0-20AB, U+20AD-20CF, U+2113, U+2C60-2C7F, U+A720-A7FF;
}
/* latin */
@font-face {
font-family: 'Comfortaa';
font-style: normal;
font-weight: 400;
src: url(/fonts/comfortaa/1Ptsg8LJRfWJmhDAuUs4TYFq.woff2) format('woff2');
unicode-range: U+0000-00FF, U+0131, U+0152-0153, U+02BB-02BC, U+02C6, U+02DA, U+02DC, U+2000-206F, U+2074, U+20AC, U+2122, U+2191, U+2193, U+2212, U+2215, U+FEFF, U+FFFD;
}
/* cyrillic-ext */
@font-face {
font-family: 'Comfortaa';
font-style: normal;
font-weight: 700;
src: url(/fonts/comfortaa/1Ptsg8LJRfWJmhDAuUs4QIFqPfE.woff2) format('woff2');
unicode-range: U+0460-052F, U+1C80-1C88, U+20B4, U+2DE0-2DFF, U+A640-A69F, U+FE2E-FE2F;
}
/* cyrillic */
@font-face {
font-family: 'Comfortaa';
font-style: normal;
font-weight: 700;
src: url(/fonts/comfortaa/1Ptsg8LJRfWJmhDAuUs4SYFqPfE.woff2) format('woff2');
unicode-range: U+0301, U+0400-045F, U+0490-0491, U+04B0-04B1, U+2116;
}
/* greek */
@font-face {
font-family: 'Comfortaa';
font-style: normal;
font-weight: 700;
src: url(/fonts/comfortaa/1Ptsg8LJRfWJmhDAuUs4ToFqPfE.woff2) format('woff2');
unicode-range: U+0370-03FF;
}
/* vietnamese */
@font-face {
font-family: 'Comfortaa';
font-style: normal;
font-weight: 700;
src: url(/fonts/comfortaa/1Ptsg8LJRfWJmhDAuUs4QoFqPfE.woff2) format('woff2');
unicode-range: U+0102-0103, U+0110-0111, U+0128-0129, U+0168-0169, U+01A0-01A1, U+01AF-01B0, U+1EA0-1EF9, U+20AB;
}
/* latin-ext */
@font-face {
font-family: 'Comfortaa';
font-style: normal;
font-weight: 700;
src: url(/fonts/comfortaa/1Ptsg8LJRfWJmhDAuUs4Q4FqPfE.woff2) format('woff2');
unicode-range: U+0100-024F, U+0259, U+1E00-1EFF, U+2020, U+20A0-20AB, U+20AD-20CF, U+2113, U+2C60-2C7F, U+A720-A7FF;
}
/* latin */
@font-face {
font-family: 'Comfortaa';
font-style: normal;
font-weight: 700;
src: url(/fonts/comfortaa/1Ptsg8LJRfWJmhDAuUs4TYFq.woff2) format('woff2');
unicode-range: U+0000-00FF, U+0131, U+0152-0153, U+02BB-02BC, U+02C6, U+02DA, U+02DC, U+2000-206F, U+2074, U+20AC, U+2122, U+2191, U+2193, U+2212, U+2215, U+FEFF, U+FFFD;
}
$headings-font-family: "Comfortaa";
// Colors
$primary :#FF550B;
$secondary :#303030;
$primary :#33A2FF;
$secondary :#52B0FF;
$success :#015668;
$danger :#FF304F;
$info :#0F81C7;
$warning :#0DE2EA;
$light :#e8e8e8;
$dark :#000000;
$light :#D1CDC7;
$dark :#2C2F31;
$light-secondary: #B5AFA6;
$dark-secondary: #383D3F;
$gray-50 : #121212; // (+)
$gray-100: #212529;
......@@ -85,7 +232,7 @@ $annotation-field-base-alpha: 15%;
// (overriding bootstrap "_variable.scss")
$enable-shadows:true;
$body-bg:$black;
$body-bg:#181A1B;
$body-color:#cccccc;
$link-color:#f0f0f0;
$font-size-base:1.1rem;
......@@ -158,22 +305,73 @@ $input-disabled-bg: $gray-100;
@import './_base';
.dropdown-menu {
a {
color: $light;
}
background-color: $body-bg;
.dropdown-item:hover, .dropdown-item:focus {
background-color: $dark-secondary;
}
.dropdown-divider {
border-top: 1px solid $dark-secondary;
}
}
.forest-layout {
border-right: 2px solid $dark-secondary !important;
}
.forest-layout__action {
.btn-light {
color: $light;
background-color: $dark;
border-color: $dark-secondary;
}
}
.navbar-dark.bg-primary {background-color:#111111 !important;}
.table.able {color:#ccccc5}
.navbar-dark.bg-primary {
background-color:#111111 !important;
}
.nav-tabs .nav-link.active, .nav-tabs .nav-item.show .nav-link {
background-color: $gray-300;
color: $gray-700
.table {
&.able {
color:#ccccc5;
}
th, td {
border-top: 1px solid $dark-secondary;
}
thead th {
border-bottom: 2px solid $dark-secondary;
}
}
.nav-tabs {
border-bottom: 1px solid $dark-secondary;
& .nav-link.active,
& .nav-item.show .nav-link {
background-color: $dark;
color: $light-secondary;
border-color: $dark-secondary;
}
}
.nav.nav-tabs li a.nav-link.active:hover {
color: $gray-900;
color: $dark;
}
.form-control,
.form-control:focus{
background-color: $gray-300;
background-color: $body-bg;
color: $gray-700;
border-color: $dark-secondary;
}
.card-header,
.card-footer {
background-color: $dark;
}
.card-header {
background-color: $gray-400;
.mainleaf {
&__version-badge {
background-color: $dark;
border: 1px solid $dark-secondary;
}
}
Markdown is supported
0% or
You are about to add 0 people to the discussion. Proceed with caution.
Finish editing this message first!
Please register or to comment