landing page nav bar done

2 files changed, 48 insertions, 4 deletions

diff --git a/react-frontend/src/css/App.css b/react-frontend/src/css/App.css
index 90e9046..f632a7f 100644
--- a/react-frontend/src/css/App.css
+++ b/react-frontend/src/css/App.css
@@ -49,9 +49,14 @@
   font-size: calc(10px + 2vmin);
   color: white;
   z-index: 10;
-  background-color: #333333;
-  border-radius: 5px;
   margin: 5px;
+  
+}
+
+#in-app-logo-holder {
+  border: 7px solid rgb(7, 94, 12);
+  border-radius: 5px;
+  background-color: white;
 }
 
 .App-link {
@@ -73,4 +78,8 @@
   top: 50%;
   left: 50%;
   transform: translate(-50%, -50%);
+}
+
+#in-app-logo {
+  width: 200px;
 }
\ No newline at end of file
diff --git a/react-frontend/src/css/Landing.css b/react-frontend/src/css/Landing.css
index e6841f8..0a5a845 100644
--- a/react-frontend/src/css/Landing.css
+++ b/react-frontend/src/css/Landing.css
@@ -1,3 +1,7 @@
+html {
+    scroll-behavior: smooth;
+  }
+
 .nav-bar{
     position: fixed;
     top: 0px;
@@ -43,6 +47,7 @@ body {
     display: flex;
     flex-direction: column;
     width: 80vw;
+    scroll-behavior: smooth slow;
 }
 main {
     margin-top: 65px;
@@ -51,7 +56,7 @@ main {
 }
 
 .intro {
-    height: 1000px;  
+    height: 900px;  
     width: 100vw;
     background-color:  rgb(3, 2, 24);
     color: white;  
@@ -59,8 +64,27 @@ main {
     left: -10px;
 }
 
+#enter-watchdogs {
+    background-color: rgb(206, 206, 206);
+    color: rgba(10, 9, 71);
+    border: 2px solid rgb(255, 255, 255);
+    border-radius: 5px;
+    padding: 5px 10px;
+    text-align: center;
+    text-decoration: none;
+    display: inline-block;
+    font-size: 16px;
+    height: 70px;
+    width: 200px;
+    font-weight: bold;
+    font-family:sans-serif;
+}
+#enter-watchdogs:hover {
+    background-color: #94ff73;
+  }
+
 .app-preview {
-    height: 1000px;
+    height: 900px;
     width: 100vw;
     background-color:  #b7ffb9;
     color: white;
@@ -70,6 +94,17 @@ main {
     left: -10px;
 }
 
+#preview {
+    width: 70vw;
+    border: 10px solid rgb(255, 255, 255);
+    border-radius: 5px;
+}
+
+#preview-text {
+    color:#868686;
+    font-size: small;
+}
+
 section {
   width: 100vw;
   overflow: hidden;