b374k
m1n1 1.01
Apache/2.4.41 (Ubuntu)
Linux vmi616275.contaboserver.net 5.4.0-84-generic #94-Ubuntu SMP Thu Aug 26 20:27:37 UTC 2021 x86_64
uid=33(www-data) gid=33(www-data) groups=33(www-data)
server ip : 62.171.164.128 | your ip : 127.0.0.1
safemode OFF
 >  / home / dev2.destoffenstraat.com / app / code / Swissup / Rtl / view / base / web / css /
Filename/home/dev2.destoffenstraat.com/app/code/Swissup/Rtl/view/base/web/css/_mixins.less
Size7.69 kb
Permissionrwxrwxrwx
Ownerroot : root
Create time17-Aug-2025 10:26
Last modified13-Mar-2023 12:28
Last accessed22-Aug-2025 13:11
Actionsedit | rename | delete | download (gzip)
Viewtext | code | image
//
// Direction
// ______________________________________________
.direction() {
.modrtl-css(direction, @modrtl-dir);
}
.direction(@value) {
& when (@modrtl-dir = ltr) {
.modrtl-css(direction, @value);
}
& when (@modrtl-dir = rtl) and (@value = ltr) {
.modrtl-css(direction, rtl);
}
& when (@modrtl-dir = rtl) and (@value = rtl) {
.modrtl-css(direction, ltr);
}
}

//
// Background
// ______________________________________________
.background-position(@ltrValue, @rtlValue) {
.modrtl(background-position, @ltrValue, @rtlValue);
}

//
// Padding
// ______________________________________________
.padding-left(@distance) {
.modrtl-css(~"padding-@{modrtl-dir-left}", @distance);
}
.padding-right(@distance) {
.modrtl-css(~"padding-@{modrtl-dir-right}", @distance);
}
.padding(@value) {
.modrtl-sides(padding, @value);
}
.padding(@top, @right, @bottom: '', @left: '') {
.padding(@top @right @bottom @left);
}

//
// Margin
// ______________________________________________
.margin-left(@distance) {
.modrtl-css(~"margin-@{modrtl-dir-left}", @distance);
}
.margin-right(@distance) {
.modrtl-css(~"margin-@{modrtl-dir-right}", @distance);
}
.margin(@value) {
.modrtl-sides(margin, @value);
}
.margin(@top, @right, @bottom: '', @left: '') {
.margin(@top @right @bottom @left);
}

//
// Float
// ______________________________________________
.float(@direction) {
& when (@direction = left) {
.modrtl-css(float, @modrtl-dir-left);
}
& when (@direction = right) {
.modrtl-css(float, @modrtl-dir-right);
}
& when (@direction = none) {
.modrtl-css(float, @direction);
}
}

//
// Text align
// ______________________________________________
.text-align(@direction) {
& when (@direction = left) {
.modrtl-css(text-align, @modrtl-dir-left);
}
& when (@direction = right) {
.modrtl-css(text-align, @modrtl-dir-right);
}
& when (@direction = center) {
.modrtl-css(text-align, @direction);
}
}

//
// Clear
// ______________________________________________
.clear(@direction) {
& when (@direction = left) {
.modrtl-css(clear, @modrtl-dir-left);
}
& when (@direction = right) {
.modrtl-css(clear, @modrtl-dir-right);
}
& when (@direction = both) {
.modrtl-css(clear, @direction);
}
}

//
// Left / Right
// ______________________________________________
.left(@distance) {
& when (@modrtl-dir = ltr) {
.modrtl-css(left, @distance);
}
& when (@modrtl-dir = rtl) {
.modrtl-css(right, @distance);
}
}
.right(@distance) {
& when (@modrtl-dir = ltr) {
.modrtl-css(right, @distance);
}
& when (@modrtl-dir = rtl) {
.modrtl-css(left, @distance);
}
}

//
// Border
// ______________________________________________
.border-left-width(@width) {
.modrtl-css(~"border-@{modrtl-dir-left}-width", @width);
}
.border-right-width(@width) {
.modrtl-css(~"border-@{modrtl-dir-right}-width", @width);
}
.border-width(@value) {
.modrtl-sides(border-width, @value);
}
.border-width(@top, @right, @bottom: '', @left: '') {
.border-width(@top @right @bottom @left);
}

.border-left-style(@style) {
.modrtl-css(~"border-@{modrtl-dir-left}-style", @style);
}
.border-right-style(@style) {
.modrtl-css(~"border-@{modrtl-dir-right}-style", @style);
}
.border-style(@value) {
.modrtl-sides(border-style, @value);
}
.border-style(@top, @right, @bottom: '', @left: '') {
.border-style(@top @right @bottom @left);
}

