style(ReactionHeader): rm hover style on views

Author: mydearxym

components/ArticleHeader/index.js

@@ -16,10 +16,12 @@ import {
   Wrapper,
   ReactionWrapper,
   Reaction,
+  PlainAction,
   ReactionAction,
   ReactionName,
   CollectIcon,
   LikeIcon,
+  PlainUserNum,
   ReactionUserNum,
   Divider,
 } from './styles'
@@ -99,10 +101,10 @@ const ArticleHeader = ({
         </Maybe>
 
         <Reaction>
-          <ReactionAction>
+          <PlainAction>
             <ReactionName>浏览:</ReactionName>
-          </ReactionAction>
-          <ReactionUserNum>{data.views}</ReactionUserNum>
+          </PlainAction>
+          <PlainUserNum>{data.views}</PlainUserNum>
         </Reaction>
       </ReactionWrapper>
     </Wrapper>

components/ArticleHeader/styles/index.js

@@ -28,10 +28,12 @@ export const Reaction = styled.div`
   align-items: center;
   display: flex;
 `
-export const ReactionAction = styled.div`
+export const PlainAction = styled.div`
   display: flex;
   align-items: center;
   padding: 2px 3px;
+`
+export const ReactionAction = styled(PlainAction)`
   &:hover {
     cursor: pointer;
     font-weight: bold;
@@ -43,11 +45,12 @@ export const ReactionName = styled.div`
   color: ${theme('article.reactionTitle')};
   font-size: 0.9rem;
 `
-export const ReactionUserNum = styled.div`
+export const PlainUserNum = styled.div`
   color: ${theme('article.reactionTitle')};
   font-size: 1rem;
   margin-left: 2px;
-
+`
+export const ReactionUserNum = styled(PlainUserNum)`
   &:hover {
     cursor: pointer;
     text-decoration: underline;