UX: Reducing number of font sizes used in mobile view

This commit is contained in:
Kris 2017-12-19 17:39:17 -05:00
parent b3fda0ea86
commit d90fc415a1
8 changed files with 18 additions and 32 deletions

View File

@ -8,5 +8,5 @@
margin-bottom: -3px;
margin-top: -5px;
padding: 15px;
font-size: 1.1em;
font-size: 1em;
}

View File

@ -31,7 +31,6 @@
}
.user-stat {
margin-left: 55px;
font-size: .929em;
.value {
font-weight: bold;

View File

@ -4,7 +4,7 @@
@media only screen and (max-width: 320px) {
#site-text-logo {
font-size: 18px;
font-size: 1.286em;
}
}

View File

@ -40,7 +40,6 @@ a#forgot-password-link {clear: left; float: left; }
.login-modal, .create-account {
.btn-primary {
margin-bottom: 10px;
font-size: 15;
float: left;
}
}

View File

@ -64,7 +64,7 @@
}
}
.close {
font-size: 1.714em;
font-size: 1.857em;
padding: 10px 15px 5px 5px;
color: $primary;
}
@ -106,7 +106,7 @@
.custom-message-length {
margin: -4px 0 10px 20px;
color: dark-light-choose($primary-high, $secondary-low);
font-size: 85%;
font-size: .857em;
}
.flag-message {

View File

@ -85,7 +85,7 @@
.badge-notification, .category-topic-link td.num .badge-notification {
position: relative;
top: -1px;
font-size: 1.071em;
font-size: 1em;
padding: 4px 6px 3px 6px;
i {color: $secondary;}
@ -260,15 +260,11 @@ tr.category-topic-link {
th .badge-category {
margin: 0;
font-size: 110%;
}
.category-topic-link {
.num {
white-space: nowrap;
.number {
font-size: 1.071em;
}
}
.topic-excerpt {
width: 110%;
@ -438,7 +434,7 @@ td .main-link {
}
.topic-list {
.posts-map {
font-size: 1.15em;
font-size: 1.143em;
}
// so the topic excerpt is full width
// as the containing div is 80%

View File

@ -33,7 +33,6 @@ span.badge-posts {
}
button {
border: none;
font-size: 1.214em;
padding: 8px 10px;
vertical-align: top;
background: transparent;
@ -135,12 +134,6 @@ a.reply-to-tab {
color: dark-light-choose($primary-medium, $secondary-medium);
}
a.star {
display: inline-block;
float: left;
font-size: 1.3em;
}
.topic-post .boxed .contents {
clear: both;
}
@ -196,7 +189,7 @@ a.star {
padding: 4px 5px 2px 5px;
text-align: center;
font-weight: normal;
font-size: .786em;
font-size: .857em;
line-height: 1;
}
}
@ -225,7 +218,7 @@ a.star {
}
.number, i {
color: dark-light-choose($primary-high, $secondary-low);
font-size: 110%;
font-size: 1.143em;
}
.avatar + a {
@ -318,13 +311,11 @@ a.star {
}
a.badge-category, a.badge-category-parent {
font-size: 0.714em;
font-size: 0.857em;
vertical-align: top;
}
}
span.post-count {
background: $primary;
color: $secondary;
@ -452,7 +443,7 @@ button.select-post {
}
.deleted-user-avatar {
font-size: 2.571em;
font-size: 2.286em;
}
span.btn-text {display: none;}
@ -490,7 +481,6 @@ span.highlighted {
}
.post-info {
float: right;
font-size: 0.929em;
margin: 4px 10px 0 0;
.edits { margin-right: 5px; }
}

View File

@ -17,8 +17,8 @@
//margin-bottom: 20px;
margin: 0 60px 10px 0;
h1 {
font-size: 1.5em;
line-height: 1.25em;
font-size: 1.429em;
line-height: 1.25;
a {
color: $primary;
vertical-align: middle;
@ -155,8 +155,8 @@
width: 90%;
margin-left: auto;
margin-right: auto;
font-size: 1.714em;
line-height: 1.1em;
font-size: 1.857em;
line-height: 1.25;
.topic-retry {
display: block;
@ -207,8 +207,10 @@ sup sup, sub sup, sup sub, sub sub { top: 0; }
// make mobile timeline top and bottom dates easier to select
.topic-timeline {
.start-date { font-size: 110%; padding: 5px; }
.now-date { font-size: 110%; padding: 5px; }
.start-date, .now-date {
font-size: 1.143em;
padding: 5px;
}
}
.edit-topic-timer-modal {