fix: purple pushbox
This commit is contained in:
@@ -74,6 +74,7 @@ class ContentTabs extends HTMLElement {
|
||||
<style>
|
||||
:host {
|
||||
display: block;
|
||||
margin: var(--spacing-xl, 2rem) 0;
|
||||
}
|
||||
|
||||
.tabs-container {
|
||||
@@ -83,15 +84,18 @@ class ContentTabs extends HTMLElement {
|
||||
|
||||
.tab-list {
|
||||
display: flex;
|
||||
gap: var(--spacing-lg, 1.5rem);
|
||||
gap: var(--spacing-md, 1rem);
|
||||
margin-top: var(--spacing-lg, 1.5rem);
|
||||
border-bottom: 1px solid var(--color-border, #e2e8f0);
|
||||
margin-bottom: var(--spacing-md, 1rem);
|
||||
}
|
||||
|
||||
.tab-button {
|
||||
padding: var(--spacing-sm, 0.5rem) 0;
|
||||
background: none;
|
||||
padding: var(--spacing-sm, 0.5rem) var(--spacing-md, 1rem);
|
||||
background: transparent;
|
||||
border: none;
|
||||
border-radius: 4px;
|
||||
border-bottom-left-radius: 0;
|
||||
border-bottom-right-radius: 0;
|
||||
font-family: var(--font-family-outfit, "Outfit", sans-serif);
|
||||
font-size: 16px;
|
||||
font-weight: 400;
|
||||
@@ -100,28 +104,24 @@ class ContentTabs extends HTMLElement {
|
||||
text-decoration: underline;
|
||||
text-underline-offset: 3px;
|
||||
cursor: pointer;
|
||||
transition: opacity var(--transition-fast, 150ms ease);
|
||||
position: relative;
|
||||
}
|
||||
|
||||
.tab-button:first-child {
|
||||
color: var(--color-text, #1e293b);
|
||||
text-decoration: none;
|
||||
font-weight: 400;
|
||||
transition: all var(--transition-fast, 150ms ease);
|
||||
}
|
||||
|
||||
.tab-button.active {
|
||||
background: var(--color-border, #e2e8f0);
|
||||
color: var(--color-text, #1e293b);
|
||||
text-decoration: none;
|
||||
font-weight: 400;
|
||||
}
|
||||
|
||||
.tab-button:hover {
|
||||
.tab-button:not(.active):hover {
|
||||
opacity: 0.7;
|
||||
}
|
||||
|
||||
.tab-panels {
|
||||
min-height: 100px;
|
||||
background: var(--color-border, #e2e8f0);
|
||||
padding: var(--spacing-lg, 1.5rem) var(--spacing-md, 1rem);
|
||||
border-radius: var(--radius-sm, 0.25rem);
|
||||
}
|
||||
</style>
|
||||
<div class="tabs-container">
|
||||
|
||||
Reference in New Issue
Block a user