Added banner for status of project

CRANE-toolbox · Aug 28, 2020 · b475854 · b475854
1 parent d794089
commit b475854
Show file tree

Hide file tree

Showing 2 changed files with 37 additions and 0 deletions.
diff --git a/src/pages/HomePage.tsx b/src/pages/HomePage.tsx
@@ -9,6 +9,15 @@ export const HomePage: React.FC<Props> = () => {
   let history = useHistory();
   return (
     <Layout.Content>
+      <Row justify="center">
+        <Col className={styles.HomePageBanner}>
+          <p className={styles.HomePageBannerContent}>
+            This website was created as part of the <a href="https://theresiliencychallenge.devpost.com/">Resiliency Challenge hackathon.</a> The data analyses presented here are
+            an example use-case for the <a href="">CRANE Python package</a> we are developing as a continuation to the Resiliency challenge. Please visit our
+            <a href="https://github.com/CRANE-toolbox"> Github repository</a> for more information.
+          </p>
+        </Col>
+      </Row>
       <Row justify="center">
         <Col className={styles.HomePageColumnContent}>
           <h1 className={styles.h1}>Tracking Racism Around COVID-19 on Twitter</h1>

diff --git a/src/styles/HomePage.module.less b/src/styles/HomePage.module.less
@@ -33,6 +33,34 @@
   text-align: center;
 }
 
+.HomePageBanner { 
+  background-color: #424c6e;
+  height: 25vh;
+  width: 100vw;
+  display: flex;
+  align-items: center;
+  justify-content: center;
+  margin-bottom: 3rem;
+}
+
+.HomePageBannerContent { 
+  height: fit-content;
+  width: 80vw;
+  font-style: italic;
+  color: #FFFFFF;
+  text-align: center;
+  margin: 0;
+}
+
+
+a,
+.HomePageBannerContent:link {
+  font-weight: 100;
+  color: #FFCA0F;
+  font-weight: 800;
+  text-decoration: underline;
+
+}
 .ActionButtonData {
   .ActionButton();
   min-width: fit-content;