james/yarr
4
0
Fork 0
mirror of https://github.com/nkanaev/yarr.git synced 2025-07-09 00:10:09 +00:00
Code Issues Packages Projects Releases Wiki Activity

ui style tweaks

Browse Source
This commit is contained in:
Nazar Kanaev 2020-07-10 21:17:01 +01:00
parent 6753a113ad
commit 9583b4b8d7
3 changed files with 19 additions and 12 deletions
Show Stats Download Patch File Download Diff File Expand all files Collapse all files

21
template/index.html
View File

@ -85,7 +85,7 @@
<input type="radio" name="item" :value="item.id" v-model="itemSelected"> <input type="radio" name="item" :value="item.id" v-model="itemSelected">
<div class="menu-item p-2"> <div class="menu-item p-2">
<div class="d-flex flex-column"> <div class="d-flex flex-column">
<div style="line-height: 1" class="d-flex text-muted"> <div style="line-height: 1.2; opacity: .6;" class="d-flex">
<small class="flex-fill text-truncate mr-1">{{feedsById[item.feed_id].title}}</small> <small class="flex-fill text-truncate mr-1">{{feedsById[item.feed_id].title}}</small>
<small class="flex-shrink-0">{{formatDate(item.date)}}</small> <small class="flex-shrink-0">{{formatDate(item.date)}}</small>
</div> </div>
@ -120,7 +120,7 @@
<img src="./static/images/settings.svg" alt="" style="width: 20px; height: 20px;"> <img src="./static/images/settings.svg" alt="" style="width: 20px; height: 20px;">
</button> </button>
</div> </div>
<div v-if="itemSelected" class="px-3 pt-3 pb-5 border-top overflow-auto"> <div v-if="itemSelected" class="px-5 pt-3 pb-5 border-top overflow-auto">
<h3>{{itemSelectedDetails.title}}</h3> <h3>{{itemSelectedDetails.title}}</h3>
<div class="text-muted"> <div class="text-muted">
<div>{{ feedsById[itemSelectedDetails.feed_id].title }}</div> <div>{{ feedsById[itemSelectedDetails.feed_id].title }}</div>
@ -228,16 +228,15 @@
</div> </div>
</div> </div>
<div v-else-if="settings=='import'"> <div v-else-if="settings=='import'">
<form id="opml-import-form" enctype="multipart/form-data"> <form class="d-inline-block m" id="opml-import-form" enctype="multipart/form-data" style="position: relative;">
<label for="opml-import">Import Subscription</label> <input type="file"
<div class="custom-file"> id="opml-import"
<input type="file" class="custom-file-input" id="opml-import" @change="importOPML" name="opml"> @change="importOPML"
<label class="custom-file-label" for="opml-import">Choose file</label> name="opml"
</div> style="opacity: 0; width: 1px; height: 0; position: absolute;">
<label class="btn btn-default m-0" for="opml-import">Import subscriptions</label>
</form> </form>
<label class="mt-3">Export Subscriptions</label> <a class="btn btn-default" href="/opml/export">Export subscriptions</a>
<br>
<a class="btn btn-default" href="/opml/export" target="_blank">Download</a>
</div> </div>
</div> </div>
</div> </div>

5
template/static/javascripts/app.js
View File

@ -241,8 +241,11 @@ var vm = new Vue({
api.items.update(item.id, {status: item.status}) api.items.update(item.id, {status: item.status})
}, },
importOPML: function(event) { importOPML: function(event) {
var input = event.target
var form = document.querySelector('#opml-import-form') var form = document.querySelector('#opml-import-form')
api.upload_opml(form) api.upload_opml(form).then(function() {
input.value = ''
})
}, },
} }
}) })

5
template/static/stylesheets/app.css
View File

@ -203,6 +203,11 @@ select.form-control:not([multiple]):not([size]) {
box-shadow: none; box-shadow: none;
} }
.content {
font-size: 1.2rem;
line-height: 1.6;
}
.content a:hover { .content a:hover {
text-decoration: none; text-decoration: none;
} }