From ed1375fcf82c21b545344b7465b1455d2812b1a9 Mon Sep 17 00:00:00 2001 From: SrijaVuppala295 Date: Sun, 10 Nov 2024 10:42:21 +0530 Subject: [PATCH 1/2] done --- challenges/medcss.html | 233 ++++++++++++++++------------------------- 1 file changed, 93 insertions(+), 140 deletions(-) diff --git a/challenges/medcss.html b/challenges/medcss.html index 424298833..d7c77fcbd 100644 --- a/challenges/medcss.html +++ b/challenges/medcss.html @@ -3,35 +3,47 @@ - CSS MEDIUM Quiz + CSS Medium Quiz
-

CSS MEDIUM CHALLENGE

+

CSS Medium Challenge

+
Question 1 of 10
+ + From 19ac72e87f2750a95dfc463f62d6440c3ed59698 Mon Sep 17 00:00:00 2001 From: SrijaVuppala295 Date: Sun, 10 Nov 2024 10:48:58 +0530 Subject: [PATCH 2/2] done --- challenges/medcss.html | 175 +++++++++++++++++++++++++++-------------- 1 file changed, 115 insertions(+), 60 deletions(-) diff --git a/challenges/medcss.html b/challenges/medcss.html index d7c77fcbd..aad2d27e0 100644 --- a/challenges/medcss.html +++ b/challenges/medcss.html @@ -8,20 +8,20 @@ body { font-family: Arial, sans-serif; background-color: #0a153e; + color: #f0f0f0; margin: 0; padding: 20px; display: flex; align-items: center; justify-content: center; height: 100vh; - color: #f0f0f0; } .quiz-container { background-color: #ffffff; padding: 30px; - border-radius: 10px; - box-shadow: 0 4px 10px rgba(0, 0, 0, 0.25); + border-radius: 12px; + box-shadow: 0 4px 12px rgba(0, 0, 0, 0.2); max-width: 600px; width: 100%; } @@ -30,14 +30,7 @@ text-align: center; color: #333; font-size: 1.8em; - margin-bottom: 15px; - } - - .progress { - text-align: center; - margin: 10px 0; - font-size: 0.9em; - color: #666; + margin-bottom: 20px; } .question { @@ -52,20 +45,17 @@ } .option { - background-color: #e9f3ff; - padding: 15px; + background-color: #1e1e1e; + padding: 12px; border-radius: 6px; margin: 8px 0; cursor: pointer; transition: background-color 0.3s, transform 0.2s; - display: flex; - align-items: center; - justify-content: space-between; border: 2px solid transparent; } .option:hover { - background-color: #d4e8ff; + background-color: #e76705; transform: scale(1.02); } @@ -75,12 +65,6 @@ color: #007bff; } - .option.selected::after { - content: '✔'; - color: #007bff; - font-size: 1.2em; - } - button { background-color: #007bff; color: #fff; @@ -88,11 +72,10 @@ padding: 12px; border-radius: 6px; cursor: pointer; - display: block; width: 100%; - margin-top: 10px; font-size: 1em; transition: background-color 0.3s; + margin-top: 10px; } button:hover { @@ -111,44 +94,123 @@ overflow-x: auto; font-family: monospace; } - - .modal { - display: none; - position: fixed; - top: 50%; - left: 50%; - transform: translate(-50%, -50%); - background-color: #fff; - padding: 20px; - border-radius: 8px; - box-shadow: 0 4px 10px rgba(0, 0, 0, 0.3); - text-align: center; - z-index: 10; - } - - .modal.show { - display: block; - }

CSS Medium Challenge

-
Question 1 of 10
- -