REFACTOR: Category / Tag Dropdown headers had extra classes

This commit is contained in:
Robin Ward 2017-07-28 16:19:33 -04:00
parent e4c2b5e430
commit 67556e6381
7 changed files with 21 additions and 19 deletions

View File

@ -35,7 +35,7 @@ export default Ember.Component.extend({
}.property('category'), }.property('category'),
dropdownButtonClass: function() { dropdownButtonClass: function() {
var result = 'badge-category category-dropdown-button'; let result = 'dropdown-header category-dropdown-button';
if (Em.isNone(this.get('category'))) { if (Em.isNone(this.get('category'))) {
result += ' home'; result += ' home';
} }
@ -85,7 +85,9 @@ export default Ember.Component.extend({
} }
} }
if (categoryStyle === 'box') {
return "background-color: #eee; color: #333".htmlSafe(); return "background-color: #eee; color: #333".htmlSafe();
}
}.property('category'), }.property('category'),
clickEventName: function() { clickEventName: function() {

View File

@ -69,7 +69,7 @@ export default Ember.Component.extend({
@computed('tag') @computed('tag')
dropdownButtonClass() { dropdownButtonClass() {
let result = 'badge-category category-dropdown-button'; let result = 'dropdown-header category-dropdown-button';
if (Em.isNone(this.get('tag'))) { if (Em.isNone(this.get('tag'))) {
result += ' home'; result += ' home';
} }

View File

@ -1,5 +1,5 @@
{{#if category}} {{#if category}}
<a href {{action "expand"}} class="badge-category" style={{badgeStyle}} aria-label={{i18n 'categories.category_list'}} aria-expanded={{expanded}}> <a href {{action "expand"}} class="dropdown-header" style={{badgeStyle}} aria-label={{i18n 'categories.category_list'}} aria-expanded={{expanded}}>
<span class="badge-category-bg" style={{categoryColor}}></span> <span class="badge-category-bg" style={{categoryColor}}></span>
{{#if category.read_restricted}} {{#if category.read_restricted}}
{{d-icon "lock"}} {{d-icon "lock"}}
@ -8,9 +8,9 @@
</a> </a>
{{else}} {{else}}
{{#if noSubcategories}} {{#if noSubcategories}}
<a href {{action "expand"}} class='badge-category home' style={{badgeStyle}} aria-label={{i18n 'categories.category_list'}} aria-expanded={{expanded}}>{{i18n 'categories.no_subcategory'}}</a> <a href {{action "expand"}} class='dropdown-header home' style={{badgeStyle}} aria-label={{i18n 'categories.category_list'}} aria-expanded={{expanded}}>{{i18n 'categories.no_subcategory'}}</a>
{{else}} {{else}}
<a href {{action "expand"}} class='badge-category home' style={{badgeStyle}} aria-label={{i18n 'categories.category_list'}} aria-expanded={{expanded}}>{{allCategoriesLabel}}</a> <a href {{action "expand"}} class='dropdown-header home' style={{badgeStyle}} aria-label={{i18n 'categories.category_list'}} aria-expanded={{expanded}}>{{allCategoriesLabel}}</a>
{{/if}} {{/if}}
{{/if}} {{/if}}

View File

@ -1,12 +1,12 @@
{{#if showTagDropdown}} {{#if showTagDropdown}}
{{#if tagId}} {{#if tagId}}
{{#if noTagsSelected}} {{#if noTagsSelected}}
<a href {{action "expand"}} class="badge-category {{tagClass}} home">{{noTagsLabel}}</a> <a href {{action "expand"}} class="dropdown-header {{tagClass}} home">{{noTagsLabel}}</a>
{{else}} {{else}}
<a href {{action "expand"}} class="badge-category {{tagClass}}">{{tagId}}</a> <a href {{action "expand"}} class="dropdown-header {{tagClass}}">{{tagId}}</a>
{{/if}} {{/if}}
{{else}} {{else}}
<a href {{action "expand"}} class="badge-category {{tagClass}} home">{{allTagsLabel}}</a> <a href {{action "expand"}} class="dropdown-header {{tagClass}} home">{{allTagsLabel}}</a>
{{/if}} {{/if}}
{{#if tags}} {{#if tags}}
@ -14,8 +14,8 @@
{{d-icon expandedIcon}} {{d-icon expandedIcon}}
</a> </a>
<section class="{{unless expanded 'hidden'}} category-dropdown-menu chooser"> <section class="{{unless expanded 'hidden'}} category-dropdown-menu chooser">
<div class='cat'><a href={{allTagsUrl}} data-drop-close="true" class='badge-category home'>{{allTagsLabel}}</a></div> <div class='cat'><a href={{allTagsUrl}} data-drop-close="true" class='dropdown-header home'>{{allTagsLabel}}</a></div>
<div class='cat'><a href={{noTagsUrl}} data-drop-close="true" class='badge-category home'>{{noTagsLabel}}</a></div> <div class='cat'><a href={{noTagsUrl}} data-drop-close="true" class='dropdown-header home'>{{noTagsLabel}}</a></div>
{{#if renderTags}} {{#if renderTags}}
{{#each tags as |t|}} {{#each tags as |t|}}
<div class='cat'> <div class='cat'>

View File

@ -247,7 +247,7 @@ ol.category-breadcrumb {
overflow:hidden; overflow:hidden;
margin-bottom: 0; margin-bottom: 0;
} }
a.badge-category { a.badge-category, .dropdown-header {
font-size: 0.929em; font-size: 0.929em;
font-weight: bold; font-weight: bold;
float: none; float: none;

View File

@ -149,7 +149,7 @@
.list-controls { .list-controls {
.category-breadcrumb { .category-breadcrumb {
a.badge-category { a.badge-category, .dropdown-header {
display: inline-block; display: inline-block;
padding: 5px 8px; padding: 5px 8px;
line-height: 20px; line-height: 20px;
@ -164,16 +164,17 @@
} }
} }
li.bar>.badge-category:not(.home):first-child { li.bar>.dropdown-header:not(.home):first-child {
border-left: 5px solid; border-left: 5px solid;
font-size: 1em;
} }
li.bar>.badge-category { li.bar>.dropdown-header {
background: $primary-low; background: $primary-low;
color: $primary; color: $primary;
} }
li.bullet>.badge-category { li.bullet>.dropdown-header {
background: $primary-low; background: $primary-low;
color: $primary; color: $primary;
@ -189,7 +190,7 @@
} }
.category-dropdown-menu { .category-dropdown-menu {
.badge-category { .dropdown-header {
&.home { &.home {
margin-left: 4px; margin-left: 4px;
padding-left: 0; padding-left: 0;

View File

@ -23,8 +23,7 @@
float: none; float: none;
} }
a.badge-category, .dropdown-header {
a.badge-category {
padding: 3px 12px; padding: 3px 12px;
font-size: 1.143em; font-size: 1.143em;
} }