From 1e14a1101933dcfec3f357c590a455649db375ff Mon Sep 17 00:00:00 2001
From: piotrruss <mail@pruss.it>
Date: Sat, 4 Sep 2021 21:55:21 +0200
Subject: add mobile styles

---
 apps/Notes/styles/_listItem.scss | 34 ++++++++++++++++++++++------------
 1 file changed, 22 insertions(+), 12 deletions(-)

(limited to 'apps/Notes/styles/_listItem.scss')

diff --git a/apps/Notes/styles/_listItem.scss b/apps/Notes/styles/_listItem.scss
index 5e7376f..fcee9aa 100644
--- a/apps/Notes/styles/_listItem.scss
+++ b/apps/Notes/styles/_listItem.scss
@@ -23,24 +23,34 @@
         opacity: 0;
         font-size: 80%;
         transition: .3s opacity linear .3s;
+
+        @media(max-width: 40em) {
+          display: none;
+        }
       }
     }
+
+    &:nth-of-type(n+2) span {
+      padding-right: .5em;
+    }
   }
 
-  &:hover {
-    background: var(--color-window-menu-alt);
-    border-radius: .5em;
-    // cursor: pointer;
+  @media(hover: hover) {
+    &:hover {
+      background: var(--color-window-menu-alt);
+      border-radius: .5em;
+      // cursor: pointer;
 
-    & > td:first-of-type > span:nth-child(n+2){
-      color: var(--color-window-buttons);
-      visibility: visible;
-      opacity: 1;
+      & > td:first-of-type > span:nth-child(n+2){
+        color: var(--color-window-buttons);
+        visibility: visible;
+        opacity: 1;
+      }
     }
-  }
 
-  & > td:first-of-type > span:nth-child(n+2):hover {
-    color: var(--color-text-alt);
-    background-color: var(--color-glass);
+    & > td:first-of-type > span:nth-child(n+2):hover {
+      color: var(--color-text-alt);
+      background-color: var(--color-glass);
+    }
   }
 }
-- 
cgit v1.2.3