feat: add pixel-btn-secondary variant
This commit is contained in:
@ -228,8 +228,35 @@ header .navbar-toggler {
|
||||
.pixel-btn:active:not(:disabled) { transform: translateY(0); }
|
||||
.pixel-btn:disabled { cursor: not-allowed; opacity: 0.45; }
|
||||
|
||||
/* Secondary variant — muted, ghost-style, no solid fill */
|
||||
.pixel-btn-secondary {
|
||||
display: inline-flex;
|
||||
align-items: center;
|
||||
justify-content: center;
|
||||
min-height: var(--btn-min-height);
|
||||
padding: var(--btn-padding-y) var(--btn-padding-x);
|
||||
border: 1px solid var(--color-border-input);
|
||||
border-radius: var(--btn-radius);
|
||||
background: transparent;
|
||||
color: var(--color-text-body);
|
||||
cursor: pointer;
|
||||
font-size: var(--font-size-base);
|
||||
font-weight: var(--font-weight-bold);
|
||||
line-height: 1;
|
||||
transition: transform .15s ease, border-color .15s ease, color .15s ease, background .15s ease, opacity .15s ease;
|
||||
}
|
||||
.pixel-btn-secondary:hover:not(:disabled) {
|
||||
border-color: var(--color-accent-blue-border);
|
||||
color: var(--color-text-heading);
|
||||
background: rgba(119, 148, 255, 0.07);
|
||||
transform: translateY(-1px);
|
||||
}
|
||||
.pixel-btn-secondary:active:not(:disabled) { transform: translateY(0); }
|
||||
.pixel-btn-secondary:disabled { cursor: not-allowed; opacity: 0.45; }
|
||||
|
||||
/* When nested in a form-group, align to start */
|
||||
.form-group .pixel-btn { justify-self: start; }
|
||||
.form-group .pixel-btn-secondary { justify-self: start; }
|
||||
/* ==========================================================================
|
||||
Web3 Style Guide — Form Components
|
||||
========================================================================== */
|
||||
|
||||
Reference in New Issue
Block a user