From 898f7bf50243cc6f25b9368b873c8bdcd230400e Mon Sep 17 00:00:00 2001
From: crupest <crupest@outlook.com>
Date: Sat, 19 Dec 2020 22:15:05 +0800
Subject: ...

---
 FrontEnd/src/app/index.sass                      | 7 +++++--
 FrontEnd/src/app/views/home/BoardWithUser.tsx    | 4 ++--
 FrontEnd/src/app/views/home/BoardWithoutUser.tsx | 4 ++--
 FrontEnd/src/app/views/home/index.tsx            | 2 +-
 4 files changed, 10 insertions(+), 7 deletions(-)

(limited to 'FrontEnd/src')

diff --git a/FrontEnd/src/app/index.sass b/FrontEnd/src/app/index.sass
index d5e1ea22..6325895a 100644
--- a/FrontEnd/src/app/index.sass
+++ b/FrontEnd/src/app/index.sass
@@ -50,10 +50,13 @@ textarea
 
 .cru-card
   @extend .shadow
-  @extend .border
   @extend .rounded
+  border: 1px solid
   border-color: $gray-200
-  background: $light
+  background: $gray-100
+  transition: all 0.3s
+  &:hover
+    border-color: $primary
 
 .full-viewport-center-child
   position: fixed
diff --git a/FrontEnd/src/app/views/home/BoardWithUser.tsx b/FrontEnd/src/app/views/home/BoardWithUser.tsx
index 9b2f395d..469eb388 100644
--- a/FrontEnd/src/app/views/home/BoardWithUser.tsx
+++ b/FrontEnd/src/app/views/home/BoardWithUser.tsx
@@ -13,13 +13,13 @@ const BoardWithUser: React.FC<{ user: AuthUser }> = ({ user }) => {
 
   return (
     <Row className="my-3 justify-content-center">
-      <Col sm="6" lg="5">
+      <Col xs="12" md="6">
         <TimelineBoard
           title={t("home.highlightTimeline")}
           load={() => getHttpHighlightClient().list()}
         />
       </Col>
-      <Col sm="6" lg="5">
+      <Col xs="12" md="6" className="my-3 my-md-0">
         <TimelineBoard
           title={t("home.relatedTimeline")}
           load={() =>
diff --git a/FrontEnd/src/app/views/home/BoardWithoutUser.tsx b/FrontEnd/src/app/views/home/BoardWithoutUser.tsx
index ad88af7a..d9c7fcf4 100644
--- a/FrontEnd/src/app/views/home/BoardWithoutUser.tsx
+++ b/FrontEnd/src/app/views/home/BoardWithoutUser.tsx
@@ -12,13 +12,13 @@ const BoardWithoutUser: React.FC = () => {
 
   return (
     <Row className="my-3 justify-content-center">
-      <Col sm="6" lg="5">
+      <Col xs="12" md="6">
         <TimelineBoard
           title={t("home.highlightTimeline")}
           load={() => getHttpHighlightClient().list()}
         />
       </Col>
-      <Col sm="8" lg="6">
+      <Col xs="12" md="6" className="my-3 my-md-0">
         <TimelineBoard
           title={t("home.publicTimeline")}
           load={() =>
diff --git a/FrontEnd/src/app/views/home/index.tsx b/FrontEnd/src/app/views/home/index.tsx
index 0d439f36..3c53736d 100644
--- a/FrontEnd/src/app/views/home/index.tsx
+++ b/FrontEnd/src/app/views/home/index.tsx
@@ -33,7 +33,7 @@ const HomePage: React.FC = () => {
 
   return (
     <>
-      <Container fluid>
+      <Container>
         <Row className="my-3 justify-content-center">
           <Col xs={12} sm={8} lg={6}>
             <SearchInput
-- 
cgit v1.2.3