summaryrefslogtreecommitdiff
path: root/src/main/resources/static/scss/_mixins.scss
diff options
context:
space:
mode:
authorAlisaLinUwU <alisalinuwu@gmail.com>2025-01-26 10:42:28 +0500
committerAlisaLinUwU <alisalinuwu@gmail.com>2025-01-26 10:42:28 +0500
commit0225bdb772d1334cc1aa7ab0fc3678df0864df6b (patch)
tree85a8c8e4fcf1d935fcbad54886b73410c8cb2e26 /src/main/resources/static/scss/_mixins.scss
Initializemain
Diffstat (limited to 'src/main/resources/static/scss/_mixins.scss')
-rw-r--r--src/main/resources/static/scss/_mixins.scss134
1 files changed, 134 insertions, 0 deletions
diff --git a/src/main/resources/static/scss/_mixins.scss b/src/main/resources/static/scss/_mixins.scss
new file mode 100644
index 0000000..4b2f01a
--- /dev/null
+++ b/src/main/resources/static/scss/_mixins.scss
@@ -0,0 +1,134 @@
+// opacity
+@mixin opacity($opacity) {
+ opacity: $opacity;
+ $opacity-ie: $opacity * 100;
+ filter: alpha(opacity=$opacity-ie); //IE8
+ }
+// transition
+@mixin transition($args...) {
+ -webkit-transition: $args;
+ -moz-transition: $args;
+ -ms-transition: $args;
+ -o-transition: $args;
+ transition: $args;
+}// transition
+@mixin border-radius($man) {
+ -webkit-border-radius: $man;
+ -moz-border-radius: $man;
+ border-radius: $man;
+}
+
+
+// Flexbox display
+@mixin flexbox() {
+ display: -webkit-box;
+ display: -moz-box;
+ display: -ms-flexbox;
+ display: -webkit-flex;
+ display: flex;
+}
+
+// justify-content
+@mixin justify-content($justify) {
+ -webkit-justify-content: $justify;
+ -moz-justify-content: $justify;
+ -ms-justify-content: $justify;
+ justify-content: $justify;
+ -ms-flex-pack: $justify;
+}
+
+// align-content
+@mixin align-content($align) {
+ -webkit-align-content: $align;
+ -moz-align-content: $align;
+ -ms-align-content: $align;
+ align-content: $align;
+}
+
+// Cross-axis Alignment
+@mixin align-items($align) {
+ -webkit-align-items: $align;
+ -moz-align-items: $align;
+ -ms-align-items: $align;
+ align-items: $align;
+}
+
+
+// transform
+// Browser Prefixes
+@mixin transform($transforms) {
+ -webkit-transform: $transforms;
+ -moz-transform: $transforms;
+ -ms-transform: $transforms;
+ transform: $transforms;
+}
+// Translate
+@mixin translate ($x, $y) {
+ @include transform(translate($x, $y));
+}
+// TranslateY
+@mixin translateY ($y) {
+ @include transform(translateY($y));
+ }
+// TranslateY
+@mixin translateX ($x) {
+ @include transform(translateX($x));
+ }
+
+
+// Box shadows
+@mixin box-shadow($shadow...) {
+ -webkit-box-shadow: $shadow;
+ -moz-box-shadow: $shadow;
+ box-shadow: $shadow;
+}
+
+
+
+@mixin background($imgpath,$position: center,$size: cover,$repeat: no-repeat) {
+ background: {
+ image: url($imgpath);
+ position: $position;
+ repeat: $repeat;
+ size: $size;
+ }
+}
+@mixin transform_time($total_time) {
+ -webkit-transition: $total_time;
+ transition: $total_time;
+}
+@mixin placeholder {
+&.placeholder {
+ @content;
+}
+&:-moz-placeholder {
+ @content;
+}
+&::-moz-placeholder {
+ @content;
+}
+&::-webkit-input-placeholder {
+ @content;
+}
+}
+@mixin transition($args: all 0.6s ease 0s) {
+-webkit-transition: $args;
+-moz-transition: $args;
+-o-transition: $args;
+transition: $args;
+}
+
+@mixin keyframes ($animation-name) {
+@-webkit-keyframes #{$animation-name} {
+ @content;
+}
+@-moz-keyframes #{$animation-name} {
+ @content;
+}
+@-o-keyframes #{$animation-name} {
+ @content;
+}
+@keyframes #{$animation-name} {
+ @content;
+}
+} \ No newline at end of file