UX: More consistent table header styles, removing duplicate styles

This commit is contained in:
Kris 2019-02-26 21:40:17 -05:00
parent 1d4e9b08ad
commit ef9b249cd2
18 changed files with 36 additions and 140 deletions

View File

@ -5,6 +5,7 @@
<th class="th-pos">{{i18n "categories.reorder.position"}}</th> <th class="th-pos">{{i18n "categories.reorder.position"}}</th>
<th class="th-cat">{{i18n "categories.category"}}</th> <th class="th-cat">{{i18n "categories.category"}}</th>
</thead> </thead>
<tbody>
{{#each categoriesOrdered as |cat|}} {{#each categoriesOrdered as |cat|}}
<tr data-category-id="{{cat.id}}"> <tr data-category-id="{{cat.id}}">
<td> <td>
@ -21,6 +22,7 @@
<td>{{category-badge cat allowUncategorized="true"}}</td> <td>{{category-badge cat allowUncategorized="true"}}</td>
</tr> </tr>
{{/each}} {{/each}}
</tbody>
</table> </table>
<div id="rc-scroll-bottom"></div> <div id="rc-scroll-bottom"></div>
{{/d-modal-body}} {{/d-modal-body}}

View File

@ -99,21 +99,6 @@ $mobile-breakpoint: 700px;
th { th {
padding: 8px; padding: 8px;
} }
th {
text-align: left;
&.sortable {
cursor: pointer;
&:hover {
background-color: #e9e9e9;
background-color: lighten($primary, 80%);
}
.d-icon-chevron-down,
.d-icon-chevron-up {
margin-left: 0.5em;
}
}
}
tr:hover { tr:hover {
background-color: darken($secondary, 2.5%); background-color: darken($secondary, 2.5%);
} }

View File

@ -42,7 +42,6 @@
} }
th { th {
background: transparent; background: transparent;
text-align: left;
padding: 0; padding: 0;
} }
} }
@ -139,7 +138,6 @@
} }
} }
th { th {
font-weight: normal;
text-align: center; text-align: center;
background: $primary-low; background: $primary-low;
} }

View File

@ -1,8 +1,5 @@
.moderation-history { .moderation-history {
width: 100%; width: 100%;
th {
text-align: left;
}
td.date { td.date {
padding-right: 1em; padding-right: 1em;
} }

View File

@ -118,15 +118,12 @@
vertical-align: middle; vertical-align: middle;
} }
th { th {
color: dark-light-choose($primary-medium, $secondary-medium);
font-weight: normal;
font-size: $font-0;
button .d-icon { button .d-icon {
color: dark-light-choose($primary-medium, $secondary-medium); color: $primary-medium;
} }
} }
td { td {
color: dark-light-choose($primary-medium, $secondary-medium); color: $primary-medium;
font-size: $font-0; font-size: $font-0;
} }

View File

