minor ui tweaks

This commit is contained in:
Nazar Kanaev 2020-06-15 22:02:30 +01:00 committed by nkanaev
parent 0f9214ffeb
commit 20ea9a849b
3 changed files with 12 additions and 4 deletions

View File

@ -10,7 +10,7 @@
<div class="wrapper d-flex vh-100" id="app" v-cloak> <div class="wrapper d-flex vh-100" id="app" v-cloak>
<div class="vh-100 overflow-auto border-right flex-shrink-0" style="width: 300px"> <div class="vh-100 overflow-auto border-right flex-shrink-0" style="width: 300px">
<div class="mx-2 my-2"> <div class="mx-2 my-2">
<div class="mb-4"> <div class="mb-5">
<label class="nav-select d-block mb-1" v-for="filter in filters"> <label class="nav-select d-block mb-1" v-for="filter in filters">
<input type="radio" name="filter" :value="filter.value" v-model="filterSelected"> <input type="radio" name="filter" :value="filter.value" v-model="filterSelected">
<div class="nav-item d-flex align-items-center w-100"> <div class="nav-item d-flex align-items-center w-100">
@ -21,6 +21,14 @@
</label> </label>
</div> </div>
<div> <div>
<label class="nav-select d-block mb-1">
<input type="radio" name="feed" :value="null" v-model="feedSelected">
<div class="nav-item d-flex align-items-center w-100">
<img src="./static/images/layers.svg" alt="" class="nav-icon">
<span class="flex-fill text-left text-truncate">All Feeds</span>
<span class="counter text-right"></span>
</div>
</label>
<div v-for="folder in foldersWithFeeds"> <div v-for="folder in foldersWithFeeds">
<label class="nav-select d-block mb-1"> <label class="nav-select d-block mb-1">
<input type="radio" name="feed" :value="'folder:'+folder.id" v-model="feedSelected"> <input type="radio" name="feed" :value="'folder:'+folder.id" v-model="feedSelected">
@ -61,9 +69,7 @@
<small class="flex-fill text-truncate">{{feedsById[entry.feed_id].title}}</small> <small class="flex-fill text-truncate">{{feedsById[entry.feed_id].title}}</small>
<small class="">{{formatDate(entry.date)}}</small> <small class="">{{formatDate(entry.date)}}</small>
</div> </div>
<span class="font-weight-bold"> <span>{{entry.title}}</span>
{{entry.title}}
</span>
</div> </div>
</div> </div>
</label> </label>

View File

@ -0,0 +1 @@
<svg xmlns="http://www.w3.org/2000/svg" width="24" height="24" viewBox="0 0 24 24" fill="none" stroke="currentColor" stroke-width="2" stroke-linecap="round" stroke-linejoin="round" class="feather feather-layers"><polygon points="12 2 2 7 12 12 22 7 12 2"></polygon><polyline points="2 17 12 22 22 17"></polyline><polyline points="2 12 12 17 22 12"></polyline></svg>

After

Width:  |  Height:  |  Size: 365 B

View File

@ -59,6 +59,7 @@ new Vue({
}, },
watch: { watch: {
'feedSelected': function(newVal, oldVal) { 'feedSelected': function(newVal, oldVal) {
if (newVal === null) return
var parts = newVal.split(':', 2) var parts = newVal.split(':', 2)
var type = parts[0] var type = parts[0]
var guid = parts[1] var guid = parts[1]