Fix mobile CSS

boards.yml

@@ -105,7 +105,6 @@ boards:
             is_parsable: false
             mix:
               - http://rss.cnn.com/rss/edition.rss
-              - https://www.buzzfeed.com/index.xml
               - https://www.huffpost.com/section/front-page/feed
               - https://www.newyorker.com/feed/news
               - https://www.msnbc.com/feed

scripts/update.py

@@ -173,7 +173,9 @@ def fetch_rss(item, rss):
             real_url, content_type, content_length = resolve_url(entry_link)
 
             # load and summarize article
-            if item["is_parsable"] and content_length <= MAX_PARSABLE_CONTENT_LENGTH \
+            if item["is_parsable"] \
+                    and content_length <= MAX_PARSABLE_CONTENT_LENGTH \
+                    and content_type \
                     and content_type.startswith("text/"):  # to not try to parse podcasts :D
 
                 if real_url:

static/css/layout.css

@@ -69,7 +69,7 @@
 
     @media only screen and (max-width : 570px) {
         .block-100, .block-50 {
-            width: auto;
+            width: 100%;
         }
     }
 
@@ -83,6 +83,7 @@
 
     .feed {
         width: 100%;
+        min-width: 200px;
         box-sizing: border-box;
     }
 
@@ -91,7 +92,7 @@
     }
 
     .feeds-2 .feed {
-        width: 49%;
+        width: 50%;
     }
 
     .feed .article-tooltip {
@@ -113,8 +114,8 @@
 
     @media only screen and (max-width : 1024px)  {
         /* Switch to 2-columns */
-        .feeds {
-            grid-template-columns: 50% 50%;
+        .feeds .feed {
+            width: 50%;
         }
 
             .feeds .feed .article-tooltip {
@@ -135,8 +136,8 @@
     }
 
     @media only screen and (max-width : 750px) {
-        .feeds {
-            grid-template-columns: 100%;
+        .feeds .feed {
+            width: 100%;
         }
 
             .feeds .feed .article-tooltip {

templates/tooltips/simple.html

@@ -2,7 +2,7 @@
 
 <a href="{{ article.url }}" class="article-tooltip" rel="noopener noreferrer nofollow" target="_blank">
     {% if article.image %}
-        <img src="{{ article.image }}" alt="{{ article.title|striptags }}" class="article-tooltip-image">
+        <img src="{{ article.image }}" alt="{{ article.title|striptags }}" class="article-tooltip-image" loading="lazy">
     {% endif %}
 
     <span class="article-tooltip-title">{{ article.title|striptags|truncatechars:300 }}</span>