.border-left-color(@color) {
.modrtl-css(~"border-@{modrtl-dir-left}-color", @color);
}
.border-right-color(@color) {
.modrtl-css(~"border-@{modrtl-dir-right}-color", @color);
}
.border-color(@value) {
.modrtl-sides(border-color, @value);
}
.border-color(@top, @right, @bottom: '', @left: '') {
.border-color(@top @right @bottom @left);
}

.border-left(@border-style) {
.modrtl-css(~"border-@{modrtl-dir-left}", @border-style);
}
.border-right(@border-style) {
.modrtl-css(~"border-@{modrtl-dir-right}", @border-style);
}

.border-top-left-radius(@radius) {
.modrtl-css(~"border-top-@{modrtl-dir-left}-radius", @radius);
}
.border-top-right-radius(@radius) {
.modrtl-css(~"border-top-@{modrtl-dir-right}-radius", @radius);
}
.border-bottom-left-radius(@radius) {
.modrtl-css(~"border-bottom-@{modrtl-dir-left}-radius", @radius);
}
.border-bottom-right-radius(@radius) {
.modrtl-css(~"border-bottom-@{modrtl-dir-right}-radius", @radius);
}
.border-right-radius(@radius) {
.border-top-right-radius(@radius);
.border-bottom-right-radius(@radius);
}
.border-left-radius(@radius) {
.border-top-left-radius(@radius);
.border-bottom-left-radius(@radius);
}
.border-top-radius(@radius) {
.border-top-left-radius(@radius);
.border-top-right-radius(@radius);
}
.border-bottom-radius(@radius) {
.border-bottom-left-radius(@radius);
.border-bottom-right-radius(@radius);
}
.border-radius(@value) {
& when (length(@value) = 1) {
.modrtl-css(border-radius, @value);
}
& when (length(@value) = 2) {
@topLeft: extract(@value, 1);
@topRight: extract(@value, 2);

& when (@modrtl-dir = ltr) {
.modrtl-css(border-radius, @topLeft @topRight);
}
& when (@modrtl-dir = rtl) {
.modrtl-css(border-radius, @topRight @topLeft);
}
}
& when (length(@value) = 3) {
@topLeft: extract(@value, 1);
@topRight: extract(@value, 2);
@bottomRight: extract(@value, 3);

& when (@modrtl-dir = ltr) {
.modrtl-css(border-radius, @topLeft @topRight @bottomRight);
}
& when (@modrtl-dir = rtl) {
.modrtl-css(border-radius, @topRight @topLeft @bottomRight);
}
}
& when (length(@value) = 4) {
@topLeft: extract(@value, 1);
@topRight: extract(@value, 2);
@bottomRight: extract(@value, 3);
@bottomLeft: extract(@value, 4);

& when (@modrtl-dir = ltr) {
.modrtl-css(border-radius, @topLeft @topRight @bottomRight @bottomLeft);
}
& when (@modrtl-dir = rtl) {
.modrtl-css(border-radius, @topRight @topLeft @bottomLeft @bottomRight);
}
}
}
.border-radius(@topRight, @topLeft, @bottomRight: '', @bottomLeft: '') {
.border-radius(@topRight @topLeft @bottomRight @bottomLeft);
}

//
// Helpers for internal usage
// ______________________________________________
.modrtl-css(@property, @value) when not (@value = '')
and not (@value = false)
and not (extract(@value, 1) = false)
and not (extract(@value, 2) = false)
and not (extract(@value, 3) = false)
and not (extract(@value, 4) = false)
and not (extract(@value, 5) = false) {

@{property}: @value;
}

.modrtl-sides(@property, @value) {
& when not (length(@value) = 4) {
.modrtl-css(@property, @value);
}
& when (length(@value) = 4) {
@top: extract(@value, 1);
@right: extract(@value, 2);
@bottom: extract(@value, 3);
@left: extract(@value, 4);

& when (@modrtl-dir = ltr) {
.modrtl-css(@property, @top @right @bottom @left);
}
& when (@modrtl-dir = rtl) {
.modrtl-css(@property, @top @left @bottom @right);
}
}
}

// Shorthand for any property
// .modrtl(background-position, 100% 50%, 0 50%);
// .modrtl(background-position, ~"calc(100% - 20px) 45%", 20px 45%);
// .modrtl(background-position, ~"100% 50%, 0 0", ~"0 50%, 100% 0");
// .modrtl(display, block, none);
.modrtl(@property, @ltrValue, @rtlValue) {
& when (@modrtl-dir = ltr) {
.modrtl-css(@property, @ltrValue);
}
& when (@modrtl-dir = rtl) {
.modrtl-css(@property, @rtlValue);
}
}