diff --git a/src/app/core/components/home/home.component.html b/src/app/core/components/home/home.component.html index 75156e9e..a5e79ec7 100644 --- a/src/app/core/components/home/home.component.html +++ b/src/app/core/components/home/home.component.html @@ -3,20 +3,38 @@
-
+

titre h1

titre h2

titre h3

- - - - - - - - + + + + + + + + +
- +
+
+
+
+
+
+
+
+
+
+
+
+
+
+
+
+
+

{{ 'config.landing_title' | translate }}

@@ -25,14 +43,14 @@

-
diff --git a/src/app/features/administration/form/steps/step-four/step-four.component.html b/src/app/features/administration/form/steps/step-four/step-four.component.html index abdf5572..9c4b881e 100644 --- a/src/app/features/administration/form/steps/step-four/step-four.component.html +++ b/src/app/features/administration/form/steps/step-four/step-four.component.html @@ -46,7 +46,7 @@ - @@ -22,7 +22,7 @@
- {{ i * 1 + 1 }}) diff --git a/src/styles/dev-utilities/_helpers.scss b/src/styles/dev-utilities/_helpers.scss index 1289cdc4..b1673bc1 100644 --- a/src/styles/dev-utilities/_helpers.scss +++ b/src/styles/dev-utilities/_helpers.scss @@ -70,14 +70,8 @@ .go-to-step, .custom-action { @extend .clickable; - color: $secondary_color; padding: 1.5em; border-radius: 0.25em; - - &:hover { - background: $secondary_color; - color: $white; - } } } diff --git a/src/styles/libraries/_frameworks.scss b/src/styles/libraries/_frameworks.scss index 891f8f5b..2cf7c062 100644 --- a/src/styles/libraries/_frameworks.scss +++ b/src/styles/libraries/_frameworks.scss @@ -4,8 +4,8 @@ //@import '../../../node_modules/bulma/sass/base/_all.sass'; //@import '../../../node_modules/bulma/sass/elements/button.sass'; @import '../../../node_modules/bulma/sass/elements/container.sass'; -@import '../../../node_modules/bulma/sass/elements/title.sass'; -@import '../../../node_modules/bulma/sass/form/_all.sass'; +//@import '../../../node_modules/bulma/sass/elements/title.sass'; +//@import '../../../node_modules/bulma/sass/form/_all.sass'; @import '../../../node_modules/bulma/sass/components/navbar.sass'; @import '../../../node_modules/bulma/sass/layout/hero.sass'; @import '../../../node_modules/bulma/sass/layout/section.sass'; diff --git a/src/styles/partials/_buttons.scss b/src/styles/partials/_buttons.scss index 8e42735b..4cc495a9 100644 --- a/src/styles/partials/_buttons.scss +++ b/src/styles/partials/_buttons.scss @@ -1,42 +1,62 @@ .outlined { &:focus { - outline: #6359cf; + outline: $outline-color; outline-style: solid; + outline-offset: 0.15rem; } } -a { - @extend .outlined; -} + button, .btn { @extend .outlined; - @extend .button; } .btn--full { @extend .is-block; } -button { - &.is-white { - &:hover { - background: $secondary_color; - color: $white; - } - } - &:hover { - outline-color: cadetblue; - } +button, +a { + @extend .outlined; + text-align: center; + padding: 10px 30px; + border: 1px solid transparent; + box-sizing: border-box; + border-radius: 4px; + cursor: pointer; } -.is-success { +.is-white { + &:hover { + background: $secondary_color; + color: $white; + } +} +.is-final { background: #128149; + border-color: #128149; color: #fff; + &:hover { + background: #07532d; + border-color: #07532d; + } } .is-primary { background: #6359cf; color: #fff; + border-color: #6359cf; + &.is-disabled { + background: #767486; + } + &:hover { + background-color: #3e3882; + border-color: #3e3882; + &.is-disabled { + background: #767486; + border-color: #6359cf; + } + } } .is-disabled { @@ -48,7 +68,46 @@ button { background: #fff; color: #6359cf; border-color: #6359cf; + &.is-disabled { + color: #767486; + border-color: #767486; + } + &:hover { + background-color: #f6f5fb; + border-color: #3e3882; + color: #3e3882; + &.is-disabled { + color: #767486; + border-color: #767486; + } + } } + +.is-thin { + font-size: 14px; + line-height: 18px; +} + +.is-action { + background: #fff; + color: #6359cf; + border-radius: 100px; + border-color: transparent; + padding: 4px !important; + + &:hover { + background-color: #e3e3ea; + border-color: #e3e3ea; + color: #3e3882; + } +} + +.buttons-demo button { + float: left; + clear: both; + margin-bottom: 1rem; +} + .btn-primary { @extend .is-primary; } diff --git a/src/styles/partials/_datepicker.scss b/src/styles/partials/_datepicker.scss index b507a126..b3941efe 100644 --- a/src/styles/partials/_datepicker.scss +++ b/src/styles/partials/_datepicker.scss @@ -60,10 +60,8 @@ p-calendar, font-weight: normal; } - p-button, - button { + p-button { color: $primary_color !important; - &:hover { color: $white !important; background: $secondary_color !important; diff --git a/src/styles/partials/_forms.scss b/src/styles/partials/_forms.scss index 02e9ba32..d14c0b83 100644 --- a/src/styles/partials/_forms.scss +++ b/src/styles/partials/_forms.scss @@ -61,12 +61,6 @@ textarea { @extend .clickable; padding: 0.25rem 0.25rem 0.25rem 1rem; - &:active, - &:focus, - &:hover { - color: $primary_color; - } - &[required] { &:after { content: '*'; diff --git a/src/styles/partials/_navigation.scss b/src/styles/partials/_navigation.scss index 7c34e527..a9156adb 100644 --- a/src/styles/partials/_navigation.scss +++ b/src/styles/partials/_navigation.scss @@ -22,15 +22,6 @@ nav { &::after { display: none; } - - &.active, - &.is-active { - color: $white; - background: $primary_color !important; - &:hover { - background: $dark !important; - } - } } } a { @@ -45,13 +36,6 @@ a { content: ''; } - &:hover { - &.next::before, - &.prev::after { - background-color: rgba($primary_color, 0.7); - } - } - span { padding-right: 1rem; padding-left: 1rem; diff --git a/src/styles/variables.scss b/src/styles/variables.scss index c8949f5f..2d0755c2 100644 --- a/src/styles/variables.scss +++ b/src/styles/variables.scss @@ -37,6 +37,7 @@ $d-alt: #a9607f; $d-info: #ecf4ff; $d-info-text: #316ec7; +$intense-blue: #0a76f6; $d-success: #ecfff5; $d-success-text: #128149; $d-warning: #dcd3bb; @@ -45,6 +46,7 @@ $d-error: #ffecee; $d-error-text: #d51b38; // interpretations in app +$outline-color: $intense-blue; // #0a76f6 $success_color: $d-success-text; $primary_color: $d-primary; $primary: $d-primary;