@ -8,12 +8,7 @@ section.about {
table { table {
width: auto; width: auto;
th { td {
text-align: left;
}
td,
th {
padding: 10px; padding: 10px;
} }

View File

@ -1,9 +1,7 @@
.reorder-categories { .reorder-categories {
thead { thead {
border-bottom: 1px solid $primary-low;
th { th {
padding-bottom: 0.5em; padding-bottom: 0.5em;
text-align: left;
} }
} }
input { input {

View File

@ -46,20 +46,10 @@
} }
th.sortable { th.sortable {
cursor: pointer;
white-space: nowrap;
width: 13%; width: 13%;
.d-icon-heart { .d-icon-heart {
color: $love; color: $love;
margin-right: 0.5em; margin: 0 0.25em 0 0;
}
.d-icon-chevron-down,
.d-icon-chevron-up {
margin-left: 0.5em;
}
&:hover {
background-color: $primary-low;
} }
} }
} }

View File

@ -276,7 +276,31 @@ select {
border: 1px solid $primary-low; border: 1px solid $primary-low;
} }
table {
th {
font-weight: normal;
color: $primary-medium;
text-align: left;
padding: 0.5em;
}
}
// Common Classes // Common Classes
.sortable {
white-space: nowrap;
cursor: pointer;
.discourse-no-touch & {
&:hover {
background-color: $primary-low;
}
}
.d-icon {
margin-left: 0.25em;
}
@include unselectable;
}
.radio, .radio,
.checkbox { .checkbox {
min-height: 18px; min-height: 18px;
@ -532,21 +556,6 @@ select {
.control-group { .control-group {
@include clearfix; @include clearfix;
.table {
width: 100%;
th,
td {
padding: 10px;
text-align: center;
}
}
&.highlighted {
animation: background-fade-highlight 2.5s ease-out;
background-color: dark-light-choose($highlight-low, $highlight);
}
} }
.control-label { .control-label {

View File

@ -82,20 +82,15 @@
table.group-manage-logs { table.group-manage-logs {
width: 100%; width: 100%;
th {
text-align: left;
padding: 5px 0;
}
td { td {
padding: 10px 0; padding: 0.5em;
} }
.group-manage-logs-expand-details { .group-manage-logs-expand-details {
cursor: pointer; cursor: pointer;
.d-icon { .d-icon {
color: blend-primary-secondary(50%); color: $primary-medium;
} }
} }
} }
@ -119,20 +114,6 @@ table.group-members {
th { th {
text-align: center; text-align: center;
padding: 5px 0 5px 5px;
color: dark-light-choose($primary-medium, $secondary-medium);
font-weight: normal;
}
th.sortable {
.d-icon {
margin-left: 5px;
}
&:hover {
cursor: pointer;
background-color: $primary-low;
}
} }
tr { tr {

View File

@ -26,19 +26,6 @@
.groups-table { .groups-table {
width: 100%; width: 100%;
th {
border-bottom: 1px solid $primary-low;
padding: 0.5em;
text-align: left;
}
.sortable {
&:hover {
background-color: $primary-low;
cursor: pointer;
}
}
tr { tr {
td { td {
padding: 0.8em; padding: 0.8em;

View File

@ -607,16 +607,16 @@ blockquote > *:last-child {
.cooked table, .cooked table,
.d-editor-preview table { .d-editor-preview table {
thead { thead {
border-bottom: 2px solid lighten($primary, 80%);
th { th {
text-align: left; text-align: left;
padding-bottom: 2px; padding-bottom: 2px;
font-weight: bold;
color: $primary;
} }
} }
td, td {
th { padding: 3px 3px 3px 0.5em;
padding: 3px 3px 3px 10px;
} }
} }

View File

@ -12,9 +12,7 @@
} }
th { th {
text-align: left;
vertical-align: middle; vertical-align: middle;
font-weight: normal;
} }
td:first-of-type { td:first-of-type {

View File

@ -50,11 +50,3 @@
top: 20px; top: 20px;
right: 20px; right: 20px;
} }
.groups-table {
thead {
.d-icon {
padding-left: 2px;
}
}
}

View File

@ -111,13 +111,6 @@
left: -2px; left: -2px;
} }
.sortable {
cursor: pointer;
&:hover {
background-color: $primary-low;
}
@include unselectable;
}
.likes { .likes {
width: 65px; width: 65px;
} }

View File

@ -115,18 +115,6 @@
.user-invite-list { .user-invite-list {
width: 100%; width: 100%;
margin-top: 15px; margin-top: 15px;
th {
text-align: left;
padding: 0 0 10px 0;
color: dark-light-choose($primary-medium, $secondary-medium);
font-weight: normal;
}
td {
padding: 10px 0 10px 0;
border-bottom: 1px solid $primary-low;
}
} }
.user-invite-search { .user-invite-search {

View File

@ -140,7 +140,6 @@
th, th,
td { td {
padding: 7px 0; padding: 7px 0;
color: dark-light-choose($primary-medium, $secondary-medium);
max-width: 300px; max-width: 300px;
} }

View File

@ -19,9 +19,7 @@
text-overflow: ellipsis; text-overflow: ellipsis;
} }
th { th {
padding: 0.5em;
text-align: right; text-align: right;
border-bottom: 1px solid $primary-low;
} }
td { td {
padding: 0.5em; padding: 0.5em;
@ -51,17 +49,6 @@
table { table {
width: 100%; width: 100%;
margin-top: 10px; margin-top: 10px;
th {
text-align: left;
border-bottom: 1px solid $primary-low;
padding: 5px;
}
td {
padding: 5px;
border-bottom: 1px solid $primary-low;
}
} }
} }