From d612082454bd15c30223dc0c3122128e8aa1191d Mon Sep 17 00:00:00 2001 From: Zero to Mastery Date: Wed, 6 Sep 2023 19:36:40 +0000 Subject: [PATCH] (CI) format code --- Art/Sunrise-Sunset/index.html | 42 ++++---- Art/Sunrise-Sunset/stylesheet.css | 156 +++++++++++++++--------------- 2 files changed, 96 insertions(+), 102 deletions(-) diff --git a/Art/Sunrise-Sunset/index.html b/Art/Sunrise-Sunset/index.html index 3cc2eefc..b5bcfbf1 100644 --- a/Art/Sunrise-Sunset/index.html +++ b/Art/Sunrise-Sunset/index.html @@ -1,26 +1,24 @@ - - Julio's gif - - - -
-
-
-
-
-
-
-
-
-
-
-
-
+ + Julio's gif + + + +
+
+
+
+
-
- - - +
+
+
+
+
+
+
+
+
+ diff --git a/Art/Sunrise-Sunset/stylesheet.css b/Art/Sunrise-Sunset/stylesheet.css index 948a06b3..056b6706 100644 --- a/Art/Sunrise-Sunset/stylesheet.css +++ b/Art/Sunrise-Sunset/stylesheet.css @@ -1,105 +1,101 @@ .sky { - position: relative; - display: flex; - background: rgb(22, 22, 37); - height: 400px; - width: 400px; - animation: night-day 2s linear infinite; + position: relative; + display: flex; + background: rgb(22, 22, 37); + height: 400px; + width: 400px; + animation: night-day 2s linear infinite; } .sun { - margin:auto; - height: 50px; - width: 50px; - border-radius: 50%; - background-color: yellow; - animation: sun-path 2s linear infinite; + margin: auto; + height: 50px; + width: 50px; + border-radius: 50%; + background-color: yellow; + animation: sun-path 2s linear infinite; } .houseRoof { - position: absolute; - left: 150px; - height: 0px; - width: 0px; - background-color: transparent; - top: 75px; - border: 38px solid; - border-top: 0px; - border-left-color: transparent; - border-right-color: transparent; - border-bottom-color: rgb(0, 0, 0); - border-bottom-width: 50px; + position: absolute; + left: 150px; + height: 0px; + width: 0px; + background-color: transparent; + top: 75px; + border: 38px solid; + border-top: 0px; + border-left-color: transparent; + border-right-color: transparent; + border-bottom-color: rgb(0, 0, 0); + border-bottom-width: 50px; } .house { - position:absolute; - display: flex; - justify-content: center; - align-items: flex-end; - top: 125px; - right: 175px; - height:50px; - width:75px; - background-color: rgb(231, 226, 226); + position: absolute; + display: flex; + justify-content: center; + align-items: flex-end; + top: 125px; + right: 175px; + height: 50px; + width: 75px; + background-color: rgb(231, 226, 226); } .door { - position: relative; - display: flex; - justify-content: flex-end; - align-items: center; - height: 30px; - width: 20px; - background-color: rgb(112, 59, 59); + position: relative; + display: flex; + justify-content: flex-end; + align-items: center; + height: 30px; + width: 20px; + background-color: rgb(112, 59, 59); } .knob { - background-color: gold; - border-radius: 50%; - height: 3px; - width: 3px; - margin-right: 2px; + background-color: gold; + border-radius: 50%; + height: 3px; + width: 3px; + margin-right: 2px; } .grass { - display: flex; - align-items: center; - align-self: flex-end; - position: absolute; - background-color: green; - height: 225px; - width: 400px; + display: flex; + align-items: center; + align-self: flex-end; + position: absolute; + background-color: green; + height: 225px; + width: 400px; } .road { - display: grid; - grid-template: 1fr 10px 1fr / 1fr; - background-color: gray; - width: 400px; - height: 70px; + display: grid; + grid-template: 1fr 10px 1fr / 1fr; + background-color: gray; + width: 400px; + height: 70px; } .roadLine { - grid-area: 2 / 1 / 3/ 2; - /* position: absolute; */ - height: 0px; - border: dashed 2px yellow; + grid-area: 2 / 1 / 3/ 2; + /* position: absolute; */ + height: 0px; + border: dashed 2px yellow; } @keyframes night-day { - 0% { - background: rgb(22, 22, 37); - } - 50% { - background-color: rgb(72, 72, 227) - } - 100% { - background: rgb(22, 22, 37); - } + 0% { + background: rgb(22, 22, 37); + } + 50% { + background-color: rgb(72, 72, 227); + } + 100% { + background: rgb(22, 22, 37); + } } @keyframes sun-path { - 0% { - transform: - rotate(0deg) - translateY(175px) - } + 0% { + transform: rotate(0deg) translateY(175px); + } - 100% { - transform: rotate(-360deg) - translateY(175px) - } + 100% { + transform: rotate(-360deg) translateY(175px); + } } -