fix(client/rtl): right positioning not adjusted

This commit is contained in:
Elian Doran 2025-10-08 18:36:10 +03:00
parent 8a8727e6df
commit d9bfa08672
No known key found for this signature in database
17 changed files with 54 additions and 54 deletions

View File

@ -102,7 +102,7 @@
content: ''; content: '';
position: absolute; position: absolute;
top: 0; top: 0;
right: 0; inset-inline-end: 0;
bottom: 0; bottom: 0;
width: 1px; width: 1px;
background-color: var(--main-border-color); background-color: var(--main-border-color);

View File

@ -62,7 +62,7 @@
.note-detail-relation-map .endpoint { .note-detail-relation-map .endpoint {
position: absolute; position: absolute;
bottom: 37%; bottom: 37%;
right: 5px; inset-inline-end: 5px;
width: 1em; width: 1em;
height: 1em; height: 1em;
background-color: #333; background-color: #333;

View File

@ -608,7 +608,7 @@ pre:not(.hljs) {
pre > button.copy-button { pre > button.copy-button {
position: absolute; position: absolute;
top: var(--copy-button-margin-size); top: var(--copy-button-margin-size);
right: var(--copy-button-margin-size); inset-inline-end: var(--copy-button-margin-size);
} }
:root pre:has(> button.copy-button) { :root pre:has(> button.copy-button) {
@ -743,7 +743,7 @@ table.promoted-attributes-in-tooltip th {
.bs-tooltip-auto[data-popper-placement^="right"] .tooltip-arrow::before, .bs-tooltip-auto[data-popper-placement^="right"] .tooltip-arrow::before,
.bs-tooltip-right .tooltip-arrow::before { .bs-tooltip-right .tooltip-arrow::before {
right: -1px; inset-inline-end: -1px;
border-width: 0.4rem 0.4rem 0.4rem 0; border-width: 0.4rem 0.4rem 0.4rem 0;
border-inline-end-color: var(--main-border-color) !important; border-inline-end-color: var(--main-border-color) !important;
} }
@ -771,7 +771,7 @@ table.promoted-attributes-in-tooltip th {
.bs-tooltip-auto[data-popper-placement^="right"] .tooltip-arrow::after, .bs-tooltip-auto[data-popper-placement^="right"] .tooltip-arrow::after,
.bs-tooltip-right .tooltip-arrow::after { .bs-tooltip-right .tooltip-arrow::after {
right: -1px; inset-inline-end: -1px;
border-width: 0.4rem 0.4rem 0.4rem 0; border-width: 0.4rem 0.4rem 0.4rem 0;
border-inline-end-color: var(--tooltip-background-color) !important; border-inline-end-color: var(--tooltip-background-color) !important;
} }
@ -825,7 +825,7 @@ table.promoted-attributes-in-tooltip th {
.note-tooltip-content .open-popup-button { .note-tooltip-content .open-popup-button {
position: absolute; position: absolute;
right: 15px; inset-inline-end: 15px;
bottom: 8px; bottom: 8px;
font-size: 1.2em; font-size: 1.2em;
color: inherit; color: inherit;
@ -1059,7 +1059,7 @@ svg.ck-icon .note-icon {
display: inline-block; display: inline-block;
min-width: fit-content; min-width: fit-content;
position: relative; position: relative;
right: 0.2em; inset-inline-end: 0.2em;
text-align: end; text-align: end;
} }
@ -1279,7 +1279,7 @@ a.external:not(.no-arrow):after, a[href^="http://"]:not(.no-arrow):after, a[href
position: fixed; position: fixed;
top: 0; top: 0;
inset-inline-start: 0; inset-inline-start: 0;
right: 0; inset-inline-end: 0;
bottom: 0; bottom: 0;
z-index: 1000; z-index: 1000;
background: rgba(0, 0, 0, 0.1); background: rgba(0, 0, 0, 0.1);
@ -1293,7 +1293,7 @@ a.external:not(.no-arrow):after, a[href^="http://"]:not(.no-arrow):after, a[href
body.mobile #context-menu-container.mobile-bottom-menu { body.mobile #context-menu-container.mobile-bottom-menu {
position: fixed !important; position: fixed !important;
inset-inline-start: 0 !important; inset-inline-start: 0 !important;
right: 0 !important; inset-inline-end: 0 !important;
bottom: 0 !important; bottom: 0 !important;
top: unset !important; top: unset !important;
max-height: 70vh; max-height: 70vh;
@ -1538,7 +1538,7 @@ body:not(.mobile) #launcher-pane.horizontal .dropdown-submenu > .dropdown-menu {
bottom: calc(var(--mobile-bottom-offset) + var(--launcher-pane-size)) !important; bottom: calc(var(--mobile-bottom-offset) + var(--launcher-pane-size)) !important;
top: unset !important; top: unset !important;
inset-inline-start: 0 !important; inset-inline-start: 0 !important;
right: 0 !important; inset-inline-end: 0 !important;
transform: unset !important; transform: unset !important;
} }
@ -1546,7 +1546,7 @@ body:not(.mobile) #launcher-pane.horizontal .dropdown-submenu > .dropdown-menu {
position: fixed; position: fixed;
top: 0; top: 0;
inset-inline-start: 0; inset-inline-start: 0;
right: 0; inset-inline-end: 0;
bottom: 0; bottom: 0;
z-index: 1000; z-index: 1000;
transition: background-color 250ms ease-in-out; transition: background-color 250ms ease-in-out;
@ -1594,7 +1594,7 @@ body:not(.mobile) #launcher-pane.horizontal .dropdown-submenu > .dropdown-menu {
position: fixed; position: fixed;
bottom: 0; bottom: 0;
inset-inline-start: 0; inset-inline-start: 0;
right: 0; inset-inline-end: 0;
margin: 0 !important; margin: 0 !important;
max-height: 85vh; max-height: 85vh;
display: flex; display: flex;
@ -2042,7 +2042,7 @@ body.zen .split-note-container-widget > .gutter {
body.zen #launcher-pane { body.zen #launcher-pane {
position: absolute !important; position: absolute !important;
top: 0 !important; top: 0 !important;
right: 0 !important; inset-inline-end: 0 !important;
width: 64px !important; width: 64px !important;
height: 64px !important; height: 64px !important;
background: transparent !important; background: transparent !important;
@ -2062,7 +2062,7 @@ body.zen .floating-buttons {
} }
body.zen .floating-buttons-children { body.zen .floating-buttons-children {
right: 0; inset-inline-end: 0;
} }
body.zen .floating-buttons-children .button-widget { body.zen .floating-buttons-children .button-widget {
@ -2383,7 +2383,7 @@ footer.webview-footer button {
.content-floating-buttons.bottom-right { .content-floating-buttons.bottom-right {
bottom: 10px; bottom: 10px;
right: 10px; inset-inline-end: 10px;
} }
.content-floating-buttons button.bx { .content-floating-buttons button.bx {

View File

@ -121,7 +121,7 @@ body.desktop .dropdown-menu::before,
position: absolute; position: absolute;
top: 0; top: 0;
inset-inline-start: 0; inset-inline-start: 0;
right: 0; inset-inline-end: 0;
bottom: 0; bottom: 0;
z-index: -1; z-index: -1;
} }
@ -225,7 +225,7 @@ html body .dropdown-item[disabled] {
content: ""; content: "";
top: -1px; top: -1px;
inset-inline-start: calc(0px - var(--menu-padding-size)); inset-inline-start: calc(0px - var(--menu-padding-size));
right: calc(0px - var(--menu-padding-size)); inset-inline-end: calc(0px - var(--menu-padding-size));
border-top: 1px solid var(--menu-item-delimiter-color); border-top: 1px solid var(--menu-item-delimiter-color);
} }
@ -237,7 +237,7 @@ html body .dropdown-item[disabled] {
align-items: center; align-items: center;
justify-content: center; justify-content: center;
top: 0; top: 0;
right: 0; inset-inline-end: 0;
margin: unset !important; margin: unset !important;
border: unset !important; border: unset !important;
padding: 0 4px; padding: 0 4px;
@ -265,7 +265,7 @@ html body .dropdown-item[disabled] {
position: absolute; position: absolute;
bottom: 8px; bottom: 8px;
inset-inline-start: calc(0px - var(--menu-padding-size)); inset-inline-start: calc(0px - var(--menu-padding-size));
right: calc(0px - var(--menu-padding-size)); inset-inline-end: calc(0px - var(--menu-padding-size));
border-top: 1px solid var(--menu-item-delimiter-color); border-top: 1px solid var(--menu-item-delimiter-color);
} }

View File

@ -451,7 +451,7 @@ optgroup {
content: "\eae1"; content: "\eae1";
width: 2em; width: 2em;
height: 100%; height: 100%;
right: 0; inset-inline-end: 0;
top: 0; top: 0;
font-size: 1.2em; font-size: 1.2em;
font-family: boxicons; font-family: boxicons;

View File

@ -117,7 +117,7 @@
content: ""; content: "";
position: absolute; position: absolute;
top: var(--negative-padding); top: var(--negative-padding);
right: var(--negative-padding); inset-inline-end: var(--negative-padding);
bottom: var(--negative-padding); bottom: var(--negative-padding);
inset-inline-start: var(--negative-padding); inset-inline-start: var(--negative-padding);
border-radius: var(--dropdown-border-radius); border-radius: var(--dropdown-border-radius);
@ -234,7 +234,7 @@
top: 0; top: 0;
bottom: var(--negative-padding); bottom: var(--negative-padding);
inset-inline-start: var(--negative-padding); inset-inline-start: var(--negative-padding);
right: var(--negative-padding); inset-inline-end: var(--negative-padding);
border-top: 1px solid var(--ck-editor-popup-border-color); border-top: 1px solid var(--ck-editor-popup-border-color);
background: var(--menu-section-background-color); background: var(--menu-section-background-color);
} }
@ -620,7 +620,7 @@ html .note-detail-editable-text :not(figure, .include-note, hr):first-child {
.ck-content blockquote:after { .ck-content blockquote:after {
content: "”"; content: "”";
right: 0.35em; inset-inline-end: 0.35em;
} }
.ck-content h2, .ck-content h2,

View File

@ -142,7 +142,7 @@ ul.editability-dropdown li.dropdown-item > div {
} }
.attribute-list .save-attributes-button { .attribute-list .save-attributes-button {
right: 30px; inset-inline-end: 30px;
} }
/* Note path in attribute detail dialog */ /* Note path in attribute detail dialog */

View File

@ -284,7 +284,7 @@ body.layout-horizontal > .horizontal {
} }
#launcher-pane.horizontal .global-menu-button .global-menu-button-update-available { #launcher-pane.horizontal .global-menu-button .global-menu-button-update-available {
right: -23px; inset-inline-end: -23px;
bottom: -22px; bottom: -22px;
transform: scale(0.85); transform: scale(0.85);
} }
@ -400,7 +400,7 @@ body.layout-horizontal > .horizontal {
content: ""; content: "";
position: absolute; position: absolute;
top: var(--vertical-margin); top: var(--vertical-margin);
right: var(--horiz-margin); inset-inline-end: var(--horiz-margin);
bottom: var(--vertical-margin); bottom: var(--vertical-margin);
inset-inline-start: var(--horiz-margin); inset-inline-start: var(--horiz-margin);
border-radius: 6px; border-radius: 6px;
@ -498,7 +498,7 @@ div.quick-search::before {
top: var(--padding-top); top: var(--padding-top);
inset-inline-start: var(--padding-inline-start); inset-inline-start: var(--padding-inline-start);
bottom: var(--padding-bottom); bottom: var(--padding-bottom);
right: var(--padding-inline-end); inset-inline-end: var(--padding-inline-end);
z-index: 0; z-index: 0;
border: 2px solid transparent; border: 2px solid transparent;
border-radius: 6px; border-radius: 6px;
@ -660,7 +660,7 @@ body.layout-vertical.background-effects div.quick-search .dropdown-menu {
top: var(--left-pane-item-selected-shadow-size); top: var(--left-pane-item-selected-shadow-size);
inset-inline-start: var(--left-pane-item-selected-shadow-size); inset-inline-start: var(--left-pane-item-selected-shadow-size);
bottom: var(--left-pane-item-selected-shadow-size); bottom: var(--left-pane-item-selected-shadow-size);
right: var(--left-pane-item-selected-shadow-size); inset-inline-end: var(--left-pane-item-selected-shadow-size);
background: var(--left-pane-item-selected-background) !important; background: var(--left-pane-item-selected-background) !important;
box-shadow: var(--left-pane-item-selected-shadow); box-shadow: var(--left-pane-item-selected-shadow);
border-radius: 6px; border-radius: 6px;
@ -676,7 +676,7 @@ body.layout-vertical.background-effects div.quick-search .dropdown-menu {
#left-pane span.fancytree-node.protected > span.fancytree-custom-icon:after { #left-pane span.fancytree-node.protected > span.fancytree-custom-icon:after {
position: absolute; position: absolute;
bottom: 0; bottom: 0;
right: 0; inset-inline-end: 0;
font-size: 14px; font-size: 14px;
content: "\eb4a"; content: "\eb4a";
font-family: "boxicons"; font-family: "boxicons";
@ -772,7 +772,7 @@ body.mobile .fancytree-node > span {
/* Toolbar container (collapsed state) */ /* Toolbar container (collapsed state) */
#left-pane .tree-actions { #left-pane .tree-actions {
max-width: var(--tree-actions-toolbar-collapsed-width); max-width: var(--tree-actions-toolbar-collapsed-width);
right: var(--tree-actions-toolbar-horizontal-margin); inset-inline-end: var(--tree-actions-toolbar-horizontal-margin);
bottom: var(--tree-actions-toolbar-vertical-margin); bottom: var(--tree-actions-toolbar-vertical-margin);
overflow: hidden; overflow: hidden;
border: 1px solid transparent; border: 1px solid transparent;
@ -821,7 +821,7 @@ body.mobile .fancytree-node > span {
justify-content: center; justify-content: center;
align-items: center; align-items: center;
top: 50%; top: 50%;
right: calc((var(--tree-actions-toolbar-collapsed-width) - var(--tree-actions-toolbar-expand-button-size)) / 2); inset-inline-end: calc((var(--tree-actions-toolbar-collapsed-width) - var(--tree-actions-toolbar-expand-button-size)) / 2);
width: var(--tree-actions-toolbar-expand-button-size); width: var(--tree-actions-toolbar-expand-button-size);
height: var(--tree-actions-toolbar-expand-button-size); height: var(--tree-actions-toolbar-expand-button-size);
box-shadow: 2px 2px 6px var(--left-pane-background-color); box-shadow: 2px 2px 6px var(--left-pane-background-color);
@ -911,7 +911,7 @@ body.electron.background-effects.layout-horizontal .tab-row-container .toggle-bu
position: absolute; position: absolute;
bottom: 0; bottom: 0;
inset-inline-start: -10px; inset-inline-start: -10px;
right: -10px; inset-inline-end: -10px;
top: 32px; top: 32px;
height: 1px; height: 1px;
border-bottom: 1px solid var(--launcher-pane-horiz-border-color); border-bottom: 1px solid var(--launcher-pane-horiz-border-color);
@ -923,12 +923,12 @@ body.electron.background-effects.layout-horizontal .tab-row-container .tab-scrol
} }
body.electron.background-effects.layout-horizontal .tab-row-container .tab-scroll-button-inset-inline-start:after, body.electron.background-effects.layout-horizontal .tab-row-container .tab-scroll-button-inset-inline-start:after,
body.electron.background-effects.layout-horizontal .tab-row-container .tab-scroll-button-right:after { body.electron.background-effects.layout-horizontal .tab-row-container .tab-scroll-button-inset-inline-end:after {
content: ""; content: "";
position: absolute; position: absolute;
bottom: 0; bottom: 0;
inset-inline-start: 0px; inset-inline-start: 0px;
right: 0px; inset-inline-end: 0px;
height: 1px; height: 1px;
border-bottom: 1px solid var(--launcher-pane-horiz-border-color); border-bottom: 1px solid var(--launcher-pane-horiz-border-color);
} }
@ -939,7 +939,7 @@ body.electron.background-effects.layout-horizontal .tab-row-container .note-tab[
bottom: 0; bottom: 0;
inset-inline-start: -32768px; inset-inline-start: -32768px;
top: var(--tab-height); top: var(--tab-height);
right: calc(100% - 1px); inset-inline-end: calc(100% - 1px);
height: 1px; height: 1px;
border-bottom: 1px solid var(--launcher-pane-horiz-border-color); border-bottom: 1px solid var(--launcher-pane-horiz-border-color);
} }
@ -950,7 +950,7 @@ body.electron.background-effects.layout-horizontal .tab-row-container .note-tab[
bottom: 0; bottom: 0;
inset-inline-start: 100%; inset-inline-start: 100%;
top: var(--tab-height); top: var(--tab-height);
right: 0; inset-inline-end: 0;
width: 100vw; width: 100vw;
height: 1px; height: 1px;
border-bottom: 1px solid var(--launcher-pane-horiz-border-color); border-bottom: 1px solid var(--launcher-pane-horiz-border-color);
@ -962,7 +962,7 @@ body.electron.background-effects.layout-horizontal .tab-row-container .note-new-
bottom: 0; bottom: 0;
inset-inline-start: -4px; inset-inline-start: -4px;
top: calc(var(--tab-height), -1); top: calc(var(--tab-height), -1);
right: 0; inset-inline-end: 0;
width: 100vw; width: 100vw;
height: 1px; height: 1px;
border-bottom: 1px solid var(--launcher-pane-horiz-border-color); border-bottom: 1px solid var(--launcher-pane-horiz-border-color);
@ -1050,7 +1050,7 @@ body.layout-horizontal .tab-row-widget .note-tab .note-tab-wrapper {
position: absolute; position: absolute;
top: 0; top: 0;
inset-inline-start: 0; inset-inline-start: 0;
right: 0; inset-inline-end: 0;
height: 3px; height: 3px;
background-color: var(--workspace-tab-background-color); background-color: var(--workspace-tab-background-color);
} }
@ -1676,7 +1676,7 @@ div.find-replace-widget div.find-widget-found-wrapper > span {
.find-widget-close-button { .find-widget-close-button {
position: absolute; position: absolute;
top: .85em; top: .85em;
right: .5em; inset-inline-end: .5em;
} }
.find-widget-box > * { .find-widget-box > * {

View File

@ -7,7 +7,7 @@
.show-floating-buttons { .show-floating-buttons {
position: absolute; position: absolute;
top: var(--floating-buttons-vert-offset, 10px); top: var(--floating-buttons-vert-offset, 10px);
right: var(--floating-buttons-horiz-offset, 10px); inset-inline-end: var(--floating-buttons-horiz-offset, 10px);
display: flex; display: flex;
flex-direction: row; flex-direction: row;
z-index: 100; z-index: 100;
@ -15,7 +15,7 @@
.note-split.rtl .floating-buttons-children, .note-split.rtl .floating-buttons-children,
.note-split.rtl .show-floating-buttons { .note-split.rtl .show-floating-buttons {
right: unset; inset-inline-end: unset;
inset-inline-end: 10px; inset-inline-end: 10px;
} }
@ -140,7 +140,7 @@
z-index: 10; z-index: 10;
position: absolute; position: absolute;
top: 50px; top: 50px;
right: 10px; inset-inline-end: 10px;
width: 400px; width: 400px;
border-radius: 10px; border-radius: 10px;
background-color: var(--accented-background-color); background-color: var(--accented-background-color);

View File

@ -23,6 +23,6 @@
color: var(--button-text-color); color: var(--button-text-color);
position: absolute; position: absolute;
top: 10px; top: 10px;
right: 10px; inset-inline-end: 10px;
cursor: pointer; cursor: pointer;
} }

View File

@ -55,7 +55,7 @@ button.global-menu-button {
.global-menu-button-update-available { .global-menu-button-update-available {
position: absolute; position: absolute;
right: -30px; inset-inline-end: -30px;
bottom: -30px; bottom: -30px;
width: 100%; width: 100%;
height: 100%; height: 100%;

View File

@ -11,7 +11,7 @@ body.zen .close-zen-container {
display: block; display: block;
position: fixed; position: fixed;
top: 2px; top: 2px;
right: 2px; inset-inline-end: 2px;
z-index: 9999; z-index: 9999;
-webkit-app-region: no-drag; -webkit-app-region: no-drag;
} }
@ -22,5 +22,5 @@ body.zen.mobile .close-zen-container {
body.zen.electron:not(.platform-darwin):not(.native-titlebar) .close-zen-container { body.zen.electron:not(.platform-darwin):not(.native-titlebar) .close-zen-container {
inset-inline-start: calc(env(titlebar-area-width) - var(--zen-button-size) - 2px); inset-inline-start: calc(env(titlebar-area-width) - var(--zen-button-size) - 2px);
right: unset; inset-inline-end: unset;
} }

View File

@ -153,7 +153,7 @@
.board-view-container .board-note > .edit-icon { .board-view-container .board-note > .edit-icon {
position: absolute; position: absolute;
top: 8px; top: 8px;
right: 4px; inset-inline-end: 4px;
padding: 2px; padding: 2px;
background-color: var(--main-background-color); background-color: var(--main-background-color);
} }
@ -165,7 +165,7 @@
.board-view-container .board-note:hover > .edit-icon { .board-view-container .board-note:hover > .edit-icon {
position: absolute; position: absolute;
top: 8px; top: 8px;
right: 4px; inset-inline-end: 4px;
color: var(--main-text-color); color: var(--main-text-color);
background-color: var(--main-background-color); background-color: var(--main-background-color);
padding-inline-start: 6px; padding-inline-start: 6px;

View File

@ -14,7 +14,7 @@
position: absolute; position: absolute;
top: 0; top: 0;
inset-inline-start: 0; inset-inline-start: 0;
right: 0; inset-inline-end: 0;
bottom: 0; bottom: 0;
} }

View File

@ -14,7 +14,7 @@
position: absolute; position: absolute;
top: 0; top: 0;
inset-inline-start: 0; inset-inline-start: 0;
right: 0; inset-inline-end: 0;
bottom: 0; bottom: 0;
} }

View File

@ -262,7 +262,7 @@
.note-map-ribbon-widget .open-full-button, .note-map-ribbon-widget .collapse-button { .note-map-ribbon-widget .open-full-button, .note-map-ribbon-widget .collapse-button {
position: absolute; position: absolute;
right: 5px; inset-inline-end: 5px;
bottom: 5px; bottom: 5px;
z-index: 1000; z-index: 1000;
} }
@ -294,7 +294,7 @@
display: flex; display: flex;
position: absolute; position: absolute;
top: 0; top: 0;
right: 0; inset-inline-end: 0;
bottom: 0; bottom: 0;
align-items: center; align-items: center;
gap: 10px; gap: 10px;

View File

@ -13,7 +13,7 @@
#root-widget.virtual-keyboard-opened .classic-toolbar-outer-container.ios { #root-widget.virtual-keyboard-opened .classic-toolbar-outer-container.ios {
position: absolute; position: absolute;
inset-inline-start: 0; inset-inline-start: 0;
right: 0; inset-inline-end: 0;
bottom: 0; bottom: 0;
} }
@ -21,7 +21,7 @@
position: absolute; position: absolute;
bottom: 0; bottom: 0;
inset-inline-start: 0; inset-inline-start: 0;
right: 0; inset-inline-end: 0;
height: 38px; height: 38px;
overflow: scroll; overflow: scroll;
display: flex; display: flex;