Homepage fix (#104)

* made changes based on comments * css linter * Moved blocks into own spaces (#105) * Moved blocks into own spaces Moved the different content blocks into their own files * Added fullwidth parameter * Fixed issue with end tag * Fixed a typo * Added containers * Moved the container class * Fixed some linting issues * mobile changes * Mobile adjustments * Update home.css * mobile adjustments * linting --------- Co-authored-by: Steve Goode <[email protected]>
Bioconductor · Aug 2, 2023 · 48d24a0 · 48d24a0
1 parent b658142
commit 48d24a0
Show file tree

Hide file tree

Showing 16 changed files with 734 additions and 802 deletions.
diff --git a/assets/style/bioconductor.css b/assets/style/bioconductor.css
@@ -8,6 +8,7 @@ body {
 main {
   background: var(--neutral-n50);
   margin: 1rem 0;
+  overflow: hidden;
 }
 
 .container {

diff --git a/assets/style/buttons.css b/assets/style/buttons.css
@@ -7,8 +7,9 @@
   display: block;
   width: fit-content;
   transition: 0.3s;
-  padding: 0.6rem 0.8rem;
+  padding: 0.1rem 0.8rem;
   border-radius: 8rem;
+  text-decoration: none;
 }
 
 .white-button:hover {

diff --git a/assets/style/footer.css b/assets/style/footer.css
@@ -8,7 +8,7 @@ footer {
   border-width: 0.625rem 0 0; /* 10px */
   border-image: var(--gradient-brandreverse) 1;
   color: #fff;
-  font-size: 0.7rem;
+  font-size: 1rem;
   height: auto;
   box-sizing: border-box;
 }
@@ -26,12 +26,14 @@ footer * {
 .link-container {
   display: grid;
   grid-template-columns: 1fr 1fr;
+  margin-bottom: 3.5rem;
 }
 
 .link-container-inner {
   display: flex;
   justify-content: flex-start;
   width: 100%;
+  margin-bottom: 1rem;
 }
 
 :is(.link-container-inner nav) {
@@ -80,6 +82,7 @@ footer * {
 
   .link-container {
     display: block;
+    margin-bottom: 0;
   }
 
   :is(.link-container-inner nav) {

diff --git a/assets/style/header.css b/assets/style/header.css
@@ -70,7 +70,7 @@ header {
   outline: none;
   background-color: transparent;
   padding-left: 0.25rem;
-  padding-top: 3px;
+  padding-top: 5px;
 }
 
 input::placeholder {
@@ -224,6 +224,7 @@ input:focus::placeholder {
     width: 100%;
     border-radius: 0%;
     align-items: center;
+    padding: 1.5rem 0;
   }
 
   .get-started {

diff --git a/assets/style/hero.css b/assets/style/hero.css
@@ -3,7 +3,12 @@
   margin: 0 auto;
   text-align: center;
   background-color: white;
-  padding: 4.5rem 0;
+  padding-top: 2rem;
+}
+
+.homepage-container {
+  padding-top: 2rem;
+  padding-bottom: 4rem;
 }
 
 .hero h1 {
@@ -29,8 +34,21 @@ a.button-hero {
   text-decoration: none;
 }
 
+.mobile-break {
+  display: none;
+}
+
 @media screen and (width <= 768px) {
+  .homepage-container {
+    padding: 1rem 0.5rem;
+  }
+
+  .mobile-break {
+    display: block;
+  }
+
   .hero p {
-    font-size: 1rem;
+    margin: 0;
+    margin-bottom: 1rem;
   }
 }