changeset 188:e85122a39e8f

css (grid): added `overflow: hidden` on items + added .grid__item--small and .grid__item--auto
author Goffi <goffi@goffi.org>
date Sun, 14 Apr 2019 08:09:42 +0200
parents 7539d98e1d08
children e5fdd7e13764
files sat_templates/templates/default/blog/discover.html sat_templates/templates/default/static/styles.css
diffstat 2 files changed, 16 insertions(+), 4 deletions(-) [+]
line wrap: on
line diff
--- a/sat_templates/templates/default/blog/discover.html	Sun Apr 14 08:09:40 2019 +0200
+++ b/sat_templates/templates/default/blog/discover.html	Sun Apr 14 08:09:42 2019 +0200
@@ -15,7 +15,7 @@
 <div class="disco_blogs">
     <ul class="grid grid--center">
         {% for entity in disco_entities %}
-            <li class='grid__item grid__item--medium grid__item--selectable'>
+            <li class='grid__item grid__item--small grid__item--selectable'>
                 <a href="{{entities_url[entity]}}" class="items_vert--centered">
                     {{ avatar.avatar(entity, class="avatar--medium") }}
                     <span>{{ identities[entity].nick|default(entity, true) }}</span>
--- a/sat_templates/templates/default/static/styles.css	Sun Apr 14 08:09:40 2019 +0200
+++ b/sat_templates/templates/default/static/styles.css	Sun Apr 14 08:09:42 2019 +0200
@@ -635,15 +635,27 @@
     justify-content: center;
 }
 
+.grid__item {
+    overflow: hidden;
+    margin: 0 0.1em;
+    padding: 0.2em;
+    text-align: center;
+}
+
 li.grid__item>a {
     text-decoration: none;
     color: inherit;
 }
 
+.grid__item--small {
+    width: 80px;
+}
+
 .grid__item--medium {
-   width: 170px;
-   padding: 0.2em;
-   text-align: center;
+    width: 170px;
+}
+
+.grid__item--auto {
 }
 
 .grid__item--selectable {