fix(aria): adjust styles for divs to buttons. display options on focus

Author: zacheryconverse

src/styles/ChannelListMessenger.scss

@@ -3,3 +3,7 @@
   min-width: 300px;
   background: var(--grey-gainsboro);
 }
+
+.str-chat-channel-list .str-chat__channel-list-messenger__main {
+  padding-bottom: 4px;
+}

src/styles/ChannelSearch.scss

@@ -81,7 +81,7 @@
   }
 
   &-container.inline {
-    top: 60px;
+    top: 64px;
     right: 0;
     background: var(--grey-gainsboro);
     height: calc(100vh - 60px);

src/styles/EditMessageForm.scss

@@ -106,3 +106,7 @@
     }
   }
 }
+
+.str-chat__edit-message-form {
+  position: relative;
+}

src/styles/LoadMoreButton.scss

@@ -36,3 +36,8 @@
     }
   }
 }
+
+.str-chat__load-more-button__button {
+  display: flex;
+  justify-content: center;
+}

src/styles/MessageActions.scss

@@ -89,3 +89,15 @@
 .str-chat__message-actions-options:hover svg {
   fill: var(--primary-color);
 }
+
+.str-chat__message-simple:focus-within .str-chat__message-simple__actions__action--thread {
+  display: flex;
+}
+
+.str-chat__message-simple:focus-within .str-chat__message-simple__actions__action--reactions {
+  display: flex;
+}
+
+.str-chat__message-simple:focus-within .str-chat__message-simple__actions__action--options {
+  display: flex;
+}

src/styles/Modal.scss

@@ -66,3 +66,9 @@
     }
   }
 }
+
+.str-chat__exit {
+  display: flex;
+  width: 86px;
+  justify-content: space-between;
+}