From 8608072bfb52d10a843a86d3d89b14e8b9776779 Mon Sep 17 00:00:00 2001
From: undergroundwires <git@undergroundwires.dev>
Date: Mon, 14 Mar 2022 18:30:05 +0100
Subject: [PATCH] Align card icons vertically in cards view

Align folder and battery icons to be on same vertical line on every
card.
---
 .../components/Scripts/View/Cards/CardListItem.vue   | 12 ++++++++++--
 1 file changed, 10 insertions(+), 2 deletions(-)

diff --git a/src/presentation/components/Scripts/View/Cards/CardListItem.vue b/src/presentation/components/Scripts/View/Cards/CardListItem.vue
index 44b29f60..d900a9bf 100644
--- a/src/presentation/components/Scripts/View/Cards/CardListItem.vue
+++ b/src/presentation/components/Scripts/View/Cards/CardListItem.vue
@@ -8,7 +8,10 @@
     }"
     ref="cardElement">
       <div class="card__inner">
-        <span v-if="cardTitle && cardTitle.length > 0">
+        <!-- Title -->
+        <span
+          class="card__inner__title"
+          v-if="cardTitle && cardTitle.length > 0">
           <span>{{cardTitle}}</span>
         </span>
         <span v-else>Oh no 😢</span>
@@ -152,7 +155,12 @@ $card-horizontal-gap    : $card-gap;
     &:after {
       transition: all 0.3s ease-in-out;
     }
-
+    &__title {
+      display: flex;
+      flex-direction: column;
+      flex: 1;
+      justify-content: center;
+    }
     &__state-icons {
       height: $card-inner-padding;
       margin-right: -$card-inner-padding;