119 lines
2.1 KiB
SCSS
Executable File
119 lines
2.1 KiB
SCSS
Executable File
@mixin transition {
|
|
transition: all 0.2s ease-in-out 0s;
|
|
-moz-transition: all 0.2s ease-in-out 0s;
|
|
}
|
|
|
|
@mixin transformY {
|
|
transform: translateY(-50%);
|
|
-moz-ransform: translateY(-50%);
|
|
-o-transform: translateY(-50%);
|
|
-ms-transform: translateY(-50%);
|
|
-webkit-transform: translateY(-50%);
|
|
}
|
|
|
|
@mixin transformX {
|
|
transform: translateX(-50%);
|
|
-moz-ransform: translateX(-50%);
|
|
-o-transform: translateX(-50%);
|
|
-ms-transform: translateX(-50%);
|
|
-webkit-transform: translateX(-50%);
|
|
}
|
|
|
|
@mixin transform {
|
|
transform: translate(-50%, -50%);
|
|
-moz-ransform: translate(-50%, -50%);
|
|
-o-transform: translate(-50%, -50%);
|
|
-ms-transform: translate(-50%, -50%);
|
|
-webkit-transform: translate(-50%, -50%);
|
|
}
|
|
|
|
@mixin transformReset {
|
|
transform: translate(0, 0);
|
|
-moz-ransform: translate(0, 0);
|
|
-o-transform: translate(0, 0);
|
|
-ms-transform: translate(0, 0);
|
|
-webkit-transform: translate(0, 0);
|
|
}
|
|
|
|
@mixin rotate {
|
|
transform: rotate(90deg);
|
|
-webkit-transform: rotate(90deg);
|
|
-o-transform: rotate(90deg);
|
|
-ms-transform: rotate(90deg);
|
|
-moz-transform: rotate(90deg);
|
|
}
|
|
|
|
@mixin ImgCon {
|
|
width: 100%;
|
|
height: 100%;
|
|
object-fit: contain;
|
|
-o-object-fit: contain;
|
|
}
|
|
|
|
@mixin ImgCov {
|
|
width: 100%;
|
|
height: 100%;
|
|
object-fit: cover;
|
|
-o-object-fit: cover;
|
|
}
|
|
|
|
// @mixin height {
|
|
// @media (max-height: 390px) {
|
|
// @content;
|
|
// }
|
|
// }
|
|
|
|
@mixin sm-md {
|
|
@media (max-width: 350px) {
|
|
@content;
|
|
}
|
|
}
|
|
|
|
@mixin sm-xl {
|
|
@media (max-width: 520px) {
|
|
@content;
|
|
}
|
|
}
|
|
|
|
@mixin md-sm {
|
|
@media (max-width: 720px) {
|
|
@content;
|
|
}
|
|
}
|
|
|
|
@mixin md-lg {
|
|
@media (max-width: 900px) {
|
|
@content;
|
|
}
|
|
}
|
|
|
|
|
|
@mixin md-xlg {
|
|
@media (max-width: 1024px) {
|
|
@content;
|
|
}
|
|
}
|
|
|
|
@mixin lg-lg {
|
|
@media (max-width: 1200px) {
|
|
@content;
|
|
}
|
|
}
|
|
|
|
@mixin lg-xlg {
|
|
@media (max-width: 1400px) {
|
|
@content;
|
|
}
|
|
}
|
|
|
|
@mixin lg-xxlg {
|
|
@media (max-width: 1500px) {
|
|
@content;
|
|
}
|
|
}
|
|
|
|
@mixin xlg-xxlg {
|
|
@media (max-width: 1665px) {
|
|
@content;
|
|
}
|
|
} |