Cleans up show/hide behavior

bookwyrm/static/css/bookwyrm.css

@@ -88,10 +88,11 @@ body {
 .transition-y.is-hidden {
     display: block !important;
     visibility: hidden !important;
-    height: 0;
+    height: 0 !important;
-    width: 0;
+    width: 0 !important;
-    margin: 0;
+    margin: 0 !important;
-    padding: 0;
+    padding: 0 !important;
+    overflow: auto;
 }
 
 .transition-x,

bookwyrm/templates/directory/directory.html

@@ -49,7 +49,3 @@
 </div>
 
 {% endblock %}
-
-{% block scripts %}
-<script src="/static/js/localstorage.js"></script>
-{% endblock %}

bookwyrm/templates/layout.html

@@ -238,6 +238,7 @@
     var csrf_token = '{{ csrf_token }}';
 </script>
 <script src="/static/js/bookwyrm.js"></script>
+<script src="/static/js/localstorage.js"></script>
 {% block scripts %}{% endblock %}
 </body>
 </html>

bookwyrm/templates/settings/announcement.html

@@ -54,7 +54,7 @@
 
     <hr aria-hidden="true">
 
-    {% include 'snippets/announcement.html' with announcement=announcement pressed=True %}
+    {% include 'snippets/announcement.html' with announcement=announcement pressed=True admin_mode=True %}
 </div>
 
 {% endblock %}

bookwyrm/templates/snippets/announcement.html

@@ -1,22 +1,31 @@
 {% load humanize %}{% load i18n %}{% load utilities %}
 {% with announcement.id|uuid as uuid %}
-<aside class="notification p-3">
+<aside class="notification mb-1 p-3 is-hidden transition-y"{% if not admin_mode %} data-hide="hide-announcement-{{ announcement.id }}"{% endif %}>
     <div class="columns mb-0">
-        <div class="column">
+        <div class="column pb-0">
             {% if announcement.event_date %}
             <strong>{{ announcement.event_date|naturalday|title }}:</strong>
             {% endif %}
             {{ announcement.preview }}
         </div>
-        <div class="column is-narrow">
+        <div class="column is-narrow pb-0">
             {% trans "Open" as button_text %}
             {% include 'snippets/toggle/open_button.html' with text=button_text controls_text="announcement" class="is-small" controls_uid=uuid icon_with_text="arrow-down" %}
             {% trans "Close" as button_text %}
             {% include 'snippets/toggle/close_button.html' with text=button_text controls_text="announcement" class="is-small" controls_uid=uuid icon_with_text="arrow-up" %}
         </div>
     </div>
-    <div class="box is-shadowless m-0{% if not pressed %} is-hidden{% endif %}" id="announcement-{{ uuid }}">
+    <div class="mb-2 mt-2 {% if not pressed %}is-hidden{% endif %}" id="announcement-{{ uuid }}">
-        {{ announcement.content|safe }}
+        <div class="box is-shadowless mb-0">
+            {{ announcement.content|safe }}
+        </div>
+    </div>
+    <div class="is-flex mt-0 help">
+        <p>{% blocktrans with user_path=announcement.user.local_path username=announcement.user.display_name %}Posted by <a href="{{ user_path }}">{{ username }}</a>{% endblocktrans %}</p>
+        {% if not admin_mode %}
+        <span class="mr-2 ml-2" aria-hidden="true">&middot;</span>
+        <a class="set-display" data-id="hide-announcement-{{ announcement.id }}" data-value="true">{% trans "Dismiss message" %}</a>
+        {% endif %}
     </div>
 </aside>
 {% endwith %}