Chromium Code Reviews
chromiumcodereview-hr@appspot.gserviceaccount.com (chromiumcodereview-hr) | Please choose your nickname with Settings | Help | Chromium Project | Gerrit Changes | Sign out
(1254)

Unified Diff: ui/login/account_picker/md_user_pod_row.css

Issue 2947933002: Fix style issues for right-to-left languages (Closed)
Patch Set: Address comments Created 3 years, 6 months ago
Use n/p to move between diff chunks; N/P to move between comments. Draft comments are only viewable by you.
Jump to:
View side-by-side diff with in-line comments
Download patch
« no previous file with comments | « no previous file | ui/login/account_picker/md_user_pod_row.js » ('j') | no next file with comments »
Expand Comments ('e') | Collapse Comments ('c') | Show Comments Hide Comments ('s')
Index: ui/login/account_picker/md_user_pod_row.css
diff --git a/ui/login/account_picker/md_user_pod_row.css b/ui/login/account_picker/md_user_pod_row.css
index 933269bbb7cb1c51de2a647e5e6ee894c045fb87..869f6f7d08a99adc9e493375991ac0acc05f410d 100644
--- a/ui/login/account_picker/md_user_pod_row.css
+++ b/ui/login/account_picker/md_user_pod_row.css
@@ -6,10 +6,7 @@
*/
podrow {
- /* Temporarily disabled because animation interferes with updating screen's
- size. */
overflow: visible;
- position: absolute;
}
/* Hide the pod row while images are loading. */
@@ -77,7 +74,7 @@ pin-keyboard {
html[dir=rtl] .user-image-pane {
left: auto;
- right: 10px;
+ right: 105px;
}
.user-image-container {
@@ -142,15 +139,9 @@ html:not([screen=login-add-user]) .pod.focused .user-image {
}
.main-pane {
- position: absolute;
z-index: 2;
}
-html[dir=rtl] .main-pane {
- left: auto;
- right: 10px;
-}
-
.name-container {
display: flex;
position: absolute;
@@ -174,6 +165,11 @@ html[dir=rtl] .main-pane {
</if>
}
+html[dir=rtl] .pod.focused:not(.multiprofiles-policy-applied) .auth-container {
+ left: auto;
+ right: 51px;
+}
+
.auth-container .submit-button[disabled] {
opacity: 0.34;
}
@@ -222,6 +218,7 @@ html[dir=rtl] .main-pane {
stroke: #FFFFFF;
stroke-width: 1px;
top: 40px;
+ width: 204px;
}
.input-present .input-line {
@@ -508,12 +505,6 @@ html[dir=rtl] .main-pane {
z-index: 4;
}
-html[dir=rtl] .action-box-area {
- left: 0;
- position: absolute;
- right: auto;
-}
-
.action-box-area:focus,
.action-box-area.hovered,
.action-box-area.active,
@@ -522,8 +513,9 @@ html[dir=rtl] .action-box-area {
}
.action-box-button {
+ -webkit-margin-start: 8px;
height: 24px;
- margin: 3px 0 0 8px;
+ margin-top: 3px;
padding: 0;
width: 24px;
}
@@ -619,12 +611,13 @@ html[dir=rtl] .user-type-icon-area {
}
.action-box-area.active ~ .action-box-menu {
+ -webkit-margin-start: 12px;
background-color: rgba(0, 0, 0, 0.8);
border-radius: 2px;
display: flex;
flex-direction: column;
font-size: 13px;
- margin: 3px 0 0 12px;
+ margin-top: 3px;
width: 220px;
}
@@ -648,11 +641,6 @@ html[dir=rtl] .user-type-icon-area {
transform: rotate(180deg);
}
-html[dir=rtl] .action-box-area.active ~ .action-box-menu {
- left: 5px;
- right: auto;
-}
-
.action-box-menu-title {
color: #FFFFFF;
display: flex;
@@ -754,7 +742,7 @@ html[dir=rtl] .action-box-area.active ~ .action-box-menu {
html[dir=rtl] .user-type-bubble {
left: auto;
- right: 5px;
+ right: 36px;
}
.bubble-shown,
@@ -878,11 +866,11 @@ html[dir=rtl] .expanded-pane {
}
.public-account-info-container .info {
+ -webkit-padding-start: 8px;
color: rgba(255, 255, 255, .67);
font-family: "Roboto";
font-size: 13px;
overflow: hidden;
- padding-left: 8px;
position: absolute;
text-overflow: ellipsis;
white-space: nowrap;
@@ -899,6 +887,11 @@ html[dir=rtl] .expanded-pane {
width: 40px;
}
+html[dir=rtl] .pod.public-account .button-container {
+ left: auto;
+ right: 133px;
+}
+
.pod.public-account .button-container.forced,
.pod.public-account.hovered .button-container,
.pod.public-account.focused .button-container {
@@ -1000,9 +993,14 @@ html[dir=rtl] .expanded-pane {
width: 40px;
}
+html[dir=rtl] .enter-button-container {
+ left: 28px;
+ right: auto;
+}
+
.language-and-input-dropdown {
+ -webkit-margin-start: 6px;
height: 16px;
- margin-left: 6px;
padding: 0;
width: 16px;
}
@@ -1103,12 +1101,22 @@ html[dir=rtl] .expanded-pane {
width: 214px;
}
+html[dir=rtl] .small-pod-name {
+ left: auto;
+ right: 90px;
+}
+
.small-pod.extra-small .small-pod-name {
left: 76px;
padding: 16px 0;
width: 190px;
}
+html[dir=rtl] .small-pod.extra-small .small-pod-name {
+ left: auto;
+ right: 76px;
+}
+
@keyframes switch-image {
from { transform: rotate3d(0, 1, 0, 90deg); }
to { transform: none; }
« no previous file with comments | « no previous file | ui/login/account_picker/md_user_pod_row.js » ('j') | no next file with comments »

Powered by Google App Engine
This is Rietveld 408576698