Show pack icon or first emoji as fallback in EmojiBoard sidebar

Signed-off-by: Ajay Bura <ajbura@gmail.com>
2021-12-30 12:46:48 +05:30
parent c2402ddb72
commit 93251e0029
2 changed files with 34 additions and 15 deletions
--- a/src/app/organisms/emoji-board/EmojiBoard.scss
+++ b/src/app/organisms/emoji-board/EmojiBoard.scss
@@ -22,11 +22,26 @@
    background-color: var(--bg-surface-low);
    @include dir.side(border, 1px solid var(--bg-surface-border), none);

-    & > .ic-btn-surface {
+    & .ic-btn-surface {
      margin: calc(var(--sp-ultra-tight) / 2) 0;
      opacity: 0.8;
    }
  }
+  &__nav-custom {
+    @extend .cp-fx__column;
+    border-bottom: 1px solid var(--bg-surface-border);
+    
+    & .ic-btn-surface {
+      & .ic-raw {
+        filter: grayscale(1);
+      }
+      &:hover, &:active, &:focus {
+        & .ic-raw {
+          filter: grayscale(0);
+        }
+      }
+    }
+  }
 }

 .emoji-board__content__search {