From 2e2eeae4f2ff799f45b15df4b8eea32a0c6d83a1 Mon Sep 17 00:00:00 2001 From: Mathieu Jaumotte Date: Mon, 5 Jul 2021 18:53:03 +0200 Subject: [PATCH 01/10] chill colors and buttons with bootstrap5 --- .../public/modules/bootstrap/_custom.scss | 15 +- .../modules/bootstrap/custom/_buttons.scss | 42 +++++ .../modules/bootstrap/custom/_variables.scss | 168 ++++++++++-------- 3 files changed, 141 insertions(+), 84 deletions(-) create mode 100644 src/Bundle/ChillMainBundle/Resources/public/modules/bootstrap/custom/_buttons.scss diff --git a/src/Bundle/ChillMainBundle/Resources/public/modules/bootstrap/_custom.scss b/src/Bundle/ChillMainBundle/Resources/public/modules/bootstrap/_custom.scss index 378597a61..51b84bf4e 100644 --- a/src/Bundle/ChillMainBundle/Resources/public/modules/bootstrap/_custom.scss +++ b/src/Bundle/ChillMainBundle/Resources/public/modules/bootstrap/_custom.scss @@ -2,19 +2,14 @@ * These custom styles will override bootstrap enabled stylesheets */ +/// chill buttons +@import 'custom/_buttons'; + /// titles h1, h2, .h1, .h2 { font-weight: $headings-font-weight + 200; } -/// buttons -.btn-success, -.btn-success:hover, -.btn-warning, -.btn-warning:hover { - color: $gray-100; -} - /// typography .open_sansbold { font-weight: bold; @@ -236,11 +231,11 @@ div.vertical-menu { border-radius: 0; margin-top: 0.5rem; a.list-group-item { - background-color: $info; + background-color: $chill-yellow; border: 0; margin-bottom: 0.25rem; &:hover { - background-color: shade-color($info, 5%) + background-color: tint-color($chill-yellow, 20%) } } } diff --git a/src/Bundle/ChillMainBundle/Resources/public/modules/bootstrap/custom/_buttons.scss b/src/Bundle/ChillMainBundle/Resources/public/modules/bootstrap/custom/_buttons.scss new file mode 100644 index 000000000..e8a767ffa --- /dev/null +++ b/src/Bundle/ChillMainBundle/Resources/public/modules/bootstrap/custom/_buttons.scss @@ -0,0 +1,42 @@ + +/// buttons + + +.btn-success, +.btn-success:hover, +.btn-warning, +.btn-warning:hover { + color: $light; +} + +.btn { + &.btn-submit, + &.btn-save, + &.btn-create, + &.btn-new, + &.btn-duplicate, + &.btn-not-duplicate { + background-color: $chill-green; + color: $light; + } + + &.btn-reset, + &.btn-delete, + &.btn-remove { + background-color: $chill-red; + color: $light; + } + + &.btn-action, + &.btn-edit, + &.btn-update { + background-color: $chill-orange; + color: $light; + } + + &.btn-show, + &.btn-view { + background-color: $chill-blue; + color: $light; + } +} diff --git a/src/Bundle/ChillMainBundle/Resources/public/modules/bootstrap/custom/_variables.scss b/src/Bundle/ChillMainBundle/Resources/public/modules/bootstrap/custom/_variables.scss index e6e6e25ad..e08569ff9 100644 --- a/src/Bundle/ChillMainBundle/Resources/public/modules/bootstrap/custom/_variables.scss +++ b/src/Bundle/ChillMainBundle/Resources/public/modules/bootstrap/custom/_variables.scss @@ -19,6 +19,21 @@ $gray-900: #212529 !default; $black: #111 !default; // scss-docs-end gray-color-variables +/* + * CHILL Theme colors + * (apply chill colors, add missing colors, trust in bootstrap grey scale) +*/ +// scss-docs-start color-variables +$blue: #334d5c !default; +$green: #43b29d !default; +$yellow: #eec84a !default; +$orange: #e2793d !default; +$red: #df4949 !default; +$pink: #dd506d !default; +$beige: #cabb9f !default; +// scss-docs-end color-variables + + // fusv-disable // scss-docs-start gray-colors-map $grays: ( @@ -35,70 +50,6 @@ $grays: ( // scss-docs-end gray-colors-map // fusv-enable -/* - * CHILL Theme colors - * (apply chill colors, add missing colors, trust in bootstrap grey scale) -*/ -// scss-docs-start color-variables -$blue: #334d5c !default; -$green: #43b29d !default; -$yellow: #eec84a !default; -$orange: #e2793d !default; -$red: #df4949 !default; -$pink: #dd506d !default; -$green-dark: #328474 !default; -$beige: #cabb9f !default; -// scss-docs-end color-variables - - -// scss-docs-start colors-map -$colors: ( - "blue": $blue, - "green": $green, - "yellow": $yellow, - "orange": $orange, - "red": $red, - "pink": $pink, - "green-dark": $green-dark, - "beige": $beige, - "white": $white, - "gray": $gray-600, - "gray-dark": $gray-800 -) !default; -// scss-docs-end colors-map - -// scss-docs-start theme-color-variables -$primary: $blue; -$secondary: $gray-200; -$success: $green; -$info: $yellow; -$warning: $orange; -$danger: $red; -$light: $gray-100; -$dark: $gray-800; -// scss-docs-end theme-color-variables - -// scss-docs-start theme-colors-map -$theme-colors: ( - "primary": $primary, - "secondary": $secondary, - "success": $success, - "info": $info, - "warning": $warning, - "danger": $danger, - "light": $light, - "dark": $dark -) !default; -// scss-docs-end theme-colors-map - -// The contrast ratio to reach against white, to determine if color changes from "light" to "dark". Acceptable values for WCAG 2.0 are 3, 4.5 and 7. -// See https://www.w3.org/TR/WCAG20/#visual-audio-contrast-contrast -$min-contrast-ratio: 4.5 !default; - -// Customize the light and dark text colors for use in our color contrast function. -$color-contrast-dark: $black !default; -$color-contrast-light: $white !default; - // fusv-disable $blue-100: tint-color($blue, 80%) !default; $blue-200: tint-color($blue, 60%) !default; @@ -110,16 +61,6 @@ $blue-700: shade-color($blue, 40%) !default; $blue-800: shade-color($blue, 60%) !default; $blue-900: shade-color($blue, 80%) !default; -$green-dark-100: tint-color($green-dark, 80%) !default; -$green-dark-200: tint-color($green-dark, 60%) !default; -$green-dark-300: tint-color($green-dark, 40%) !default; -$green-dark-400: tint-color($green-dark, 20%) !default; -$green-dark-500: $green-dark !default; -$green-dark-600: shade-color($green-dark, 20%) !default; -$green-dark-700: shade-color($green-dark, 40%) !default; -$green-dark-800: shade-color($green-dark, 60%) !default; -$green-dark-900: shade-color($green-dark, 80%) !default; - $beige-100: tint-color($beige, 80%) !default; $beige-200: tint-color($beige, 60%) !default; $beige-300: tint-color($beige, 40%) !default; @@ -181,6 +122,85 @@ $green-800: shade-color($green, 60%) !default; $green-900: shade-color($green, 80%) !default; // fusv-enable +// scss-docs-start colors-map +$colors: ( + "blue": $blue, + "green": $green, + "yellow": $yellow, + "orange": $orange, + "red": $red, + "pink": $pink, + "green-dark": $green-800, + "beige": $beige, + "white": $white, + "gray": $gray-600, + "gray-dark": $gray-800 +) !default; +// scss-docs-end colors-map + +// scss-docs-start theme-color-variables +$primary: $blue; +$secondary: $gray-200; +$success: $green; +$info: $yellow; +$warning: $orange; +$danger: $red; +$light: $gray-100; +$dark: $gray-800; +$chill-blue: $blue; +$chill-green: $green; +$chill-green-dark: $green-800; +$chill-orange: $orange; +$chill-yellow: $yellow; +$chill-red: $red; +$chill-beige: $beige; +$chill-pink: $pink; +$chill-gray: $gray-600; +$chill-dark-gray: $gray-800; +$chill-light-gray: $gray-200; +$chill-llight-gray: $gray-100; +// scss-docs-end theme-color-variables + + +// scss-docs-start theme-colors-map +$theme-colors: ( + "primary": $primary, + "secondary": $secondary, + "success": $success, + "info": $info, + "warning": $warning, + "danger": $danger, + "light": $light, + "dark": $dark, +) !default; +// scss-docs-end theme-colors-map + +$chill-colors: ( + "chill-blue": $chill-blue, + "chill-green": $chill-green, + "chill-green-dark": $chill-green-dark, + "chill-orange": $chill-orange, + "chill-yellow": $chill-yellow, + "chill-red": $chill-red, + "chill-beige": $chill-beige, + "chill-pink": $chill-pink, + "chill-gray": $chill-gray, + "chill-dark-gray": $chill-dark-gray, + "chill-light-gray": $chill-light-gray, + "chill-llight-gray": $chill-llight-gray, +); + +// Merge the maps +$theme-colors: map-merge($theme-colors, $chill-colors); + +// The contrast ratio to reach against white, to determine if color changes from "light" to "dark". Acceptable values for WCAG 2.0 are 3, 4.5 and 7. +// See https://www.w3.org/TR/WCAG20/#visual-audio-contrast-contrast +$min-contrast-ratio: 4.5 !default; + +// Customize the light and dark text colors for use in our color contrast function. +$color-contrast-dark: $black !default; +$color-contrast-light: $white !default; + // Characters which are escaped by the escape-svg function $escaped-characters: ( ("<", "%3c"), From 05a1f7d04162c31f886f35e69ec840446d58d44e Mon Sep 17 00:00:00 2001 From: Mathieu Jaumotte Date: Mon, 5 Jul 2021 19:02:09 +0200 Subject: [PATCH 02/10] batch rename class sc-button (scratch) by btn (bootstrap) --- .../Resources/views/Activity/edit.html.twig | 4 ++-- .../Resources/views/Activity/list.html.twig | 10 ++++----- .../Resources/views/Activity/new.html.twig | 4 ++-- .../Resources/views/Activity/show.html.twig | 6 ++--- .../views/ActivityPresence/index.html.twig | 4 ++-- .../views/ActivityReason/edit.html.twig | 2 +- .../views/ActivityReason/index.html.twig | 6 ++--- .../views/ActivityReason/new.html.twig | 4 ++-- .../views/ActivityReason/show.html.twig | 4 ++-- .../ActivityReasonCategory/edit.html.twig | 4 ++-- .../ActivityReasonCategory/index.html.twig | 6 ++--- .../ActivityReasonCategory/new.html.twig | 4 ++-- .../ActivityReasonCategory/show.html.twig | 4 ++-- .../views/ActivityType/index.html.twig | 4 ++-- .../ActivityTypeCategory/index.html.twig | 4 ++-- .../activity_person_context.html.twig | 4 ++-- .../Resources/views/Charge/edit.html.twig | 4 ++-- .../Resources/views/Charge/new.html.twig | 4 ++-- .../Resources/views/Charge/view.html.twig | 4 ++-- .../Resources/views/Element/index.html.twig | 14 ++++++------ .../Resources/views/Resource/edit.html.twig | 4 ++-- .../Resources/views/Resource/new.html.twig | 4 ++-- .../Resources/views/Resource/view.html.twig | 4 ++-- .../views/CustomFieldsGroup/edit.html.twig | 6 ++--- .../views/CustomFieldsGroup/index.html.twig | 4 ++-- .../views/CustomFieldsGroup/new.html.twig | 4 ++-- .../views/CustomFieldsGroup/show.html.twig | 10 ++++----- .../Resources/views/Form/fields.html.twig | 2 +- .../DocumentCategory/_delete_form.html.twig | 2 +- .../views/DocumentCategory/_form.html.twig | 2 +- .../views/DocumentCategory/edit.html.twig | 4 ++-- .../views/DocumentCategory/index.html.twig | 6 ++--- .../views/DocumentCategory/new.html.twig | 4 ++-- .../views/DocumentCategory/show.html.twig | 4 ++-- .../Resources/views/Macro/macro.html.twig | 2 +- .../PersonDocument/_delete_form.html.twig | 2 +- .../views/PersonDocument/edit.html.twig | 4 ++-- .../views/PersonDocument/index.html.twig | 6 ++--- .../views/PersonDocument/new.html.twig | 4 ++-- .../views/PersonDocument/show.html.twig | 4 ++-- .../Resources/views/Event/edit.html.twig | 4 ++-- .../Resources/views/Event/list.html.twig | 4 ++-- .../Resources/views/Event/new.html.twig | 4 ++-- .../views/Event/newPickCenter.html.twig | 2 +- .../Resources/views/Event/show.html.twig | 18 +++++++-------- .../Resources/views/EventType/edit.html.twig | 4 ++-- .../Resources/views/EventType/index.html.twig | 6 ++--- .../Resources/views/EventType/new.html.twig | 4 ++-- .../Resources/views/EventType/show.html.twig | 6 ++--- .../Participation/edit-multiple.html.twig | 4 ++-- .../views/Participation/edit.html.twig | 4 ++-- .../Participation/new-multiple.html.twig | 2 +- .../views/Participation/new.html.twig | 2 +- .../Resources/views/Role/edit.html.twig | 4 ++-- .../Resources/views/Role/index.html.twig | 6 ++--- .../Resources/views/Role/new.html.twig | 4 ++-- .../Resources/views/Role/show.html.twig | 6 ++--- .../Resources/views/Status/edit.html.twig | 4 ++-- .../Resources/views/Status/index.html.twig | 6 ++--- .../Resources/views/Status/new.html.twig | 4 ++-- .../Resources/views/Status/show.html.twig | 6 ++--- .../Timeline/event_person_context.html.twig | 2 +- .../views/FamilyMember/edit.html.twig | 4 ++-- .../views/FamilyMember/index.html.twig | 8 +++---- .../views/FamilyMember/new.html.twig | 4 ++-- .../views/FamilyMember/view.html.twig | 4 ++-- .../Resources/public/vuejs/Address/App.vue | 4 ++-- .../public/vuejs/_components/AddAddress.vue | 6 ++--- .../public/vuejs/_components/Modal.vue | 2 +- .../public/vuejs/_components/OnTheFly.vue | 6 ++--- .../views/CRUD/_delete_content.html.twig | 6 ++--- .../views/CRUD/_edit_content.html.twig | 10 ++++----- .../Resources/views/CRUD/_index.html.twig | 2 +- .../views/CRUD/_new_content.html.twig | 8 +++---- .../views/CRUD/_view_content.html.twig | 8 +++---- .../Resources/views/Export/layout.html.twig | 4 ++-- .../views/PermissionsGroup/edit.html.twig | 6 ++--- .../views/PermissionsGroup/index.html.twig | 6 ++--- .../views/PermissionsGroup/show.html.twig | 4 ++-- .../views/Search/advanced_search.html.twig | 2 +- .../Util/confirmation_template.html.twig | 4 ++-- .../AccompanyingCourse/components/Comment.vue | 4 ++-- .../AccompanyingCourse/components/Confirm.vue | 4 ++-- .../PersonsAssociated/PersonItem.vue | 6 ++--- .../components/Referrer.vue | 2 +- .../components/Requestor.vue | 2 +- .../components/Resources/ResourceItem.vue | 2 +- .../AccompanyingCourse/components/Test.vue | 8 +++---- .../AccompanyingCourseWorkCreate/App.vue | 6 ++--- .../vuejs/AccompanyingCourseWorkEdit/App.vue | 10 ++++----- .../_components/AddResult.vue | 4 ++-- .../public/vuejs/HouseholdAddress/App.vue | 4 ++-- .../components/Confirmation.vue | 2 +- .../components/Household.vue | 12 +++++----- .../public/vuejs/_components/AddPersons.vue | 4 ++-- .../AccompanyingCourse/history.html.twig | 4 ++-- .../views/AccompanyingCourse/index.html.twig | 14 ++++++------ .../list_by_accompanying_period.html.twig | 4 ++-- .../views/AccompanyingPeriod/_list.html.twig | 8 +++---- .../views/AccompanyingPeriod/form.html.twig | 4 ++-- .../views/AccompanyingPeriod/list.html.twig | 8 +++---- .../AccompanyingPeriod/re_open.html.twig | 4 ++-- .../Resources/views/Address/list.html.twig | 8 +++---- .../Resources/views/CRUD/_index.html.twig | 2 +- .../views/CRUD/_new_content.html.twig | 8 +++---- .../views/CRUD/_view_content.html.twig | 8 +++---- .../Resources/views/CRUD/index.html.twig | 2 +- .../views/ClosingMotive/index.html.twig | 4 ++-- .../views/Household/Member/edit.html.twig | 4 ++-- .../Household/accompanying_period.html.twig | 4 ++-- .../views/Household/addresses.html.twig | 4 ++-- .../Household/edit_member_metadata.html.twig | 4 ++-- .../views/Household/members.html.twig | 12 +++++----- .../views/Household/summary.html.twig | 12 +++++----- .../views/MaritalStatus/index.html.twig | 2 +- .../views/Person/create_review.html.twig | 2 +- .../views/Person/household_history.html.twig | 4 ++-- .../Resources/views/Person/list.html.twig | 10 ++++----- .../Person/list_by_phonenumber.html.twig | 6 ++--- .../views/Person/list_with_period.html.twig | 10 ++++----- .../views/PersonDuplicate/confirm.html.twig | 8 +++---- .../PersonDuplicate/find_manually.html.twig | 2 +- .../views/PersonDuplicate/view.html.twig | 8 +++---- .../Resources/views/Report/edit.html.twig | 4 ++-- .../Resources/views/Report/list.html.twig | 6 ++--- .../Resources/views/Report/new.html.twig | 4 ++-- .../views/Report/select_report_type.html.twig | 2 +- .../Resources/views/Report/view.html.twig | 4 ++-- .../Resources/views/Timeline/report.html.twig | 4 ++-- .../views/SingleTask/_list.html.twig | 22 +++++++++---------- .../Resources/views/SingleTask/edit.html.twig | 4 ++-- .../Resources/views/SingleTask/show.html.twig | 8 +++---- .../views/SingleTask/transition.html.twig | 4 ++-- .../Timeline/single_task_transition.html.twig | 4 ++-- .../views/ThirdParty/index.html.twig | 6 ++--- .../Resources/views/ThirdParty/new.html.twig | 4 ++-- .../Resources/views/ThirdParty/show.html.twig | 4 ++-- .../views/ThirdParty/update.html.twig | 4 ++-- 138 files changed, 355 insertions(+), 355 deletions(-) diff --git a/src/Bundle/ChillActivityBundle/Resources/views/Activity/edit.html.twig b/src/Bundle/ChillActivityBundle/Resources/views/Activity/edit.html.twig index 5e010bc87..94211fff5 100644 --- a/src/Bundle/ChillActivityBundle/Resources/views/Activity/edit.html.twig +++ b/src/Bundle/ChillActivityBundle/Resources/views/Activity/edit.html.twig @@ -94,12 +94,12 @@ {{ form_end(edit_form) }} diff --git a/src/Bundle/ChillActivityBundle/Resources/views/Activity/list.html.twig b/src/Bundle/ChillActivityBundle/Resources/views/Activity/list.html.twig index a4d75917e..59b1e193e 100644 --- a/src/Bundle/ChillActivityBundle/Resources/views/Activity/list.html.twig +++ b/src/Bundle/ChillActivityBundle/Resources/views/Activity/list.html.twig @@ -13,7 +13,7 @@ {% if activities|length == 0 %}

{{ "There isn't any activities."|trans }} - +

{% else %} @@ -138,20 +138,20 @@