[myfaces-tobago] 01/02: fix(tabs): position for icons in bar-faces

[hn...@apache.org]

This is an automated email from the ASF dual-hosted git repository.

hnoeth pushed a commit to branch main
in repository https://gitbox.apache.org/repos/asf/myfaces-tobago.git

commit d6748027dd7d82a2fdc8fdd36359e929461d4d92
Author: Henning Noeth <hn...@apache.org>
AuthorDate: Tue Jun 27 11:17:43 2023 +0200

    fix(tabs): position for icons in bar-faces
    
    * fix icon position
    * refactor/cleanup tobago-tab CSS
    
    Issue: TOBAGO-2237
---
 tobago-theme/src/main/scss/_tobago.scss | 30 +++++++++++++++---------------
 1 file changed, 15 insertions(+), 15 deletions(-)

diff --git a/tobago-theme/src/main/scss/_tobago.scss b/tobago-theme/src/main/scss/_tobago.scss
index 85f9455974..8d22c4aef9 100644
--- a/tobago-theme/src/main/scss/_tobago.scss
+++ b/tobago-theme/src/main/scss/_tobago.scss
@@ -1656,10 +1656,7 @@ tobago-split-layout {
   z-index: 10000; /* TODO: check, if needed (check also with iframes) */
 }
 
-/* tab / tab-group ----------------------------------------------------------------- */
-
 tobago-tab {
-
   .nav-link:not([href]):not([tabindex]) {
     /* fix .nav-links without 'href'; bootstrap tab only works if 'href' is set */
     &.active {
@@ -1693,12 +1690,26 @@ tobago-tab.tobago-bar {
   > .nav-link {
     border-right: 0;
     border-top-right-radius: 0;
+
+    &:hover:not(.disabled):not(.active) + div {
+      border-color: var(--#{$prefix}nav-tabs-link-hover-border-color);
+    }
+
+    &.active + div {
+      background-color: var(--#{$prefix}card-bg);
+      border-color: var(--#{$prefix}nav-tabs-link-active-border-color);
+      border-bottom-color: var(--#{$prefix}card-bg);
+    }
   }
 
   > div {
+    padding: var(--#{$prefix}nav-link-padding-y) var(--#{$prefix}nav-link-padding-x);
+    padding-left: 0;
     border: $nav-tabs-border-width solid transparent;
     border-top-right-radius: $nav-tabs-border-radius;
-    padding-right: $nav-link-padding-x;
+    border-left: 0;
+    margin-bottom: calc(-1 * var(--bs-nav-tabs-border-width));
+    @include transition($nav-link-transition);
 
     & > button {
       height: 100%;
@@ -1709,17 +1720,6 @@ tobago-tab.tobago-bar {
       padding-top: 0.5rem;
     }
   }
-
-  .nav-link.active + div {
-    background-color: $nav-tabs-link-active-bg;
-    border-top-color: $nav-tabs-border-color;
-    border-right-color: $nav-tabs-border-color;
-  }
-
-  .nav-link:not(.disabled):hover + div {
-    border-top-color: $gray-200;
-    border-right-color: $gray-200;
-  }
 }
 
 tobago-tab-group {