Adding max-width to category logos

Adding max-width to category logos

From 28ddaf80d2cbafdf44bc291d1a2394efa1bf043d Mon Sep 17 00:00:00 2001
From: Kris <kris.aubuchon@discourse.org>
Date: Tue, 4 Dec 2018 13:01:27 -0500
Subject: [PATCH] Adding max-width to category logos


diff --git a/app/assets/stylesheets/desktop/topic-list.scss b/app/assets/stylesheets/desktop/topic-list.scss
index 9cd8d01..48f0218 100644
--- a/app/assets/stylesheets/desktop/topic-list.scss
+++ b/app/assets/stylesheets/desktop/topic-list.scss
@@ -235,8 +235,9 @@ button.dismiss-read {
   .category-logo.aspect-image {
     --max-height: 150px;
     max-height: var(--max-height);
-    width: calc(var(--max-height) * var(--aspect-ratio));
+    max-width: 60%;
     height: auto;
+    width: calc(var(--max-height) * var(--aspect-ratio));
 
     img {
       width: 100%;
diff --git a/app/assets/stylesheets/mobile/topic-list.scss b/app/assets/stylesheets/mobile/topic-list.scss
index 8d9d4b2..be35d19 100644
--- a/app/assets/stylesheets/mobile/topic-list.scss
+++ b/app/assets/stylesheets/mobile/topic-list.scss
@@ -273,9 +273,10 @@ tr.category-topic-link {
   border-top: 1px solid;
 
   h3 {
+    max-width: 100%;
     display: inline-block;
     font-size: $font-up-2;
-    margin: 0 0 0 10px;
+    padding: 0 0 0 10px;
     .d-icon {
       margin-right: 5px;
     }

GitHub

2 Likes