social.io/catalog
2
0
Fork 0
Code Issues Pull Requests Actions Packages Projects Releases Wiki Activity

update

Browse Source
This commit is contained in:
Jürgen Kunz
2025-07-14 15:07:39 +00:00
parent 9ab16c85ba
commit efd142d63d
6 changed files with 217 additions and 120 deletions
Download Patch File Download Diff File Expand all files Collapse all files

35
ts_web/elements/sio-button.ts
View File

@@ -75,7 +75,7 @@ export class SioButton extends DeesElement {
user-select: none;
outline: none;
border: 1px solid transparent;
gap: ${unsafeCSS(spacing[2])};
gap: ${unsafeCSS(spacing["2"])};
font-size: 0.875rem;
line-height: 1.5;
}
@@ -83,49 +83,57 @@ export class SioButton extends DeesElement {
/* Size variants */
.button.size-sm {
height: 32px;
padding: 0 ${unsafeCSS(spacing[3])};
padding: 0 ${unsafeCSS(spacing["3"])};
font-size: 13px;
}
.button.size-default {
height: 36px;
padding: 0 ${unsafeCSS(spacing[4])};
padding: 0 ${unsafeCSS(spacing["4"])};
font-size: 14px;
}
.button.size-lg {
height: 44px;
padding: 0 ${unsafeCSS(spacing[6])};
padding: 0 ${unsafeCSS(spacing["6"])};
font-size: 16px;
}
/* Type variants */
.button.default {
background: ${bdTheme('secondary')};
color: ${bdTheme('secondaryForeground')};
background: ${bdTheme('background')};
color: ${bdTheme('foreground')};
border-color: ${bdTheme('border')};
box-shadow: ${unsafeCSS(shadows.sm)};
}
.button.default:hover:not(.disabled) {
background: ${bdTheme('secondary')};
opacity: 0.8;
background: ${bdTheme('accent')};
border-color: ${bdTheme('accent')};
transform: translateY(-1px);
box-shadow: ${unsafeCSS(shadows.md)};
}
.button.default:active:not(.disabled) {
transform: translateY(1px);
transform: translateY(0);
box-shadow: ${unsafeCSS(shadows.sm)};
}
.button.primary {
background: ${bdTheme('primary')};
color: ${bdTheme('primaryForeground')};
box-shadow: ${unsafeCSS(shadows.sm)};
}
.button.primary:hover:not(.disabled) {
opacity: 0.9;
transform: translateY(-1px);
box-shadow: ${unsafeCSS(shadows.md)};
}
.button.primary:active:not(.disabled) {
transform: translateY(1px);
transform: translateY(0);
box-shadow: ${unsafeCSS(shadows.sm)};
}
.button.destructive {
@@ -159,15 +167,18 @@ export class SioButton extends DeesElement {
.button.ghost {
background: transparent;
color: ${bdTheme('foreground')};
border-color: transparent;
}
.button.ghost:hover:not(.disabled) {
background: ${bdTheme('accent')};
color: ${bdTheme('accentForeground')};
border-color: transparent;
}
.button.ghost:active:not(.disabled) {
transform: translateY(1px);
background: ${bdTheme('accent')};
opacity: 0.8;
}
/* Status states */
@@ -178,7 +189,7 @@ export class SioButton extends DeesElement {
.spinner {
position: absolute;
left: ${unsafeCSS(spacing[3])};
left: ${unsafeCSS(spacing["3"])};
animation: spin 1s linear infinite;
}