140 lines
3.4 KiB
SCSS
140 lines
3.4 KiB
SCSS
// Right to left styles.
|
|
// *** These styles are all going to be flipped by the r2 gem ***
|
|
// Adding the !important declaration to a rule prevents it from being flipped.
|
|
|
|
// This is used to flip the .d-icon-caret-right
|
|
@mixin rotate($degrees) {
|
|
-webkit-transform: rotate(#{$degrees}deg);
|
|
-moz-transform: rotate(#{$degrees}deg);
|
|
-ms-transform: rotate(#{$degrees}deg);
|
|
-o-transform: rotate(#{$degrees}deg);
|
|
transform: rotate(#{$degrees}deg);
|
|
|
|
filter: "progid:DXImageTransform.Microsoft.Matrix(sizingMethod='auto expand', M11=#{cos($degrees)}, M12=-#{sin($degrees)}, M21=#{sin($degrees)}, M22=#{cos($degrees)})";
|
|
-ms-filter: "progid:DXImageTransform.Microsoft.Matrix(sizingMethod='auto expand', M11=#{cos($degrees)}, M12=-#{sin($degrees)}, M21=#{sin($degrees)}, M22=#{cos($degrees)})";
|
|
zoom: 1;
|
|
}
|
|
|
|
// Get the right caret to point left
|
|
.rtl .d-icon-caret-right {
|
|
@include rotate(180);
|
|
}
|
|
|
|
// Changes the triangle arrow direction in .nav-stacked .active
|
|
// The 'left' and 'right' in these selectors is not being flipped by r2.
|
|
.rtl .nav-stacked a.active::after {
|
|
border-left-color: transparent !important;
|
|
border-right-color: var(--secondary) !important;
|
|
}
|
|
.rtl code {
|
|
direction: ltr !important;
|
|
text-align: left !important;
|
|
}
|
|
.rtl .pull-left {
|
|
float: right !important;
|
|
}
|
|
.rtl .autocomplete {
|
|
left: 27px;
|
|
}
|
|
|
|
.rtl .admin-customize .current-style .toggle-mobile {
|
|
position: static !important;
|
|
float: left !important;
|
|
}
|
|
.rtl .admin-customize .current-style .toggle-maximize {
|
|
position: static !important;
|
|
float: left !important;
|
|
}
|
|
.rtl .dashboard-left {
|
|
float: right !important;
|
|
}
|
|
.rtl .dashboard-right {
|
|
float: left !important;
|
|
}
|
|
|
|
// This is for the support_mixed_text_direction setting
|
|
.cooked ul[dir="ltr"],
|
|
.d-editor-preview ul[dir="ltr"],
|
|
.rtl .cooked ul[dir="rtl"],
|
|
.rtl .d-editor-preview ul[dir="rtl"] {
|
|
padding-left: 40px;
|
|
padding-right: 0;
|
|
}
|
|
|
|
.cooked ul[dir="rtl"],
|
|
.d-editor-preview ul[dir="rtl"],
|
|
.rtl .cooked ul[dir="ltr"],
|
|
.rtl .d-editor-preview ul[dir="ltr"] {
|
|
padding-left: 0;
|
|
padding-right: 40px;
|
|
}
|
|
|
|
// Fixes github oneboxes for RTL sites
|
|
.rtl aside.onebox.githubblob {
|
|
padding: 12px 25px 12px 12px !important;
|
|
direction: ltr !important;
|
|
}
|
|
|
|
.rtl aside.onebox.githubblob .source {
|
|
background-position: 0 50% !important;
|
|
padding-right: 20px;
|
|
}
|
|
|
|
.rtl pre.onebox code ol.lines {
|
|
margin: 0 0 0 40px !important;
|
|
}
|
|
|
|
.rtl pre.onebox code ol.lines li:before {
|
|
right: -40px;
|
|
padding-left: 5px;
|
|
padding-right: 0;
|
|
text-align: right !important;
|
|
}
|
|
|
|
.rtl pre.onebox code ol.lines li {
|
|
padding-right: 5px;
|
|
padding-left: 0;
|
|
margin-right: 0;
|
|
border-right: 1px solid #cfcfcf;
|
|
border-left: none !important;
|
|
}
|
|
|
|
.rtl {
|
|
$mobile-breakpoint: 700px;
|
|
|
|
.admin-detail.mobile-open {
|
|
@media (max-width: $mobile-breakpoint) {
|
|
transition: transform 0.3s ease;
|
|
@include transform(translateX(-250px));
|
|
}
|
|
@media (max-width: 500px) {
|
|
transition: transform 0.3s ease;
|
|
@include transform(translateX(-50%));
|
|
}
|
|
}
|
|
|
|
.admin-detail.mobile-closed {
|
|
@media (max-width: $mobile-breakpoint) {
|
|
transition: transform 0.3s ease;
|
|
@include transform(translateX(0));
|
|
margin-left: -10px !important;
|
|
padding-left: 10px !important;
|
|
}
|
|
}
|
|
|
|
.admin-nav {
|
|
.nav-stacked {
|
|
margin: 0 -10px 0 10px !important;
|
|
}
|
|
}
|
|
}
|
|
|
|
.rtl .ace_placeholder {
|
|
direction: rtl !important;
|
|
text-align: right !important;
|
|
|
|
[dir="ltr"] {
|
|
text-align: left !important;
|
|
}
|
|
}
|