Adjust public profile pages (#4713)

* Adjust account-grid in public profiles

Full-width card on mobile UI. Set break-word for long name and ID. Fix margin.

* Reduce padding-bottom of public profiles

* Revive next prev buttons in mobile public profiles

In followers followees pages.

* Revert break-word for username

* Fix overflow of display_name

Need re-setting text-overflow and overflow in display: block;
signup-info-prompt
Lynx Kotoura 2017-08-28 06:59:51 +09:00 committed by Eugen Rochko
parent 15093f9113
commit bab9afaa09
2 changed files with 10 additions and 6 deletions

View File

@ -296,7 +296,9 @@
} }
.next, .next,
.prev { .prev,
.next a,
.prev a {
display: inline-block; display: inline-block;
} }
} }
@ -306,7 +308,7 @@
box-shadow: 0 0 15px rgba($base-shadow-color, 0.2); box-shadow: 0 0 15px rgba($base-shadow-color, 0.2);
background: darken($simple-background-color, 8%); background: darken($simple-background-color, 8%);
border-radius: 0 0 4px 4px; border-radius: 0 0 4px 4px;
padding: 20px 10px; padding: 20px 5px;
padding-bottom: 10px; padding-bottom: 10px;
overflow: hidden; overflow: hidden;
display: flex; display: flex;
@ -325,11 +327,11 @@
background: $simple-background-color; background: $simple-background-color;
border-radius: 4px; border-radius: 4px;
color: $ui-base-color; color: $ui-base-color;
margin-bottom: 10px; margin: 0 5px 10px;
position: relative; position: relative;
&:nth-child(odd) { @media screen and (max-width: 740px) {
margin-right: 10px; width: calc(100% - 10px);
} }
.account-grid-card__header { .account-grid-card__header {
@ -400,6 +402,8 @@
.display_name { .display_name {
font-size: 16px; font-size: 16px;
display: block; display: block;
text-overflow: ellipsis;
overflow: hidden;
} }
.username { .username {

View File

@ -6,7 +6,7 @@ body {
line-height: 18px; line-height: 18px;
font-weight: 400; font-weight: 400;
color: $primary-text-color; color: $primary-text-color;
padding-bottom: 140px; padding-bottom: 40px;
text-rendering: optimizelegibility; text-rendering: optimizelegibility;
font-feature-settings: "kern"; font-feature-settings: "kern";
text-size-adjust: none; text-size-adjust: none;