From 63f9d559039387af8862b83894daf0bae294dd94 Mon Sep 17 00:00:00 2001
From: Farow <farow.the.time.traveler@gmail.com>
Date: Sun, 30 May 2021 11:28:57 +0300
Subject: [PATCH] update ui

- display full date when hovering over the age in the article list
- hide close article button on desktop layouts
- autofocus username on the login page
- hide the title on the settings/appearance dropdowns (still visible on the buttons)
---
 src/assets/index.html         | 4 ++--
 src/assets/javascripts/app.js | 4 ++--
 src/assets/login.html         | 2 +-
 3 files changed, 5 insertions(+), 5 deletions(-)

diff --git a/src/assets/index.html b/src/assets/index.html
index f514c66..09911ec 100644
--- a/src/assets/index.html
+++ b/src/assets/index.html
@@ -255,7 +255,7 @@
                             <small class="flex-fill text-truncate mr-1">
                                 {{ feedsById[item.feed_id].title }}
                             </small>
-                            <small class="flex-shrink-0"><relative-time :val="item.date"/></small>
+                            <small class="flex-shrink-0"><relative-time v-bind:title="formatDate(item.date)" :val="item.date"/></small>
                         </div>
                         <div>{{ item.title || 'untitled' }}</div>
                     </div>
@@ -313,7 +313,7 @@
                     <span class="icon">{% inline "external-link.svg" %}</span>
                 </a>
                 <div class="flex-grow-1"></div>
-                <button class="toolbar-item" @click="itemSelected=null" title="Close Article">
+                <button class="toolbar-item d-md-none" @click="itemSelected=null" title="Close Article">
                     <span class="icon">{% inline "x.svg" %}</span>
                 </button>
             </div>
diff --git a/src/assets/javascripts/app.js b/src/assets/javascripts/app.js
index 9e3c567..cb8f67f 100644
--- a/src/assets/javascripts/app.js
+++ b/src/assets/javascripts/app.js
@@ -47,13 +47,13 @@ Vue.component('drag', {
 })
 
 Vue.component('dropdown', {
-  props: ['class', 'toggle-class', 'ref', 'drop'],
+  props: ['class', 'toggle-class', 'ref', 'drop', 'title'],
   data: function() {
     return {open: false}
   },
   template: `
     <div class="dropdown" :class="$attrs.class">
-      <button ref="btn" @click="toggle" :class="btnToggleClass"><slot name="button"></slot></button>
+      <button ref="btn" @click="toggle" :class="btnToggleClass" :title="$props.title"><slot name="button"></slot></button>
       <div ref="menu" class="dropdown-menu" :class="{show: open}"><slot v-if="open"></slot></div>
     </div>
   `,
diff --git a/src/assets/login.html b/src/assets/login.html
index 1ab2207..601f5c1 100644
--- a/src/assets/login.html
+++ b/src/assets/login.html
@@ -30,7 +30,7 @@
         <div class="form-group">
             <label for="username">Username</label>
             <input name="username" class="form-control" id="username" autocomplete="off"
-                   value="{% if .username %}{% .username %}{% end %}" required>
+                   value="{% if .username %}{% .username %}{% end %}" required autofocus>
         </div>
         <div class="form-group">
             <label for="password">Password</label>