(CI) format code

zero-to-mastery · Oct 24, 2023 · c6a793c · c6a793c
1 parent 86dd3f2
commit c6a793c
Show file tree

Hide file tree

Showing 7 changed files with 118 additions and 119 deletions.
diff --git a/Art/CodeDrinks270/index.html b/Art/CodeDrinks270/index.html
@@ -1,18 +1,16 @@
-
 <!DOCTYPE html>
 <html lang="en">
-<head>
-  <meta charset="UTF-8">
-  <meta http-equiv="X-UA-Compatible" content="IE=edge">
-  <link rel="stylesheet" href="style.css">
-  <meta name="viewport" content="width=device-width, initial-scale=1.0">
-  <title>Light Bulb Animation</title>
-</head>
-
-<body>
-  <div class="box">
-    <span></span>
-  </div>
-</body>
+  <head>
+    <meta charset="UTF-8" />
+    <meta http-equiv="X-UA-Compatible" content="IE=edge" />
+    <link rel="stylesheet" href="style.css" />
+    <meta name="viewport" content="width=device-width, initial-scale=1.0" />
+    <title>Light Bulb Animation</title>
+  </head>
 
-</html>
+  <body>
+    <div class="box">
+      <span></span>
+    </div>
+  </body>
+</html>
diff --git a/Art/CodeDrinks270/style.css b/Art/CodeDrinks270/style.css
@@ -1,50 +1,49 @@
 * {
-    padding: 0;
-    margin: 0;
-    box-sizing: border-box;
+  padding: 0;
+  margin: 0;
+  box-sizing: border-box;
+}
+
+body {
+  display: flex;
+  justify-content: center;
+  align-items: center;
+  background: #333;
+  min-height: 100vh;
+  overflow: hidden;
+}
+
+.box {
+  position: relative;
+  width: 500px;
+  height: 500px;
+}
+
+.box span {
+  position: absolute;
+  inset: 0;
+}
+
+.box span::before {
+  content: '';
+  position: absolute;
+  width: 350px;
+  height: 400px;
+  left: 15%;
+  background: url('https://i.ibb.co/C1S9Vwn/bulb-off.jpg');
+  background-size: cover;
+  background-position: center;
+  transform: scale(0.8);
+  animation: animate 2s linear infinite;
+  border-bottom: 10px ridge #fff;
+}
+
+@keyframes animate {
+  0%,
+  100% {
+    background: url('https://i.ibb.co/C1S9Vwn/bulb-off.jpg');
   }
-
-  body {
-    display: flex;
-    justify-content: center;
-    align-items: center;
-    background: #333;
-    min-height: 100vh;
-    overflow: hidden;
+  50% {
+    background: url('https://i.ibb.co/SXmm4cd/bulb-on.jpg');
   }
-
-  .box {
-    position: relative;
-    width: 500px;
-    height: 500px;
-  }
-
-  .box span {
-    position: absolute;
-    inset: 0;
-  }
-
-  .box span::before {
-    content: "";
-    position: absolute;
-    width: 350px;
-    height: 400px;
-    left: 15%;
-    background: url("https://i.ibb.co/C1S9Vwn/bulb-off.jpg");
-    background-size: cover;
-    background-position: center;
-    transform: scale(0.8);
-    animation: animate 2s linear infinite;
-    border-bottom: 10px ridge #fff;
-  }
-
-  @keyframes animate {
-    0%,
-    100% {
-      background: url("https://i.ibb.co/C1S9Vwn/bulb-off.jpg");
-    }
-    50% {
-      background: url("https://i.ibb.co/SXmm4cd/bulb-on.jpg");
-    }
-  }
-
+}
diff --git a/Art/Comder101/solar_system.css b/Art/Comder101/solar_system.css
@@ -24,13 +24,18 @@ stars {
   opacity: 0.5;
   animation: twinkle 1s infinite;
   background: url('star.png') no-repeat center center/contain;
-
 }
 
 @keyframes twinkle {
-  0% { opacity: 1; }
-  50% { opacity: 0; }
-  100% { opacity: 1; }
+  0% {
+    opacity: 1;
+  }
+  50% {
+    opacity: 0;
+  }
+  100% {
+    opacity: 1;
+  }
 }
 .solar-system {
   position: absolute;
@@ -85,7 +90,6 @@ stars {
   top: 50%;
   left: 50%;
   transform: translate(-50%, -50%);
-
 }
 
 .mercury-orbit {
@@ -112,8 +116,6 @@ stars {
   animation: orbit-rotation 20s infinite linear;
 }
 
-
-
 @keyframes planet-revolution {
   from {
     transform: rotate(0deg);

diff --git a/Art/Comder101/solar_system.html b/Art/Comder101/solar_system.html
@@ -1,45 +1,45 @@
 <!DOCTYPE html>
 <html lang="en">
-<head>
-  <meta charset="UTF-8">
-  <meta name="viewport" content="width=device-width, initial-scale=1.0">
-  <link rel="stylesheet" href="solar_system.css">
-</head>
-<body>
-  <div class="solar-system">
-    <div class="sun"></div>
-    <div class="orbit mercury-orbit">
-      <div class="planet mercury"></div>
+  <head>
+    <meta charset="UTF-8" />
+    <meta name="viewport" content="width=device-width, initial-scale=1.0" />
+    <link rel="stylesheet" href="solar_system.css" />
+  </head>
+  <body>
+    <div class="solar-system">
+      <div class="sun"></div>
+      <div class="orbit mercury-orbit">
+        <div class="planet mercury"></div>
+      </div>
+      <div class="orbit venus-orbit">
+        <div class="planet venus"></div>
+      </div>
+      <div class="orbit earth-orbit">
+        <div class="planet earth"></div>
+      </div>
+      <div class="orbit mars-orbit">
+        <div class="planet mars"></div>
+      </div>
     </div>
-    <div class="orbit venus-orbit">
-      <div class="planet venus"></div>
-    </div>
-    <div class="orbit earth-orbit">
-      <div class="planet earth"></div>
-    </div>
-    <div class="orbit mars-orbit">
-      <div class="planet mars"></div>
-    </div>
-  </div>
-  <div class="stars"></div>
-  <script>  
-    function createRandomStars() {
-      const numberOfStars = 100; 
-      const starsContainer = document.querySelector('.stars');
+    <div class="stars"></div>
+    <script>
+      function createRandomStars() {
+        const numberOfStars = 100;
+        const starsContainer = document.querySelector('.stars');
 
-      for (let i = 0; i < numberOfStars; i++) {
-        const star = document.createElement('div');
-        star.className = 'star';
-        star.style.left = `${Math.random() * 100}vw`;
-        star.style.top = `${Math.random() * 100}vh`;
-        star.style.width = `${Math.random() * 80}px`;
-        star.style.height = star.style.width;
-        const twinklingTime = Math.random() * 5 + 0.5;
-        star.style.animation = `twinkle ${twinklingTime}s infinite`;
-        starsContainer.appendChild(star);
+        for (let i = 0; i < numberOfStars; i++) {
+          const star = document.createElement('div');
+          star.className = 'star';
+          star.style.left = `${Math.random() * 100}vw`;
+          star.style.top = `${Math.random() * 100}vh`;
+          star.style.width = `${Math.random() * 80}px`;
+          star.style.height = star.style.width;
+          const twinklingTime = Math.random() * 5 + 0.5;
+          star.style.animation = `twinkle ${twinklingTime}s infinite`;
+          starsContainer.appendChild(star);
+        }
       }
-    }
-    createRandomStars();
-  </script>
-</body>
+      createRandomStars();
+    </script>
+  </body>
 </html>
diff --git a/Art/nharjes/index.html b/Art/nharjes/index.html
@@ -1,11 +1,13 @@
 <!DOCTYPE html>
 <html>
-<head>
-    <link rel="stylesheet" type="text/css" href="styles.css">
-</head>
-<body>
+  <head>
+    <link rel="stylesheet" type="text/css" href="styles.css" />
+  </head>
+  <body>
     <div class="colorful-background">
-        <div class="animated-text">This is a colorful background animation in CSS</div>
+      <div class="animated-text">
+        This is a colorful background animation in CSS
+      </div>
     </div>
-</body>
+  </body>
 </html>
diff --git a/Art/nharjes/styles.css b/Art/nharjes/styles.css
@@ -17,8 +17,6 @@ body {
   filter: brightness(0.8);
 }
 
-
-
 .animated-text {
   font-size: 80px;
   text-align: center;
@@ -28,9 +26,9 @@ body {
 
 @keyframes animateBackground {
   0% {
-      background-position: 0% 50%;
+    background-position: 0% 50%;
   }
   100% {
-      background-position: 100% 50%;
+    background-position: 100% 50%;
   }
 }
diff --git a/include.js b/include.js
@@ -112,7 +112,7 @@ let cards = [
     githubLink: 'https://github.com/ahmedalhamad7'
   },
   {
-    artName: "Solar system-Art",
+    artName: 'Solar system-Art',
     pageLink: './Art/Comder101/solar_system.html',
     imageLink: './Art/Comder101/solar_system.gif',
     author: 'Comder101',