Add some local changes

2 files changed, 68 insertions, 6 deletions

diff --git a/src/assets/app.scss b/src/assets/app.scss
index ab067e6..2408d60 100644
--- a/src/assets/app.scss
+++ b/src/assets/app.scss
@@ -55,6 +55,23 @@ body {
       }
     }
 
+    .subcard {
+      background-color: var(--subcard-background);
+      color: var(--subcard-a);
+
+      a {
+        color: var(--subcard-a);
+        &:hover {
+          color: var(--subcard-a-hover);
+        }
+      }
+    }
+
+    a.card-arrow {
+      color: var(--subcard-a);
+      background-color: var(--subcard-background);
+    }
+
     .footer {
       background-color: var(--card-background);
       box-shadow: 0 2px 15px 0 var(--card-shadow);
@@ -214,8 +231,7 @@ body {
     }
   }
 
-  .card {
-    border-radius: 5px;
+  .card, .card-arrow {
     border: none;
     box-shadow: 0 2px 15px 0 rgba(0, 0, 0, 0.1);
     transition: cubic-bezier(0.165, 0.84, 0.44, 1) 300ms;
@@ -225,6 +241,32 @@ body {
     }
   }
 
+  .card {
+    border-radius: 5px;
+  }
+
+  .card-arrow {
+    border-radius: 0px 5px 5px 0px;
+  }
+
+  .card-arrow.active {
+    border-radius: 0px 5px 0px 0px;
+    box-shadow: none;
+  }
+
+  .subcard {
+    border-radius: 0px 0px 5px 5px;
+    display: none;
+    list-style: disc inside;
+    padding: 0.8rem;
+  }
+  .subcard.active {
+    display: block;
+  }
+  .subcard a {
+    padding: 10px;
+  }
+
   .card:hover {
     transform: translate(0, -3px);
 
@@ -239,6 +281,14 @@ body {
     }
   }
 
+  .card-arrow {
+    height: 85px;
+    display: flex;
+    align-items: center;
+    float: right;
+    padding: 10px;
+  }
+
   .card-content {
     height: 85px;
     padding: 1.3rem;
@@ -259,10 +309,6 @@ body {
   }
 
   .footer {
-    position: fixed;
-    left: 0;
-    right: 0;
-    bottom: 0;
     padding: 0.5rem;
     text-align: left;
     color: #676767;
@@ -318,6 +364,16 @@ body {
     }
   }
 
+  .search-bar-mobile {
+    input {
+      margin-top: 10px;
+      margin-left: 10px;
+    }
+    .search-label::before {
+      top: 14px;
+    }
+  }
+
   .offline-message {
     text-align: center;
     margin: 35px 0;
diff --git a/src/assets/defaults.yml b/src/assets/defaults.yml
index 99f5ed5..eaa345c 100644
--- a/src/assets/defaults.yml
+++ b/src/assets/defaults.yml
@@ -18,11 +18,14 @@ colors:
     highlight-hover: "#5a95f5"
     background: "#f5f5f5"
     card-background: "#ffffff"
+    subcard-background: "#eeeeee"
     text: "#363636"
     text-header: "#ffffff"
     text-title: "#303030"
     text-subtitle: "#424242"
     card-shadow: rgba(0, 0, 0, 0.1)
+    subcard-a: "#363636"
+    subcard-a-hover: "#808080"
     link-hover: "#363636"
   dark:
     highlight-primary: "#3367d6"
@@ -30,11 +33,14 @@ colors:
     highlight-hover: "#5a95f5"
     background: "#131313"
     card-background: "#2b2b2b"
+    subcard-background: "#444444"
     text: "#eaeaea"
     text-header: "#ffffff"
     text-title: "#fafafa"
     text-subtitle: "#f5f5f5"
     card-shadow: rgba(0, 0, 0, 0.4)
+    subcard-a: "#ffdd57"
+    subcard-a-hover: "#eaeaea"
     link-hover: "#ffdd57"
 
 message: ~