home styling fixes

OSURoboticsClub · Apr 9, 2024 · 1959a21 · 1959a21
1 parent dea4225
commit 1959a21
Show file tree

Hide file tree

Showing 3 changed files with 38 additions and 2 deletions.
diff --git a/layouts/_default/baseof.html b/layouts/_default/baseof.html
@@ -32,7 +32,7 @@
 
   {{ partial "navbar.html" . }}
 
-  <div class="container px-4 max-w-4xl mx-auto overflow-x-hidden">
+  <div class="container px-4 max-w-4xl mx-auto overflow-x-hidden md:overflow-visible">
     {{ block "main" . }}{{ end }}
   </div>
 

diff --git a/layouts/index.html b/layouts/index.html
@@ -5,7 +5,7 @@
   <div class="relative min-h-[500pt]">
     <div class="relative scale-125">
       <!-- Background Image -->
-      <img src="/images/big/rover_hero.jpg" style="" class="w-full h-[400pt] md:h-auto object-cover" alt="">
+      <img src="/images/big/rover_hero.jpg" style="" class="w-full h-[400pt] -translate-x-[40px] md:-translate-x-0 md:pr-0 md:h-auto object-cover" alt="">
       <!-- Radial Gradient -->
       <div class="absolute w-full h-full top-0" style="background: rgb(23,23,23);
         background: radial-gradient(circle, rgba(23,23,23,0.2) 30%, rgba(23,23,23,1) 82%);"></div>

diff --git a/static/css/styles.css b/static/css/styles.css
@@ -995,6 +995,9 @@ video {
 .mt-8 {
   margin-top: 2rem;
 }
+.mr-7 {
+  margin-right: 1.75rem;
+}
 .block {
   display: block;
 }
@@ -1112,6 +1115,26 @@ video {
 .flex-none {
   flex: none;
 }
+.-translate-x-6 {
+  --tw-translate-x: -1.5rem;
+  transform: translate(var(--tw-translate-x), var(--tw-translate-y)) rotate(var(--tw-rotate)) skewX(var(--tw-skew-x)) skewY(var(--tw-skew-y)) scaleX(var(--tw-scale-x)) scaleY(var(--tw-scale-y));
+}
+.-translate-x-\[10\] {
+  --tw-translate-x: -10;
+  transform: translate(var(--tw-translate-x), var(--tw-translate-y)) rotate(var(--tw-rotate)) skewX(var(--tw-skew-x)) skewY(var(--tw-skew-y)) scaleX(var(--tw-scale-x)) scaleY(var(--tw-scale-y));
+}
+.-translate-x-\[10px\] {
+  --tw-translate-x: -10px;
+  transform: translate(var(--tw-translate-x), var(--tw-translate-y)) rotate(var(--tw-rotate)) skewX(var(--tw-skew-x)) skewY(var(--tw-skew-y)) scaleX(var(--tw-scale-x)) scaleY(var(--tw-scale-y));
+}
+.-translate-x-\[140px\] {
+  --tw-translate-x: -140px;
+  transform: translate(var(--tw-translate-x), var(--tw-translate-y)) rotate(var(--tw-rotate)) skewX(var(--tw-skew-x)) skewY(var(--tw-skew-y)) scaleX(var(--tw-scale-x)) scaleY(var(--tw-scale-y));
+}
+.-translate-x-\[40px\] {
+  --tw-translate-x: -40px;
+  transform: translate(var(--tw-translate-x), var(--tw-translate-y)) rotate(var(--tw-rotate)) skewX(var(--tw-skew-x)) skewY(var(--tw-skew-y)) scaleX(var(--tw-scale-x)) scaleY(var(--tw-scale-y));
+}
 .scale-105 {
   --tw-scale-x: 1.05;
   --tw-scale-y: 1.05;
@@ -1728,6 +1751,11 @@ video {
     max-width: 28rem;
   }
 
+  .md\:-translate-x-0 {
+    --tw-translate-x: -0px;
+    transform: translate(var(--tw-translate-x), var(--tw-translate-y)) rotate(var(--tw-rotate)) skewX(var(--tw-skew-x)) skewY(var(--tw-skew-y)) scaleX(var(--tw-scale-x)) scaleY(var(--tw-scale-y));
+  }
+
   .md\:grid-cols-3 {
     grid-template-columns: repeat(3, minmax(0, 1fr));
   }
@@ -1744,6 +1772,10 @@ video {
     align-items: center;
   }
 
+  .md\:overflow-visible {
+    overflow: visible;
+  }
+
   .md\:px-8 {
     padding-left: 2rem;
     padding-right: 2rem;
@@ -1753,6 +1785,10 @@ video {
     padding-bottom: 0px;
   }
 
+  .md\:pr-0 {
+    padding-right: 0px;
+  }
+
   .md\:text-h1 {
     font-size: 86px;
   }