From 4c63cda47381d5eec4398fd77125fc952578ae7c Mon Sep 17 00:00:00 2001 From: "Julia.Radzhabova" Date: Thu, 22 May 2025 19:55:08 +0300 Subject: [PATCH 1/5] Fix color button --- apps/common/main/resources/less/buttons.less | 1 + 1 file changed, 1 insertion(+) diff --git a/apps/common/main/resources/less/buttons.less b/apps/common/main/resources/less/buttons.less index a9b1147b96..6a785ed3f2 100644 --- a/apps/common/main/resources/less/buttons.less +++ b/apps/common/main/resources/less/buttons.less @@ -858,6 +858,7 @@ height: 100%; border: @scaled-one-px-value-ie solid @border-color-shading-ie; border: @scaled-one-px-value solid @border-color-shading; + border-radius: @border-radius-form-control; background-color: transparent; } From b62897a6eafc0ce80ea2056a4b2e0361f098280a Mon Sep 17 00:00:00 2001 From: "Julia.Radzhabova" Date: Thu, 22 May 2025 19:56:48 +0300 Subject: [PATCH 2/5] Fix tab line --- .../main/resources/less/colors-table-white.less | 3 +++ apps/common/main/resources/less/colors-table.less | 6 ++++++ apps/common/main/resources/less/toolbar.less | 13 ++++++------- 3 files changed, 15 insertions(+), 7 deletions(-) diff --git a/apps/common/main/resources/less/colors-table-white.less b/apps/common/main/resources/less/colors-table-white.less index 4cd37add37..cf385c8827 100644 --- a/apps/common/main/resources/less/colors-table-white.less +++ b/apps/common/main/resources/less/colors-table-white.less @@ -181,6 +181,9 @@ --border-sidemenu: 0 none; --border-radius-toolbar: 8px; --toolbar-tab-radius: 5px; + --toolbar-tab-line-radius: 2px; + --toolbar-tab-line-height: 3px; + --toolbar-tab-line-bottom: 2px; --background-statusbar: var(--background-toolbar); --shadow-toolbar: 0px 1px 3px 0px rgba(0, 0, 0, 0.10), 0px 1px 2px 0px rgba(0, 0, 0, 0.06); --shadow-side-panel: 0px 4px 6px -1px rgba(0, 0, 0, 0.10), 0px 2px 4px -1px rgba(0, 0, 0, 0.06); diff --git a/apps/common/main/resources/less/colors-table.less b/apps/common/main/resources/less/colors-table.less index 965adc052e..8a0e8c88ba 100644 --- a/apps/common/main/resources/less/colors-table.less +++ b/apps/common/main/resources/less/colors-table.less @@ -236,6 +236,9 @@ --border-radius-toolbar: 0; --toolbar-tab-radius: 0; + --toolbar-tab-line-radius: 2px; + --toolbar-tab-line-height: 2px; + --toolbar-tab-line-bottom: 4px; --border-sidemenu: var(--scaled-one-pixel, 1px) solid var(--border-toolbar); --background-statusbar: var(--background-pane); --shadow-toolbar: 0px 1px 0 0 var(--border-toolbar); @@ -489,6 +492,9 @@ @shadow-side-panel: var(--shadow-side-panel, none); @border-radius-toolbar: var(--border-radius-toolbar,0); @toolbar-tab-radius: var(--toolbar-tab-radius, 0); +@toolbar-tab-line-radius: var(--toolbar-tab-line-radius, 2px); +@toolbar-tab-line-height: var(--toolbar-tab-line-height, 2px); +@toolbar-tab-line-bottom: var(--toolbar-tab-line-bottom, 4px); @layout-padding-toolbar: var(--layout-padding-toolbar, 0); @layout-padding-x-side-panel: var(--layout-padding-x-side-panel, 0); @layout-padding-y-side-panel: var(--layout-padding-y-side-panel, 2px); diff --git a/apps/common/main/resources/less/toolbar.less b/apps/common/main/resources/less/toolbar.less index ba728a3a40..92cc1a68c1 100644 --- a/apps/common/main/resources/less/toolbar.less +++ b/apps/common/main/resources/less/toolbar.less @@ -761,8 +761,6 @@ padding: 4px 0; } - @underscore_height: 2px; - .tabs { ul { padding: 0; @@ -773,17 +771,18 @@ &:after { border-top-style: solid; - border-top-width: @underscore_height; + border-top-width: @toolbar-tab-line-height; content: ''; position: absolute; .margin-left-6(); width: calc(100% - 12px); - bottom: -@underscore_height; + bottom: calc(-1 * @toolbar-tab-line-height); opacity: 0; .tab-header-color(); .style-off-tabs& { .tab-toolbar-color(); } + border-radius: @toolbar-tab-line-radius; } &.active, @@ -795,14 +794,14 @@ &.active { &:after { opacity: 1; - bottom: 4px; + bottom: @toolbar-tab-line-bottom; } } &:hover:not(.active) { &:after { opacity: 0.4; - bottom: 4px; + bottom: @toolbar-tab-line-bottom; } } @@ -820,7 +819,7 @@ &.short { li { &:after { - bottom: 4px; + bottom: @toolbar-tab-line-bottom; } } } From d3f50436f6fc4c6fd3583fe718c29b64f0ae12bf Mon Sep 17 00:00:00 2001 From: "Julia.Radzhabova" Date: Thu, 22 May 2025 20:11:51 +0300 Subject: [PATCH 3/5] Change active/hover tabs --- apps/common/main/resources/less/toolbar.less | 11 +++++++++-- 1 file changed, 9 insertions(+), 2 deletions(-) diff --git a/apps/common/main/resources/less/toolbar.less b/apps/common/main/resources/less/toolbar.less index 92cc1a68c1..663bf9422b 100644 --- a/apps/common/main/resources/less/toolbar.less +++ b/apps/common/main/resources/less/toolbar.less @@ -774,8 +774,8 @@ border-top-width: @toolbar-tab-line-height; content: ''; position: absolute; - .margin-left-6(); - width: calc(100% - 12px); + .margin-left-9(); + width: calc(100% - 18px); bottom: calc(-1 * @toolbar-tab-line-height); opacity: 0; .tab-header-color(); @@ -805,6 +805,13 @@ } } + &:hover.active { + &:after { + .margin-left-3(); + width: calc(100% - 6px); + } + } + & > a { color: @text-toolbar-header-ie; color: @text-toolbar-header; From 8839d9760a055edf5f67563c2a4779ce86659dcb Mon Sep 17 00:00:00 2001 From: "Julia.Radzhabova" Date: Thu, 22 May 2025 21:16:51 +0300 Subject: [PATCH 4/5] Fix styles --- apps/common/main/resources/less/toolbar.less | 8 ++++---- 1 file changed, 4 insertions(+), 4 deletions(-) diff --git a/apps/common/main/resources/less/toolbar.less b/apps/common/main/resources/less/toolbar.less index 663bf9422b..0b748683d9 100644 --- a/apps/common/main/resources/less/toolbar.less +++ b/apps/common/main/resources/less/toolbar.less @@ -774,8 +774,8 @@ border-top-width: @toolbar-tab-line-height; content: ''; position: absolute; - .margin-left-9(); - width: calc(100% - 18px); + .margin-left-7(); + width: calc(100% - 14px); bottom: calc(-1 * @toolbar-tab-line-height); opacity: 0; .tab-header-color(); @@ -807,8 +807,8 @@ &:hover.active { &:after { - .margin-left-3(); - width: calc(100% - 6px); + .margin-left-2(); + width: calc(100% - 4px); } } From 19b35a5cf48a60e96ce30cd360a331b9bcc53159 Mon Sep 17 00:00:00 2001 From: maxkadushkin Date: Thu, 22 May 2025 23:49:16 +0300 Subject: [PATCH 5/5] [themes] transitions for tabbar --- apps/common/main/resources/less/toolbar.less | 1 + 1 file changed, 1 insertion(+) diff --git a/apps/common/main/resources/less/toolbar.less b/apps/common/main/resources/less/toolbar.less index 0b748683d9..3d6d769761 100644 --- a/apps/common/main/resources/less/toolbar.less +++ b/apps/common/main/resources/less/toolbar.less @@ -783,6 +783,7 @@ .tab-toolbar-color(); } border-radius: @toolbar-tab-line-radius; + transition: margin-left .05s ease-in-out, width .05s ease-in-out, opacity .1s ease-in-out; } &.active,