Add quiz mode toggle to chapter/section toolbar
Adds a button to the existing top-right button group on chapter and section pages that hides everything outside of the breadcrumb, the heading, the rendered questions and the link to the next section or chapter at the end of the page. The state is persisted via localStorage so it survives navigation. On pages without questions a small notice is shown instead. Replaces the previously published userscript by integrating the same behaviour directly into the site.
This commit is contained in:
@@ -446,3 +446,43 @@ span.formula {
|
||||
.course .katex-display {
|
||||
margin: 1em 0em;
|
||||
}
|
||||
|
||||
/* Quiz-Modus */
|
||||
#quiz-mode-toggle {
|
||||
cursor: pointer;
|
||||
}
|
||||
#quiz-mode-toggle.active {
|
||||
background: #0a7a2a;
|
||||
border-color: #0a7a2a;
|
||||
color: #fff;
|
||||
}
|
||||
#quiz-mode-toggle.active svg {
|
||||
fill: #fff;
|
||||
}
|
||||
|
||||
#quiz-mode-notice {
|
||||
position: fixed;
|
||||
top: 12px;
|
||||
right: 12px;
|
||||
z-index: 99999;
|
||||
max-width: 260px;
|
||||
padding: 8px 12px;
|
||||
font: 500 13px/1.35 system-ui, -apple-system, sans-serif;
|
||||
color: #333;
|
||||
background: #fff3cd;
|
||||
border: 1px solid #ffe69c;
|
||||
border-radius: 6px;
|
||||
box-shadow: 0 2px 8px rgba(0, 0, 0, 0.15);
|
||||
}
|
||||
|
||||
body.quiz-mode-active.quiz-has-questions .course > * {
|
||||
display: none !important;
|
||||
}
|
||||
body.quiz-mode-active.quiz-has-questions .course > .course-toolbar,
|
||||
body.quiz-mode-active.quiz-has-questions .course > h1,
|
||||
body.quiz-mode-active.quiz-has-questions .course > nav,
|
||||
body.quiz-mode-active.quiz-has-questions .course > .question,
|
||||
body.quiz-mode-active.quiz-has-questions .course > [data-quiz-tail],
|
||||
body.quiz-mode-active.quiz-has-questions .course > [data-quiz-tail] ~ * {
|
||||
display: revert !important;
|
||||
}
|
||||
|
||||
Reference in New Issue
Block a user