style: postItem with community label & adjust looks

Author: mydearxym

src/components/PostItem/DigestView/DesktopView/Body.tsx

@@ -18,6 +18,7 @@ import {
   Extra,
   LeftPart,
   CommunityLabel,
+  LabelDivider,
   AuthorName,
   ItemWrapper,
   ViewsIcon,
@@ -33,9 +34,9 @@ const Body: FC<TProps> = ({ item }) => {
       <Extra>
         <LeftPart>
           <CommunityLabel>Elixir</CommunityLabel>
-          <Dot radius={3} space={8} />
+          <LabelDivider />
           <AuthorName>{item.author.nickname}</AuthorName>
-          <Dot radius={3} space={8} />
+          <Dot radius={3} space={10} />
           <PublishTime>
             <TimeAgo datetime={item.insertedAt} locale="zh_CN" />
           </PublishTime>

src/components/PostItem/styles/digest_view/body.ts

@@ -32,13 +32,21 @@ export const CommunityLabel = styled.div`
     content: '';
     position: absolute;
     left: 1px;
-    top: 4px;
+    top: 3px;
     width: 6px;
-    height: 10px;
+    height: 11px;
     border-radius: 4px;
     background-color: #49a5a0;
   }
 `
+export const LabelDivider = styled.div`
+  width: 1px;
+  height: 8px;
+  margin-left: 10px;
+  margin-right: 12px;
+  background-color: #49a5a0;
+  transform: rotate(12deg);
+`
 export const AuthorName = styled.div`
   color: ${theme('thread.extraInfo')};
   font-size: 13px;