Consolidate CSS styles for user mention list

Fixes: #3140

Signed-off-by: Jonas <jonas@freesources.org>

Author: mejo-

src/components/Mention/List.vue

@@ -95,29 +95,10 @@ export default {
 <style lang="scss">
 .items {
   position: relative;
-  border-radius: 0.5rem;
-  background: #FFF;
-  color: rgba(0, 0, 0, 0.8);
+  border-radius: var(--border-radius);
+  background: var(--color-main-background);
   overflow: hidden;
   font-size: 0.9rem;
-  box-shadow:
-    0 0 0 1px rgba(0, 0, 0, 0.05),
-    0px 10px 20px rgba(0, 0, 0, 0.1),
-  ;
-}
-
-.item {
-  display: block;
-  margin: 0;
-  width: 100%;
-  text-align: left;
-  background: transparent;
-  border-radius: 0.4rem;
-  border: 1px solid transparent;
-  padding: 0.2rem 0.4rem;
-
-  &.is-selected {
-    border-color: #000;
-  }
+  box-shadow: 0 1px 5px var(--color-box-shadow);
 }
 </style>