Use new responsive option in cre8bit website pages

daveknights · Feb 12, 2024 · eedcf20 · eedcf20
1 parent da43dc5
commit eedcf20
Showing 1 changed file with 8 additions and 10 deletions.
diff --git a/script.js b/script.js
@@ -1,18 +1,16 @@
 import cre8bit from './cre8bit.min.js'
 
-const getSize = size => window.innerWidth > 999 ? size * 2 : size;
-
 window.onload = () => {
     // Header
-    new cre8bit().create('ghost', {colour: 'red', size: getSize(3), flip: true, reflection: true, parentClass: 'header-svgs'});
-    new cre8bit().create('ghost', {colour: 'pink', size: getSize(4), flip: true, reflection: true, parentClass: 'header-svgs'});
-    new cre8bit().create('ghost', {size: getSize(5), flip: true, reflection: true, parentClass: 'header-svgs'});
-    new cre8bit().create('ghost', {colour: 'orange', size: getSize(6), flip: true, reflection: true, parentClass: 'header-svgs'});
+    new cre8bit().create('ghost', {colour: 'red', responsive: [3, 3, 6], flip: true, reflection: true, parentClass: 'header-svgs'});
+    new cre8bit().create('ghost', {colour: 'pink', responsive: [4, 4, 8], flip: true, reflection: true, parentClass: 'header-svgs'});
+    new cre8bit().create('ghost', {responsive: [5, 5, 10], flip: true, reflection: true, parentClass: 'header-svgs'});
+    new cre8bit().create('ghost', {colour: 'orange', responsive: [6, 6, 12], flip: true, reflection: true, parentClass: 'header-svgs'});
     // Colour
-    new cre8bit().create('mario', {size: getSize(4), parentClass: 'mario'});
-    new cre8bit().create('mario', {size: getSize(4), colour: 'green', parentClass: 'luigi'});
+    new cre8bit().create('mario', {responsive: [4, 4, 8], parentClass: 'mario'});
+    new cre8bit().create('mario', {responsive: [4, 4, 8], colour: 'green', parentClass: 'luigi'});
     // Animating
-    new cre8bit().create('space invader', {size: getSize(12), animate: true, parentClass: 'animating-svg'});
+    new cre8bit().create('space invader', {responsive: [12, 12, 24], animate: true, parentClass: 'animating-svg'});
     // Reflections
-    new cre8bit().create('ufo', {size: getSize(9), reflection: true, wrapperClass: 'ufo-wrap', parentClass: 'reflection-svg'});
+    new cre8bit().create('ufo', {responsive: [9, 9, 18], reflection: true, wrapperClass: 'ufo-wrap', parentClass: 'reflection-svg'});
 };