From f772210d0506a787cb33015f04c34d6439b75c4a Mon Sep 17 00:00:00 2001
From: Mouse Reeve <mousereeve@riseup.net>
Date: Sun, 19 Sep 2021 09:21:13 -0700
Subject: [PATCH] Clips tiles on discover view

---
 bookwyrm/templates/discover/discover.html | 22 ++++++++++++----------
 1 file changed, 12 insertions(+), 10 deletions(-)

diff --git a/bookwyrm/templates/discover/discover.html b/bookwyrm/templates/discover/discover.html
index 01ef2186..f55f81a0 100644
--- a/bookwyrm/templates/discover/discover.html
+++ b/bookwyrm/templates/discover/discover.html
@@ -15,14 +15,15 @@
         </p>
     </header>
 
+    {% with tile_classes="tile is-child box has-background-white-ter is-clipped" %}
     <div class="tile is-ancestor">
         <div class="tile is-6 is-parent">
-            <div class="tile is-child box has-background-white-ter">
+            <div class="{{ tile_classes }}">
                 {% include 'discover/large-book.html' with status=large_activities.0 %}
             </div>
         </div>
         <div class="tile is-6 is-parent">
-            <div class="tile is-child box has-background-white-ter">
+            <div class="{{ tile_classes }}">
                 {% include 'discover/large-book.html' with status=large_activities.1 %}
             </div>
         </div>
@@ -31,18 +32,18 @@
     <div class="tile is-ancestor">
         <div class="tile is-vertical is-6">
             <div class="tile is-parent">
-                <div class="tile is-child box has-background-white-ter">
+                <div class="{{ tile_classes }}">
                     {% include 'discover/large-book.html' with status=large_activities.2 %}
                 </div>
             </div>
             <div class="tile">
                 <div class="tile is-parent is-6">
-                    <div class="tile is-child box has-background-white-ter">
+                    <div class="{{ tile_classes }}">
                         {% include 'discover/small-book.html' with status=small_activities.0 %}
                     </div>
                 </div>
                 <div class="tile is-parent is-6">
-                    <div class="tile is-child box has-background-white-ter">
+                    <div class="{{ tile_classes }}">
                         {% include 'discover/small-book.html' with status=small_activities.1 %}
                     </div>
                 </div>
@@ -51,18 +52,18 @@
         <div class="tile is-vertical is-6">
             <div class="tile">
                 <div class="tile is-parent is-6">
-                    <div class="tile is-child box has-background-white-ter">
+                    <div class="{{ tile_classes }}">
                         {% include 'discover/small-book.html' with status=small_activities.2 %}
                     </div>
                 </div>
                 <div class="tile is-parent is-6">
-                    <div class="tile is-child box has-background-white-ter">
+                    <div class="{{ tile_classes }}">
                         {% include 'discover/small-book.html' with status=small_activities.3 %}
                     </div>
                 </div>
             </div>
             <div class="tile is-parent">
-                <div class="tile is-child box has-background-white-ter">
+                <div class="{{ tile_classes }}">
                     {% include 'discover/large-book.html' with status=large_activities.3 %}
                 </div>
             </div>
@@ -71,16 +72,17 @@
 
     <div class="tile is-ancestor">
         <div class="tile is-6 is-parent">
-            <div class="tile is-child box has-background-white-ter">
+            <div class="{{ tile_classes }}">
                 {% include 'discover/large-book.html' with status=large_activities.4 %}
             </div>
         </div>
         <div class="tile is-6 is-parent">
-            <div class="tile is-child box has-background-white-ter">
+            <div class="{{ tile_classes }}">
                 {% include 'discover/large-book.html' with status=large_activities.5 %}
             </div>
         </div>
     </div>
+    {% endwith %}
 </section>
 
 <div class="block">