dave-dmg/website
1
0
Fork 0
Code Issues Pull Requests Actions Packages Projects Releases Wiki Activity

PreStyling Layouts & Components

Browse Source
This commit is contained in:
Dave
2026-09-24 09:58:25 +02:00
parent fc38a1aafe
commit 356ccedc01
39 changed files with 1212 additions and 96 deletions
Download Patch File Download Diff File Expand all files Collapse all files

60
src/styles/mixins/borders.css Normal file
View File

@@ -0,0 +1,60 @@
@define-mixin border-l $width: var(--size-1), $style: solid,
$color: var(--color-surface-inverse) {
border-left: $width $style $color;
}
@define-mixin border-r $width: var(--size-1), $style: solid,
$color: var(--color-surface-inverse) {
border-right: $width $style $color;
}
@define-mixin border-t $width: var(--size-1), $style: solid,
$color: var(--color-surface-inverse) {
border-top: $width $style $color;
}
@define-mixin border-b $width: var(--size-1), $style: solid,
$color: var(--color-surface-inverse) {
border-bottom: $width $style $color;
}
@define-mixin border-x $width: var(--size-1), $style: solid,
$color: var(--color-surface-inverse) {
border-right: $width $style $color;
border-left: $width $style $color;
}
@define-mixin border-y $width: var(--size-1), $style: solid,
$color: var(--color-surface-inverse) {
border-top: $width $style $color;
border-bottom: $width $style $color;
}
@define-mixin rounded-top $radius {
border-top-left-radius: $radius;
border-top-right-radius: $radius;
}
@define-mixin rounded-bottom $radius {
border-bottom-right-radius: $radius;
border-bottom-left-radius: $radius;
}
@define-mixin rounded-left $radius {
border-top-left-radius: $radius;
border-bottom-left-radius: $radius;
}
@define-mixin rounded-right $radius {
border-top-left-radius: $radius;
border-bottom-left-radius: $radius;
}
@define-mixin circle {
border-radius: 50%;
}
@define-mixin focus-ring $width: 2px, $color: var(--color-focus-ring), $offset: 2px {
outline: $width solid $color;
outline-offset: $offset;
}