diff --git a/Pages/Quizes/index.html b/Pages/Quizes/index.html index 89d3b5364..3a71d3f85 100644 --- a/Pages/Quizes/index.html +++ b/Pages/Quizes/index.html @@ -161,6 +161,7 @@

Thermodynamics

+
Course
@@ -205,6 +206,20 @@

Respiration In Plants

+ +
+
+
Course
+

Biology

+
+
+
Test
+

Digestion and Absorption

+ +
+
diff --git a/Pages/Quizes/tests/button-10/assets/asset 1.png b/Pages/Quizes/tests/button-10/assets/asset 1.png new file mode 100644 index 000000000..3b146137e Binary files /dev/null and b/Pages/Quizes/tests/button-10/assets/asset 1.png differ diff --git a/Pages/Quizes/tests/button-10/assets/asset 41.png b/Pages/Quizes/tests/button-10/assets/asset 41.png new file mode 100644 index 000000000..6cde0f6b6 Binary files /dev/null and b/Pages/Quizes/tests/button-10/assets/asset 41.png differ diff --git a/Pages/Quizes/tests/button-10/assets/asset 42.svg b/Pages/Quizes/tests/button-10/assets/asset 42.svg new file mode 100644 index 000000000..3a87b9f08 --- /dev/null +++ b/Pages/Quizes/tests/button-10/assets/asset 42.svg @@ -0,0 +1,1037 @@ + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + diff --git a/Pages/Quizes/tests/button-10/img/Absorption of digestive products.png b/Pages/Quizes/tests/button-10/img/Absorption of digestive products.png new file mode 100644 index 000000000..3eed73559 Binary files /dev/null and b/Pages/Quizes/tests/button-10/img/Absorption of digestive products.png differ diff --git a/Pages/Quizes/tests/button-10/img/digestion of food.png b/Pages/Quizes/tests/button-10/img/digestion of food.png new file mode 100644 index 000000000..92ed4a583 Binary files /dev/null and b/Pages/Quizes/tests/button-10/img/digestion of food.png differ diff --git a/Pages/Quizes/tests/button-10/img/digestive system.png b/Pages/Quizes/tests/button-10/img/digestive system.png new file mode 100644 index 000000000..4c750f8e0 Binary files /dev/null and b/Pages/Quizes/tests/button-10/img/digestive system.png differ diff --git a/Pages/Quizes/tests/button-10/img/disorder of digestive system.png b/Pages/Quizes/tests/button-10/img/disorder of digestive system.png new file mode 100644 index 000000000..655d5ad9c Binary files /dev/null and b/Pages/Quizes/tests/button-10/img/disorder of digestive system.png differ diff --git a/Pages/Quizes/tests/button-10/index.html b/Pages/Quizes/tests/button-10/index.html new file mode 100644 index 000000000..321f59879 --- /dev/null +++ b/Pages/Quizes/tests/button-10/index.html @@ -0,0 +1,134 @@ + + + + + + + Virtuo Learn + + + + + + + + + +
+
+

Digestion and Absorption

+
+
+ + + +
+
+
+
+ +
+ +
+
+
+
+
+

Question is loading...

+ +
    +
  • + + +
  • +
  • + + +
  • +
  • + + +
  • +
  • + + +
  • + +
