Add theme_3d_systems/static/src/scss/_mixins.scss
This commit is contained in:
parent
51a092b666
commit
86539da3f4
1 changed files with 25 additions and 0 deletions
25
theme_3d_systems/static/src/scss/_mixins.scss
Normal file
25
theme_3d_systems/static/src/scss/_mixins.scss
Normal file
|
|
@ -0,0 +1,25 @@
|
|||
// SCSS Mixins for 3D & Glassmorphism
|
||||
@import 'variables';
|
||||
|
||||
@mixin glass-panel($bg: $glass-bg, $border: $glass-border, $blur: $glass-blur) {
|
||||
background: $bg;
|
||||
backdrop-filter: blur($blur);
|
||||
-webkit-backdrop-filter: blur($blur);
|
||||
border: 1px solid $border;
|
||||
border-radius: 16px;
|
||||
}
|
||||
|
||||
@mixin text-gradient($start: $theme-cyan, $end: $theme-blue) {
|
||||
background: linear-gradient(135deg, $start 0%, $end 100%);
|
||||
-webkit-background-clip: text;
|
||||
-webkit-text-fill-color: transparent;
|
||||
}
|
||||
|
||||
@mixin box-glow($color: $theme-cyan-glow, $spread: 20px) {
|
||||
box-shadow: 0 8px 32px 0 rgba(0, 0, 0, 0.37), 0 0 $spread $color;
|
||||
}
|
||||
|
||||
@mixin preserve-3d {
|
||||
transform-style: preserve-3d;
|
||||
perspective: 1000px;
|
||||
}
|
||||
Loading…
Reference in a new issue