@gjsify/adwaita-web 0.18.0 → 0.19.0

package/dist/adwaita-web.css

@@ -2312,15 +2312,15 @@ adw-tab-view {
 }
 adw-tab-view .adw-tab-bar {
   display: flex;
-  align-items: flex-end;
+  align-items: stretch;
   flex-shrink: 0;
   box-sizing: border-box;
-  padding: 0 var(--spacing-xs);
+  padding: 0 1px 1px;
   background-color: var(--headerbar-bg-color);
   color: var(--headerbar-fg-color);
   box-shadow: inset 0 -1px var(--headerbar-shade-color);
   overflow-x: auto;
-  scrollbar-width: thin;
+  scrollbar-width: none;
 }
 adw-tab-view .adw-tab-bar[hidden] {
   display: none;
@@ -2328,49 +2328,68 @@ adw-tab-view .adw-tab-bar[hidden] {
 adw-tab-view .adw-tab-box {
   display: flex;
   align-items: stretch;
-  gap: var(--spacing-xs);
-  padding: var(--spacing-xs) 0;
-  min-height: 34px;
+  flex: 1 1 auto;
+  padding: 4px 0;
 }
 adw-tab-view .adw-tab {
+  position: relative;
   box-sizing: border-box;
   display: inline-flex;
   align-items: center;
+  justify-content: center;
   gap: var(--spacing-xs);
   max-width: 200px;
-  min-height: 26px;
+  min-height: 30px;
   margin: 0;
-  padding: 4px var(--spacing-s);
+  padding: 0 var(--spacing-m);
   border: none;
   border-radius: var(--button-radius);
   background-color: transparent;
-  color: var(--headerbar-fg-color);
+  color: inherit;
   font-family: var(--font-family);
   font-size: var(--font-size-base);
-  font-weight: 700;
   line-height: 1;
   cursor: pointer;
   user-select: none;
   -webkit-user-select: none;
-  transition: background-color 150ms ease-in-out, color 150ms ease-in-out, box-shadow 150ms ease-in-out;
+  transition: background-color 150ms ease-in-out;
 }
 adw-tab-view .adw-tab:hover {
-  background-color: var(--button-hover-color);
+  background-color: color-mix(in srgb, currentColor 7%, transparent);
 }
 adw-tab-view .adw-tab:active {
-  background-color: var(--button-active-color, var(--button-hover-color));
+  background-color: color-mix(in srgb, currentColor 16%, transparent);
 }
 adw-tab-view .adw-tab:focus-visible {
   outline: 2px solid var(--accent-color);
-  outline-offset: -1px;
+  outline-offset: -2px;
 }
 adw-tab-view .adw-tab.active {
-  background-color: var(--view-bg-color);
-  color: var(--view-fg-color);
-  box-shadow: 0 1px 3px 1px rgba(0, 0, 6, 0.07), 0 2px 6px 2px rgba(0, 0, 6, 0.03);
+  background-color: color-mix(in srgb, currentColor 10%, transparent);
 }
 adw-tab-view .adw-tab.active:hover {
-  background-color: var(--view-bg-color);
+  background-color: color-mix(in srgb, currentColor 13%, transparent);
+}
+adw-tab-view .adw-tab.active:active {
+  background-color: color-mix(in srgb, currentColor 19%, transparent);
+}
+adw-tab-view .adw-tab + .adw-tab::before {
+  content: "";
+  position: absolute;
+  left: 0;
+  top: 3px;
+  bottom: 3px;
+  width: 1px;
+  background-color: currentColor;
+  opacity: 0.2;
+  transition: opacity 150ms ease-in-out;
+  pointer-events: none;
+}
+adw-tab-view .adw-tab.active + .adw-tab::before,
+adw-tab-view .adw-tab + .adw-tab.active::before,
+adw-tab-view .adw-tab:hover + .adw-tab::before,
+adw-tab-view .adw-tab + .adw-tab:hover::before {
+  opacity: 0;
 }
 adw-tab-view .adw-tab-title {
   white-space: nowrap;
@@ -2418,10 +2437,15 @@ adw-tab-view .adw-tab-close::before {
 adw-tab-view .adw-tab-close::after {
   transform: translate(-50%, -50%) rotate(-45deg);
 }
+adw-tab-view[expand-tabs] .adw-tab {
+  flex: 1 1 0;
+  max-width: none;
+}
+adw-tab-view[no-close] .adw-tab-close {
+  display: none;
+}
 adw-tab-view .adw-tab-bar.single-tab .adw-tab, adw-tab-view .adw-tab-bar.single-tab .adw-tab:hover, adw-tab-view .adw-tab-bar.single-tab .adw-tab:active {
   background: none;
-  box-shadow: none;
-  color: var(--headerbar-fg-color);
 }
 adw-tab-view .adw-tab-view-pages {
   flex: 1 1 auto;