Discource-C
/
discourse
mirror of https://github.com/discourse/discourse.git
1
0
Fork 0
Code Issues Packages Projects Releases Wiki Activity

UX: More consistent category lock and topic-status styles

This commit is contained in:
Kris 2018-12-10 16:06:26 -05:00
parent 414aa1fe7a
commit 73d2fc194d
7 changed files with 37 additions and 20 deletions
Show Stats Download Patch File Download Diff File Expand all files Collapse all files

2
app/assets/javascripts/discourse/templates/components/categories-boxes-with-topics.hbs
View File

@ -1,5 +1,5 @@
{{#each categories as |c|}} {{#each categories as |c|}}
<div class='category-box category-box-{{unbound c.slug}}' style={{border-color c.color}}> <div class='category category-box category-box-{{unbound c.slug}}' style={{border-color c.color}}>
<div class='category-box-inner'> <div class='category-box-inner'>
<div class='category-box-heading'> <div class='category-box-heading'>
<a href={{c.url}}> <a href={{c.url}}>

2
app/assets/javascripts/discourse/templates/components/categories-boxes.hbs
View File

@ -1,5 +1,5 @@
{{#each categories as |c|}} {{#each categories as |c|}}
<div class='category-box category-box-{{unbound c.slug}}' style={{border-color c.color}} data-url={{c.url}}> <div class='category category-box category-box-{{unbound c.slug}}' style={{border-color c.color}} data-url={{c.url}}>
<div class='category-box-inner'> <div class='category-box-inner'>
<div class="category-logo"> <div class="category-logo">
{{#if c.uploaded_logo.url}} {{#if c.uploaded_logo.url}}

28
app/assets/stylesheets/common/base/category-list.scss
View File

@ -55,10 +55,6 @@
max-width: 100%; max-width: 100%;
} }
} }
h3 .fa {
color: $primary;
}
} }
.category-box-inner { .category-box-inner {
@ -186,16 +182,34 @@
li { li {
padding: 4px 0; padding: 4px 0;
display: flex; display: flex;
align-items: baseline;
.overflow { .overflow {
max-height: 3em; max-height: 3em;
overflow: hidden; overflow: hidden;
text-overflow: ellipsis; text-overflow: ellipsis;
} }
.d-icon { .d-icon {
margin-right: 6px; margin-right: 0.15em;
margin-top: 2px; width: 0.76em;
height: 0.76em;
} }
} }
} }
} }
.categories-list .category {
h3 .d-icon {
color: $primary-medium;
height: 0.76em;
width: 0.76em;
vertical-align: baseline;
margin-right: 0.15em;
}
}
.category-boxes-with-topics,
.category-boxes {
.category-box h3 .d-icon {
margin-right: 0;
}
}

12
app/assets/stylesheets/common/base/discourse.scss
View File

@ -670,16 +670,18 @@ select {
} }
.topic-statuses { .topic-statuses {
display: inline;
float: left; float: left;
padding: 0; margin-right: 0.15em;
line-height: $line-height-medium;
color: $primary-medium;
.topic-status { .topic-status {
margin: 0; margin: 0;
display: inline-flex;
color: $primary-medium;
.d-icon { .d-icon {
height: 0.75em; height: 0.76em;
width: 0.75em; width: 0.75em;
}
&:not(:last-child) {
margin-right: 0.15em; margin-right: 0.15em;
} }
} }

3
app/assets/stylesheets/common/base/topic.scss
View File

@ -67,7 +67,8 @@
display: inline-block; display: inline-block;
} }
.topic-statuses { .topic-statuses {
line-height: 0.95; line-height: 1.2em;
margin-right: 0.15em;
.d-icon { .d-icon {
color: $primary-medium; color: $primary-medium;
} }

4
app/assets/stylesheets/common/components/badges.scss
View File

@ -32,8 +32,8 @@
} }
.d-icon { .d-icon {
margin-right: 3px; margin-right: 3px;
width: 0.7em; width: 0.74em;
height: 0.7em; height: 0.74em;
} }
} }

6
app/assets/stylesheets/desktop/category-list.scss
View File

@ -76,6 +76,9 @@
text-overflow: ellipsis; text-overflow: ellipsis;
flex: 0 1 auto; flex: 0 1 auto;
} }
.topic-statuses {
margin-right: 0.15em;
}
.topic-post-badges .badge.new-posts, .topic-post-badges .badge.new-posts,
.title { .title {
margin-right: 5px; margin-right: 5px;
@ -91,9 +94,6 @@
a[href] { a[href] {
color: $primary; color: $primary;
} }
.fa {
margin-right: 5px;
}
} }
} }