Basic styling, set up query params

This commit is contained in:
Justin DiRose 2019-07-14 16:31:29 -05:00
parent af0243cee8
commit 46820c070f
5 changed files with 64 additions and 6 deletions

View File

@ -0,0 +1,3 @@
export default Ember.Component.extend({
classNames: "knowledge-explorer-topic-list"
});

View File

@ -5,5 +5,11 @@ import {
} from "ember-addons/ember-computed-decorators";
export default Ember.Controller.extend({
application: Ember.inject.controller()
application: Ember.inject.controller(),
queryParams: {
filterCategory: 'category',
filterTags: 'tags'
},
filterTags: null,
filterCategory: null,
});

View File

@ -7,7 +7,8 @@ export default Ember.Route.extend({
setupController(controller, model) {
controller.setProperties({
model: model
tags: model.tags,
topics: model.topics
});
}
});

View File

@ -1,6 +1,8 @@
<div class="knowledge-explorer">
{{knowledge-explorer-tags
tags=model.tags
searchResults=searchResults}}
{{knowledge-explorer-topic-list topics=model.topics}}
<div class="knowledge-explorer-browse">
{{knowledge-explorer-tags
tags=tags
searchResults=searchResults}}
{{knowledge-explorer-topic-list topics=topics}}
</div>
</div>

View File

@ -0,0 +1,46 @@
.knowledge-explorer {
.knowledge-explorer-browse {
display: flex;
.knowledge-explorer-tags {
flex-basis: 25%;
padding: 10px 10px 10px 0;
a {
color: $primary;
}
.knowledge-explorer-tag {
display: flex;
align-items: center;
cursor: pointer;
height: 30px;
padding-left: 10px;
.d-icon {
height: 1em;
&.d-icon-plus {
height: 0.75em;
margin-right: 0.25em;
}
&.d-icon-times-circle {
margin-left: 0.25em;
}
}
&:hover {
background: $highlight-medium;
}
&.selected:hover {
background: $danger-low;
.d-icon {
color: $danger;
}
}
}
.selected {
font-weight: bold;
}
}
.knowledge-explorer-topic-list {
flex-basis: 75%;
}
}
}