From d9eef7592f5d5c682deda9e590f47208aefad2ba Mon Sep 17 00:00:00 2001
From: Gesina Schwalbe <gesina.schwalbe@pheerai.de>
Date: Sun, 3 Jan 2021 21:50:16 +0100
Subject: [PATCH] fixed some issues with the flexbox approach

- had to remove border, padding, and margin from input boxes
- centered images
- fixed y-overflow of description and images by restricting height
---
 src/scss/components/_items.scss | 19 +++++++++++++++++--
 1 file changed, 17 insertions(+), 2 deletions(-)

diff --git a/src/scss/components/_items.scss b/src/scss/components/_items.scss
index fe3370ab..01358b75 100644
--- a/src/scss/components/_items.scss
+++ b/src/scss/components/_items.scss
@@ -16,13 +16,26 @@
 
         .item-image {
             flex: 0 0 24px;
-            margin-right: 5px;
+            height: 100%;
+            //margin-right: 5px;
+            @include centered-content;
         }
 
         img {
             display: block;
             border: none;
         }
+
+        input {
+            border: 0;
+            padding: 0;
+        }
+
+        input[type="checkbox"] {
+            width: auto;
+            height: 100%;
+            margin: 0px;
+        }
     }
 
     .item-name {
@@ -36,7 +49,8 @@
 
     .item-num-val {
         text-align: center;
-        max-width: 2.5em;
+        width: 2.5em;
+        padding: 0;
     }
 
     .item-description {
@@ -44,6 +58,7 @@
         white-space: nowrap;
         overflow: hidden;
         text-overflow: ellipsis;
+        height: 100%;
         p {
             text-overflow: ellipsis;
             overflow: hidden;