From ee5341ffcf02aa99a935dd4a3f523b14ab9ab5ad Mon Sep 17 00:00:00 2001
From: crupest <crupest@outlook.com>
Date: Thu, 1 Jul 2021 16:58:34 +0800
Subject: ...

---
 FrontEnd/src/views/timeline-common/TimelineMember.css |  8 ++++++++
 FrontEnd/src/views/timeline-common/TimelineMember.tsx | 12 ++++++------
 2 files changed, 14 insertions(+), 6 deletions(-)
 create mode 100644 FrontEnd/src/views/timeline-common/TimelineMember.css

(limited to 'FrontEnd/src/views/timeline-common')

diff --git a/FrontEnd/src/views/timeline-common/TimelineMember.css b/FrontEnd/src/views/timeline-common/TimelineMember.css
new file mode 100644
index 00000000..adb78764
--- /dev/null
+++ b/FrontEnd/src/views/timeline-common/TimelineMember.css
@@ -0,0 +1,8 @@
+.timeline-member-item {
+  border: var(--cru-background-1-color) solid;
+  border-width: 0.5px 1px;
+}
+
+.timeline-member-item > div {
+  padding: 0.5em;
+}
diff --git a/FrontEnd/src/views/timeline-common/TimelineMember.tsx b/FrontEnd/src/views/timeline-common/TimelineMember.tsx
index c8f26da7..0ebecbb9 100644
--- a/FrontEnd/src/views/timeline-common/TimelineMember.tsx
+++ b/FrontEnd/src/views/timeline-common/TimelineMember.tsx
@@ -12,22 +12,22 @@ import UserAvatar from "../common/user/UserAvatar";
 import Button from "../common/button/Button";
 import Dialog from "../common/dailog/Dialog";
 
+import "./TimelineMember.css";
+
 const TimelineMemberItem: React.FC<{
   user: HttpUser;
   add?: boolean;
   onAction?: (username: string) => void;
 }> = ({ user, add, onAction }) => {
   return (
-    <div className="container">
+    <div className="container timeline-member-item">
       <div className="row">
         <div className="col col-auto">
-          <UserAvatar username={user.username} className="avatar small" />
+          <UserAvatar username={user.username} className="cru-avatar small" />
         </div>
         <div className="col">
           <div className="row">{user.nickname}</div>
-          <div className="row">
-            <small>{"@" + user.username}</small>
-          </div>
+          <small className="row">{"@" + user.username}</small>
         </div>
         {onAction ? (
           <div className="col col-auto">
@@ -130,7 +130,7 @@ const TimelineMemberUserSearch: React.FC<{
           }
         } else if (userSearchState.type === "error") {
           return (
-            <div className="text-danger">
+            <div className="cru-color-danger">
               {convertI18nText(userSearchState.data, t)}
             </div>
           );
-- 
cgit v1.2.3