From e44c2bfb712fc06bdd0333cd92773dfca3d90d75 Mon Sep 17 00:00:00 2001 From: Suraj Shetty Date: Tue, 28 Jul 2020 17:29:52 +0530 Subject: [PATCH 1/8] refactor: Move dark theme style to separate file --- frappe/public/scss/dark.scss | 36 +++++++++++++++++++++++++++++ frappe/public/scss/variables.scss | 38 +------------------------------ 2 files changed, 37 insertions(+), 37 deletions(-) create mode 100644 frappe/public/scss/dark.scss diff --git a/frappe/public/scss/dark.scss b/frappe/public/scss/dark.scss new file mode 100644 index 0000000000..fae5d39204 --- /dev/null +++ b/frappe/public/scss/dark.scss @@ -0,0 +1,36 @@ +[data-theme="dark"] { + --gray-50: #{$gray-50}; + --gray-100: #F7FAFC; + --gray-200: #EDF2F7; + --gray-300: #E2E8F0; + --gray-400: #CBD5E0; + --gray-500: #A0AEC0; + --gray-600: #718096; + --gray-700: #4A5568; + --gray-800: #2D3748; + --gray-900: #1A202C; + + // Type Colors + --text-muted: var(--gray-300); + --text-light: var(--gray-400); + --text-color: var(--gray-50); + --heading-color: var(--gray-50); + + // SVG Colors + --icon-fill: transparent; + --icon-stroke: var(--gray-500); + + // Layout Colors + --bg-color: var(--gray-900); + --fg-color: var(--gray-800); + --card-bg: var(--gray-800); + --control-bg: var(--gray-700); + --modal-bg: var(--gray-700); + --toast-bg: var(--modal-bg); + --popover-bg: var(--bg-color); + + --sidebar-select-color: var(--gray-800); + + --shadow-inset: var(--fg-color); + --border-color: var(--gray-600); +} \ No newline at end of file diff --git a/frappe/public/scss/variables.scss b/frappe/public/scss/variables.scss index 1fab78ca39..2e79422a0e 100644 --- a/frappe/public/scss/variables.scss +++ b/frappe/public/scss/variables.scss @@ -232,43 +232,6 @@ $dropdown-border-radius: 0.375rem !default; $dropdown-item-padding-y: 0.5rem !default; $dropdown-item-padding-x: 0.5rem !default; -[data-theme="dark"] { - --gray-50: #{$gray-50}; - --gray-100: #F7FAFC; - --gray-200: #EDF2F7; - --gray-300: #E2E8F0; - --gray-400: #CBD5E0; - --gray-500: #A0AEC0; - --gray-600: #718096; - --gray-700: #4A5568; - --gray-800: #2D3748; - --gray-900: #1A202C; - - // Type Colors - --text-muted: var(--gray-300); - --text-light: var(--gray-400); - --text-color: var(--gray-50); - --heading-color: var(--gray-50); - - // SVG Colors - --icon-fill: transparent; - --icon-stroke: var(--gray-500); - - // Layout Colors - --bg-color: var(--gray-900); - --fg-color: var(--gray-800); - --card-bg: var(--gray-800); - --control-bg: var(--gray-700); - --modal-bg: var(--gray-700); - --toast-bg: var(--modal-bg); - --popover-bg: var(--bg-color); - - --sidebar-select-color: var(--gray-800); - - --shadow-inset: var(--fg-color); - --border-color: var(--gray-600); -} - $spacer: 14px; $grid-breakpoints: ( xs: 0, @@ -279,6 +242,7 @@ $grid-breakpoints: ( 2xl: 1440px ) !default; +@import 'dark'; @import 'typography'; @import '~bootstrap/scss/functions'; @import '~bootstrap/scss/variables'; From 66b06b42f3a2674bccb716dfdcbbcd6ea35cc4d7 Mon Sep 17 00:00:00 2001 From: Suraj Shetty Date: Tue, 28 Jul 2020 17:32:05 +0530 Subject: [PATCH 2/8] Merge branch 'rebrand-ui' of https://github.com/frappe/frappe into rebrand-ui --- .../js/frappe/views/calendar/calendar.js | 16 +++-- frappe/public/scss/calendar.scss | 71 ++++++++++++++----- frappe/public/scss/dark.scss | 1 + frappe/public/scss/desktop.scss | 10 ++- frappe/public/scss/frappe-datatable.scss | 36 +++++----- frappe/public/scss/image-view.scss | 2 +- frappe/public/scss/kanban.scss | 2 +- frappe/public/scss/list.scss | 63 +++------------- frappe/public/scss/variables.scss | 1 + 9 files changed, 106 insertions(+), 96 deletions(-) diff --git a/frappe/public/js/frappe/views/calendar/calendar.js b/frappe/public/js/frappe/views/calendar/calendar.js index a72a43268b..19e0058027 100644 --- a/frappe/public/js/frappe/views/calendar/calendar.js +++ b/frappe/public/js/frappe/views/calendar/calendar.js @@ -33,6 +33,11 @@ frappe.views.CalendarView = class CalendarView extends frappe.views.ListView { }); } + setup_page() { + this.hide_page_form = true; + super.setup_page(); + } + setup_view() { } @@ -180,7 +185,9 @@ frappe.views.Calendar = Class.extend({ .removeClass("fc-state-default") .addClass("btn btn-default"); - this.$wrapper.find(".fc-right").addClass("btn-group"); + this.$wrapper + .find('.fc-month-button, .fc-agendaWeek-button, .fc-agendaDay-button') + .wrapAll('
'); this.$wrapper.find('.fc-prev-button span') .attr('class', '').html(frappe.utils.icon('left')); @@ -198,7 +205,7 @@ frappe.views.Calendar = Class.extend({ btn_group.find(".btn").on("click", function() { btn_group.find(".btn").removeClass("active"); $(this).addClass("active"); - }); + }) }, field_map: { "id": "name", @@ -222,9 +229,8 @@ frappe.views.Calendar = Class.extend({ this.cal_options = { locale: frappe.boot.user.language || "en", header: { - left: 'today', - center: 'prev, title, next', - right: 'month, agendaWeek, agendaDay' + left: 'prev, title, next', + right: 'today, month, agendaWeek, agendaDay' }, editable: true, selectable: true, diff --git a/frappe/public/scss/calendar.scss b/frappe/public/scss/calendar.scss index f9d0aa4630..effb23c7d5 100644 --- a/frappe/public/scss/calendar.scss +++ b/frappe/public/scss/calendar.scss @@ -1,9 +1,10 @@ .fc-unthemed { - padding: 0 10px 0 30px; + padding: 20px; + color: var(--text-light); } .fc-toolbar { - padding-top: 30px; + // padding-top: 30px; padding-bottom: 15px; margin-bottom: 0px !important; } @@ -38,11 +39,11 @@ th.fc-widget-header { } .fc-unthemed td.fc-sun { - background: var(--gray-50); + background: var(--highlight-color); } .fc-unthemed .fc-today { - background-color: $white !important; + background-color: var(--fg-color) !important; .fc-day-number { background-color: var(--blue-500); @@ -108,7 +109,7 @@ th.fc-day-header { } } -.fc-center h2 { +.fc-left h2 { font-size: $font-size-lg; font-weight: 500; line-height: 28px; @@ -126,28 +127,22 @@ th.fc-day-header { } .fc-right button { - width: 64px; + min-width: 64px; } .fc-left button { width: 80px; - svg { - margin-right: 5px; - } + // svg { + // margin-right: 5px; + // } } -.fc-prev-button, .fc-next-button { - width: 28px; - display: flex; - justify-content: center; - align-items: center; -} .fc-state-active { box-shadow: none !important; background: var(--gray-500) !important; - color: white !important; + color: var(--fg-color) !important; z-index: 0 !important; } @@ -157,16 +152,54 @@ th.fc-day-header { padding: 1px 5px !important; } -.result .footnote-area { - padding: 15px 10px 0 30px; +// .result .footnote-area { +// padding: 15px 10px 0 30px; +// } + +.fc-time-grid .fc-slats .fc-minor td { + border-top-style: none !important; } .fc-highlight { background: var(--blue-100) !important; } +.fc-left { + .fc-prev-button, .fc-next-button { + width: 28px; + display: flex; + justify-content: center; + align-items: center; + background: var(--gray-100); + box-shadow: none; + border: none; -// TODO: Fix color palette + use { + stroke-width: 0.9; + } + } +} + +.fc-time-grid .fc-slats td { + height: 2.5em !important; +} + +.fc-day-grid { + border-bottom: 1px solid var(--gray-300); + // height: 2em !important; +} + +.fc-divider { + display: none; +} + +.fc .fc-axis { + color: var(--gray-600) !important; + text-align: center; + width: 60px !important; +} + +// REDESIGN-TODO: Fix color palette // @mixin fc-bg-color($color){ // $light: #{"${color}-light"}; // $extra-light: #{"${color}-extra-light"}; diff --git a/frappe/public/scss/dark.scss b/frappe/public/scss/dark.scss index fae5d39204..6b98bbd45a 100644 --- a/frappe/public/scss/dark.scss +++ b/frappe/public/scss/dark.scss @@ -33,4 +33,5 @@ --shadow-inset: var(--fg-color); --border-color: var(--gray-600); + --highlight-color: var(--gray-700); } \ No newline at end of file diff --git a/frappe/public/scss/desktop.scss b/frappe/public/scss/desktop.scss index d77522b375..7279c07a87 100644 --- a/frappe/public/scss/desktop.scss +++ b/frappe/public/scss/desktop.scss @@ -441,7 +441,7 @@ html, body { .widget-content { @include flex(flex, space-between, null, null); - padding-top: 25px; + padding-top: var(--padding-xl); .number { font-weight: 600; @@ -487,10 +487,18 @@ html, body { .green-stat { color: var(--dark-green-500); + + use { + stroke: var(--dark-green-500); + } } .red-stat { color: var(--red-500); + + use { + stroke: var(--red-500); + } } .grey-stat { diff --git a/frappe/public/scss/frappe-datatable.scss b/frappe/public/scss/frappe-datatable.scss index bb51838c54..57cb82cc2b 100644 --- a/frappe/public/scss/frappe-datatable.scss +++ b/frappe/public/scss/frappe-datatable.scss @@ -1,8 +1,22 @@ .datatable { - --dt-border-color: var(--gray-100); + --dt-primary-color: $primary; + --dt-light-bg: var(--highlight-color); + --dt-light-red: var(--red-50); + --dt-light-yellow: var(--yellow-50); + --dt-orange: var(--orange-500); + --dt-text-color: var(--text-light); + --dt-text-light: var(--bg-color); + --dt-spacer-1: 0.25rem; + --dt-spacer-2: 0.5rem; + --dt-spacer-3: 1rem; --dt-border-radius: var(--border-radius); - background-color: $white; + --dt-cell-bg: var(--fg-color); + --dt-border-color: var(--border-color); + --dt-border-radius: var(--border-radius); + --dt-header-cell-bg: var(--fg-color); + --dt-selection-highlight-color: var(--highlight-color); + background-color: var(--fg-color); margin-left: -5px; margin-top: 0px; font-size: var(--text-md); @@ -15,9 +29,6 @@ } .dt-header { - // --dt-header-cell-bg: white; - // --dt-cell-bg: white; - --dt-text-color: $text-muted; .dt-row[data-is-filter] { display: flex !important; @@ -58,9 +69,6 @@ min-height: 100px; scrollbar-width: thin; - .dt-cell { - --dt-text-color: $text-muted; - } } .dt-cell__edit { @@ -82,9 +90,9 @@ } .dt-filter.dt-input { - border-radius: $border-radius; + border-radius: var(--border-radius); height: 100%; - background-color: $gray-100; + background-color: var(--control); } .dt-scrollable { @@ -102,13 +110,7 @@ .dt-scrollable--highlight-all { .dt-cell__content { - background: var(--gray-50)!important; - } - } - - .dt-scrollable .dt-row--highlight { - .dt-cell__content { - background: var(--gray-50)!important; + background: var(--dt-selection-highlight-color); } } diff --git a/frappe/public/scss/image-view.scss b/frappe/public/scss/image-view.scss index 2ca93ef007..96af2843ee 100644 --- a/frappe/public/scss/image-view.scss +++ b/frappe/public/scss/image-view.scss @@ -57,7 +57,7 @@ .image-view-item:hover { border: none; - background-color: var(--control-bg); + background-color: var(--highlight-color); .list-row-checkbox { &:before { diff --git a/frappe/public/scss/kanban.scss b/frappe/public/scss/kanban.scss index 31cc5f2e27..503b9edd3b 100644 --- a/frappe/public/scss/kanban.scss +++ b/frappe/public/scss/kanban.scss @@ -98,7 +98,7 @@ justify-content: center; display: flex; align-items: center; - color: var(--gray-700); + color: var(--text-light); background-color: var(--fg-color); box-shadow: none; height: 27px; diff --git a/frappe/public/scss/list.scss b/frappe/public/scss/list.scss index 383c14a9f4..7a0972c631 100644 --- a/frappe/public/scss/list.scss +++ b/frappe/public/scss/list.scss @@ -89,7 +89,7 @@ font-size: var(--text-md); &:hover { - background-color: var(--control-bg); + background-color: var(--highlight-color); } &:last-child { border-bottom: 0px; @@ -163,12 +163,20 @@ .list-row-col { flex: 1; margin-right: 15px; + + a { + color: var(--text-light); + } } .list-subject { flex: 2; justify-content: start; + a { + color: var(--text-color); + } + .level-item { margin-right: 8px; } @@ -244,7 +252,7 @@ input.list-check-all, input.list-row-checkbox { font-size: var(--text-md); &:hover { - background-color: var(--control-bg); + background-color: var(--highlight-color); } // @media (max-width: $screen-xs) { @@ -256,7 +264,7 @@ input.list-check-all, input.list-row-checkbox { // } &--head { - background-color: var(--control-bg); + background-color: var(--highlight-color); border-bottom: 1px solid $border-color; cursor: auto; } @@ -493,52 +501,3 @@ input.list-check-all, input.list-row-checkbox { // margin-top: 5px; // } - -// input[type="checkbox"] { -// position: relative; -// visibility: hidden; -// // dispxlay: none; - -// &:before { -// position: absolute; -// font-family: 'FontAwesome'; -// // width: 4px; -// // height: 4px; -// content: '\f096'; -// // content: ' '; -// // background-image: url('../icons/frapicon-checkbox.svg'); -// // visibility: visible; -// // font-style: normal; -// // font-weight: normal; -// // font-variant: normal; -// // text-transform: none; -// // line-height: 14px; -// // display: inline-block; -// // font-size: 14px; -// // color: @text-extra-muted; -// // .transition(150ms color); -// // left: 0px; -// // display: inline-block; -// // vertical-align: middle; -// // width: 45px; -// // height: 45px; -// // background-size: 50%; -// // content: url("data:image/svg+xml;utf8,"); - -// // background: url('../icons/frapicon-checkbox.svg') 0px center no-repeat; -// } - -// &:focus:before { -// color: $text-muted; -// } - -// &:checked:before { -// content: '\f14a'; -// font-size: 13px; -// color: $checkbox-color; -// } - -// &:focus { -// outline: none; -// } -// } diff --git a/frappe/public/scss/variables.scss b/frappe/public/scss/variables.scss index 2e79422a0e..24e3b45339 100644 --- a/frappe/public/scss/variables.scss +++ b/frappe/public/scss/variables.scss @@ -173,6 +173,7 @@ $card-box-shadow: 0px 0px 1px rgba(17, 43, 66, 0.16), 0px 1px 3px rgba(17, 43, 6 --shadow-inset: var(--gray-100); --border-color: var(--gray-100); + --highlight-color: var(--gray-50); // Border Sizes --border-radius-sm: 4px; From 86572b621333c86774949e8dc25b45016a5ac614 Mon Sep 17 00:00:00 2001 From: Suraj Shetty Date: Tue, 28 Jul 2020 18:21:22 +0530 Subject: [PATCH 3/8] fix: Comment box style --- frappe/public/scss/controls.scss | 7 ------- frappe/public/scss/form.scss | 16 ++++++++++++++-- 2 files changed, 14 insertions(+), 9 deletions(-) diff --git a/frappe/public/scss/controls.scss b/frappe/public/scss/controls.scss index db827b5023..9a05c2f34b 100644 --- a/frappe/public/scss/controls.scss +++ b/frappe/public/scss/controls.scss @@ -19,11 +19,4 @@ .table-multiselect .awesomplete { display: inline; -} - -.frappe-control { - .ql-editor { - background-color: var(--gray-200); - max-width: 700px; - } } \ No newline at end of file diff --git a/frappe/public/scss/form.scss b/frappe/public/scss/form.scss index 55048ba2aa..8a3ff744d7 100644 --- a/frappe/public/scss/form.scss +++ b/frappe/public/scss/form.scss @@ -80,9 +80,21 @@ .comment-box { @include card(); - padding: var(--padding-md); + padding: 25px var(--padding-xl); .comment-input-header { @extend .head-title; - width: 100%; + margin-bottom: var(--margin-sm); + } + .comment-input-container { + .frappe-control { + margin-bottom: var(--margin-xs); + } + .ql-editor { + background-color: var(--gray-200); + } + } + + .btn-comment { + margin-top: var(--margin-md); } } \ No newline at end of file From bb0f3cbef39f812e6b756fd529d7b0206c18b9ec Mon Sep 17 00:00:00 2001 From: Suraj Shetty Date: Tue, 28 Jul 2020 18:47:41 +0530 Subject: [PATCH 4/8] fix: Update body color variables --- frappe/public/scss/variables.scss | 2 +- 1 file changed, 1 insertion(+), 1 deletion(-) diff --git a/frappe/public/scss/variables.scss b/frappe/public/scss/variables.scss index 24e3b45339..8b466bb1e9 100644 --- a/frappe/public/scss/variables.scss +++ b/frappe/public/scss/variables.scss @@ -211,7 +211,7 @@ $brand-gradient: linear-gradient(180deg, #2C9AF1 0%, var(--blue-500) 100%); $navbar-height: 60px; $page-head-height: 68px; -$body-color: $gray-700 !default; +$body-color: var(--text-light); $input-placeholder-color: var(--text-light); $btn-padding-y-lg: 1rem !default; From f93b1cd60f950794c38c190d8783b7dc251b11d4 Mon Sep 17 00:00:00 2001 From: Suraj Shetty Date: Tue, 28 Jul 2020 18:59:22 +0530 Subject: [PATCH 5/8] fix: Remove brand gradient --- frappe/public/scss/global.scss | 2 +- frappe/public/scss/variables.scss | 7 ++++--- 2 files changed, 5 insertions(+), 4 deletions(-) diff --git a/frappe/public/scss/global.scss b/frappe/public/scss/global.scss index 3be7c36de4..8e6447624e 100644 --- a/frappe/public/scss/global.scss +++ b/frappe/public/scss/global.scss @@ -136,7 +136,7 @@ img { } .btn-primary { - background: $brand-gradient; + background-color: var(--primary-color); } diff --git a/frappe/public/scss/variables.scss b/frappe/public/scss/variables.scss index 8b466bb1e9..be7744dfea 100644 --- a/frappe/public/scss/variables.scss +++ b/frappe/public/scss/variables.scss @@ -10,6 +10,7 @@ $gray-100: #F4F5F6; $gray-50 : #F9FAFA; $primary: #2490EF; +$danger: #E24C4C; $black: #000; $white: #fff; $light: $gray-50 !default; @@ -180,6 +181,8 @@ $card-box-shadow: 0px 0px 1px rgba(17, 43, 66, 0.16), 0px 1px 3px rgba(17, 43, 6 --border-radius: 6px; --border-radius-md: 8px; --border-radius-lg: 12px; + + --primary-color: #{$primary}; } html, body { @@ -203,11 +206,9 @@ $container-max-widths: ( $theme-colors: ( "primary": $primary, - "danger": #ff4136 + "danger": $danger ); -$brand-gradient: linear-gradient(180deg, #2C9AF1 0%, var(--blue-500) 100%); - $navbar-height: 60px; $page-head-height: 68px; From 34ffd1fd577fc0f354909f757ca89c5c4959f373 Mon Sep 17 00:00:00 2001 From: Suraj Shetty Date: Tue, 28 Jul 2020 19:13:46 +0530 Subject: [PATCH 6/8] fix: Border colors --- frappe/public/scss/dark.scss | 3 ++- frappe/public/scss/timeline.scss | 2 +- frappe/public/scss/variables.scss | 1 + 3 files changed, 4 insertions(+), 2 deletions(-) diff --git a/frappe/public/scss/dark.scss b/frappe/public/scss/dark.scss index 6b98bbd45a..56e8112ef7 100644 --- a/frappe/public/scss/dark.scss +++ b/frappe/public/scss/dark.scss @@ -32,6 +32,7 @@ --sidebar-select-color: var(--gray-800); --shadow-inset: var(--fg-color); - --border-color: var(--gray-600); + --border-color: var(--gray-700); + --dark-border-color: var(--gray-600); --highlight-color: var(--gray-700); } \ No newline at end of file diff --git a/frappe/public/scss/timeline.scss b/frappe/public/scss/timeline.scss index 34ba6157fe..eb4f6256c1 100644 --- a/frappe/public/scss/timeline.scss +++ b/frappe/public/scss/timeline.scss @@ -10,7 +10,7 @@ $threshold: 50px; top: 0; height: 100%; position: absolute; - border-left: 1px solid var(--gray-300); + border-left: 1px solid var(--dark-border-color); } .timeline-item { diff --git a/frappe/public/scss/variables.scss b/frappe/public/scss/variables.scss index be7744dfea..c28b85b1fe 100644 --- a/frappe/public/scss/variables.scss +++ b/frappe/public/scss/variables.scss @@ -174,6 +174,7 @@ $card-box-shadow: 0px 0px 1px rgba(17, 43, 66, 0.16), 0px 1px 3px rgba(17, 43, 6 --shadow-inset: var(--gray-100); --border-color: var(--gray-100); + --dark-border-color: var(--gray-300); --highlight-color: var(--gray-50); // Border Sizes From 86191f60d685999c04b47827b45fd8dfe45f25c7 Mon Sep 17 00:00:00 2001 From: Suraj Shetty Date: Tue, 28 Jul 2020 19:38:31 +0530 Subject: [PATCH 7/8] fix: Update dropdown bootstrap variables to fix dark theme --- frappe/public/scss/dark.scss | 1 + frappe/public/scss/variables.scss | 13 +++++++++++++ 2 files changed, 14 insertions(+) diff --git a/frappe/public/scss/dark.scss b/frappe/public/scss/dark.scss index 56e8112ef7..5db08b28f2 100644 --- a/frappe/public/scss/dark.scss +++ b/frappe/public/scss/dark.scss @@ -23,6 +23,7 @@ // Layout Colors --bg-color: var(--gray-900); --fg-color: var(--gray-800); + --hover-fg-color: var(--gray-700); --card-bg: var(--gray-800); --control-bg: var(--gray-700); --modal-bg: var(--gray-700); diff --git a/frappe/public/scss/variables.scss b/frappe/public/scss/variables.scss index c28b85b1fe..7106939673 100644 --- a/frappe/public/scss/variables.scss +++ b/frappe/public/scss/variables.scss @@ -164,6 +164,7 @@ $card-box-shadow: 0px 0px 1px rgba(17, 43, 66, 0.16), 0px 1px 3px rgba(17, 43, 6 // Layout Colors --bg-color: var(--gray-50); --fg-color: white; + --hover-fg-color: var(--gray-100); --card-bg: var(--fg-color); --control-bg: var(--gray-100); --modal-bg: white; @@ -215,7 +216,19 @@ $page-head-height: 68px; $body-color: var(--text-light); $input-placeholder-color: var(--text-light); +$component-active-color: var(--fg-color); +$modal-content-bg: var(--modal-bg); +// dropdown +$dropdown-bg: var(--fg-color); +$dropdown-border-color: var(--dark-border-color); +$dropdown-link-color: var(--text-color); +$dropdown-link-hover-color: var(--text-color); +$dropdown-link-hover-bg: var(--hover-fg-color); +$dropdown-link-disabled-color: var(--gray-600); +$dropdown-header-color: var(--gray-600); + +// button $btn-padding-y-lg: 1rem !default; $btn-padding-x-lg: 2.5rem !default; $btn-font-size-lg: 1.125rem !default; From 33157210cfae82400efb113113a74af6ad868b5c Mon Sep 17 00:00:00 2001 From: Suraj Shetty Date: Tue, 28 Jul 2020 19:58:34 +0530 Subject: [PATCH 8/8] fix: Inconsistent naming --- frappe/public/scss/dark.scss | 2 +- frappe/public/scss/variables.scss | 4 ++-- 2 files changed, 3 insertions(+), 3 deletions(-) diff --git a/frappe/public/scss/dark.scss b/frappe/public/scss/dark.scss index 5db08b28f2..fa1f51e9a0 100644 --- a/frappe/public/scss/dark.scss +++ b/frappe/public/scss/dark.scss @@ -23,7 +23,7 @@ // Layout Colors --bg-color: var(--gray-900); --fg-color: var(--gray-800); - --hover-fg-color: var(--gray-700); + --fg-hover-color: var(--gray-700); --card-bg: var(--gray-800); --control-bg: var(--gray-700); --modal-bg: var(--gray-700); diff --git a/frappe/public/scss/variables.scss b/frappe/public/scss/variables.scss index 7106939673..5d0b98d08a 100644 --- a/frappe/public/scss/variables.scss +++ b/frappe/public/scss/variables.scss @@ -164,7 +164,7 @@ $card-box-shadow: 0px 0px 1px rgba(17, 43, 66, 0.16), 0px 1px 3px rgba(17, 43, 6 // Layout Colors --bg-color: var(--gray-50); --fg-color: white; - --hover-fg-color: var(--gray-100); + --fg-hover-color: var(--gray-100); --card-bg: var(--fg-color); --control-bg: var(--gray-100); --modal-bg: white; @@ -224,7 +224,7 @@ $dropdown-bg: var(--fg-color); $dropdown-border-color: var(--dark-border-color); $dropdown-link-color: var(--text-color); $dropdown-link-hover-color: var(--text-color); -$dropdown-link-hover-bg: var(--hover-fg-color); +$dropdown-link-hover-bg: var(--fg-hover-color); $dropdown-link-disabled-color: var(--gray-600); $dropdown-header-color: var(--gray-600);