Fix CSS styles for RTL langs
Fixes a bug in the extraInfo and profileIndicator features where the
layout didn't look right for right-to-left languages.
Reported by Medelinor (thanks! :) )
Change-Id: I6998260bc1eecde9db9e94c7fe114981cbe54b53
diff --git a/src/static/css/extrainfo.css b/src/static/css/extrainfo.css
index 0767ee2..5737193 100644
--- a/src/static/css/extrainfo.css
+++ b/src/static/css/extrainfo.css
@@ -11,8 +11,8 @@
}
.TWPT-extrainfo-info-cell {
- border-left: solid 1px var(--TWPT-interop-subtle-border, #ababab);
- padding-left: 8px;
+ border-inline-start: solid 1px var(--TWPT-interop-subtle-border, #ababab);
+ padding-inline-start: 8px;
display: flex;
flex-direction: column;
}
@@ -42,7 +42,7 @@
font-size: 13px;
position: absolute;
bottom: 25px;
- right: 48px;
+ inset-inline-end: 48px;
}
ec-message .footer .TWPT-extrainfo-container {
@@ -56,7 +56,7 @@
}
ec-message .footer .TWPT-extrainfo-info-cell {
- padding-left: 6px;
+ padding-inline-start: 6px;
}
/* Special styles for good/bad labels */
@@ -100,7 +100,7 @@
ec-canned-response-row .TWPT-content .TWPT-badge {
--icon-size: 14px;
- margin-right: 6px;
+ margin-inline-end: 6px;
}
ec-canned-response-row .TWPT-content span[aria-describedby] {
diff --git a/src/static/css/profileindicator_inject.css b/src/static/css/profileindicator_inject.css
index 55a7d63..a937b8c 100644
--- a/src/static/css/profileindicator_inject.css
+++ b/src/static/css/profileindicator_inject.css
@@ -15,7 +15,7 @@
.profile-indicator {
display: inline-block;
font-size: 16px;
- margin-left: 4px;
+ margin-inline-start: 4px;
}
.profile-indicator a {
@@ -51,7 +51,7 @@
.num-posts-indicator {
display: inline-block;
padding: 3px 7px;
- margin-left: 8px;
+ margin-inline-start: 8px;
border-radius: 16px;
height: 14px;
min-width: 12px;