+
+ +
+
+
+ +
+ +
+
+ +
+ + + + + +
+ +
+ +
+ +
+ +
+
+ +
+
+ + + + + + + + + + diff --git a/Pages/Quizes/tests/button-10/media-queries.css b/Pages/Quizes/tests/button-10/media-queries.css new file mode 100644 index 000000000..1dfe6af04 --- /dev/null +++ b/Pages/Quizes/tests/button-10/media-queries.css @@ -0,0 +1,106 @@ +@media screen and (max-width: 1030px) { + + h3 { + font-size: 1.2rem; + } + + .main-nav { + overflow: initial; + } + + .hamburger{ + display: block; + } + + .hamburger.active .bar:nth-child(2){ + opacity: 0; + } + .hamburger.active .bar:nth-child(1){ + transform: translateY(8px) rotate(45deg); + } + .hamburger.active .bar:nth-child(3){ + transform: translateY(-8px) rotate(-45deg); + } + + .nav-menu{ + position: absolute; + top: -100%; + left: 0; + gap: 0; + flex-direction: column; + width: 100%; + text-align: center; + transition: 0.3s; + z-index: 1; + /* background-color: aqua; */ + /* max-height: 10vh; */ + margin: 0; + padding: 0; + + background: rgba(236, 235, 255, 0.2); + /* border-radius: 16px; */ + box-shadow: 0 4px 30px rgba(0, 0, 0, 0.1); + backdrop-filter: blur(3.3px); + -webkit-backdrop-filter: blur(3.3px); + border: 1px solid rgba(236, 235, 255, 0.3); + + } + .hover-link{ + margin: 16px 0; + } + .nav-menu.active{ + top: 13%; + } + + .course { + flex-direction: column; + height: 60vh; + } + .course-preview { + width: 70vw; + } + .course-info { + width: 100%; + height: 200%; + } + .card-btn { + bottom: 5vh; + right: 5vw; + } + /* Submit button */ + button { + margin-left: 16.2rem; + } + /* Options */ + .quiz-ul li { + width: 40rem; + } +} + +@media screen and (max-width: 479px) { + :root { + --padding-inline-section: 10px; + } + + h1 { + font-size: 2rem; + } + + h2 { + font-size: 1.5rem; + } + + h3 { + font-size: 1.5rem; + } + + p { + font-size: 1rem; + } + + .center{ + position: relative; + left: 0vw; + } + +} diff --git a/Pages/Quizes/tests/button-10/script.js b/Pages/Quizes/tests/button-10/script.js new file mode 100644 index 000000000..94abf3604 --- /dev/null +++ b/Pages/Quizes/tests/button-10/script.js @@ -0,0 +1,226 @@ +const quizData = [ + { + question: "Type of attachement of teeth in humans: ", + a: "Diphyodont", + b: "Heterodont", + c: "Thecodont", + d: "None", + correct: "c", + topic: "Digestive system", + difficulty: "Easy", + }, + { + question: "Vermiform appendix arises from ? ", + a: "Colon", + b: "Jejunum", + c: "Caecum", + d: "Ileum", + correct: "c", + topic: "Digestive system", + difficulty: "medium", + }, + { + question: "Which of the following are the causes of indigestion?", + a: "Anxiety", + b: "Food poisoning", + c: "Over eating", + d: "All of these", + correct: "d", + topic: "Disorder of digestive system", + difficulty: "Hard", + }, + { + question: "The optimum pH of pepsin is :", + a: "1.5 - 2.5", + b: "5.5 - 6.5", + c: "6.8 - 7.5", + d: "4.5 - 5.5", + correct: "a", + topic: "Digestion of food", + difficulty: "Medium", + }, + { + question: "which part of mammalian alimentary canal does not secrete any enzyme : ", + a: "Mouth", + b: "Oesophagus", + c: "Stomach", + d: "Duodenum", + correct: "b", + topic: "Digestive system", + difficulty: "Easy", + }, + { + question: "Pepsin converts protein into :", + a: "rennin", + b: "Proteoses and peptones", + c: "Amino acids", + d: "Lipase", + correct: "b", + topic: "Digestion of food", + difficulty: "Easy", + }, + { + question: "Kwashiorkar occurs due to: ", + a: "Protein and Calorie deficiency", + b: "Protein deficiency", + c: "Calcium deficiency", + d: "Fat deficiency", + correct: "b", + topic: "Disorder of digestive system", + difficulty: "Medium", + }, + { + question: "The common bile duct in human is formed by the joining of : ", + a: "Pancreatic duct and bile duct", + b: "Cystic duct and hepatic duct", + c: "Cystic duct and pancreatic duct", + d: "Hepatic duct and pancreatic duct", + correct: "b", + topic: "Digestive System", + difficulty: "Hard", + }, + { + question: "Pepsin acts in :", + a: "Basic medium", + b: "Acidic medium", + c: "Neutral medium", + d: "All types of medium", + correct: "b", + topic: "Digestion of food", + difficulty: "Medium", + }, + { + question: "Carrier ions like Na+ facilitate the absorption of substances like:", + a: "Amino acids and glucose", + b: "Glucose and fatty acids", + c: "Fatty acid and glycerol", + d: "Fructose and some amino acids", + correct: "a", + topic: "Absorption of digestive products", + difficulty: "Hard", + }, + ]; + + const quiz = document.getElementById("quiz"); + const answerElements = document.querySelectorAll(".answer"); + const questionElement = document.getElementById("question"); + const a_text = document.getElementById("a_text"); + const b_text = document.getElementById("b_text"); + const c_text = document.getElementById("c_text"); + const d_text = document.getElementById("d_text"); + const submitButton = document.getElementById("submit"); + const difficulty = document.getElementById("difficulty"); + const quizcount = document.getElementById("quizcount"); + const prev_score= document.getElementById("max-score"); + const max_wrapper= document.getElementsByClassName("max-wrapper")[0] + + + let currentQuiz = 0; + let score = 0; + const weak_topics=[]; + const loadScore=()=>{ + const score= localStorage.getItem('btn-10-max'); + if(score){ + prev_score.innerHTML=`Max score
${score}`; + }else{ + max_wrapper.style.display='none' + } + + } + const storeMax=(score)=>{ + const maxscore = localStorage.getItem('btn-10-max'); + if (score>maxscore){ + localStorage.setItem('btn-10-max',score) + } + } + + const deselectAnswers = () => { + answerElements.forEach((answer) => (answer.checked = false)); + }; + + const getSelected = () => { + let answer; + answerElements.forEach((answerElement) => { + if (answerElement.checked) answer = answerElement.id; + }); + return answer; + }; + + + const loadQuiz = () => { + deselectAnswers(); + const currentQuizData = quizData[currentQuiz]; + questionElement.innerText = currentQuizData.question; + a_text.innerText = currentQuizData.a; + b_text.innerText = currentQuizData.b; + c_text.innerText = currentQuizData.c; + d_text.innerText = currentQuizData.d; + difficulty.innerText = currentQuizData.difficulty; + quizcount.innerText = currentQuiz+1+"/"+quizData.length; + }; + + loadQuiz(); + loadScore(); + + submitButton.addEventListener("click", () => { + const answer = getSelected(); + if (answer) { + if (answer === quizData[currentQuiz].correct) { + score++; + currentQuiz++; + } + else{ + weak_topics.push(quizData[currentQuiz].topic); + currentQuiz++; + } + if (currentQuiz < quizData.length) loadQuiz(); + else { + quiz.innerHTML = ` +

You answered ${score}/${quizData.length} questions correctly

+ + ` + storeMax(score); + loadScore(); + var temp; + for (i = 0; i < weak_topics.length; i++) { + if(i===0){ + // this is for recommended videos heading + temp = document.createElement('h3'); + temp.className = 'Recommended-Videos-Title'; + temp.innerHTML = "Recommended Videos "; + document.getElementsByClassName('recommendations')[0].appendChild(temp); + } + // this is for recommended videos + var image = document.createElement("img"); + image.setAttribute("src", "img/" + weak_topics[i] + ".png"); + temp.className = 'thumbnail'; + document.querySelector(".recommendation-thumbnails").appendChild(image); + } + + for (i = 0; i < weak_topics.length; i++) { + if(i===0){ + temp = document.createElement('div'); + temp.className = 'heading'; + temp.innerHTML = "Weak Topics:" ; + document.getElementsByClassName('weak')[0].appendChild(temp); + } + temp = document.createElement('div'); + temp.className = 'topic'; + temp.innerHTML = weak_topics[i]; + document.getElementsByClassName('weak')[0].appendChild(temp); + } + } + } + if(currentQuiz>=quizData.length){ + let link = document.createElement("a"); + link.href="/Pages/Quizes/tests/button-10/solution.html"; + + temp = document.createElement('button'); + + + temp.className = 'solution-button'; + temp.innerHTML = "Solutions" ; + link.appendChild(temp); + document.getElementsByClassName('solution-div')[0].appendChild(link); + } + }); \ No newline at end of file diff --git a/Pages/Quizes/tests/button-10/solution.html b/Pages/Quizes/tests/button-10/solution.html new file mode 100644 index 000000000..0001f29b8 --- /dev/null +++ b/Pages/Quizes/tests/button-10/solution.html @@ -0,0 +1,137 @@ + + + + + + + Virtuo Learn + + + + + + + + + +
+
+

Digestion and Absorption

+
+
+ + + +
+ +
+ +
+
+

Question is loading...

+ +
    +
  • + + +
  • +
  • + + +
  • +
  • + + +
  • +
  • + + +
  • +
    +

    + + Correct Answer +

    +

    Answer

    +
    +
    +

    Explanation

    +

    Explanation goes here...

    +
    + +
+
+ +
+
+
+ +
+ +
+
+ +
+ + +
+ +
+ + +
+ +
+ +
+
+ +
+
+ + + + + + + + + + diff --git a/Pages/Quizes/tests/button-10/solution.js b/Pages/Quizes/tests/button-10/solution.js new file mode 100644 index 000000000..8327355b2 --- /dev/null +++ b/Pages/Quizes/tests/button-10/solution.js @@ -0,0 +1,172 @@ +const quizData = [ + { + question: "Type of attachement of teeth in humans: ", + a: "Diphyodont", + b: "Heterodont", + c: "Thecodont", + d: "None", + correct: "c", + explanation:"Thecodont dentition refers to a specific arrangement of teeth where the base of each tooth is completely enclosed in a deep socket of bone. This type of dentition is observed in crocodilians, dinosaurs, and mammals.", + topic: "Digestive system", + difficulty: "Easy", + }, + { + question: "Vermiform appendix arises from ? ", + a: "Colon", + b: "Jejunum", + c: "Caecum", + d: "Ileum", + correct: "c", + explanation:"The vermiform appendix arises from the cecum, which is the first part of the large intestine. It is attached dorsomedially to the end of the cecum. Unlike the cecum and the rest of the colon, the appendix lacks certain features such as taeniae, haustra, semilunar folds, and appendices epiploicae. ", + topic: "Digestive system", + difficulty: "medium", + }, + { + question: "Which of the following are the causes of indigestion?", + a: "Anxiety", + b: "Food poisoning", + c: "Over eating", + d: "All of these", + correct: "d", + explanation:"Indigestion, also known as dyspepsia, is discomfort in the upper abdomen. It can be related to various factors: Overeating ,Fatty or Spicy Foods,Excessive Caffeine, Alcohol, Chocolate, or Carbonated Beverages,anxiety,smoking ,etc.", + topic: "Disorder of digestive system", + difficulty: "Hard", + }, + { + question: "The optimum pH of pepsin is :", + a: "1.5 - 2.5", + b: "5.5 - 6.5", + c: "6.8 - 7.5", + d: "4.5 - 5.5", + correct: "a", + explanation:"Pepsin's primary function is to break down proteins into smaller peptides during the process of digestion. Pepsin works most effectively in an acidic environment, specifically at a pH of approximately 1.8. This low pH is necessary for its optimal activity.", + topic: "Digestion of food", + difficulty: "Medium", + }, + { + question: "which part of mammalian alimentary canal does not secrete any enzyme : ", + a: "Mouth", + b: "Oesophagus", + c: "Stomach", + d: "Duodenum", + correct: "b", + explanation:"The part of the mammalian alimentary canal that does not secrete any enzyme is the oesophagus. It simply passes the food from the mouth to the stomach through peristalsis.", + topic: "Digestive system", + difficulty: "Easy", + }, + { + question: "Pepsin converts protein into :", + a: "rennin", + b: "Proteoses and peptones", + c: "Amino acids", + d: "Lipase", + correct: "b", + explanation:"Pepsin is an enzyme produced in the stomach. Its primary function is to break down proteins into smaller peptides during the process of digestion. Pepsin works most effectively in an acidic environment, specifically at a pH of approximately 1.8.", + topic: "Digestion of food", + difficulty: "Easy", + }, + { + question: "Kwashiorkar occurs due to: ", + a: "Protein and Calorie deficiency", + b: "Protein deficiency", + c: "Calcium deficiency", + d: "Fat deficiency", + correct: "b", + explanation:"Kwashiorkor is a severe form of malnutrition that primarily affects young children. It occurs due to protein deficiency in the diet. Key features of kwashiorkor include:Edema (Swelling),skin roughness,mental and physical retardation ,etc.", + topic: "Disorder of digestive system", + difficulty: "Medium", + }, + { + question: "The common bile duct in human is formed by the joining of : ", + a: "Pancreatic duct and bile duct", + b: "Cystic duct and hepatic duct", + c: "Cystic duct and pancreatic duct", + d: "Hepatic duct and pancreatic duct", + correct: "b", + explanation:"The common bile duct is formed by the union of the common hepatic duct and the cystic duct. It carries bile from the gallbladder and empties it into the upper part of the small intestine (the duodenum)", + topic: "Digestive System", + difficulty: "Hard", + }, + { + question: "Pepsin acts in :", + a: "Basic medium", + b: "Acidic medium", + c: "Neutral medium", + d: "All types of medium", + correct: "b", + explanation:"Pepsin is most active in acidic environments with a pH range of 1.5 to 2.5. In the human stomach, pepsinogen (its inactive form) is converted to active pepsin when mixed with hydrochloric acid (HCl). The digestive potency of pepsin is highest at the acidic pH found in normal gastric juice", + topic: "Digestion of food", + difficulty: "Medium", + }, + { + question: "Carrier ions like Na+ facilitate the absorption of substances like:", + a: "Amino acids and glucose", + b: "Glucose and fatty acids", + c: "Fatty acid and glycerol", + d: "Fructose and some amino acids", + correct: "a", + explanation:"Carrier ions like Na+ facilitate the absorption of glucose and amino acids in the intestinal epithelium. The Na/Glucose cotransporter (SGLT1) enables glucose-coupled sodium absorption, while amino acid-coupled sodium absorption occurs through epithelial cells with Na/amino acid cotransporters.", + topic: "Absorption of digestive products", + difficulty: "Hard", + }, + ]; + + const quiz = document.getElementById("quiz"); + const answerElements = document.querySelectorAll(".answer"); + const questionElement = document.getElementById("question"); + const a_text = document.getElementById("a_text"); + const b_text = document.getElementById("b_text"); + const c_text = document.getElementById("c_text"); + const d_text = document.getElementById("d_text"); + const submitButton = document.getElementById("submit"); + const difficulty = document.getElementById("difficulty"); + + let currentQuiz = 0; + let score = 0; + const weak_topics=[]; + + const deselectAnswers = () => { + answerElements.forEach((answer) => (answer.checked = false)); + }; + + const getSelected = () => { + let answer; + answerElements.forEach((answerElement) => { + if (answerElement.checked) answer = answerElement.id; + }); + return answer; + }; + + const explanationElement = document.getElementById("explanation"); + + const loadQuiz = () => { + deselectAnswers(); + const currentQuizData = quizData[currentQuiz]; + questionElement.innerText = currentQuizData.question; + a_text.innerText = currentQuizData.a; + b_text.innerText = currentQuizData.b; + c_text.innerText = currentQuizData.c; + d_text.innerText = currentQuizData.d; + difficulty.innerText = currentQuizData.difficulty; + + // Update explanation text + explanationElement.innerText = currentQuizData.explanation; + }; + + loadQuiz(); + + document.getElementById("answer").innerHTML = quizData[0].correct; + + let next_Button = document.getElementById("next"); + next_Button.addEventListener("click", () => { + if (currentQuiz == 9) { + next_Button.disabled = true; + } else { + currentQuiz++; + console.log(currentQuiz); + + next_Button.disabled = false; + document.getElementById("answer").innerHTML = quizData[currentQuiz].correct; + loadQuiz(); + } + }); \ No newline at end of file diff --git a/Pages/Quizes/tests/button-10/style.css b/Pages/Quizes/tests/button-10/style.css new file mode 100644 index 000000000..451190969 --- /dev/null +++ b/Pages/Quizes/tests/button-10/style.css @@ -0,0 +1,403 @@ +@import url('https://fonts.googleapis.com/css2?family=Poppins:wght@400;500&family=Roboto:wght@400;700&display=swap'); + +/* resets */ + + + +* { + margin: 0; + padding: 0; + box-sizing: border-box; + font-family: 'Poppins', sans-serif; + box-sizing: border-box; +} + +:root { + --primary-text-color: #183b56; + --secondary-text-color: #577592; + --accent-color: #2294ed; + --accent-color-dark: #1d69a3; + --padding-inline-section: 20px; +} + +body { + font-family: 'Poppins', sans-serif; + color: var(--primary-text-color); + overflow-x: hidden; +} + +html{ + scroll-behavior: smooth; +} + +::-webkit-scrollbar{ + width: 12px; +} + +::-webkit-scrollbar-track{ + border-radius: 5px; + box-shadow: inset 0 0 10px rgba(0,0,0,0.25); +} + +::-webkit-scrollbar-thumb{ + border-radius: 5px; + background: linear-gradient(to top, #2294ed , #1d69a3); +} + +h1 { + font-size: 3rem; +} + +h2 { + font-size: 2rem; +} + +h3 { + font-size: 1.5rem; +} + +p { + font-family: 'Roboto', sans-serif; + font-size: 1.25rem; + color: var(--secondary-text-color); + line-height: 1.8rem; +} + +a { + text-decoration: none; + display: inline-block; +} + +ul { + list-style: none; +} + +/* utility classes */ + +.small-bold-text { + font-size: 1rem; + font-weight: 700; +} + +.container { + max-width: 1180px; + margin-inline: auto; + padding-inline: var(--padding-inline-section); + overflow: hidden; +} + +.flex { + display: flex; + align-items: center; +} + +.hover-link { + color: var(--primary-text-color); + transition: 0.2s ease-out; +} + +.hover-link:hover { + color: var(--accent-color); +} + +.primary-button { + background-color: var(--accent-color); + border-radius: 6px; + font-weight: 700; + color: white !important; + padding: 12px 24px; + box-shadow: 0 0 2px var(--secondary-text-color); + transition: 0.2s ease-out; + text-align: center; +} + +.primary-button:hover { + background-color: var(--accent-color-dark); +} + +.secondary-button { + border: 0.5px solid var(--secondary-text-color); + border-radius: 6px; + font-weight: 700; + color: var(--primary-text-color) !important; + padding: 12px 24px; + transition: 0.2s ease-out; +} + +.secondary-button:hover { + border-color: var(--accent-color); + color: var(--accent-color) !important; +} + +/* nav bar */ + +.main-nav { + margin-top: 20px; + justify-content: space-between; +} + +.company-logo img { + width: 200px; +} + +.nav-links { + flex-basis: 730px; +} + +.nav-menu{ + display: flex; + align-items: center; +} + +.nav-links ul { + justify-content: end; + gap: 40px; +} + +.nav-toggle { + display: none; +} + +.hamburger{ + display: none; + cursor: pointer; +} + +.bar{ + display: block; + width: 25px; + height: 3px; + margin: 5px auto; + -webkit-transition: all 0.3s ease-in-out; + transition: all 0.3s ease-in-out; + background-color: black; +} + +/* header section */ +.header h1{ + text-align: center; + margin-top: 4vh; +} + +.header img{ + display: block; + margin: 0 auto; + width: 35vw; + } + +/* quiz section */ + + +.quiz-wrapper{ + display: flex; + flex-direction: column; + align-items: center; + justify-content: center; + margin-top: 10vh; + } + + .quiz-container { + background-color: #F0F1FF; + border-radius: 10px; + box-shadow: 0 0 10px 2px rgba(100, 100, 100, 0.1); + width: 1000px; + max-width: 95vw; + overflow: hidden; + } + + .quiz-header { + padding: 1rem; + } + + h2 { + padding: 1rem; + text-align: left; + margin: 0; + } + + .quiz-ul { + list-style-type: none; + padding: 0; + } + + .quiz-ul li { + font-size: 1.2rem; + margin: 1rem 0; + width: 60rem; + height: 3.7rem; + border-radius: 1rem; + padding: 1rem; + background-color: rgb(214, 219, 248); + } + + .quiz-ul li:hover{ + background-color: rgb(179, 188, 255); + + } + + .quiz-ul li label { + cursor: pointer; + } + + button { + background-color: #282d78 ; + color: #fff; + border-radius: 15px; + display: block; + width: 25%; + cursor: pointer; + font-size: 1.1rem; + font-family: inherit; + padding: 1rem; + margin-left: 21.8rem; + margin-top: 3rem; + } + + button:hover { + background-color: #2d4ed1; + } + + button:focus { + outline: none; + background-color: #5e3370; + } + + .weak{ + display: flex; + flex-wrap: wrap; + margin: 0 auto; + } + + .topic{ + background: rgba(176, 189, 255, 0.22); + border-radius: 16px; + box-shadow: 0 4px 30px rgba(0, 0, 0, 0.1); + backdrop-filter: blur(3.1px); + -webkit-backdrop-filter: blur(3.1px); + border: 1px solid rgba(176, 189, 255, 0.35); + margin-top: 10px; + margin-left: 10px; + padding-left: 8px; + padding-right: 8px; + } + + .heading{ + margin-top: 10px; + margin-left: 10px; + } + + .result{ + display: flex; + } + + #difficulty{ + text-align: center; + font-weight: bold; + } + + .solution-div{ + max-width: 10vw; + min-width: 80px; + margin: 0 auto; + margin-top: 4vh; + } + + .solution-button { + display: flex; + flex-direction: column; + align-items: center; + padding: 6px 14px; + font-family: -apple-system, BlinkMacSystemFont, 'Roboto', sans-serif; + border-radius: 6px; + border: none; + + color: #fff; + background: linear-gradient(180deg, #4B91F7 0%, #367AF6 100%); + background-origin: border-box; + box-shadow: 0px 0.5px 1.5px rgba(54, 122, 246, 0.25), inset 0px 0.8px 0px -0.25px rgba(255, 255, 255, 0.2); + user-select: none; + -webkit-user-select: none; + touch-action: manipulation; + } + + .solution-button:focus { + box-shadow: inset 0px 0.8px 0px -0.25px rgba(255, 255, 255, 0.2), 0px 0.5px 1.5px rgba(54, 122, 246, 0.25), 0px 0px 0px 3.5px rgba(58, 108, 217, 0.5); + outline: 0; + } + +/* recommendations */ + +.Recommended-Videos-Title{ + position: relative; + left: 6vw; + margin-top: 2vh; +} + +.recommendation-thumbnails{ + display: flex; + flex-wrap: wrap; +} + +.recommendation-thumbnails img{ + width: 420px; + height: auto; +} + +.recommendations h3{ + margin-left: 1.5vw; +} +.max-wrapper{ + background-color:#F0F1FF; + border-radius: 50%; + width:10rem; + height:10rem; + display: flex; + justify-content:center; + align-items: center; + border : 7px solid #242969; + margin-bottom: 6rem; + padding: 5px; + font-size: 1.5rem; +} +#max-score{ + font-family: 'Poppins', sans-serif; + font-weight: bold; + text-align: center; +} +/* footer */ + +footer{ + + bottom: 0; + left: 0; + right: 0; + background: #111; + height: auto; + width: 100vw; + padding-top: 40px; + background-color: #ebf2fa; + margin-top: 5vh; +} + +.footer-content{ + display: flex; + align-items: center; + justify-content: center; + flex-direction: column; + text-align: center; +} + +.footer-logo{ + font-size: 2.1rem; + font-weight: 500; + text-transform: capitalize; + line-height: 3rem; +} + +.footer-content p{ + max-width: 500px; + margin: 10px auto; + line-height: 28px; + font-size: 14px; + color: #cacdd2; +} diff --git a/Pages/Quizes/tests/button-6/script.js b/Pages/Quizes/tests/button-6/script.js index 340ec826b..9d341d854 100644 --- a/Pages/Quizes/tests/button-6/script.js +++ b/Pages/Quizes/tests/button-6/script.js @@ -229,4 +229,4 @@ const loadScore=()=>{ document.getElementsByClassName('solution-div')[0].appendChild(link); } - }); \ No newline at end of file + }) \ No newline at end of file