fix home

Signed-off-by: Arnaud Guéras <arnaudgs@gmail.com>

diff --git a/static/img/decorative/home-servers.webp b/static/img/decorative/home-servers.webp
index 0b06996da01796db8796cb080b1128fcdc52d5e7..479bab15141f35d7c71bc1c2153b603f5b577967 100644 (file)
Binary files a/static/img/decorative/home-servers.webp and b/static/img/decorative/home-servers.webp differ

diff --git a/themes/xen-project/assets/css/animation/home-animation.scss b/themes/xen-project/assets/css/animation/home-animation.scss
index 478e57b0358c70aa7ce80ed5496c0cf49f5d8ce1..33e264051ceeb923fc97d34e0aeae9b1c1467ca0 100644 (file)
--- a/themes/xen-project/assets/css/animation/home-animation.scss
+++ b/themes/xen-project/assets/css/animation/home-animation.scss
@@ -1,3 +1,18 @@
+:root {
+  --home-shadow-screen-left: -45%;
+  --home-server-top: -104%;
+  --home-shadow-screen-bottom: 170px;
+  --home-hero-padding-bottom: 180px;
+  @include tablet {
+    --home-shadow-screen-left: 140px;
+    --home-hero-padding-bottom: 320px;
+  }
+
+  @include desktop {
+    --home-shadow-screen-left: 54px;
+  }
+}
+
 .home-hero-animated {
   position: relative;
   overflow: hidden;
@@ -35,7 +50,7 @@
   }
 
   .animated-home-shadow-screen {
-    bottom: 150px;
+    bottom: var(--home-shadow-screen-bottom);
     left: 56%;
     transform: translateX(40px);
     z-index: 2;
@@ -58,25 +73,17 @@
 .home-section-hero {
   margin-bottom: 0;
   margin-top: 0;
-  padding-bottom: 200px;
+  padding-bottom: var(--home-hero-padding-bottom);
 
   .hero-block {
     margin-top: 40px;
-
-    @include tablet {
-      margin-top: 100px;
-    }
   }
 
-  @include desktop {
-    padding-bottom: 260px;
-  }
   .media-block {
     flex-direction: column;
   }
 
   @include tablet {
-    padding-bottom: 300px;
     .media-block {
       flex-direction: row;
     }
@@ -87,19 +94,6 @@
   }
 }
 
-:root {
-  --home-shadow-screen-left: -45%;
-  --home-server-top: -55%;
-
-  @include tablet {
-    --home-shadow-screen-left: 100px;
-  }
-
-  @include desktop {
-    --home-shadow-screen-left: 54px;
-  }
-}
-
 @keyframes homeFadeInUp {
   from {
     opacity: 0;