diff --git a/arrowFunction.js b/Arrow Function/arrowFunction.js similarity index 100% rename from arrowFunction.js rename to Arrow Function/arrowFunction.js diff --git a/JSONdemo.html b/JSON-Demo/JSONdemo.html similarity index 96% rename from JSONdemo.html rename to JSON-Demo/JSONdemo.html index 204b44f..04f0037 100644 --- a/JSONdemo.html +++ b/JSON-Demo/JSONdemo.html @@ -1,25 +1,25 @@ - - - - -

Creating Object from JSON String

- -

- - - - + + + + +

Creating Object from JSON String

+ +

+ + + + \ No newline at end of file diff --git a/Balloon Pop Game/README.md b/Projects/Balloon Pop Game/README.md similarity index 100% rename from Balloon Pop Game/README.md rename to Projects/Balloon Pop Game/README.md diff --git a/Balloon Pop Game/app.js b/Projects/Balloon Pop Game/app.js similarity index 100% rename from Balloon Pop Game/app.js rename to Projects/Balloon Pop Game/app.js diff --git a/Balloon Pop Game/index.html b/Projects/Balloon Pop Game/index.html similarity index 100% rename from Balloon Pop Game/index.html rename to Projects/Balloon Pop Game/index.html diff --git a/Balloon Pop Game/style.css b/Projects/Balloon Pop Game/style.css similarity index 100% rename from Balloon Pop Game/style.css rename to Projects/Balloon Pop Game/style.css diff --git a/Calculator.css b/Projects/Calculator/Calculator.css similarity index 94% rename from Calculator.css rename to Projects/Calculator/Calculator.css index d8be588..a5674a9 100644 --- a/Calculator.css +++ b/Projects/Calculator/Calculator.css @@ -1,38 +1,38 @@ - -.container { -margin-top: 0px; - text-align: center; - } -h1{ - text-align: center; - font-size: 28px; -} -input { - width: 230px; - height: 40px; - border:5px solid #244624; - border-radius: 21px; - font-size: 34px; -} -button{ - margin: 5px; - border-radius: 20px; - font-size: 30px; - background: #978fa0; - text-align: center; - width: 50px; - height: 50px; -} -.calculator { - border: 4px solid #13695d; - background-color: #ff99f7; - padding: 8px; - border-radius: 53px; - display: inline-block; -} -span { - color: rgb(26, 197, 209); - font-size: larger; -} - + +.container { +margin-top: 0px; + text-align: center; + } +h1{ + text-align: center; + font-size: 28px; +} +input { + width: 230px; + height: 40px; + border:5px solid #244624; + border-radius: 21px; + font-size: 34px; +} +button{ + margin: 5px; + border-radius: 20px; + font-size: 30px; + background: #978fa0; + text-align: center; + width: 50px; + height: 50px; +} +.calculator { + border: 4px solid #13695d; + background-color: #ff99f7; + padding: 8px; + border-radius: 53px; + display: inline-block; +} +span { + color: rgb(26, 197, 209); + font-size: larger; +} + \ No newline at end of file diff --git a/Calculator.html b/Projects/Calculator/Calculator.html similarity index 95% rename from Calculator.html rename to Projects/Calculator/Calculator.html index 8029c95..ddcc788 100644 --- a/Calculator.html +++ b/Projects/Calculator/Calculator.html @@ -1,59 +1,59 @@ - - - - - - - - Caculator - - - -
-

Caculator by Dilpat Rai

-
- - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - -
-
-
- - - + + + + + + + + Caculator + + + +
+

Caculator by Dilpat Rai

+
+ + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + +
+
+
+ + + \ No newline at end of file diff --git a/Calculator.js b/Projects/Calculator/Calculator.js similarity index 96% rename from Calculator.js rename to Projects/Calculator/Calculator.js index a0f322b..d1e04b1 100644 --- a/Calculator.js +++ b/Projects/Calculator/Calculator.js @@ -1,26 +1,26 @@ -let screen = document.getElementById('screen'); -buttons = document.querySelectorAll('button'); -let screenValue = ""; -for(item of buttons){ - item.addEventListener('click', (e) => { - buttonText = e.target.innerText; - console.log(buttonText); - if(buttonText == 'X') { - buttonText = '*'; - screenValue+=buttonText; - screen.value = screenValue; - } - else if(buttonText == 'C'){ - screenValue = ""; - screen.value = screenValue; - } - else if(buttonText == '='){ - screen.value = eval(screenValue); - screenValue = ""; - } - else { - screenValue+= buttonText; - screen.value = screenValue; - } - }) +let screen = document.getElementById('screen'); +buttons = document.querySelectorAll('button'); +let screenValue = ""; +for(item of buttons){ + item.addEventListener('click', (e) => { + buttonText = e.target.innerText; + console.log(buttonText); + if(buttonText == 'X') { + buttonText = '*'; + screenValue+=buttonText; + screen.value = screenValue; + } + else if(buttonText == 'C'){ + screenValue = ""; + screen.value = screenValue; + } + else if(buttonText == '='){ + screen.value = eval(screenValue); + screenValue = ""; + } + else { + screenValue+= buttonText; + screen.value = screenValue; + } + }) } \ No newline at end of file diff --git a/Covid-19-Tracker-App/README.md b/Projects/Covid-19-Tracker-App/README.md similarity index 100% rename from Covid-19-Tracker-App/README.md rename to Projects/Covid-19-Tracker-App/README.md diff --git a/Covid-19-Tracker-App/package.json b/Projects/Covid-19-Tracker-App/package.json similarity index 100% rename from Covid-19-Tracker-App/package.json rename to Projects/Covid-19-Tracker-App/package.json diff --git a/Covid-19-Tracker-App/public/corona_bg.jpg b/Projects/Covid-19-Tracker-App/public/corona_bg.jpg similarity index 100% rename from Covid-19-Tracker-App/public/corona_bg.jpg rename to Projects/Covid-19-Tracker-App/public/corona_bg.jpg diff --git a/Covid-19-Tracker-App/public/corona_vaccine.jpg b/Projects/Covid-19-Tracker-App/public/corona_vaccine.jpg similarity index 100% rename from Covid-19-Tracker-App/public/corona_vaccine.jpg rename to Projects/Covid-19-Tracker-App/public/corona_vaccine.jpg diff --git a/Covid-19-Tracker-App/public/covid.png b/Projects/Covid-19-Tracker-App/public/covid.png similarity index 100% rename from Covid-19-Tracker-App/public/covid.png rename to Projects/Covid-19-Tracker-App/public/covid.png diff --git a/Covid-19-Tracker-App/public/covidbg.png b/Projects/Covid-19-Tracker-App/public/covidbg.png similarity index 100% rename from Covid-19-Tracker-App/public/covidbg.png rename to Projects/Covid-19-Tracker-App/public/covidbg.png diff --git a/Covid-19-Tracker-App/public/favicon.ico b/Projects/Covid-19-Tracker-App/public/favicon.ico similarity index 100% rename from Covid-19-Tracker-App/public/favicon.ico rename to Projects/Covid-19-Tracker-App/public/favicon.ico diff --git a/Covid-19-Tracker-App/public/index.html b/Projects/Covid-19-Tracker-App/public/index.html similarity index 100% rename from Covid-19-Tracker-App/public/index.html rename to Projects/Covid-19-Tracker-App/public/index.html diff --git a/Covid-19-Tracker-App/public/manifest.json b/Projects/Covid-19-Tracker-App/public/manifest.json similarity index 100% rename from Covid-19-Tracker-App/public/manifest.json rename to Projects/Covid-19-Tracker-App/public/manifest.json diff --git a/Covid-19-Tracker-App/public/new_corona_bg.png b/Projects/Covid-19-Tracker-App/public/new_corona_bg.png similarity index 100% rename from Covid-19-Tracker-App/public/new_corona_bg.png rename to Projects/Covid-19-Tracker-App/public/new_corona_bg.png diff --git a/Covid-19-Tracker-App/public/robots.txt b/Projects/Covid-19-Tracker-App/public/robots.txt similarity index 100% rename from Covid-19-Tracker-App/public/robots.txt rename to Projects/Covid-19-Tracker-App/public/robots.txt diff --git a/Covid-19-Tracker-App/src/API/index.js b/Projects/Covid-19-Tracker-App/src/API/index.js similarity index 100% rename from Covid-19-Tracker-App/src/API/index.js rename to Projects/Covid-19-Tracker-App/src/API/index.js diff --git a/Covid-19-Tracker-App/src/App.js b/Projects/Covid-19-Tracker-App/src/App.js similarity index 100% rename from Covid-19-Tracker-App/src/App.js rename to Projects/Covid-19-Tracker-App/src/App.js diff --git a/Covid-19-Tracker-App/src/App.module.css b/Projects/Covid-19-Tracker-App/src/App.module.css similarity index 100% rename from Covid-19-Tracker-App/src/App.module.css rename to Projects/Covid-19-Tracker-App/src/App.module.css diff --git a/Covid-19-Tracker-App/src/components/Cards/Cards.jsx b/Projects/Covid-19-Tracker-App/src/components/Cards/Cards.jsx similarity index 100% rename from Covid-19-Tracker-App/src/components/Cards/Cards.jsx rename to Projects/Covid-19-Tracker-App/src/components/Cards/Cards.jsx diff --git a/Covid-19-Tracker-App/src/components/Cards/Cards.module.css b/Projects/Covid-19-Tracker-App/src/components/Cards/Cards.module.css similarity index 100% rename from Covid-19-Tracker-App/src/components/Cards/Cards.module.css rename to Projects/Covid-19-Tracker-App/src/components/Cards/Cards.module.css diff --git a/Covid-19-Tracker-App/src/components/Chart/Charts.jsx b/Projects/Covid-19-Tracker-App/src/components/Chart/Charts.jsx similarity index 100% rename from Covid-19-Tracker-App/src/components/Chart/Charts.jsx rename to Projects/Covid-19-Tracker-App/src/components/Chart/Charts.jsx diff --git a/Covid-19-Tracker-App/src/components/Chart/Charts.module.css b/Projects/Covid-19-Tracker-App/src/components/Chart/Charts.module.css similarity index 100% rename from Covid-19-Tracker-App/src/components/Chart/Charts.module.css rename to Projects/Covid-19-Tracker-App/src/components/Chart/Charts.module.css diff --git a/Covid-19-Tracker-App/src/components/CountryPicker/CountryPicker.jsx b/Projects/Covid-19-Tracker-App/src/components/CountryPicker/CountryPicker.jsx similarity index 100% rename from Covid-19-Tracker-App/src/components/CountryPicker/CountryPicker.jsx rename to Projects/Covid-19-Tracker-App/src/components/CountryPicker/CountryPicker.jsx diff --git a/Covid-19-Tracker-App/src/components/CountryPicker/CountryPicker.module.css b/Projects/Covid-19-Tracker-App/src/components/CountryPicker/CountryPicker.module.css similarity index 100% rename from Covid-19-Tracker-App/src/components/CountryPicker/CountryPicker.module.css rename to Projects/Covid-19-Tracker-App/src/components/CountryPicker/CountryPicker.module.css diff --git a/Covid-19-Tracker-App/src/components/Footer/Footer.js b/Projects/Covid-19-Tracker-App/src/components/Footer/Footer.js similarity index 100% rename from Covid-19-Tracker-App/src/components/Footer/Footer.js rename to Projects/Covid-19-Tracker-App/src/components/Footer/Footer.js diff --git a/Covid-19-Tracker-App/src/components/Footer/Footer.module.css b/Projects/Covid-19-Tracker-App/src/components/Footer/Footer.module.css similarity index 100% rename from Covid-19-Tracker-App/src/components/Footer/Footer.module.css rename to Projects/Covid-19-Tracker-App/src/components/Footer/Footer.module.css diff --git a/Covid-19-Tracker-App/src/components/index.js b/Projects/Covid-19-Tracker-App/src/components/index.js similarity index 100% rename from Covid-19-Tracker-App/src/components/index.js rename to Projects/Covid-19-Tracker-App/src/components/index.js diff --git a/Covid-19-Tracker-App/src/images/covid.png b/Projects/Covid-19-Tracker-App/src/images/covid.png similarity index 100% rename from Covid-19-Tracker-App/src/images/covid.png rename to Projects/Covid-19-Tracker-App/src/images/covid.png diff --git a/Covid-19-Tracker-App/src/images/covid19.png b/Projects/Covid-19-Tracker-App/src/images/covid19.png similarity index 100% rename from Covid-19-Tracker-App/src/images/covid19.png rename to Projects/Covid-19-Tracker-App/src/images/covid19.png diff --git a/Covid-19-Tracker-App/src/index.js b/Projects/Covid-19-Tracker-App/src/index.js similarity index 100% rename from Covid-19-Tracker-App/src/index.js rename to Projects/Covid-19-Tracker-App/src/index.js diff --git a/Covid-19-Tracker-App/src/logo.svg b/Projects/Covid-19-Tracker-App/src/logo.svg similarity index 100% rename from Covid-19-Tracker-App/src/logo.svg rename to Projects/Covid-19-Tracker-App/src/logo.svg diff --git a/Covid-19-Tracker-App/src/serviceWorker.js b/Projects/Covid-19-Tracker-App/src/serviceWorker.js similarity index 100% rename from Covid-19-Tracker-App/src/serviceWorker.js rename to Projects/Covid-19-Tracker-App/src/serviceWorker.js diff --git a/Covid-19-Tracker-App/src/setupTests.js b/Projects/Covid-19-Tracker-App/src/setupTests.js similarity index 100% rename from Covid-19-Tracker-App/src/setupTests.js rename to Projects/Covid-19-Tracker-App/src/setupTests.js diff --git a/Covid-19-Tracker-App/src/static/images/deaths.png b/Projects/Covid-19-Tracker-App/src/static/images/deaths.png similarity index 100% rename from Covid-19-Tracker-App/src/static/images/deaths.png rename to Projects/Covid-19-Tracker-App/src/static/images/deaths.png diff --git a/Covid-19-Tracker-App/src/static/images/infected.png b/Projects/Covid-19-Tracker-App/src/static/images/infected.png similarity index 100% rename from Covid-19-Tracker-App/src/static/images/infected.png rename to Projects/Covid-19-Tracker-App/src/static/images/infected.png diff --git a/Covid-19-Tracker-App/src/static/images/infected1.png b/Projects/Covid-19-Tracker-App/src/static/images/infected1.png similarity index 100% rename from Covid-19-Tracker-App/src/static/images/infected1.png rename to Projects/Covid-19-Tracker-App/src/static/images/infected1.png diff --git a/Covid-19-Tracker-App/src/static/images/recovered.png b/Projects/Covid-19-Tracker-App/src/static/images/recovered.png similarity index 100% rename from Covid-19-Tracker-App/src/static/images/recovered.png rename to Projects/Covid-19-Tracker-App/src/static/images/recovered.png diff --git a/Covid-19-Tracker-App/yarn.lock b/Projects/Covid-19-Tracker-App/yarn.lock similarity index 100% rename from Covid-19-Tracker-App/yarn.lock rename to Projects/Covid-19-Tracker-App/yarn.lock diff --git a/Digital Clock/README.md b/Projects/Digital Clock/README.md similarity index 100% rename from Digital Clock/README.md rename to Projects/Digital Clock/README.md diff --git a/Digital Clock/clock.css b/Projects/Digital Clock/clock.css similarity index 94% rename from Digital Clock/clock.css rename to Projects/Digital Clock/clock.css index 52609d8..e16aea7 100644 --- a/Digital Clock/clock.css +++ b/Projects/Digital Clock/clock.css @@ -1,113 +1,113 @@ -@import url('https://fonts.googleapis.com/css2?family=Orbitron:wght@400;500&display=swap'); - -*{ - margin: 0; - padding: 0; - box-sizing: border-box; -} - -body { - background-image: url('themeLight.png'); - transition: background 0.2s linear; -} - -body.dark { - background-image: url('themeDark.png'); -} - -.main { - background-color: #ccc; - width: 400px; - height: 175px; - margin: 200px auto; - border-radius: 4px; - position: relative; - padding: 30px; -} - - -.badge { - background-color: #e66357; - color: white; - padding: 3px 8px; - width: 80px; - font-weight: bold; - text-align: center; - border-radius: 4px; - position: absolute; - top: -10; - left: 155px; - font-family: sans-serif; -} - -body.dark .badge { - color: black; -} - -.time { - background-color: #ebebeb; - text-align: center; - font-size: 48px; - height: 100%; - padding-top: 25px; - border-radius: 4px; - font-family: 'Orbitron', sans-serif; - font-weight: 500; -} - -body.dark .time { - background-color: rgba(51, 46, 46, 0.315); - color: white; -} - -.checkbox { - opacity: 0; - position: absolute; -} - -.label { - background-color: #111; - display: flex; - align-items: center; - justify-content: space-between; - border-radius: 50px; - padding: 5px; - height: 26px; - width: 50px; - position: relative; - transform: scale(1.25); - transition: background 0.2s linear; -} - -.checkbox:checked + .label{ - background-color: rgb(11, 122, 196); -} - -.ball { - background-color: white; - width: 22px; - height: 22px; - position: absolute; - border-radius: 50%; - top: 2px; - left: 2px; - transition: transform 0.2s linear; -} - -.checkbox:checked + .label .ball { - transform: translateX(24px); -} - -.toggle-position { - position: absolute; - top: 25px; - right: 110px; -} - -.fa-moon { - color: #f1c40f; -} - -.fa-sun { - color: #f39c12; -} +@import url('https://fonts.googleapis.com/css2?family=Orbitron:wght@400;500&display=swap'); + +*{ + margin: 0; + padding: 0; + box-sizing: border-box; +} + +body { + background-image: url('themeLight.png'); + transition: background 0.2s linear; +} + +body.dark { + background-image: url('themeDark.png'); +} + +.main { + background-color: #ccc; + width: 400px; + height: 175px; + margin: 200px auto; + border-radius: 4px; + position: relative; + padding: 30px; +} + + +.badge { + background-color: #e66357; + color: white; + padding: 3px 8px; + width: 80px; + font-weight: bold; + text-align: center; + border-radius: 4px; + position: absolute; + top: -10; + left: 155px; + font-family: sans-serif; +} + +body.dark .badge { + color: black; +} + +.time { + background-color: #ebebeb; + text-align: center; + font-size: 48px; + height: 100%; + padding-top: 25px; + border-radius: 4px; + font-family: 'Orbitron', sans-serif; + font-weight: 500; +} + +body.dark .time { + background-color: rgba(51, 46, 46, 0.315); + color: white; +} + +.checkbox { + opacity: 0; + position: absolute; +} + +.label { + background-color: #111; + display: flex; + align-items: center; + justify-content: space-between; + border-radius: 50px; + padding: 5px; + height: 26px; + width: 50px; + position: relative; + transform: scale(1.25); + transition: background 0.2s linear; +} + +.checkbox:checked + .label{ + background-color: rgb(11, 122, 196); +} + +.ball { + background-color: white; + width: 22px; + height: 22px; + position: absolute; + border-radius: 50%; + top: 2px; + left: 2px; + transition: transform 0.2s linear; +} + +.checkbox:checked + .label .ball { + transform: translateX(24px); +} + +.toggle-position { + position: absolute; + top: 25px; + right: 110px; +} + +.fa-moon { + color: #f1c40f; +} + +.fa-sun { + color: #f39c12; +} diff --git a/Digital Clock/clock.html b/Projects/Digital Clock/clock.html similarity index 96% rename from Digital Clock/clock.html rename to Projects/Digital Clock/clock.html index 51e95ca..0223d5b 100644 --- a/Digital Clock/clock.html +++ b/Projects/Digital Clock/clock.html @@ -1,35 +1,35 @@ - - - - - Digital Clock - - - - - -
- - -
- -
-
- Clock -
- -
- 00 : - 00 : - 00 -
- -
- - - + + + + + Digital Clock + + + + + +
+ + +
+ +
+
+ Clock +
+ +
+ 00 : + 00 : + 00 +
+ +
+ + + \ No newline at end of file diff --git a/Digital Clock/clock.js b/Projects/Digital Clock/clock.js similarity index 96% rename from Digital Clock/clock.js rename to Projects/Digital Clock/clock.js index 6897e8a..7b6464d 100644 --- a/Digital Clock/clock.js +++ b/Projects/Digital Clock/clock.js @@ -1,23 +1,23 @@ -function refresh(){ - const time = new Date(); - - let hr = time.getHours();; - let min = time.getMinutes(); - let sec = time.getSeconds(); - - hr = (hr < 10) ? "0" + hr : hr; - min = (min < 10) ? "0" + mim : min; - sec = (sec < 10) ? "0" + sec : sec; - - document.getElementById("h").innerHTML = hr; - document.getElementById("m").innerHTML = min; - document.getElementById("s").innerHTML = sec; -} - -setInterval(refresh,1000); - -const checkbox = document.getElementById('checkbox'); - -checkbox.addEventListener('change', () => { - document.body.classList.toggle('dark') -}); +function refresh(){ + const time = new Date(); + + let hr = time.getHours();; + let min = time.getMinutes(); + let sec = time.getSeconds(); + + hr = (hr < 10) ? "0" + hr : hr; + min = (min < 10) ? "0" + mim : min; + sec = (sec < 10) ? "0" + sec : sec; + + document.getElementById("h").innerHTML = hr; + document.getElementById("m").innerHTML = min; + document.getElementById("s").innerHTML = sec; +} + +setInterval(refresh,1000); + +const checkbox = document.getElementById('checkbox'); + +checkbox.addEventListener('change', () => { + document.body.classList.toggle('dark') +}); diff --git a/Digital Clock/themeDark.png b/Projects/Digital Clock/themeDark.png similarity index 100% rename from Digital Clock/themeDark.png rename to Projects/Digital Clock/themeDark.png diff --git a/Digital Clock/themeLight.png b/Projects/Digital Clock/themeLight.png similarity index 100% rename from Digital Clock/themeLight.png rename to Projects/Digital Clock/themeLight.png diff --git a/Multiplication Table Generator/bg.jpg b/Projects/Multiplication Table Generator/bg.jpg similarity index 100% rename from Multiplication Table Generator/bg.jpg rename to Projects/Multiplication Table Generator/bg.jpg diff --git a/Multiplication Table Generator/index.html b/Projects/Multiplication Table Generator/index.html similarity index 100% rename from Multiplication Table Generator/index.html rename to Projects/Multiplication Table Generator/index.html diff --git a/Multiplication Table Generator/logo.png b/Projects/Multiplication Table Generator/logo.png similarity index 100% rename from Multiplication Table Generator/logo.png rename to Projects/Multiplication Table Generator/logo.png diff --git a/Multiplication Table Generator/script.js b/Projects/Multiplication Table Generator/script.js similarity index 100% rename from Multiplication Table Generator/script.js rename to Projects/Multiplication Table Generator/script.js diff --git a/Multiplication Table Generator/style.css b/Projects/Multiplication Table Generator/style.css similarity index 100% rename from Multiplication Table Generator/style.css rename to Projects/Multiplication Table Generator/style.css diff --git a/RandomQuoteGenerator/index.html b/Projects/RandomQuoteGenerator/index.html similarity index 97% rename from RandomQuoteGenerator/index.html rename to Projects/RandomQuoteGenerator/index.html index f82f728..674b0e8 100644 --- a/RandomQuoteGenerator/index.html +++ b/Projects/RandomQuoteGenerator/index.html @@ -1,22 +1,22 @@ - - - - Random Quote - - - - -

The Random Quote Generator

-
-
- Education is the most powerful weapon which - you can - use to change the world. - - - Nelson Mandela -
- -
- - + + + + Random Quote + + + + +

The Random Quote Generator

+
+
+ Education is the most powerful weapon which + you can + use to change the world. + + - Nelson Mandela +
+ +
+ + \ No newline at end of file diff --git a/RandomQuoteGenerator/main.js b/Projects/RandomQuoteGenerator/main.js similarity index 96% rename from RandomQuoteGenerator/main.js rename to Projects/RandomQuoteGenerator/main.js index c1af6b8..c6582ae 100644 --- a/RandomQuoteGenerator/main.js +++ b/Projects/RandomQuoteGenerator/main.js @@ -1,16 +1,16 @@ -const api = "https://api.quotable.io/random"; - -const quote = document.getElementById("quote"); -const author = document.getElementById("author"); -const btn = document.getElementById("btn"); - -btn.addEventListener("click", getQuote); - -function getQuote() { - fetch(api) - .then((res) => res.json()) - .then((data) => { - quote.innerHTML = `${data.content}`; - author.innerHTML = `- ${data.author}`; - }); -} +const api = "https://api.quotable.io/random"; + +const quote = document.getElementById("quote"); +const author = document.getElementById("author"); +const btn = document.getElementById("btn"); + +btn.addEventListener("click", getQuote); + +function getQuote() { + fetch(api) + .then((res) => res.json()) + .then((data) => { + quote.innerHTML = `${data.content}`; + author.innerHTML = `- ${data.author}`; + }); +} diff --git a/RandomQuoteGenerator/styles.css b/Projects/RandomQuoteGenerator/styles.css similarity index 93% rename from RandomQuoteGenerator/styles.css rename to Projects/RandomQuoteGenerator/styles.css index 2d801fc..ca7fb8e 100644 --- a/RandomQuoteGenerator/styles.css +++ b/Projects/RandomQuoteGenerator/styles.css @@ -1,68 +1,68 @@ -* { - margin: 0; - padding: 0; - box-sizing: border-box; -} - -body { - font-family: helvetica; - font-size: 18px; - background: #1e3030; -} - -.heading { - color: #d5dbe7; - text-align: center; - margin-top: 80px; - font-size: 3rem; -} - -.container { - width: 80%; - margin: 130px auto; - display: flex; - flex-direction: column; -} - -.quote-box { - height: 40vh; - border: 5px solid #d5dbe7; - border-radius: 20%; - padding: 50px 30px; - margin-bottom: 20px; - background: #1a494f; - display: flex; - flex-direction: column; - align-items: center; - justify-content: center; -} - -.quote-box span { - color: #d5dbe7; - text-align: center; - font-size: 2rem; -} -#author { - float: right; - color: #888; - font-weight: bold; - font-style: italic; - margin-top: 10px; -} - -#btn { - border: none; - outline: none; - padding: 20px 30px; - background-color: #455261; - color: #fff; - border-radius: 5px; - font-size: 27px; - cursor: pointer; - max-width: 300px; - align-self: center; -} - -#btn:focus { - outline: none; -} +* { + margin: 0; + padding: 0; + box-sizing: border-box; +} + +body { + font-family: helvetica; + font-size: 18px; + background: #1e3030; +} + +.heading { + color: #d5dbe7; + text-align: center; + margin-top: 80px; + font-size: 3rem; +} + +.container { + width: 80%; + margin: 130px auto; + display: flex; + flex-direction: column; +} + +.quote-box { + height: 40vh; + border: 5px solid #d5dbe7; + border-radius: 20%; + padding: 50px 30px; + margin-bottom: 20px; + background: #1a494f; + display: flex; + flex-direction: column; + align-items: center; + justify-content: center; +} + +.quote-box span { + color: #d5dbe7; + text-align: center; + font-size: 2rem; +} +#author { + float: right; + color: #888; + font-weight: bold; + font-style: italic; + margin-top: 10px; +} + +#btn { + border: none; + outline: none; + padding: 20px 30px; + background-color: #455261; + color: #fff; + border-radius: 5px; + font-size: 27px; + cursor: pointer; + max-width: 300px; + align-self: center; +} + +#btn:focus { + outline: none; +} diff --git a/Rock paper scissors/README.md b/Projects/Rock paper scissors/README.md similarity index 100% rename from Rock paper scissors/README.md rename to Projects/Rock paper scissors/README.md diff --git a/Rock paper scissors/paper.png b/Projects/Rock paper scissors/paper.png similarity index 100% rename from Rock paper scissors/paper.png rename to Projects/Rock paper scissors/paper.png diff --git a/Rock paper scissors/rock.png b/Projects/Rock paper scissors/rock.png similarity index 100% rename from Rock paper scissors/rock.png rename to Projects/Rock paper scissors/rock.png diff --git a/Rock paper scissors/rps.css b/Projects/Rock paper scissors/rps.css similarity index 93% rename from Rock paper scissors/rps.css rename to Projects/Rock paper scissors/rps.css index 4310892..63e4e6b 100644 --- a/Rock paper scissors/rps.css +++ b/Projects/Rock paper scissors/rps.css @@ -1,89 +1,89 @@ -* { - margin:0; - padding: 0; - font-family: 'Balsamiq Sans', cursive; - box-sizing: border-box; -} - -header { - background: white; -} - -header > h1 { - color: rgb(153, 33, 29); - font-size:45px; - padding: 15px; - text-align: center; -} - -body { - background: rgb(109, 109, 110); -} - -.score-board { - margin: 30px auto; - padding: 10px 20px; - font-size:40px; - color: white; - text-align: center; - border: 4px solid black; - width: 200px; - border-radius: 7px; - position: relative; -} - -.label { - background: rgb(153, 33, 29); - border-radius: 7px; - font-size: 20px; - padding: 1px 5px; -} - -#user-label { - position: absolute; - top:25px; - left:-20px; -} - -#computer-label { - position: absolute; - top:25px; - right:-25px; -} - -.result { - text-align: center; - font-size: 40px; -} - -.choices { - text-align: center; - margin: 25px; -} - -.choice { - display: inline-block; - border: 3px solid black; - border-radius: 50%; - padding:15px; - margin: 0px 5px; - -} - -.choice:hover { - cursor: pointer; - background: rgb(70, 69, 69); - transition: all 0.5s ease; -} - -.green-glow { - border: 4px solid #4dcc7d; -} - -.red-glow { - border: 4px solid #fc121b; -} - -.white-glow { - border: 4px solid rgb(184, 174, 174); -} +* { + margin:0; + padding: 0; + font-family: 'Balsamiq Sans', cursive; + box-sizing: border-box; +} + +header { + background: white; +} + +header > h1 { + color: rgb(153, 33, 29); + font-size:45px; + padding: 15px; + text-align: center; +} + +body { + background: rgb(109, 109, 110); +} + +.score-board { + margin: 30px auto; + padding: 10px 20px; + font-size:40px; + color: white; + text-align: center; + border: 4px solid black; + width: 200px; + border-radius: 7px; + position: relative; +} + +.label { + background: rgb(153, 33, 29); + border-radius: 7px; + font-size: 20px; + padding: 1px 5px; +} + +#user-label { + position: absolute; + top:25px; + left:-20px; +} + +#computer-label { + position: absolute; + top:25px; + right:-25px; +} + +.result { + text-align: center; + font-size: 40px; +} + +.choices { + text-align: center; + margin: 25px; +} + +.choice { + display: inline-block; + border: 3px solid black; + border-radius: 50%; + padding:15px; + margin: 0px 5px; + +} + +.choice:hover { + cursor: pointer; + background: rgb(70, 69, 69); + transition: all 0.5s ease; +} + +.green-glow { + border: 4px solid #4dcc7d; +} + +.red-glow { + border: 4px solid #fc121b; +} + +.white-glow { + border: 4px solid rgb(184, 174, 174); +} diff --git a/Rock paper scissors/rps.html b/Projects/Rock paper scissors/rps.html similarity index 96% rename from Rock paper scissors/rps.html rename to Projects/Rock paper scissors/rps.html index e3a2c2f..9bad8b2 100644 --- a/Rock paper scissors/rps.html +++ b/Projects/Rock paper scissors/rps.html @@ -1,39 +1,39 @@ - - - - - - Rock Paper Scissors - - - -
-

Rock Paper Scissors

-
- -
-
user
-
comp
- 0:0 -
- -
Make your move.
- -
-
- rock -
- -
- paper -
- -
- scissors -
-
- - - - + + + + + + Rock Paper Scissors + + + +
+

Rock Paper Scissors

+
+ +
+
user
+
comp
+ 0:0 +
+ +
Make your move.
+ +
+
+ rock +
+ +
+ paper +
+ +
+ scissors +
+
+ + + + \ No newline at end of file diff --git a/Rock paper scissors/rps.js b/Projects/Rock paper scissors/rps.js similarity index 97% rename from Rock paper scissors/rps.js rename to Projects/Rock paper scissors/rps.js index 759777d..db5e35d 100644 --- a/Rock paper scissors/rps.js +++ b/Projects/Rock paper scissors/rps.js @@ -1,92 +1,92 @@ -var userScore = 0; -var computerScore = 0; -const userScore_span = document.getElementById("user-score"); -const computerScore_span = document.getElementById("computer-score"); -const scoreBoard_div = document.querySelector(".score-board"); -const result_div = document.querySelector(".result"); -const rock_div = document.getElementById("r"); -const paper_div = document.getElementById("p"); -const scissors_div = document.getElementById("s"); - -function main(){ - rock_div.addEventListener('click', function() { - game("r"); - }) - - paper_div.addEventListener('click', function() { - game("p"); - }) - - scissors_div.addEventListener('click', function() { - game("s"); - }) -} - -main(); - -function getComputerChoice(){ - const choices = ["r", "p", "s"] - const randomNumber = Math.floor(Math.random()*3); - return choices[randomNumber]; -} - -function game(userChoice){ - const computerChoice = getComputerChoice(); - - switch(userChoice + computerChoice) { - case "rs": - case "pr": - case "sp": - win(userChoice, computerChoice); - break; - case "sr": - case "rp": - case "ps": - lose(userChoice, computerChoice); - break; - case "rr": - case "pp": - case "ss": - draw(userChoice, computerChoice); - break; - } -} - -function convertToWord(letter){ - if (letter === "r") return "Rock"; - if (letter === "p") return "Paper"; - return "Scissors"; -} - -function win(userChoice, computerChoice){ - const subUser = "user".fontsize(3).sub(); - const subComp = "comp".fontsize(3).sub(); - const glow_div = document.getElementById(userChoice); - userScore++; - userScore_span.innerHTML = userScore; - computerScore_span.innerHTML = computerScore; - result_div.innerHTML = `${convertToWord(userChoice)}${subUser} beats ${convertToWord(computerChoice)}${subComp}. You Win!!!`; - glow_div.classList.add('green-glow'); - setTimeout(function(){ glow_div.classList.remove('green-glow')}, 300); -} - -function lose(userChoice, computerChoice){ - const subUser = "user".fontsize(3).sub(); - const subComp = "comp".fontsize(3).sub(); - const glow_div = document.getElementById(userChoice); - computerScore++; - userScore_span.innerHTML = userScore; - computerScore_span.innerHTML = computerScore; - result_div.innerHTML = `${convertToWord(computerChoice)}${subComp} beats ${convertToWord(userChoice)}${subUser}. You Lose...`; - glow_div.classList.add('red-glow'); - setTimeout(function(){ glow_div.classList.remove('red-glow')}, 300); -} - -function draw(userChoice, computerChoice){ - const subUser = "user".fontsize(3).sub(); - const subComp = "comp".fontsize(3).sub(); - const glow_div = document.getElementById(userChoice); - result_div.innerHTML = `${convertToWord(userChoice)}${subUser} equals ${convertToWord(computerChoice)}${subComp}. It's a Draw.`; - glow_div.classList.add('white-glow'); - setTimeout(function(){ glow_div.classList.remove('white-glow')}, 300); -} +var userScore = 0; +var computerScore = 0; +const userScore_span = document.getElementById("user-score"); +const computerScore_span = document.getElementById("computer-score"); +const scoreBoard_div = document.querySelector(".score-board"); +const result_div = document.querySelector(".result"); +const rock_div = document.getElementById("r"); +const paper_div = document.getElementById("p"); +const scissors_div = document.getElementById("s"); + +function main(){ + rock_div.addEventListener('click', function() { + game("r"); + }) + + paper_div.addEventListener('click', function() { + game("p"); + }) + + scissors_div.addEventListener('click', function() { + game("s"); + }) +} + +main(); + +function getComputerChoice(){ + const choices = ["r", "p", "s"] + const randomNumber = Math.floor(Math.random()*3); + return choices[randomNumber]; +} + +function game(userChoice){ + const computerChoice = getComputerChoice(); + + switch(userChoice + computerChoice) { + case "rs": + case "pr": + case "sp": + win(userChoice, computerChoice); + break; + case "sr": + case "rp": + case "ps": + lose(userChoice, computerChoice); + break; + case "rr": + case "pp": + case "ss": + draw(userChoice, computerChoice); + break; + } +} + +function convertToWord(letter){ + if (letter === "r") return "Rock"; + if (letter === "p") return "Paper"; + return "Scissors"; +} + +function win(userChoice, computerChoice){ + const subUser = "user".fontsize(3).sub(); + const subComp = "comp".fontsize(3).sub(); + const glow_div = document.getElementById(userChoice); + userScore++; + userScore_span.innerHTML = userScore; + computerScore_span.innerHTML = computerScore; + result_div.innerHTML = `${convertToWord(userChoice)}${subUser} beats ${convertToWord(computerChoice)}${subComp}. You Win!!!`; + glow_div.classList.add('green-glow'); + setTimeout(function(){ glow_div.classList.remove('green-glow')}, 300); +} + +function lose(userChoice, computerChoice){ + const subUser = "user".fontsize(3).sub(); + const subComp = "comp".fontsize(3).sub(); + const glow_div = document.getElementById(userChoice); + computerScore++; + userScore_span.innerHTML = userScore; + computerScore_span.innerHTML = computerScore; + result_div.innerHTML = `${convertToWord(computerChoice)}${subComp} beats ${convertToWord(userChoice)}${subUser}. You Lose...`; + glow_div.classList.add('red-glow'); + setTimeout(function(){ glow_div.classList.remove('red-glow')}, 300); +} + +function draw(userChoice, computerChoice){ + const subUser = "user".fontsize(3).sub(); + const subComp = "comp".fontsize(3).sub(); + const glow_div = document.getElementById(userChoice); + result_div.innerHTML = `${convertToWord(userChoice)}${subUser} equals ${convertToWord(computerChoice)}${subComp}. It's a Draw.`; + glow_div.classList.add('white-glow'); + setTimeout(function(){ glow_div.classList.remove('white-glow')}, 300); +} diff --git a/Rock paper scissors/scissors.png b/Projects/Rock paper scissors/scissors.png similarity index 100% rename from Rock paper scissors/scissors.png rename to Projects/Rock paper scissors/scissors.png diff --git a/clock/Clock-No-Hands-PNG-Clipart.png b/Projects/clock/Clock-No-Hands-PNG-Clipart.png similarity index 100% rename from clock/Clock-No-Hands-PNG-Clipart.png rename to Projects/clock/Clock-No-Hands-PNG-Clipart.png diff --git a/clock/index.html b/Projects/clock/index.html similarity index 96% rename from clock/index.html rename to Projects/clock/index.html index 4a269b5..4b6b0f9 100644 --- a/clock/index.html +++ b/Projects/clock/index.html @@ -1,94 +1,94 @@ - - - - - Clock Project - - -
-
-
-
-
-
-
-
-
-
-
-
- -
- -

Enter time to set Alarm

- -

Note: Enter time in 24-hour format

- -
- - -
-
-
- - - + + + + + Clock Project + + +
+
+
+
+
+
+
+
+
+
+
+
+ +
+ +

Enter time to set Alarm

+ +

Note: Enter time in 24-hour format

+ +
+ + +
+
+
+ + + \ No newline at end of file diff --git a/clock/index.js b/Projects/clock/index.js similarity index 50% rename from clock/index.js rename to Projects/clock/index.js index d3f5a12..8b13789 100644 --- a/clock/index.js +++ b/Projects/clock/index.js @@ -1 +1 @@ - + diff --git a/clock/main.css b/Projects/clock/main.css similarity index 94% rename from clock/main.css rename to Projects/clock/main.css index 3bed5b2..ea0c977 100644 --- a/clock/main.css +++ b/Projects/clock/main.css @@ -1,117 +1,117 @@ -*, -*::before, -*::after { - margin: 0; - padding: 0; - box-sizing: border-box; -} -body { - display: flex; - align-items: center; - justify-content: center; - min-height: 100vh; -} - -.clock { - display: flex; - align-items: center; - justify-content: center; - width: 300px; - height: 300px; - background: url(Clock-No-Hands-PNG-Clipart.png); - background-size: cover; -} - -.clock::before { - height: 10px; - width: 10px; - border-radius: 50%; - background: black; - position: absolute; - z-index: 1000; - content: ""; -} - -.hr, -.mn, -.sc { - display: flex; - /* align-items: center; */ - justify-content: center; -} -.hr::before { - height: 80px; - width: 6px; - z-index: 10; - background: black; - content: ""; - position: absolute; - border-radius: 50%; - transform: rotateZ(180deg); - transform-origin: top center; -} -.mn::before { - height: 90px; - width: 3px; - z-index: 5; - background: black; - content: ""; - position: absolute; - border-radius: 50%; - transform: rotateZ(180deg); - transform-origin: top center; -} - -.sc::before { - height: 100px; - width: 2px; - z-index: 60; - background: red; - content: ""; - position: absolute; - border-radius: 50%; - transform: rotateZ(180deg); - transform-origin: top center; -} - -h1 { - padding: 4px 4px; - margin-bottom: 2rem; - font-family: "Segoe UI", Tahoma, Geneva, Verdana, sans-serif; -} - -.container { - width: 60vw; - display: flex; - justify-content: space-between; -} - -.form-control { - display: block; - width: 23rem; - font-size: 15px; - padding: 5px 15px; - border: 1px solid black; - border-radius: 10px; - outline: none; -} - -.btn-list { - margin: 2em 0em; -} - -.btn { - margin: 1rem; - font-size: 14px; - padding: 6px 6px; - border: 1px solid transparent; - background-color: #b7edff; - border-radius: 5px; - font-weight: 5000; - font-weight: 500; - cursor: pointer; -} -p { - font-family: "Segoe UI", Tahoma, Geneva, Verdana, sans-serif; - padding-top: 1rem; -} +*, +*::before, +*::after { + margin: 0; + padding: 0; + box-sizing: border-box; +} +body { + display: flex; + align-items: center; + justify-content: center; + min-height: 100vh; +} + +.clock { + display: flex; + align-items: center; + justify-content: center; + width: 300px; + height: 300px; + background: url(Clock-No-Hands-PNG-Clipart.png); + background-size: cover; +} + +.clock::before { + height: 10px; + width: 10px; + border-radius: 50%; + background: black; + position: absolute; + z-index: 1000; + content: ""; +} + +.hr, +.mn, +.sc { + display: flex; + /* align-items: center; */ + justify-content: center; +} +.hr::before { + height: 80px; + width: 6px; + z-index: 10; + background: black; + content: ""; + position: absolute; + border-radius: 50%; + transform: rotateZ(180deg); + transform-origin: top center; +} +.mn::before { + height: 90px; + width: 3px; + z-index: 5; + background: black; + content: ""; + position: absolute; + border-radius: 50%; + transform: rotateZ(180deg); + transform-origin: top center; +} + +.sc::before { + height: 100px; + width: 2px; + z-index: 60; + background: red; + content: ""; + position: absolute; + border-radius: 50%; + transform: rotateZ(180deg); + transform-origin: top center; +} + +h1 { + padding: 4px 4px; + margin-bottom: 2rem; + font-family: "Segoe UI", Tahoma, Geneva, Verdana, sans-serif; +} + +.container { + width: 60vw; + display: flex; + justify-content: space-between; +} + +.form-control { + display: block; + width: 23rem; + font-size: 15px; + padding: 5px 15px; + border: 1px solid black; + border-radius: 10px; + outline: none; +} + +.btn-list { + margin: 2em 0em; +} + +.btn { + margin: 1rem; + font-size: 14px; + padding: 6px 6px; + border: 1px solid transparent; + background-color: #b7edff; + border-radius: 5px; + font-weight: 5000; + font-weight: 500; + cursor: pointer; +} +p { + font-family: "Segoe UI", Tahoma, Geneva, Verdana, sans-serif; + padding-top: 1rem; +}