#476 & refactoring

sadanandpai · Jul 24, 2024 · 3cf09b6 · 3cf09b6
1 parent 753b531
commit 3cf09b6
Show file tree

Hide file tree

Showing 6 changed files with 39 additions and 41 deletions.
diff --git a/.../challenges/quiz-app-with-timer/index.css → ...cript/src/challenges/timer-quiz/index.css b/.../challenges/quiz-app-with-timer/index.css → ...cript/src/challenges/timer-quiz/index.css
@@ -1,44 +1,41 @@
-
 body {
- background-color: #0a69ed;
+ background-color: #0a69ed50;
 }
+
 .start-screen,
 .score-container {
- position: absolute;
- top: 0;
- width: 100%;
- height: 100%;
  display: flex;
  flex-direction: column;
  align-items: center;
  justify-content: center;
 }
+
 button {
  border: none;
  outline: none;
  cursor: pointer;
 }
+
 #start-button,
 #restart {
  font-size: 1.3em;
  padding: 0.5em 1.8em;
  border-radius: 0.2em;
 }
+
 #restart {
  margin-top: 0.9em;
 }
+
 #display-container {
  background-color: #ffffff;
  padding: 3.1em 1.8em;
  width: 80%;
  max-width: 37.5em;
  margin: 0 auto;
- position: absolute;
- transform: translate(-50%, -50%);
- top: 50%;
- left: 50%;
  border-radius: 0.6em;
 }
+
 .header {
  margin-bottom: 1.8em;
  display: flex;
@@ -47,6 +44,7 @@ button {
  padding-bottom: 0.6em;
  border-bottom: 0.1em solid #c0bfd2;
 }
+
 .timer-div {
  background-color: #e1f5fe;
  width: 7.5em;
@@ -56,10 +54,12 @@ button {
  justify-content: space-between;
  padding: 0.7em 1.8em;
 }
+
 .question {
  margin-bottom: 1.25em;
  font-weight: 600;
 }
+
 .option-div {
  font-size: 0.9em;
  width: 100%;
@@ -71,32 +71,39 @@ button {
  border: 1px solid #c0bfd2;
  border-radius: 0.3em;
 }
+
 .option-div:disabled {
  color: #000000;
  cursor: not-allowed;
 }
+
 #next-button {
+ display: block;
  font-size: 1em;
  margin-top: 1.5em;
+ margin-left: auto;
  background-color: #0a69ed;
  color: #ffffff;
  padding: 0.7em 1.8em;
  border-radius: 0.3em;
- float: right;
 }
+
 .hide {
  display: none;
 }
+
 .incorrect {
  background-color: #ffdde0;
  color: #d32f2f;
  border-color: #d32f2f;
 }
+
 .correct {
  background-color: #e7f6d5;
  color: #689f38;
  border-color: #689f38;
 }
+
 #user-score {
  font-size: 1.5em;
  color: #ffffff;

diff --git a/...challenges/quiz-app-with-timer/index.html → ...ript/src/challenges/timer-quiz/index.html b/...challenges/quiz-app-with-timer/index.html → ...ript/src/challenges/timer-quiz/index.html
@@ -1,4 +1,4 @@
-<!DOCTYPE html>
+<!doctype html>
 <html lang="en">
  <head>
  <script src="../../helpers/header.js" type="module"></script>

diff --git a/...c/challenges/quiz-app-with-timer/index.js → ...script/src/challenges/timer-quiz/index.js b/...c/challenges/quiz-app-with-timer/index.js → ...script/src/challenges/timer-quiz/index.js
diff --git a/...lenges/quiz-app-with-timer/questions.json → .../src/challenges/timer-quiz/questions.json b/...lenges/quiz-app-with-timer/questions.json → .../src/challenges/timer-quiz/questions.json
diff --git a/apps/javascript/src/challenges/weather-app/index.js b/apps/javascript/src/challenges/weather-app/index.js
@@ -1,32 +1,23 @@
-const clear = new Image();
-clear.src = './images/clear.png';
-const clouds = new Image();
-clouds.src = './images/clouds.png';
-const drizzle = new Image();
-drizzle.src = './images/drizzle.png';
-const haze = new Image();
-haze.src = './images/haze.png';
-const humidity = new Image();
-humidity.src = './images/humidity.png';
-const mist = new Image();
-mist.src = './images/mist.png';
-const rain = new Image();
-rain.src = './images/rain.png';
-const snow = new Image();
-snow.src = './images/snow.png';
-const wind = new Image();
-wind.src = './images/wind.png';
+import clear from './images/clear.png';
+import clouds from './images/clouds.png';
+import drizzle from './images/drizzle.png';
+import haze from './images/haze.png';
+import humidity from './images/humidity.png';
+import mist from './images/mist.png';
+import rain from './images/rain.png';
+import snow from './images/snow.png';
+import wind from './images/wind.png';
 
 const weatherIconsMap = new Map([
- ['clear', clear.src],
- ['clouds', clouds.src],
- ['drizzle', drizzle.src],
- ['haze', haze.src],
- ['humidity', humidity.src],
- ['mist', mist.src],
- ['rain', rain.src],
- ['snow', snow.src],
- ['wind', wind.src],
+ ['clear', clear],
+ ['clouds', clouds],
+ ['drizzle', drizzle],
+ ['haze', haze],
+ ['humidity', humidity],
+ ['mist', mist],
+ ['rain', rain],
+ ['snow', snow],
+ ['wind', wind],
 ]);
 
 // API TO BE USED FOR THE WEATHER DETAILS

diff --git a/shared/data/content/js-challenges.ts b/shared/data/content/js-challenges.ts
@@ -543,10 +543,10 @@ const challenges: Map<string, IChallenge> = new Map([
  },
  ],
  [
- 'quiz-app-with-timer',
+ 'timer-quiz',
  {
  title: 'Timer Quiz',
- link: 'quiz-app-with-timer/',
+ link: 'timer-quiz/',
  difficulty: EDifficulty.Medium,
  developer: 'Vivek-GuptaXCode',
  tags: [],