From 36d62d796cdbb7e0cc3187c19287f5a821e54563 Mon Sep 17 00:00:00 2001
From: profi248 <kostal.david8@gmail.com>
Date: Tue, 29 Dec 2020 13:14:30 +0000
Subject: [PATCH] Fixed squishy color bubble (#358)

Fixed squishy color bubble

The bubble was getting squished on smaller screens because of flex-shrink. Changed flex-shrink to 0.

Reviewed-on: https://kolaente.dev/vikunja/frontend/pulls/358
Reviewed-by: konrad <konrad@kola-entertainments.de>
Co-Authored-By: profi248 <kostal.david8@gmail.com>
Co-Committed-By: profi248 <kostal.david8@gmail.com>
---
 src/styles/components/tasks.scss | 2 +-
 src/styles/theme/navigation.scss | 2 +-
 2 files changed, 2 insertions(+), 2 deletions(-)

diff --git a/src/styles/components/tasks.scss b/src/styles/components/tasks.scss
index dfefc20d7..8add68d05 100644
--- a/src/styles/components/tasks.scss
+++ b/src/styles/components/tasks.scss
@@ -54,8 +54,8 @@
     }
 
     .color-bubble {
-      width: 11px;
       height: 10px;
+      flex: 1 0 10px;
     }
 
     .tag {
diff --git a/src/styles/theme/navigation.scss b/src/styles/theme/navigation.scss
index a054e55ea..e9d5be524 100644
--- a/src/styles/theme/navigation.scss
+++ b/src/styles/theme/navigation.scss
@@ -163,8 +163,8 @@
         }
 
         .color-bubble {
-          width: 14px; // Without this, the bubble is only 10.2342357612px wide and seems squashed.
           height: 12px;
+          flex: 1 0 12px;
         }
 
         .favorite {