Responsive bg image

artemave · Oct 18, 2023 · 630531f · 630531f
1 parent 841b6b0
commit 630531f
Show file tree

Hide file tree

Showing 5 changed files with 13 additions and 1 deletion.
diff --git a/assets/stars.jpg b/assets/stars.jpg
diff --git a/assets/stars_1080.jpg b/assets/stars_1080.jpg
diff --git a/assets/stars_2729.jpg b/assets/stars_2729.jpg
diff --git a/assets/stars_3840.jpg b/assets/stars_3840.jpg
diff --git a/styles.css b/styles.css
@@ -3,14 +3,26 @@ html {
 }
 
 body {
-  background: black url('./assets/stars.jpg') no-repeat top center fixed;
+  background: black url('./assets/stars_1080.jpg') no-repeat top center fixed;
   background-size: cover;
   font-family: 'Pathway Gothic One', sans-serif;
   font-weight: 600;
   height: 100%;
   margin: 0;
 }
 
+@media (min-width: 768px) {
+  body {
+    background-image: url('./assets/stars_2729.jpg');
+  }
+}
+
+@media (min-width: 1080px) {
+  body {
+    background-image: url('./assets/stars_3840.jpg');
+  }
+}
+
 #scene {
   position: relative;
   height: 100%;