<!-- wp:html --> <!DOCTYPE html> <html lang="hi"> <head> <meta charset="UTF-8" /> <meta name="viewport" content="width=device-width, initial-scale=1.0"/> <title>MCQ Quiz</title> <style> /* Basic CSS resets */ * { margin: 0; padding: 0; box-sizing: border-box; } body { font-family: Arial, sans-serif; background-color: #f1f8e9; color: #33691e; } .content-container { background-color: #dcedc8; padding: 5px; border-radius: 5px; max-width: auto; margin: 20px auto; box-shadow: 0 6px 12px rgba(0, 0, 0, 0.1); position: relative; } .header { background-color: #7cb342; color: #ffffff; text-align: center; padding: 20px; border-radius: 10px; margin-bottom: 20px; box-shadow: 0 4px 8px rgba(0, 0, 0, 0.15); position: relative; } .header h1 { margin: 0; font-size: 28px; } /* Hamburger Menu Icon */ .hamburger { position: absolute; top: 8px; left: 8px; z-index: 1000; width: 20px; height: 15px; display: flex; flex-direction: column; justify-content: space-between; cursor: pointer; } .hamburger-line { height: 3px; background-color: #fff; border-radius: 2px; } /* Sidebar (Question Nav) */ #questionNavOverlay { position: fixed; top: 0; left: -250px; /* hidden by default */ width: 250px; height: 100%; background-color: #fff; transition: left 0.3s ease-in-out; z-index: 2000; box-shadow: 2px 0 6px rgba(0,0,0,0.3); padding: 20px; overflow-y: auto; } #questionNavOverlay.show { left: 0; /* slide in */ } #questionNavTitle { margin-bottom: 10px; font-weight: bold; font-size: 1.1rem; } .question-nav { display: flex; flex-wrap: wrap; gap: 5px; } .circle-number { width: 30px; height: 30px; border-radius: 50%; background-color: #ccc; color: #000; display: flex; justify-content: center; align-items: center; cursor: pointer; user-select: none; /* Prevent text selection */ transition: background-color 0.2s; } .circle-number:hover { background-color: #aaa; } .circle-number.active { background-color: #4CAF50; color: #fff; } /* Quiz Container */ .quiz-container { background-color: #fff; border-radius: 10px; padding: 5px; box-shadow: 0 4px 8px rgba(0, 0, 0, 0.1); max-width: auto; width: 100%; margin: 0 auto; text-align: center; position: relative; } .question-counter { font-weight: bold; padding: 5px 10px; border-radius: 5px; background-color: #d9edf7; position: absolute; top: 10px; left: 10px; } /* Timer display */ .timer { font-weight: bold; padding: 5px 10px; border-radius: 5px; background-color: #ffcccb; position: absolute; top: 10px; right: 10px; } .question { font-size: 1.2rem; margin-top: 40px; margin-bottom: 20px; text-align: left; } .choices { display: flex; flex-direction: column; gap: 10px; } .choice { padding: 10px; background-color: #f0f0f0; border: 1px solid #ddd; border-radius: 5px; cursor: pointer; transition: background-color 0.3s, box-shadow 0.3s; } .choice:hover { background-color: #e0e0e0; box-shadow: 0 4px 6px rgba(0, 0, 0, 0.1); } .choice.selected { background-color: #28a745; /* More vivid green */ color: #fff; } .choice.correct { background-color: #28a745; /* More vivid green */ border-color: #28a745; color: #fff; } .choice.incorrect { background-color: #dc3545; /* More vivid red */ border-color: #dc3545; color: #fff; } .choice.disabled { cursor: not-allowed; pointer-events: none; opacity: 0.6; } .explanation { margin-top: 20px; text-align: left; background-color: #e7f3fe; padding: 15px; border-left: 5px solid #2196F3; border-radius: 5px; } .buttons { display: flex; justify-content: center; gap: 10px; margin-top: 20px; flex-wrap: wrap; } .btn { flex: 1 1 auto; padding: 8px 12px; background-color: #4CAF50; color: white; border: none; border-radius: 5px; cursor: pointer; font-size: 0.9rem; text-align: center; min-width: 100px; max-width: 150px; transition: none; } .btn.disabled { background-color: #cccccc; cursor: not-allowed; } .hidden { display: none; } /* Result Section */ #resultContent { text-align: center; margin-top: 20px; } .congrats { font-size: 1.5rem; color: #4CAF50; } .sad { font-size: 1.5rem; color: #d32f2f; } /* Popup Message (Optional) */ #popupMessage { position: fixed; top: 20px; left: 50%; transform: translateX(-50%); color: white; padding: 10px 20px; border-radius: 5px; font-size: 1rem; z-index: 5000; display: none; } #popupMessage.show { display: block; } #popupMessage.correct { background-color: #28a745; } #popupMessage.incorrect { background-color: #dc3545; } </style> </head> <body> <div class="content-container"> <div class="header"> <!-- Hamburger menu button --> <div class="hamburger" id="hamburgerBtn"> <div class="hamburger-line"></div> <div class="hamburger-line"></div> <div class="hamburger-line"></div> </div> <h1 style="color: #ffffff;">MCQs Quiz</h1> </div> <!-- Sidebar (Question Nav) --> <div id="questionNavOverlay"> <div id="questionNavTitle">Questions</div> <div class="question-nav" id="questionNav"></div> </div> <!-- Quiz Container --> <div class="quiz-container" id="quizContent"> <div class="question-counter" id="questionCounter">1/3</div> <!-- Timer display here --> <div class="timer" id="timer">Time: 00:00</div> <div class="question" id="question">Loading question...</div> <div class="choices" id="choices"></div> <!-- Explanation and feedback --> <div class="explanation hidden" id="explanation"></div> <!-- Buttons for navigation and submission --> <div class="buttons"> <button class="btn" id="prevButton">Previous</button> <button class="btn" id="submitAnswerButton">Submit Answer</button> <button class="btn hidden" id="nextButton">Next</button> </div> </div> <!-- Result Section --> <div id="resultContent" class="hidden"> <h2>Quiz Completed</h2> <div id="resultMessage"></div> <p id="scoreMessage"></p> </div> </div> <!-- Optional Popup Message --> <div id="popupMessage" class="hidden"></div> <script> /***** JavaScript Code *****/ // Quiz data (sample) const quizData = [ { "question": "भारतीय संविधान को विश्व का सबसे लंबा लिखित संविधान (Longest Written Constitution) क्यों कहा जाता है?", "options": [ "क्योंकि इसमें सैकड़ों खंड (Sections) जोड़े गए", "क्योंकि इसमें 395 अनुच्छेद (Articles) और 8 अनुसूचियाँ (Schedules) मूल रूप से सम्मिलित थीं", "क्योंकि यह एक ही भाषा में लिखा गया है", "क्योंकि यह अन्य सभी संविधानों से पुराना है" ], "correct": 1, "explanation": "भारतीय संविधान मूलतः 395 अनुच्छेद, 22 भाग, और 8 अनुसूचियों के साथ लागू हुआ था। बाद के संशोधनों के चलते यह और भी विस्तृत हो गया, जिससे यह विश्व का सबसे बड़ा लिखित संविधान माना जाता है।" }, { "question": "भारतीय संविधान में 'मिश्रित सरकार (Mixed Government)' से क्या आशय है?", "options": [ "एकसाथ राजशाही (Monarchy) और गणतंत्र (Republic) का मिश्रण", "संघात्मक (Federal) और एकात्मक (Unitary) तत्त्वों का मिश्रण", "लोकतंत्र (Democracy) और तानाशाही (Dictatorship) का मिश्रण", "सांप्रदायिक (Communal) और धर्मनिरपेक्ष (Secular) तत्त्वों का मिश्रण" ], "correct": 1, "explanation": "भारतीय संविधान में संघीय (Federal) और एकात्मक (Unitary) दोनों तत्त्व समाहित हैं। सामान्य परिस्थितियों में यह संघीय सिद्धांतों को अपनाता है, किन्तु आपातकालीन परिस्थितियों में केंद्र अत्यंत शक्तिशाली हो जाता है, जो एकात्मक स्वरूप दिखाता है।" }, { "question": "भारतीय संविधान को लचीला (Flexible) और कठोर (Rigid) दोनों क्यों माना जाता है?", "options": [ "क्योंकि इसे आसानी से संशोधित नहीं किया जा सकता", "क्योंकि उच्चतम न्यायालय (Supreme Court) के पास सारे अधिकार हैं", "क्योंकि कुछ प्रावधान साधारण बहुमत से बदले जा सकते हैं और कुछ के लिए विशेष बहुमत की आवश्यकता होती है", "क्योंकि इसे ब्रिटिश संसद ने बनवाया था" ], "correct": 2, "explanation": "भारतीय संविधान में संशोधन प्रक्रिया दोहरी है। कुछ संशोधन संसद के साधारण बहुमत से ही हो जाते हैं, जबकि कुछ महत्वपूर्ण प्रावधानों के संशोधन के लिए विशेष बहुमत एवं राज्यों की सहमति अनिवार्य होती है। इसी कारण यह 'लचीला भी है और कठोर भी'।" }, { "question": "भारतीय संविधान में मूल अधिकार (Fundamental Rights) किस भाग में उल्लेखित हैं?", "options": [ "भाग III (Part III)", "भाग IV (Part IV)", "भाग II (Part II)", "भाग VI (Part VI)" ], "correct": 0, "explanation": "भारतीय संविधान के भाग III (अनुच्छेद 12 से 35) में मौलिक अधिकारों का विवरण है, जो नागरिकों को स्वतंत्रता और समानता इत्यादि सुनिश्चित करते हैं।" }, { "question": "भारतीय संविधान की प्रस्तावना (Preamble) को न्यायिक रूप से किस मामले (Case) में प्रथम बार विधिक मान्यता (Legal Recognition) मिली?", "options": [ "केशवानंद भारती बनाम राज्य केरल (Keshavananda Bharati vs. State of Kerala)", "गोलकनाथ बनाम पंजाब राज्य (Golaknath vs. State of Punjab)", "शंकरप्रसाद बनाम भारत संघ (Shankari Prasad vs. Union of India)", "मिनर्वा मिल्स बनाम भारत संघ (Minerva Mills vs. Union of India)" ], "correct": 1, "explanation": "गोलकनाथ (1967) मामले में सर्वोच्च न्यायालय ने प्रस्तावना का महत्व स्वीकार किया। हालाँकि केशवानंद भारती (1973) मामले में प्रस्तावना को संविधान के आधारभूत ढाँचे (Basic Structure) के रूप में मान्यता दी गई।" }, { "question": "भारतीय संविधान का आधारभूत ढाँचा (Basic Structure) सिद्धांत किस ऐतिहासिक न्यायिक फैसले से उभरा?", "options": [ "गोलकनाथ मामला (1967)", "केशवानंद भारती मामला (1973)", "मिनर्वा मिल्स मामला (1980)", "बेरूवरी यूनियन मामला (1960)" ], "correct": 1, "explanation": "1973 के केशवानंद भारती मामले में सर्वोच्च न्यायालय ने निर्णय दिया कि संविधान का आधारभूत ढाँचा (Basic Structure) संसद के संशोधन अधिकार से भी परे है। इसने कई मूल सिद्धांतों की रक्षा सुनिश्चित की।" }, { "question": "भारतीय संविधान के तहत कौन-सा सिद्धांत इसे एक 'संघीय संविधान (Federal Constitution)' घोषित करने में सहायक है?", "options": [ "मूल अधिकारों का होना", "संविधान में एकल नागरिकता", "केंद्र और राज्यों के बीच शक्तियों का विभाजन (Division of Powers)", "कार्यपालिका की शक्तियाँ" ], "correct": 2, "explanation": "संघीयता की मुख्य विशेषता केंद्र और राज्यों के बीच शक्तियों का स्पष्ट विभाजन है, जो भारतीय संविधान की संघीय पहचान को दर्शाता है (अध्याय Union, State, और Concurrent Lists में)।" }, { "question": "आपातकालीन उपबंध (Emergency Provisions) के अंतर्गत, भारतीय संविधान कितने प्रकार के आपातकालों का प्रावधान करता है?", "options": [ "केवल एक प्रकार", "दो प्रकार", "तीन प्रकार", "चार प्रकार" ], "correct": 2, "explanation": "भारतीय संविधान में मुख्यतः तीन प्रकार के आपातकाल हैं: राष्ट्रीय आपातकाल (Article 352), राज्य आपातकाल या राष्ट्रपति शासन (Article 356), और वित्तीय आपातकाल (Article 360)।" }, { "question": "संविधान की कौन-सी विशेषता इसे 'संविधान के भीतर संविधान (Mini Constitution)' की उपमा देती है?", "options": [ "42वाँ संशोधन", "44वाँ संशोधन", "अनुच्छेद 368", "अनुच्छेद 32" ], "correct": 0, "explanation": "42वाँ संशोधन (1976) को 'मिनी संविधान' कहा जाता है क्योंकि इसने प्रस्तावना, मौलिक कर्तव्य, और कई महत्त्वपूर्ण धाराओं में व्यापक संशोधन किए, जिससे संविधान की मूल संरचना में अनेक परिवर्तन हुए।" }, { "question": "मूल कर्तव्य (Fundamental Duties) भारतीय संविधान में किस संशोधन द्वारा जोड़े गए?", "options": [ "24वाँ संशोधन", "42वाँ संशोधन", "44वाँ संशोधन", "86वाँ संशोधन" ], "correct": 1, "explanation": "42वें संशोधन (1976) द्वारा भाग IV-A में अनुच्छेद 51A जोड़कर मूल कर्तव्य (Fundamental Duties) को संविधान में शामिल किया गया।" }, { "question": "भारतीय संविधान में सर्वोच्चता (Supremacy) किसकी है?", "options": [ "राष्ट्रपति", "संसद", "संविधान", "प्रधानमंत्री" ], "correct": 2, "explanation": "भारत में संविधान सर्वोच्च है। संसद या कार्यपालिका, दोनों को संविधान के अनुरूप कार्य करना होता है, और सर्वोच्च न्यायालय इसका संरक्षक (Guardian) है।" }, { "question": "भारतीय संविधान में कौन-सा विशेष प्रावधान राज्य को 'कल्याणकारी (Welfare)' भूमिका में रखता है?", "options": [ "मौलिक अधिकार (Fundamental Rights)", "संविधान की प्रस्तावना (Preamble)", "नीति-निर्देशक तत्त्व (Directive Principles of State Policy)", "अनुच्छेद 368 (Amendment)" ], "correct": 2, "explanation": "नीति-निर्देशक तत्त्व (Part IV) राज्य को सामाजिक न्याय, आर्थिक कल्याण, अंतर्राष्ट्रीय शांति आदि दिशाओं में सक्रियता के लिए प्रेरित करते हैं, जिससे राज्य की कल्याणकारी छवि उभरती है।" }, { "question": "संविधान में निहित 'निरपेक्षता (Secularism)' का क्या अर्थ है?", "options": [ "राज्य का कोई धर्म नहीं होगा", "केवल बहुसंख्यक धर्म को मान्यता", "धर्म के आधार पर भेदभाव करने की अनुमति", "सब धर्मों को पोषित करने की जिम्मेदारी निजी क्षेत्र पर" ], "correct": 0, "explanation": "भारतीय संविधान में राज्य किसी एक धर्म को अपना नहीं सकता। सब धर्मों के प्रति समान सम्मान और दूरी रखता है, तथा धार्मिक स्वतंत्रता की गारंटी देता है।" }, { "question": "संविधान में मौजूद दोहरी विशेषता (Dual Nature) किस परिस्थिति में जाहिर होती है?", "options": [ "जब राज्य विधानमंडल भंग कर दिया जाए", "जब लोकसभा चुनाव न हों", "सामान्य समय में संघीय और आपातकाल में एकात्मक स्वरूप", "जब राष्ट्रपति पद खाली हो" ], "correct": 2, "explanation": "भारत का संविधान सामान्य परिस्थितियों में संघीय ढाँचा अपनाता है, परंतु आपातकालीन परिस्थिति में केंद्र अत्यंत शक्तिशाली बन जाता है। इसीलिए इसे 'दोहरा स्वरूप' कहा जाता है।" }, { "question": "भारत में कौन-सी व्यवस्था उच्चतम न्यायालय (Supreme Court) के जरिए कानूनों की संवैधानिकता की जाँच (Judicial Review) सुनिश्चित करती है?", "options": [ "मंत्रिपरिषद", "लोकसभा स्पीकर", "संविधान की सर्वोच्चता", "राष्ट्रपति का अध्यादेश" ], "correct": 2, "explanation": "भारतीय संविधान की सर्वोच्चता तथा अनुच्छेद 13 की व्यवस्था के अंतर्गत उच्चतम न्यायालय और उच्च न्यायालय कानूनों की संवैधानिक वैधता की जाँच कर सकते हैं।" }, { "question": "उच्चतम न्यायालय (Supreme Court) को किस नाम से भी जाना जाता है, क्योंकि यह राज्यों के बीच तथा राज्य और केंद्र के बीच विवादों की सुनवाई करता है?", "options": [ "संविधान निर्माता (Constitution Maker)", "संघ का रक्षक (Protector of the Union)", "संविधान का संरक्षक (Guardian of the Constitution)", "राष्ट्रपति का न्यायालय (President’s Court)" ], "correct": 2, "explanation": "उच्चतम न्यायालय को ‘संविधान का संरक्षक (Guardian of the Constitution)’ कहा जाता है, क्योंकि वह अनुच्छेद 32, 131 इत्यादि के माध्यम से मौलिक अधिकारों और संघीय ढाँचे की रक्षा करता है।" }, { "question": "भारत में विधायिका, कार्यपालिका, और न्यायपालिका के बीच शक्तियों के पृथक्करण (Separation of Powers) की अवधारणा किस सिद्धांत पर आधारित है?", "options": [ "केवल ब्रिटिश संसदीय मॉडल", "लॉक (Locke) और मोंटेस्क्यू (Montesquieu) के सिद्धांतों पर", "ऑस्ट्रेलिया के मॉडल पर", "कोई स्पष्ट सिद्धांत नहीं है" ], "correct": 1, "explanation": "शक्तियों के पृथक्करण की अवधारणा जॉन लॉक और मोंटेस्क्यू द्वारा प्रतिपादित सिद्धांतों से प्रेरित है। भारतीय संविधान ने आंशिक रूप से इसे अपनाया है, हालाँकि पूर्ण पृथक्करण नहीं है।" }, { "question": "भारतीय संविधान का कौन-सा भाग 'राज्य के नीति-निर्देशक तत्त्व (Directive Principles)' को परिभाषित करता है?", "options": [ "भाग III", "भाग IV", "भाग V", "भाग VI" ], "correct": 1, "explanation": "भाग IV (Article 36-51) में नीति-निर्देशक तत्त्वों का वर्णन है, जो राज्य को सामाजिक, आर्थिक एवं राजनैतिक न्याय के लिए मार्गदर्शन प्रदान करते हैं।" }, { "question": "भारतीय संविधान में एक ही व्यक्ति का केंद्र और राज्य स्तर पर मंत्री (Minister) होना संभव नहीं है। यह किस सिद्धांत को दर्शाता है?", "options": [ "द्वि-नागरिकता (Dual Citizenship)", "पदों का पृथक्करण (Separation of Offices)", "एकात्मक सरकार (Unitary Government)", "संसदीय संप्रभुता (Parliamentary Sovereignty)" ], "correct": 1, "explanation": "पदों का पृथक्करण (Separation of Offices) के अनुसार, एक ही व्यक्ति दो स्तरों (केंद्र व राज्य) पर मंत्री पद धारण नहीं कर सकता। यह संघीय ढाँचे की पारदर्शिता व जिम्मेदारी सुनिश्चित करने के लिए है।" }, { "question": "संविधान में 'स्वतंत्रता, समानता, बंधुत्व (Liberty, Equality, Fraternity)' जैसे शब्द कहाँ प्रतिबिंबित होते हैं?", "options": [ "भाग III में", "नीति-निर्देशक तत्त्वों में", "प्रस्तावना में (Preamble)", "अनुच्छेद 368 में" ], "correct": 2, "explanation": "भारतीय संविधान की प्रस्तावना (Preamble) में स्वतंत्रता, समानता, बंधुत्व और न्याय (Justice) जैसे आदर्शों को सम्मिलित किया गया है, जो फ्रांसीसी क्रांति समेत अन्य संविधानों से प्रेरित हैं।" }, { "question": "भारतीय संविधान का उद्देश्य 'संविधान के शासन (Rule of Law)' को स्थापित करना है। यह सिद्धांत कहाँ से प्रेरित है?", "options": [ "अमेरिकी बिल ऑफ राइट्स", "ब्रिटिश कॉमन लॉ (British Common Law)", "सोवियत संघ का संविधान", "चीन का संविधान" ], "correct": 1, "explanation": "भारतीय संविधान में 'Rule of Law' का सिद्धांत ब्रिटिश कॉमन लॉ से प्रभावित है, जहाँ कानून के समक्ष समानता (Equality before Law) और कानून का शासन (Rule of Law) की अवधारणा विकसित हुई।" }, { "question": "भारतीय संविधान के सार में किस प्रकार की शासन व्यवस्था स्थापित करने का प्रयास किया गया है?", "options": [ "पूर्ण सोशलिस्ट (Socialist) अर्थव्यवस्था", "पूर्ण कैपिटलिस्ट (Capitalist) अर्थव्यवस्था", "समाजवादी (Socialist) और कल्याणकारी (Welfare) लोकतंत्र (Democracy)", "सैन्य शासन (Military Rule)" ], "correct": 2, "explanation": "भारतीय संविधान समाजवादी और कल्याणकारी लोकतंत्र स्थापित करना चाहता है, जिसमें समाज के सभी वर्गों को विकास का समान अवसर मिले और राज्य सामाजिक-आर्थिक नीतियों से जनकल्याण (Public Welfare) को बढ़ावा दे।" }, { "question": "कौन-सी विशेषता भारतीय संविधान को इस अर्थ में अद्वितीय बनाती है कि यहाँ केंद्र सरकार राज्यों के ढाँचे को पुनर्गठित (Reorganize) कर सकती है?", "options": [ "अनुच्छेद 3 का प्रावधान", "अनुच्छेद 32 का प्रावधान", "अनुच्छेद 356 का प्रावधान", "अनुच्छेद 368 का प्रावधान" ], "correct": 0, "explanation": "अनुच्छेद 3 के अंतर्गत संसद को अधिकार दिया गया है कि वह राज्यों के क्षेत्र, सीमाओं या नामों में परिवर्तन कर सकती है। इससे भारत का संघ अपनी भौगोलिक इकाइयों को आवश्यकता अनुसार पुनर्गठित कर सकता है।" }, { "question": "भारतीय संविधान में कौन-से मुख्य अवयव (Components) इसे एक 'सम्पूर्ण दस्तावेज (Comprehensive Document)' बनाते हैं?", "options": [ "प्रस्तावना, भाग III, भाग IV, भाग IV-A और अनुसूचियाँ", "सिर्फ भाग III और भाग IV", "सिर्फ अनुच्छेदों की लंबी सूची", "केवल Schedules" ], "correct": 0, "explanation": "भारतीय संविधान को सम्पूर्ण दस्तावेज बनाते हैं: इसकी प्रस्तावना (Preamble), मौलिक अधिकार (Part III), नीति-निर्देशक तत्त्व (Part IV), मूल कर्तव्य (Part IV-A), संघीय ढाँचा (Union-State Relations), विविध अनुसूचियाँ (Schedules) आदि।" }, { "question": "पंचायती राज संस्थाओं को संवैधानिक दर्जा मिलने से संविधान में कौन-सी नई अनुसूची (Schedule) जोड़ी गई?", "options": [ "नौवीं अनुसूची (9th Schedule)", "दसवीं अनुसूची (10th Schedule)", "ग्यारहवीं अनुसूची (11th Schedule)", "बारहवीं अनुसूची (12th Schedule)" ], "correct": 2, "explanation": "73वें संशोधन अधिनियम (1992) के द्वारा पंचायती राज संस्थाओं के लिए ग्यारहवीं अनुसूची जोड़ी गई, जिसमें पंचायतों के कार्यों और शक्तियों का उल्लेख है।" }, { "question": "नगर पालिका (Municipality) संस्थाओं से संबंधित बारहवीं अनुसूची (12th Schedule) किस संशोधन द्वारा जोड़ी गई?", "options": [ "42वाँ संशोधन", "44वाँ संशोधन", "74वाँ संशोधन", "86वाँ संशोधन" ], "correct": 2, "explanation": "74वें संशोधन अधिनियम (1992) द्वारा शहरी स्थानीय निकायों (Municipalities) को संवैधानिक दर्जा दिया गया, और बारहवीं अनुसूची जोड़ी गई।" }, { "question": "भारतीय संविधान की एक विशेषता यह भी है कि यह 'प्रावधान के साथ लचीलापन (Flexibility with Provisions)' रखता है, उदाहरण के लिए भाषा नीति (Language Policy)। यह किस अनुच्छेद या भाग में आता है?", "options": [ "भाग XVII (Article 343-351)", "भाग IV (Article 36-51)", "भाग V (Article 52-151)", "भाग III (Article 12-35)" ], "correct": 0, "explanation": "भारतीय संविधान का भाग XVII (अनुच्छेद 343-351) भाषा नीति से संबंधित है, जहाँ हिंदी को राजभाषा (Official Language) माना गया, लेकिन अन्य भारतीय भाषाओं को भी पर्याप्त संरक्षण और लचीलापन दिया गया।" }, { "question": "न्यायपालिका की स्वतंत्रता को सुनिश्चित करने के लिए भारतीय संविधान में क्या प्रावधान हैं?", "options": [ "न्यायाधीशों की नियुक्ति राष्ट्रपति की मर्ज़ी से होती है", "न्यायाधीशों के वेतन (Salary) व शर्तों को संसद बदल सकती है", "न्यायाधीशों की सेवानिवृत्ति आयु और महाभियोग (Impeachment) प्रक्रिया निर्धारित", "कोई विशेष प्रावधान नहीं" ], "correct": 2, "explanation": "न्यायाधीशों की सेवानिवृत्ति आयु तय है, महाभियोग द्वारा ही उन्हें हटाया जा सकता है, और उनके वेतन व शर्तों में संसद मनमानी कटौती नहीं कर सकती। इससे न्यायपालिका की स्वतंत्रता सुनिश्चित होती है।" }, { "question": "भारतीय संविधान में \"सम्पूर्ण प्रभुत्व-संपन्न (Sovereign), समाजवादी (Socialist), धर्मनिरपेक्ष (Secular), लोकतंत्रात्मक (Democratic), गणराज्य (Republic)\" शब्द कहाँ दर्ज हैं?", "options": [ "भाग III में", "अनुच्छेद 368 में", "प्रस्तावना (Preamble)", "भाग IV में" ], "correct": 2, "explanation": "प्रस्तावना (Preamble) में इन शब्दों को वर्णित किया गया है। 42वें संशोधन में 'समाजवादी' और 'धर्मनिरपेक्ष' शब्द भी जोड़े गए।" }, { "question": "भारतीय संविधान के विकास में 'बहुलवादी (Pluralistic) दृष्टिकोण' का क्या महत्व है?", "options": [ "संविधान केवल एक धर्म को मान्यता देता है", "भाषाई, सांस्कृतिक, धार्मिक विविधता को संविधान द्वारा स्वीकार किया जाना", "केवल बहुसंख्यक की सत्ता होना", "विपक्षी दलों का न होना" ], "correct": 1, "explanation": "भारतीय संविधान विविधता में एकता (Unity in Diversity) की अवधारणा पर आधारित है और विभिन्न भाषाई, सांस्कृतिक, धार्मिक समुदायों को स्वायत्तता व अधिकार देकर एक बहुलवादी दृष्टिकोण अपनाता है।" }, { "question": "मौलिक अधिकारों में से कौन-सा अधिकार संविधान के 44वें संशोधन (1978) द्वारा हटाया गया?", "options": [ "सम्पत्ति का अधिकार (Right to Property)", "शोषण के विरुद्ध अधिकार (Right against Exploitation)", "सांस्कृतिक और शैक्षिक अधिकार (Cultural and Educational Rights)", "धर्म की स्वतंत्रता का अधिकार (Right to Freedom of Religion)" ], "correct": 0, "explanation": "44वें संशोधन 1978 के द्वारा सम्पत्ति का अधिकार (Right to Property) को मौलिक अधिकारों की सूची से निकालकर कानूनी अधिकार (Legal Right) बना दिया गया, जो अब अनुच्छेद 300-A में दर्ज है।" }, { "question": "संविधान में 'मूलभूत संरचना सिद्धांत (Basic Structure Doctrine)' क्या कहता है?", "options": [ "संसद किसी भी अनुच्छेद को बदल सकती है", "संसद संविधान के आधारभूत ढाँचे को नहीं बदल सकती", "राष्ट्रपति मनचाहे संशोधन कर सकते हैं", "राज्यसभा को veto पावर है" ], "correct": 1, "explanation": "बेसिक स्ट्रक्चर सिद्धांत (केशवानंद भारती मामला, 1973) के अनुसार संसद अनुच्छेद 368 के तहत संविधान संशोधन तो कर सकती है लेकिन उसके मूलभूत ढाँचे (Fundamental features) को नष्ट या बदल नहीं सकती।" }, { "question": "भारतीय संविधान में मौलिक अधिकार (Fundamental Rights) का प्रवर्तन (Enforcement) सुनिश्चित करने के लिए कौन सा प्रावधान है?", "options": [ "अनुच्छेद 12", "अनुच्छेद 13", "अनुच्छेद 32", "अनुच्छेद 14" ], "correct": 2, "explanation": "अनुच्छेद 32 को 'संविधान का हृदय और आत्मा (Heart and Soul)' कहा जाता है, क्योंकि यह मौलिक अधिकारों के उल्लंघन पर सर्वोच्च न्यायालय जाने का अधिकार देता है, एवं रिट्स जारी करने का अधिकार भी।" }, { "question": "भारतीय संविधान की कौन-सी विशेषता इसे राज्यों की सहमति के बिना भी संशोधनों (Amendments) को संभव बनाती है?", "options": [ "संसदीय संप्रभुता (Parliamentary Sovereignty)", "दोहरा जनादेश (Dual Mandate)", "प्रत्यक्ष लोकतंत्र (Direct Democracy)", "संशोधन की विभिन्न श्रेणियाँ (Different categories of Amendments)" ], "correct": 3, "explanation": "अनुच्छेद 368 के तहत कुछ संशोधन ऐसे हैं, जो केवल संसद के विशेष या साधारण बहुमत से हो जाते हैं, और उनमें राज्यों की सहमति की आवश्यकता नहीं पड़ती। यही संविधान में लचीलापन भी दर्शाता है।" }, { "question": "भारत के संविधान में राष्ट्रपति को शक्तिशाली क्यों नहीं कहा जा सकता, जबकि वे राष्ट्र के प्रमुख (Head of the State) हैं?", "options": [ "क्योंकि राष्ट्रपति के पद का कोई कार्य नहीं है", "क्योंकि राष्ट्रपति मंत्रिपरिषद की सलाह से बँधे होते हैं", "क्योंकि राष्ट्रपति चुनाव द्वारा नहीं चुने जाते", "क्योंकि राष्ट्रपति न्यायपालिका के अधीन होते हैं" ], "correct": 1, "explanation": "भारतीय राष्ट्रपति के अधिकांश कार्य एवं शक्तियाँ प्रधानमंत्री व मंत्रिपरिषद की सलाह (Aid and Advice) से संचालित होती हैं, जिसके चलते राष्ट्रपति एक संवैधानिक प्रमुख (Constitutional Head) की भूमिका में रहते हैं।" }, { "question": "भारतीय संविधान 'सर्वजनहित (Common Good)' को बढ़ावा देने के लिए किन उपबंधों (Provisions) पर बल देता है?", "options": [ "मौलिक अधिकारों के कड़े प्रवर्तन पर", "नीति-निर्देशक तत्त्वों (Directive Principles) के पालन पर", "केवल लोकपाल जैसे संस्थानों पर", "केवल संसद पर दबाव डालकर" ], "correct": 1, "explanation": "नीति-निर्देशक तत्त्व (Part IV) का उद्देश्य समाज के सभी वर्गों के कल्याण (Common Good) के लिए राज्य को दिशा-निर्देश देना है, जैसे शिक्षा, स्वास्थ्य, समान मजदूरी आदि को प्रोत्साहन देना।" }, { "question": "भारतीय संविधान की प्रस्तावना (Preamble) में किस शब्द के जुड़ने ने समाज में जाति, वर्ग, लिंग आदि के भेदभाव को कम करने का सार्थक संदेश दिया?", "options": [ "धर्मनिरपेक्ष (Secular)", "समाजवादी (Socialist)", "गणराज्य (Republic)", "लोकतंत्रात्मक (Democratic)" ], "correct": 1, "explanation": "42वें संशोधन के जरिये प्रस्तावना में 'समाजवादी (Socialist)' शब्द जोड़ा गया, जिससे सामाजिक-आर्थिक न्याय और संसाधनों के समान वितरण पर बल दिया गया, जो जाति एवं वर्ग भेदभाव को कम करने का संदेश देता है।" }, { "question": "भारत एक \"गणराज्य (Republic)\" है। इसका क्या अर्थ है?", "options": [ "राजा (Monarch) को देश का प्रमुख मानने से इनकार", "सभी निर्णय राष्ट्रपति अकेले लेता है", "बहुसंख्यक समुदाय का शासन", "संसद सर्वोच्च है" ], "correct": 0, "explanation": "गणराज्य (Republic) का अर्थ है कि देश का प्रमुख (राष्ट्रपति) वंशानुगत (Hereditary) नहीं होता, बल्कि चुना हुआ या निर्वाचित व्यक्ति होता है, जो एक निश्चित अवधि के लिए पद संभालता है।" }, { "question": "भारत में \"लोकतंत्रात्मक (Democratic)\" प्रणाली का मुख्य आधार क्या है?", "options": [ "निर्वाचित प्रतिनिधियों द्वारा शासन (Government by elected representatives)", "सैनिक शासन", "राजा के आदेश पर सरकार चलना", "पूंजीपतियों का शासन" ], "correct": 0, "explanation": "लोकतंत्रात्मक प्रणाली का अर्थ है कि जनता अपने प्रतिनिधियों को चुनती है, और ये प्रतिनिधि सरकार का संचालन करते हैं। भारत में नियमित चुनाव (Regular Elections) के द्वारा यह सुनिश्चित होता है।" }, { "question": "भारतीय संविधान में किस अनुच्छेद (Article) के तहत राज्यपाल को अध्यादेश (Ordinance) जारी करने का अधिकार प्राप्त है?", "options": [ "अनुच्छेद 200", "अनुच्छेद 201", "अनुच्छेद 213", "अनुच्छेद 356" ], "correct": 2, "explanation": "अनुच्छेद 213 के तहत राज्यपाल को, जब राज्य विधानमंडल सत्र में न हो, आवश्यक मामलों में अध्यादेश जारी करने का अधिकार है। यह केंद्र में राष्ट्रपति को प्राप्त अध्यादेश की शक्ति (अनुच्छेद 123) के समरूप है।" }, { "question": "भारतीय संविधान में \"विधायिका का सर्वोच्चता\" (Legislative Supremacy) सिद्धांत पूर्ण रूप से लागू क्यों नहीं होता?", "options": [ "क्योंकि कार्यपालिका इसे मान्यता नहीं देती", "क्योंकि संविधान स्वयं सर्वोच्च है और न्यायिक पुनरावलोकन (Judicial Review) सीमाएँ निर्धारित करता है", "क्योंकि राज्यसभा लोकसभा से शक्तिशाली है", "क्योंकि राष्ट्रपति के पास वीटो (Veto) है" ], "correct": 1, "explanation": "भारतीय प्रणाली में संविधान सर्वोच्च है, और न्यायपालिका को कानूनों की संवैधानिक वैधता की जाँच का अधिकार है। अतः संसद सर्वशक्तिमान (Supreme) नहीं है, जैसा कि ब्रिटेन में होता है।" }, { "question": "भारतीय संविधान में \"धर्मनिरपेक्षता (Secularism)\" का अर्थ है:", "options": [ "राज्य का कोई धर्म नहीं होगा, सभी धर्मों को समान सम्मान", "केवल बहुसंख्यक धर्म को मान्यता", "किसी भी धर्म पर रोक", "धार्मिक स्वतंत्रता का न होना" ], "correct": 0, "explanation": "भारतीय संविधान के अनुसार, राज्य न तो किसी धर्म को बढ़ावा देगा, न किसी को दबाएगा। सभी धर्मों को समान अधिकार दिए गए हैं, और सभी नागरिकों को अपने धर्म का पालन करने की आज़ादी है।" }, { "question": "एकात्मक प्रवृत्ति (Unitary Tendency) भारतीय संविधान में किस परिस्थिति में मुखर (Prominent) हो जाती है?", "options": [ "जब किसी राज्य का मुख्यमंत्री लोकप्रिय न हो", "सामान्य बजट सत्र के दौरान", "आपातकाल (Emergency) के दौरान", "कभी भी नहीं" ], "correct": 2, "explanation": "आपातकाल के दौरान केंद्र सरकार को राज्यों की कार्यकारिणी व विधायिकाओं पर व्यापक नियंत्रण का अधिकार मिल जाता है, जिससे संविधान का एकात्मक (Unitary) स्वरूप प्रबल हो जाता है।" }, { "question": "भारतीय संविधान में प्रतिपादित 'संघीय' व्यवस्था के अंतर्गत निम्न में से कौन-सा गलत कथन है?", "options": [ "केंद्र और राज्यों के बीच विषयों का विभाजन होता है", "राज्यों के अपने राज्यपाल होते हैं", "राज्यों के पास कोई स्वतंत्र विधान शक्ति नहीं होती", "केंद्र के पास विशिष्ट शक्तियाँ रहती हैं" ], "correct": 2, "explanation": "भारतीय संविधान में राज्यों को विधायी शक्तियाँ (State List) दी गई हैं। यह कथन गलत है कि 'राज्यों के पास कोई स्वतंत्र विधान शक्ति नहीं होती'। वास्तव में संघीय सूची (Union List), राज्य सूची (State List), और समवर्ती सूची (Concurrent List) का प्रावधान है।" }, { "question": "कौन-सा कथन सही है? \"भारतीय संविधान एक स्वीकृत और स्वीकार्य सामाजिक संकल्पना (Social Contract) है...\"", "options": [ "यह महज एक कानूनी दस्तावेज है, सामाजिक उद्देश्य नहीं", "हाँ, क्योंकि संविधान सभा में सारे वर्गों का प्रतिनिधित्व था", "नहीं, क्योंकि यह विदेशी शक्तियों ने थोपा था", "कोई स्पष्ट मत नहीं है" ], "correct": 1, "explanation": "संविधान सभा में विभिन्न वर्गों, समुदायों, राज्यों का प्रतिनिधित्व शामिल था, जिसने संविधान को एक व्यापक समाजीकृत (Social Contract) दस्तावेज का रूप दिया, जिसे जनता ने स्वेच्छा से स्वीकारा।" }, { "question": "सर्वोच्च न्यायालय (Supreme Court) द्वारा नीति-निर्देशक तत्त्वों (Directive Principles) को कभी-कभी मौलिक अधिकारों के समान महत्त्व देने के पीछे कौन-सा तर्क है?", "options": [ "क्योंकि मौलिक अधिकारों को रद्द कर दिया गया", "क्योंकि संविधान संशोधन ने दोनों को बराबर कर दिया", "कल्याणकारी राज्य (Welfare State) की अवधारणा और सामंजस्यपूर्ण व्याख्या (Harmonious Construction)", "कोई तर्क नहीं, बस अदालती गलती" ], "correct": 2, "explanation": "सर्वोच्च न्यायालय ने कुछ प्रकरणों में कहा है कि मौलिक अधिकारों व नीति-निर्देशक तत्त्वों को समग्रता में पढ़ा जाना चाहिए। कल्याणकारी राज्य की भावना के तहत DPSPs को भी महत्त्व दिया जाना चाहिए, यद्यपि वे गैर-न्यायिक (Non-Justiciable) हैं।" } // More questions as needed... ]; let currentQuestionIndex = 0; // Track current question let userAnswers = Array(quizData.length).fill(null); // Track user's answers // Timer variables let totalQuizTime = quizData.length * 30; // total seconds = 30 seconds * no. of questions let timeLeft = totalQuizTime; let timerInterval; // On page load, initialize quiz window.onload = function() { generateQuestionNav(); // Generate the question navigation circles loadQuestion(); startTimer(); // Start the countdown }; // Start the countdown timer function startTimer() { updateTimerDisplay(timeLeft); timerInterval = setInterval(() => { timeLeft--; updateTimerDisplay(timeLeft); if (timeLeft <= 0) { clearInterval(timerInterval); showResults(); // Force show results if time is up } }, 1000); } // Update timer on the screen in mm:ss format function updateTimerDisplay(seconds) { const timerEl = document.getElementById("timer"); const mins = Math.floor(seconds / 60).toString().padStart(2, '0'); const secs = (seconds % 60).toString().padStart(2, '0'); timerEl.innerText = `Time: ${mins}:${secs}`; } // Toggle the question nav when hamburger is pressed const hamburgerBtn = document.getElementById('hamburgerBtn'); hamburgerBtn.addEventListener('click', () => { document.getElementById('questionNavOverlay').classList.toggle('show'); }); // Close hamburger menu if user clicks outside the nav and menu document.addEventListener('click', (e) => { const navOverlay = document.getElementById('questionNavOverlay'); const hamburger = document.getElementById('hamburgerBtn'); // If the menu is open, and the click is outside both the overlay and the hamburger, close it if ( navOverlay.classList.contains('show') && !navOverlay.contains(e.target) && !hamburger.contains(e.target) ) { navOverlay.classList.remove('show'); } }); // Create small clickable circles for each question function generateQuestionNav() { const navContainer = document.getElementById("questionNav"); navContainer.innerHTML = ""; // clear old items if any quizData.forEach((_, index) => { const circle = document.createElement("div"); circle.classList.add("circle-number"); circle.innerText = index + 1; // Show question number (1-based) circle.onclick = () => jumpToQuestion(index); navContainer.appendChild(circle); }); } // Jump to a specific question function jumpToQuestion(qIndex) { currentQuestionIndex = qIndex; // Hide the nav on mobile after selection document.getElementById('questionNavOverlay').classList.remove('show'); // Reset submission/next button state document.getElementById("submitAnswerButton").classList.remove("hidden"); document.getElementById("nextButton").classList.add("hidden"); loadQuestion(); } // Load current question function loadQuestion() { highlightCurrentCircle(); // Hide explanation area and Next button initially document.getElementById("explanation").classList.add("hidden"); document.getElementById("nextButton").classList.add("hidden"); const questionData = quizData[currentQuestionIndex]; document.getElementById("question").innerText = questionData.question; document.getElementById("questionCounter").innerText = `${currentQuestionIndex + 1}/${quizData.length}`; // Clear old choices const choicesContainer = document.getElementById("choices"); choicesContainer.innerHTML = ""; // Populate choices questionData.options.forEach((option, index) => { const choiceElement = document.createElement("div"); choiceElement.className = "choice"; choiceElement.innerText = option; // If previously selected, mark it if (userAnswers[currentQuestionIndex] === index) { choiceElement.classList.add("selected"); } // On clicking a choice choiceElement.onclick = () => { // Clear all selections first document.querySelectorAll(".choice").forEach(c => c.classList.remove("selected")); // Mark this one as selected choiceElement.classList.add("selected"); userAnswers[currentQuestionIndex] = index; }; choicesContainer.appendChild(choiceElement); }); // Handle Previous button visibility document.getElementById("prevButton").style.display = currentQuestionIndex === 0 ? "none" : "inline-block"; } // Highlight the current question circle function highlightCurrentCircle() { const circles = document.querySelectorAll(".circle-number"); circles.forEach((circle, idx) => { circle.classList.remove("active"); if (idx === currentQuestionIndex) { circle.classList.add("active"); } }); } // Submit the current question's answer function submitAnswer() { const questionData = quizData[currentQuestionIndex]; const userAnswer = userAnswers[currentQuestionIndex]; // Show the explanation div const explanationDiv = document.getElementById("explanation"); explanationDiv.classList.remove("hidden"); // Clear previous correctness classes and disable further selection document.querySelectorAll(".choice").forEach((c) => { c.classList.add("disabled"); c.onclick = null; }); // Determine correctness or skipping if (userAnswer === null) { explanationDiv.innerHTML = "You Skipped the question.<br/><br/>व्याख्या: " + questionData.explanation; showPopupMessage("You Skipped the question", false); } else if (userAnswer === questionData.correct) { explanationDiv.innerHTML = "You got it right!<br/><br/>व्याख्या: " + questionData.explanation; showPopupMessage("You got it right", true); // Highlight correct choice document.querySelectorAll(".choice")[userAnswer].classList.add("correct"); } else { explanationDiv.innerHTML = "You got it wrong.<br/><br/>व्याख्या: " + questionData.explanation; showPopupMessage("You got it wrong", false); // Highlight correct choice document.querySelectorAll(".choice")[questionData.correct].classList.add("correct"); // Mark the chosen one as incorrect document.querySelectorAll(".choice")[userAnswer].classList.add("incorrect"); } // Hide the submit button, show the next button document.getElementById("submitAnswerButton").classList.add("hidden"); document.getElementById("nextButton").classList.remove("hidden"); } // Go to the next question or show final results function nextQuestion() { currentQuestionIndex++; if (currentQuestionIndex >= quizData.length) { // Show results if no more questions showResults(); } else { // Reset buttons document.getElementById("submitAnswerButton").classList.remove("hidden"); document.getElementById("nextButton").classList.add("hidden"); loadQuestion(); } } // Go to the previous question function previousQuestion() { if (currentQuestionIndex > 0) { currentQuestionIndex--; document.getElementById("submitAnswerButton").classList.remove("hidden"); document.getElementById("nextButton").classList.add("hidden"); loadQuestion(); } } // Show final quiz results function showResults() { // Stop the timer if it's still running clearInterval(timerInterval); // Calculate correct answers const correctAnswersCount = userAnswers.filter( (ans, i) => ans === quizData[i].correct ).length; // Hide quiz content document.getElementById("quizContent").classList.add("hidden"); // Show results document.getElementById("resultContent").classList.remove("hidden"); const percentage = (correctAnswersCount / quizData.length) * 100; let resultHTML = ""; if (percentage >= 60) { resultHTML = `<div class="congrats">🎉 बधाई हो! आपने ${percentage.toFixed( 2 )}% स्कोर किया है!</div>`; } else { resultHTML = `<div class="sad">😢 आपने ${percentage.toFixed( 2 )}% स्कोर किया है। अगली बार के लिए शुभकामनाएं!</div>`; } document.getElementById("resultMessage").innerHTML = resultHTML; document.getElementById("scoreMessage").innerText = `आपने कुल ${quizData.length} में से ${correctAnswersCount} प्रश्न सही उत्तर दिए हैं।`; } // Optional popup message function showPopupMessage(message, isCorrect) { const popup = document.getElementById('popupMessage'); popup.innerText = message; popup.className = ''; popup.classList.add('show'); popup.classList.add(isCorrect ? 'correct' : 'incorrect'); setTimeout(() => { popup.classList.remove('show'); popup.classList.add('hidden'); }, 2000); } // Button event listeners document.getElementById('prevButton').addEventListener('click', previousQuestion); document.getElementById('submitAnswerButton').addEventListener('click', submitAnswer); document.getElementById('nextButton').addEventListener('click', nextQuestion); // Predefined Darker Color Themes const themes = [ { header: '#a31645', headerText: '#ffffff', container: '#e8c4d6', containerText: '#6e0c36', headings: '#6e0c36' }, // Berry Delight { header: '#00574b', headerText: '#ffffff', container: '#b3dfd7', containerText: '#00382e', headings: '#00382e' }, // Ocean Breeze { header: '#c95a00', headerText: '#ffffff', container: '#dca865', containerText: '#7a3400', headings: '#7a3400' }, // Sunset Glow { header: '#4a0f6f', headerText: '#ffffff', container: '#cdb5e3', containerText: '#320b4a', headings: '#320b4a' }, // Calming Lavender { header: '#1e4d2b', headerText: '#ffffff', container: '#98c1a3', containerText: '#122417', headings: '#122417' }, // Forest Retreat { header: '#c99800', headerText: '#ffffff', container: '#e8d18a', containerText: '#6c4f00', headings: '#6c4f00' }, // Golden Elegance { header: '#01477e', headerText: '#ffffff', container: '#86b9e4', containerText: '#00223d', headings: '#00223d' }, // Sky Calm { header: '#5a3b2e', headerText: '#ffffff', container: '#b8a89c', containerText: '#32211a', headings: '#32211a' }, // Retro Rust { header: '#b34727', headerText: '#ffffff', container: '#f2c29d', containerText: '#6a2915', headings: '#6a2915' }, // Warm Peach { header: '#0f4c43', headerText: '#ffffff', container: '#92c3b8', containerText: '#072822', headings: '#072822' }, // Cool Mint ]; // Apply Random Darker Theme function applyRandomTheme() { const header = document.querySelector('.header'); const container = document.querySelector('.content-container'); const headings = document.querySelectorAll('.content-container h2'); // Select a random theme const randomTheme = themes[Math.floor(Math.random() * themes.length)]; // Apply Header Colors header.style.backgroundColor = randomTheme.header; header.style.color = randomTheme.headerText; // Apply Container Colors container.style.backgroundColor = randomTheme.container; container.style.color = randomTheme.containerText; // Apply Heading Colors headings.forEach((heading) => { heading.style.color = randomTheme.headings; heading.style.borderBottom = `2px solid ${randomTheme.headings}`; }); } // Apply the theme on page load window.onload = function () { applyRandomTheme(); // Set random theme generateQuestionNav(); // Generate question navigation loadQuestion(); // Load the first question startTimer(); // Start the countdown timer }; </script> </body> </html> <!-- /wp:html -->