width: 52px;
height: 52px;
font-size: 26px;
- right: $-xs;
+ inset-inline-end: $-xs;
bottom: $-s;
box-shadow: $bs-hover;
background-color: currentColor;
display: block;
transform: rotate(45deg);
transform-origin: 50% 50%;
- border-block-end: 1px solid #CCC;
- border-inline-end: 1px solid #CCC;
+ border-right: 1px solid #CCC;
+ border-bottom: 1px solid #CCC;
z-index: 56;
@include lightDark(background-color, #fff, #333);
@include lightDark(border-color, #ccc, #000);
border-radius: 8px;
box-shadow: $bs-card;
margin-bottom: auto;
- margin-left: $-l;
+ margin-inline-start: $-l;
position: relative;
&.open {
position: relative;
position: relative;
}
.tabs {
- border-right: 1px solid #DDD;
- @include lightDark(border-right-color, #DDD, #000);
+ border-inline-end: 1px solid #DDD;
+ @include lightDark(border-inline-end-color, #DDD, #000);
width: 40px;
flex: 0 1 auto;
- margin-right: -1px;
+ margin-inline-end: -1px;
}
.tabs-inner {
@include lightDark(background-color, #FFFFFF, #222);
@include smaller-than($xxl) {
.floating-toolbox {
- margin-left: $-s;
+ margin-inline-start: $-s;
}
}
margin: 4px !important;
}
.floating-toolbox {
- margin-left: 4px;
+ margin-inline-start: 4px;
}
.floating-toolbox .tabs {
width: 32px;
</head>
<body class="export export-format-{{ $format }} export-engine-{{ $engine ?? 'none' }}">
@include('layouts.parts.export-body-start')
-<div class="page-content">
+<div class="page-content" dir="auto">
@yield('content')
</div>
@include('layouts.parts.export-body-end')