diff --git a/app/javascript/flavours/glitch/features/drawer/results/index.js b/app/javascript/flavours/glitch/features/drawer/results/index.js index ac7a14ef4..4574c0e1e 100644 --- a/app/javascript/flavours/glitch/features/drawer/results/index.js +++ b/app/javascript/flavours/glitch/features/drawer/results/index.js @@ -10,6 +10,7 @@ import spring from 'react-motion/lib/spring'; import { Link } from 'react-router-dom'; // Components. +import Icon from 'flavours/glitch/components/icon'; import AccountContainer from 'flavours/glitch/containers/account_container'; import StatusContainer from 'flavours/glitch/containers/status_container'; import Hashtag from 'flavours/glitch/components/hashtag'; @@ -62,6 +63,7 @@ export default function DrawerResults ({ }} >
+ {accounts && accounts.size ? (
-
+
{accounts.map( accountId => ( @@ -83,7 +85,7 @@ export default function DrawerResults ({ ) : null} {statuses && statuses.size ? (
-
+
{statuses.map( statusId => ( @@ -97,7 +99,7 @@ export default function DrawerResults ({ ) : null} {hashtags && hashtags.size ? (
-
+
{hashtags.map(hashtag => )}
diff --git a/app/javascript/flavours/glitch/styles/components/drawer.scss b/app/javascript/flavours/glitch/styles/components/drawer.scss index f4931c36c..d22783b94 100644 --- a/app/javascript/flavours/glitch/styles/components/drawer.scss +++ b/app/javascript/flavours/glitch/styles/components/drawer.scss @@ -196,43 +196,35 @@ overflow-y: auto; & > header { - border-bottom: 1px solid darken($ui-base-color, 4%); - padding: 15px 10px; color: $dark-text-color; background: lighten($ui-base-color, 2%); - font-size: 14px; + padding: 15px; font-weight: 500; + font-size: 16px; + cursor: default; + + .fa { + display: inline-block; + margin-right: 5px; + } } & > section { - background: $ui-base-color; - margin-bottom: 20px; + margin-bottom: 5px; h5 { - position: relative; + background: darken($ui-base-color, 4%); + border-bottom: 1px solid lighten($ui-base-color, 8%); + cursor: default; + display: flex; + padding: 15px; + font-weight: 500; + font-size: 16px; + color: $dark-text-color; - &::before { - content: ""; - display: block; - position: absolute; - left: 0; - right: 0; - top: 50%; - width: 100%; - height: 0; - border-top: 1px solid lighten($ui-base-color, 8%); - } - - span { + .fa { display: inline-block; - background: $ui-base-color; - color: $darker-text-color; - font-size: 14px; - font-weight: 500; - padding: 10px; - position: relative; - z-index: 1; - cursor: default; + margin-right: 5px; } }