From 4b2866932755aac7fdc216fc7a932343e684e91b Mon Sep 17 00:00:00 2001
From: codl <codl@codl.fr>
Date: Thu, 31 Aug 2017 21:56:17 +0200
Subject: [PATCH] small visual changes

---
 assets/styles.css        |  3 ++-
 components/Banner.html   | 22 +++++++++++++---------
 templates/logged_in.html |  8 +++++++-
 3 files changed, 22 insertions(+), 11 deletions(-)

diff --git a/assets/styles.css b/assets/styles.css
index 3e69e7b..6ada8d3 100644
--- a/assets/styles.css
+++ b/assets/styles.css
@@ -77,11 +77,12 @@ input[type=number]{
 body > section > .banner,
 body > section > .container > .banner {
     padding-left: 4.3rem;
+    padding-right: 4.3rem;
 }
 
 .banner.enabled {
     border-left-color: transparent;
-    background: #bbfbff;
+    background: #cde;
 }
 
 .banner.disabled {
diff --git a/components/Banner.html b/components/Banner.html
index bad7215..76e4733 100644
--- a/components/Banner.html
+++ b/components/Banner.html
@@ -3,15 +3,21 @@
         <button class='primary' on:click='toggle(policy_enabled)'>{{policy_enabled?'Disable':'Enable'}}</button>
     </div>
     <div>
-        Forget is currently {{policy_enabled?'enabled':'disabled'}} on your account.
+        Forget is currently
+        {{#if policy_enabled }}
+        <b>enabled</b>
+        {{else}}
+        disabled
+        {{/if}}
+        on your account.
     </div>
     <div class='timers'>
+        <span class='last-delete {{(!last_delete)?'hidden':''}}' title={{last_delete}}>
         {{#if last_delete }}
-        <span class='last-delete {{(!last_delete)?'hidden':''}}'>
             Last delete {{rel_past(now - last_delete)}}.
-        </span>
         {{/if }}
-        <span class='next-delete {{(!policy_enabled || !next_delete || !eligible_for_delete_estimate)?'hidden':''}}'>
+        </span>
+        <span class='next-delete {{(!policy_enabled || !next_delete || !eligible_for_delete_estimate)?'hidden':''}}' title={{next_delete}}>
             Next delete {{rel_future(next_delete - now)}}.
         </span>
     </div>
@@ -25,20 +31,18 @@
 .timers > * {
     transition-property: opacity, transform;
     transition-duration: 0.4s;
+    display: inline-block;
 }
 
 .timers > .hidden {
     opacity: 0;
-    transform: translateY(-100%);
+    transform: translateY(-0.3em);
     pointer-events: none;
 }
 
-.btn-group {
-    margin-right: 5rem;
-}
-
 .right {
     float: right;
+    margin-left: 1em;
 }
 
 button.primary {
diff --git a/templates/logged_in.html b/templates/logged_in.html
index f8173a3..ae68d10 100644
--- a/templates/logged_in.html
+++ b/templates/logged_in.html
@@ -13,7 +13,13 @@
 </p>
 <div class='main-banner container'>
     {% set enabled_disabled = "enabled" if g.viewer.account.policy_enabled else "disabled" %}
-    <div class="banner {{enabled_disabled}}">Forget is currently {{ enabled_disabled }} on your account.
+    <div class="banner {{enabled_disabled}}">Forget is currently
+    {% if g.viewer.account.policy_enabled -%}
+        <b>enabled</b>
+    {% else -%}
+        disabled
+    {% endif %}
+        on your account.
     {% if g.viewer.account.policy_enabled -%}
         <form action='{{url_for("disable")}}' method='post' enctype='multipart/form-data'>
             <input type='submit' value='Disable'>