Remove css nesting to support devices with iOS 16.4 and older and other browsers (https://caniuse.com/css-nesting)

This commit is contained in:
schlagmichdoch 2023-10-11 19:27:11 +02:00
parent 684fe7142d
commit e367ca9f78
2 changed files with 50 additions and 72 deletions

View file

@ -689,22 +689,19 @@ footer .logo {
position: relative;
}
html:not([dir="rtl"]) {
#display-name,
#edit-pen {
html:not([dir="rtl"]) #display-name,
html:not([dir="rtl"]) #edit-pen {
margin-left: -1rem;
}
}
html[dir="rtl"] {
#display-name,
#edit-pen {
html[dir="rtl"] #display-name,
html[dir="rtl"] #edit-pen {
margin-right: -1rem;
}
#edit-pen {
html[dir="rtl"] #edit-pen {
transform: rotateY(180deg);
}
}
/* Dialog */
@ -986,25 +983,21 @@ x-paper > .button-row > .button {
width: 100%;
}
html:not([dir="rtl"]) {
& x-paper > .button-row > .button:not(:first-child) {
html:not([dir="rtl"]) x-paper > .button-row > .button:not(:first-child) {
border-right: solid 1.5px var(--border-color);
}
& x-paper > .button-row > .button:not(:last-child) {
border-left: solid 1.5px var(--border-color);
}
}
html[dir="rtl"] {
& x-paper > .button-row > .button:not(:first-child) {
html:not([dir="rtl"]) x-paper > .button-row > .button:not(:last-child) {
border-left: solid 1.5px var(--border-color);
}
& x-paper > .button-row > .button:not(:last-child) {
html[dir="rtl"] x-paper > .button-row > .button:not(:first-child) {
border-left: solid 1.5px var(--border-color);
}
html[dir="rtl"] x-paper > .button-row > .button:not(:last-child) {
border-right: solid 1.5px var(--border-color);
}
}
.language-buttons > button > span {
margin: 0 0.3em;
@ -1280,17 +1273,13 @@ button::-moz-focus-inner {
z-index: -1;
}
html:not([dir="rtl"]) {
#about x-background {
html:not([dir="rtl"]) #about x-background {
right: calc(36px - var(--size-half));
}
}
html[dir="rtl"] {
#about x-background {
html[dir="rtl"] #about x-background {
left: calc(36px - var(--size-half));
}
}
/* Hack such that initial scale(0) isn't animated */

View file

@ -719,22 +719,19 @@ footer .logo {
position: relative;
}
html:not([dir="rtl"]) {
#display-name,
#edit-pen {
html:not([dir="rtl"]) #display-name,
html:not([dir="rtl"]) #edit-pen {
margin-left: -1rem;
}
}
html[dir="rtl"] {
#display-name,
#edit-pen {
html[dir="rtl"] #display-name,
html[dir="rtl"] #edit-pen {
margin-right: -1rem;
}
#edit-pen {
html[dir="rtl"] #edit-pen {
transform: rotateY(180deg);
}
}
/* Dialog */
@ -1016,25 +1013,21 @@ x-paper > .button-row > .button {
width: 100%;
}
html:not([dir="rtl"]) {
& x-paper > .button-row > .button:not(:first-child) {
html:not([dir="rtl"]) x-paper > .button-row > .button:not(:first-child) {
border-right: solid 1.5px var(--border-color);
}
& x-paper > .button-row > .button:not(:last-child) {
border-left: solid 1.5px var(--border-color);
}
}
html[dir="rtl"] {
& x-paper > .button-row > .button:not(:first-child) {
html:not([dir="rtl"]) x-paper > .button-row > .button:not(:last-child) {
border-left: solid 1.5px var(--border-color);
}
& x-paper > .button-row > .button:not(:last-child) {
html[dir="rtl"] x-paper > .button-row > .button:not(:first-child) {
border-left: solid 1.5px var(--border-color);
}
html[dir="rtl"] x-paper > .button-row > .button:not(:last-child) {
border-right: solid 1.5px var(--border-color);
}
}
.language-buttons > button > span {
margin: 0 0.3em;
@ -1310,17 +1303,13 @@ button::-moz-focus-inner {
z-index: -1;
}
html:not([dir="rtl"]) {
#about x-background {
html:not([dir="rtl"]) #about x-background {
right: calc(36px - var(--size-half));
}
}
html[dir="rtl"] {
#about x-background {
html[dir="rtl"] #about x-background {
left: calc(36px - var(--size-half));
}
}
/* Hack such that initial scale(0) isn't animated */