chore(footer): adjust margin & powered by info

Author: mydearxym

deploy/production/web.tar.gz

@@ -139,7 +139,7 @@ const GlobalStyle = createGlobalStyle`
   }
 
   #nprogress .spinner {
-    top: 10px !important;
+    top: 8px !important;
   }
 
   // masonry cards styles

src/containers/layout/ThemePalette/GlobalStyle.ts

@@ -9,6 +9,8 @@ import {
   ClassicWrapper,
   HolyGrailWrapper,
   BeianLink,
+  PowerByWrapper,
+  PowerByLink,
 } from '../styles/desktop_view/bottom_info'
 
 type TProps = {
@@ -24,6 +26,12 @@ const BottomInfo: FC<TProps> = ({ metric, layout }) => {
           <BeianLink href="http://beian.miit.gov.cn">
             蜀ICP备17043722号-4
           </BeianLink>
+          <PowerByWrapper>
+            Powered by
+            <PowerByLink href="http://github.com/groupher">
+              Groupher
+            </PowerByLink>
+          </PowerByWrapper>
         </InnerWrapper>
       </RawWrapper>
     )
@@ -37,6 +45,10 @@ const BottomInfo: FC<TProps> = ({ metric, layout }) => {
         <BeianLink href="http://beian.miit.gov.cn">
           蜀ICP备17043722号-4
         </BeianLink>
+        <PowerByWrapper>
+          Powered by
+          <PowerByLink href="http://github.com/groupher">Groupher</PowerByLink>
+        </PowerByWrapper>
       </InnerWrapper>
     </Wrapper>
   )

src/containers/unit/Footer/DesktopView/BottomInfo.tsx

@@ -15,7 +15,7 @@ const General: FC<TProps> = ({ title }) => {
   return (
     <Wrapper noBottomBorder>
       <Logo />
-      <BlinkCursor duration={2} />
+      <BlinkCursor duration={2} top={1} />
       <CommunityTitle>{title}</CommunityTitle>
     </Wrapper>
   )

src/containers/unit/Footer/DesktopView/TopInfo/General.tsx

@@ -19,7 +19,8 @@ const Wrapper = styled.div<{ metric: TMetric }>`
 `
 export const RawWrapper = styled(Wrapper)``
 export const ClassicWrapper = styled(Wrapper)`
-  padding-left: 24px;
+  padding-left: 22px;
+  padding-right: 60px;
   ${css.media.laptopM`
     padding-left: 18px;
   `}
@@ -31,14 +32,11 @@ export const HolyGrailWrapper = styled(Wrapper)`
     padding-left: 18px;
   `}
 `
-
 export const InnerWrapper = styled.div`
-  ${css.flexColumn('justify-start')};
-  color: ${theme('thread.articleDigest')};
+  ${css.flex('justify-between')};
   width: 100%;
   margin-right: 20px;
 `
-
 export const BeianLink = styled.a`
   color: ${theme('footer.text')};
   text-decoration: none;
@@ -49,7 +47,11 @@ export const BeianLink = styled.a`
     color: ${theme('footer.hover')};
   }
 `
-export const CompanyLink = styled(BeianLink)`
-  font-size: 12px;
-  margin-bottom: 2px;
+export const PowerByWrapper = styled.div`
+  color: ${theme('footer.text')};
+  ${css.flex('align-center')};
+`
+export const PowerByLink = styled(BeianLink)`
+  margin-right: 4px;
+  margin-left: 6px;
 `

src/containers/unit/Footer/styles/desktop_view/bottom_info.ts

@@ -16,7 +16,7 @@ export const InfoBar = styled(DefaultInfoBar)``
 export const Logo = styled(DefaultLogo)`
   ${css.size(16)};
   margin-right: 5px;
-  margin-top: -4px;
+  margin-top: -1px;
 `
 export const ArticleTitle = styled(DefaultSiteTitle)`
   color: ${theme('footer.title')};

src/containers/unit/Footer/styles/desktop_view/top_info/article.ts

@@ -24,7 +24,7 @@ export const InfoBar = styled.div`
 `
 export const Logo = styled(CommunityFaceLogo)`
   ${css.size(18)};
-  margin-top: -4px;
+  margin-top: -1;
   margin-left: 2px;
   cursor: pointer;
 `