From 7efe649c3b55096125120e13c80cf04339ba116c Mon Sep 17 00:00:00 2001 From: farhan Date: Fri, 15 Nov 2024 13:30:35 +0500 Subject: [PATCH 1/2] chore: clean up built in blocks css --- .../css-builtin-blocks/AnnotatableBlockDisplay.css | 11 ----------- .../static/css-builtin-blocks/HtmlBlockDisplay.css | 8 -------- .../static/css-builtin-blocks/HtmlBlockEditor.css | 5 ----- .../static/css-builtin-blocks/LTIBlockDisplay.css | 12 +++--------- .../static/css-builtin-blocks/PollBlockDisplay.css | 5 ----- .../css-builtin-blocks/ProblemBlockDisplay.css | 7 +------ .../static/css-builtin-blocks/ProblemBlockEditor.css | 3 --- .../css-builtin-blocks/SequenceBlockDisplay.css | 5 ----- .../static/css-builtin-blocks/VideoBlockDisplay.css | 9 --------- .../static/css-builtin-blocks/VideoBlockEditor.css | 3 --- .../css-builtin-blocks/WordCloudBlockDisplay.css | 5 ----- 11 files changed, 4 insertions(+), 69 deletions(-) diff --git a/xmodule/static/css-builtin-blocks/AnnotatableBlockDisplay.css b/xmodule/static/css-builtin-blocks/AnnotatableBlockDisplay.css index 45b395ec66ab..804d84a7717a 100644 --- a/xmodule/static/css-builtin-blocks/AnnotatableBlockDisplay.css +++ b/xmodule/static/css-builtin-blocks/AnnotatableBlockDisplay.css @@ -1,16 +1,5 @@ @import url("https://fonts.googleapis.com/css?family=Open+Sans:300,400,400i,600,700"); -.xmodule_display.xmodule_AnnotatableBlock { - /* TODO: move top-level variables to a common _variables.scss. - * NOTE: These variables were only added here because when this was integrated with the CMS, - * SASS compilation errors were triggered because the CMS didn't have the same variables defined - * that the LMS did, so the quick fix was to localize the LMS variables not shared by the CMS. - * -Abarrett and Vshnayder - */ - /* stylelint-disable-line */ - /* stylelint-disable-line */ -} - .xmodule_display.xmodule_AnnotatableBlock .annotatable-wrapper { position: relative; } diff --git a/xmodule/static/css-builtin-blocks/HtmlBlockDisplay.css b/xmodule/static/css-builtin-blocks/HtmlBlockDisplay.css index 0896a814a210..8e8854aca730 100644 --- a/xmodule/static/css-builtin-blocks/HtmlBlockDisplay.css +++ b/xmodule/static/css-builtin-blocks/HtmlBlockDisplay.css @@ -1,13 +1,5 @@ @import url("https://fonts.googleapis.com/css?family=Open+Sans:300,400,400i,600,700"); -.xmodule_display.xmodule_AboutBlock, -.xmodule_display.xmodule_CourseInfoBlock, -.xmodule_display.xmodule_HtmlBlock, -.xmodule_display.xmodule_StaticTabBlock { - /* stylelint-disable-line */ - /* stylelint-disable-line */ -} - .xmodule_display.xmodule_AboutBlock *, .xmodule_display.xmodule_CourseInfoBlock *, .xmodule_display.xmodule_HtmlBlock *, diff --git a/xmodule/static/css-builtin-blocks/HtmlBlockEditor.css b/xmodule/static/css-builtin-blocks/HtmlBlockEditor.css index feae8a0034dd..75502f45670a 100644 --- a/xmodule/static/css-builtin-blocks/HtmlBlockEditor.css +++ b/xmodule/static/css-builtin-blocks/HtmlBlockEditor.css @@ -1,10 +1,5 @@ @import url("https://fonts.googleapis.com/css?family=Open+Sans:300,400,400i,600,700"); -.xmodule_edit.xmodule_AboutBlock, -.xmodule_edit.xmodule_CourseInfoBlock, -.xmodule_edit.xmodule_HtmlBlock, -.xmodule_edit.xmodule_StaticTabBlock { -} .xmodule_edit.xmodule_AboutBlock .ui-col-wide, .xmodule_edit.xmodule_CourseInfoBlock .ui-col-wide, diff --git a/xmodule/static/css-builtin-blocks/LTIBlockDisplay.css b/xmodule/static/css-builtin-blocks/LTIBlockDisplay.css index 294dfc9a832b..5ca27a4c4a0a 100644 --- a/xmodule/static/css-builtin-blocks/LTIBlockDisplay.css +++ b/xmodule/static/css-builtin-blocks/LTIBlockDisplay.css @@ -1,11 +1,5 @@ @import url("https://fonts.googleapis.com/css?family=Open+Sans:300,400,400i,600,700"); -.xmodule_display.xmodule_LTIBlock { - /* stylelint-disable-line */ - /* stylelint-disable-line */ - /* stylelint-disable-line */ - /* stylelint-disable-line */ -} .xmodule_display.xmodule_LTIBlock h2.problem-header { display: inline-block; @@ -13,7 +7,7 @@ .xmodule_display.xmodule_LTIBlock div.problem-progress { display: inline-block; - padding-left: calc((var(--baseline)/4)); + padding-left: calc((var(--baseline) / 4)); color: #666; font-weight: 100; font-size: 1em; @@ -57,6 +51,6 @@ } .xmodule_display.xmodule_LTIBlock div.lti div.problem-feedback { - margin-top: calc((var(--baseline)/4)); - margin-bottom: calc((var(--baseline)/4)); + margin-top: calc((var(--baseline) / 4)); + margin-bottom: calc((var(--baseline) / 4)); } diff --git a/xmodule/static/css-builtin-blocks/PollBlockDisplay.css b/xmodule/static/css-builtin-blocks/PollBlockDisplay.css index f617dc960d38..436e0c966f1b 100644 --- a/xmodule/static/css-builtin-blocks/PollBlockDisplay.css +++ b/xmodule/static/css-builtin-blocks/PollBlockDisplay.css @@ -1,10 +1,5 @@ @import url("https://fonts.googleapis.com/css?family=Open+Sans:300,400,400i,600,700"); -.xmodule_display.xmodule_PollBlock { - /* stylelint-disable-line */ - /* stylelint-disable-line */ -} - @media print { .xmodule_display.xmodule_PollBlock div.poll_question { display: block; diff --git a/xmodule/static/css-builtin-blocks/ProblemBlockDisplay.css b/xmodule/static/css-builtin-blocks/ProblemBlockDisplay.css index 31ce58efe387..4b2a16a0fc0f 100644 --- a/xmodule/static/css-builtin-blocks/ProblemBlockDisplay.css +++ b/xmodule/static/css-builtin-blocks/ProblemBlockDisplay.css @@ -1,10 +1,5 @@ @import url("https://fonts.googleapis.com/css?family=Open+Sans:300,400,400i,600,700"); -.xmodule_display.xmodule_ProblemBlock { - /* stylelint-disable-line */ - /* stylelint-disable-line */ -} - .xmodule_display.xmodule_ProblemBlock div.problem .choicegroup input + label.choicegroup_correct .status-icon::after, .xmodule_display.xmodule_ProblemBlock div.problem .choicetextgroup input + label.choicegroup_correct .status-icon::after, .xmodule_display.xmodule_ProblemBlock div.problem .choicetextgroup .choicegroup input + label.choicetextgroup_correct .status-icon::after, .xmodule_display.xmodule_ProblemBlock div.problem .choicetextgroup input + label.choicetextgroup_correct .status-icon::after, .xmodule_display.xmodule_ProblemBlock div.problem .choicetextgroup .choicegroup input + section.choicetextgroup_correct .status-icon::after, .xmodule_display.xmodule_ProblemBlock div.problem .choicetextgroup input + section.choicetextgroup_correct .status-icon::after, .xmodule_display.xmodule_ProblemBlock div.problem .choicegroup input + label.choicegroup_partially-correct .status-icon::after, .xmodule_display.xmodule_ProblemBlock div.problem .choicetextgroup input + label.choicegroup_partially-correct .status-icon::after, .xmodule_display.xmodule_ProblemBlock div.problem .choicetextgroup .choicegroup input + label.choicetextgroup_partially-correct .status-icon::after, .xmodule_display.xmodule_ProblemBlock div.problem .choicetextgroup input + label.choicetextgroup_partially-correct .status-icon::after, .xmodule_display.xmodule_ProblemBlock div.problem .choicetextgroup .choicegroup input + section.choicetextgroup_partially-correct .status-icon::after, .xmodule_display.xmodule_ProblemBlock div.problem .choicetextgroup input + section.choicetextgroup_partially-correct .status-icon::after, .xmodule_display.xmodule_ProblemBlock div.problem .choicegroup input + label.choicegroup_incorrect .status-icon::after, .xmodule_display.xmodule_ProblemBlock div.problem .choicetextgroup input + label.choicegroup_incorrect .status-icon::after, .xmodule_display.xmodule_ProblemBlock div.problem .choicetextgroup .choicegroup input + label.choicetextgroup_incorrect .status-icon::after, .xmodule_display.xmodule_ProblemBlock div.problem .choicetextgroup input + label.choicetextgroup_incorrect .status-icon::after, .xmodule_display.xmodule_ProblemBlock div.problem .choicetextgroup .choicegroup input + section.choicetextgroup_incorrect .status-icon::after, .xmodule_display.xmodule_ProblemBlock div.problem .choicetextgroup input + section.choicetextgroup_incorrect .status-icon::after, .xmodule_display.xmodule_ProblemBlock div.problem .indicator-container .status.correct .status-icon::after, .xmodule_display.xmodule_ProblemBlock div.problem .indicator-container .status.partially-correct .status-icon::after, .xmodule_display.xmodule_ProblemBlock div.problem .indicator-container .status.incorrect .status-icon::after, .xmodule_display.xmodule_ProblemBlock .problem .capa_inputtype.textline > .incorrect .status .status-icon::after, .xmodule_display.xmodule_ProblemBlock .problem .inputtype.formulaequationinput > .incorrect .status .status-icon::after, .xmodule_display.xmodule_ProblemBlock .problem .capa_inputtype.textline > .partially-correct .status .status-icon::after, .xmodule_display.xmodule_ProblemBlock .problem .inputtype.formulaequationinput > .partially-correct .status .status-icon::after, .xmodule_display.xmodule_ProblemBlock .problem .capa_inputtype.textline > .correct .status .status-icon::after, .xmodule_display.xmodule_ProblemBlock .problem .inputtype.formulaequationinput > .correct .status .status-icon::after, .xmodule_display.xmodule_ProblemBlock div.problem .imageinput.capa_inputtype .correct .status-icon::after, .xmodule_display.xmodule_ProblemBlock div.problem .imageinput.capa_inputtype .incorrect .status-icon::after, .xmodule_display.xmodule_ProblemBlock div.problem .imageinput.capa_inputtype .partially-correct .status-icon::after, .xmodule_display.xmodule_ProblemBlock div.problem .annotation-input .correct .status-icon::after, .xmodule_display.xmodule_ProblemBlock div.problem .annotation-input .incorrect .status-icon::after, .xmodule_display.xmodule_ProblemBlock div.problem .annotation-input .partially-correct .status-icon::after { font-family: FontAwesome; -webkit-font-smoothing: antialiased; @@ -901,8 +896,8 @@ } .xmodule_display.xmodule_ProblemBlock div.problem - var + ( --all-text-inputs diff --git a/xmodule/static/css-builtin-blocks/ProblemBlockEditor.css b/xmodule/static/css-builtin-blocks/ProblemBlockEditor.css index 086a3ebd2208..21399a02ce9f 100644 --- a/xmodule/static/css-builtin-blocks/ProblemBlockEditor.css +++ b/xmodule/static/css-builtin-blocks/ProblemBlockEditor.css @@ -1,8 +1,5 @@ @import url("https://fonts.googleapis.com/css?family=Open+Sans:300,400,400i,600,700"); -.xmodule_edit.xmodule_ProblemBlock { -} - .xmodule_edit.xmodule_ProblemBlock .ui-col-wide { width: 74.46809%; margin-right: 2.12766%; diff --git a/xmodule/static/css-builtin-blocks/SequenceBlockDisplay.css b/xmodule/static/css-builtin-blocks/SequenceBlockDisplay.css index 1a40ca9f7c54..24d9b8ae6c32 100644 --- a/xmodule/static/css-builtin-blocks/SequenceBlockDisplay.css +++ b/xmodule/static/css-builtin-blocks/SequenceBlockDisplay.css @@ -1,10 +1,5 @@ @import url("https://fonts.googleapis.com/css?family=Open+Sans:300,400,400i,600,700"); -.xmodule_display.xmodule_SequenceBlock { - /* stylelint-disable-line */ - /* stylelint-disable-line */ -} - .xmodule_display.xmodule_SequenceBlock .block-link { border-left: 1px solid var(--border-color); display: block; diff --git a/xmodule/static/css-builtin-blocks/VideoBlockDisplay.css b/xmodule/static/css-builtin-blocks/VideoBlockDisplay.css index 93c4b6adcec3..0c4ac98d42c9 100644 --- a/xmodule/static/css-builtin-blocks/VideoBlockDisplay.css +++ b/xmodule/static/css-builtin-blocks/VideoBlockDisplay.css @@ -1,14 +1,5 @@ @import url("https://fonts.googleapis.com/css?family=Open+Sans:300,400,400i,600,700"); -.xmodule_display.xmodule_VideoBlock { - /* stylelint-disable-line */ - /* stylelint-disable-line */ - /* stylelint-disable-line */ - /* stylelint-disable-line */ - /* stylelint-disable-line */ - /* stylelint-disable-line */ -} - .xmodule_display.xmodule_VideoBlock { margin-bottom: calc((var(--baseline) * 1.5)); } diff --git a/xmodule/static/css-builtin-blocks/VideoBlockEditor.css b/xmodule/static/css-builtin-blocks/VideoBlockEditor.css index 4a570a5fec89..148f4054a1a0 100644 --- a/xmodule/static/css-builtin-blocks/VideoBlockEditor.css +++ b/xmodule/static/css-builtin-blocks/VideoBlockEditor.css @@ -1,8 +1,5 @@ @import url("https://fonts.googleapis.com/css?family=Open+Sans:300,400,400i,600,700"); -.xmodule_edit.xmodule_VideoBlock { -} - .xmodule_edit.xmodule_VideoBlock .ui-col-wide { width: 74.46809%; margin-right: 2.12766%; diff --git a/xmodule/static/css-builtin-blocks/WordCloudBlockDisplay.css b/xmodule/static/css-builtin-blocks/WordCloudBlockDisplay.css index 51050dcba9a1..8be5f77ede00 100644 --- a/xmodule/static/css-builtin-blocks/WordCloudBlockDisplay.css +++ b/xmodule/static/css-builtin-blocks/WordCloudBlockDisplay.css @@ -1,10 +1,5 @@ @import url("https://fonts.googleapis.com/css?family=Open+Sans:300,400,400i,600,700"); -.xmodule_display.xmodule_WordCloudBlock { - /* stylelint-disable-line */ - /* stylelint-disable-line */ -} - .xmodule_display.xmodule_WordCloudBlock .input-cloud { margin: calc((var(--baseline) / 4)); } From ad377dca93d7d54539218074038f8f4639b19b48 Mon Sep 17 00:00:00 2001 From: farhan Date: Fri, 15 Nov 2024 17:26:07 +0500 Subject: [PATCH 2/2] chore: Address PR change request --- .../css-builtin-blocks/HtmlBlockDisplay.css | 30 +- .../css-builtin-blocks/HtmlBlockEditor.css | 3 +- .../css-builtin-blocks/PollBlockDisplay.css | 3 +- .../ProblemBlockDisplay.css | 386 +++++++++++++----- .../css-builtin-blocks/ProblemBlockEditor.css | 8 +- .../css-builtin-blocks/VideoBlockDisplay.css | 107 +++-- .../css-builtin-blocks/VideoBlockEditor.css | 5 +- 7 files changed, 389 insertions(+), 153 deletions(-) diff --git a/xmodule/static/css-builtin-blocks/HtmlBlockDisplay.css b/xmodule/static/css-builtin-blocks/HtmlBlockDisplay.css index 8e8854aca730..0e7a20017092 100644 --- a/xmodule/static/css-builtin-blocks/HtmlBlockDisplay.css +++ b/xmodule/static/css-builtin-blocks/HtmlBlockDisplay.css @@ -130,18 +130,18 @@ font-weight: bold; } -.xmodule_display.xmodule_AboutBlock p + p, -.xmodule_display.xmodule_AboutBlock ul + p, -.xmodule_display.xmodule_AboutBlock ol + p, -.xmodule_display.xmodule_CourseInfoBlock p + p, -.xmodule_display.xmodule_CourseInfoBlock ul + p, -.xmodule_display.xmodule_CourseInfoBlock ol + p, -.xmodule_display.xmodule_HtmlBlock p + p, -.xmodule_display.xmodule_HtmlBlock ul + p, -.xmodule_display.xmodule_HtmlBlock ol + p, -.xmodule_display.xmodule_StaticTabBlock p + p, -.xmodule_display.xmodule_StaticTabBlock ul + p, -.xmodule_display.xmodule_StaticTabBlock ol + p { +.xmodule_display.xmodule_AboutBlock p+p, +.xmodule_display.xmodule_AboutBlock ul+p, +.xmodule_display.xmodule_AboutBlock ol+p, +.xmodule_display.xmodule_CourseInfoBlock p+p, +.xmodule_display.xmodule_CourseInfoBlock ul+p, +.xmodule_display.xmodule_CourseInfoBlock ol+p, +.xmodule_display.xmodule_HtmlBlock p+p, +.xmodule_display.xmodule_HtmlBlock ul+p, +.xmodule_display.xmodule_HtmlBlock ol+p, +.xmodule_display.xmodule_StaticTabBlock p+p, +.xmodule_display.xmodule_StaticTabBlock ul+p, +.xmodule_display.xmodule_StaticTabBlock ol+p { margin-top: var(--baseline); } @@ -190,7 +190,11 @@ list-style: disc outside none; } -.xmodule_display.xmodule_AboutBlock a:link, .xmodule_display.xmodule_AboutBlock a:visited, .xmodule_display.xmodule_AboutBlock a:hover, .xmodule_display.xmodule_AboutBlock a:active, .xmodule_display.xmodule_AboutBlock a:focus, +.xmodule_display.xmodule_AboutBlock a:link, +.xmodule_display.xmodule_AboutBlock a:visited, +.xmodule_display.xmodule_AboutBlock a:hover, +.xmodule_display.xmodule_AboutBlock a:active, +.xmodule_display.xmodule_AboutBlock a:focus, .xmodule_display.xmodule_CourseInfoBlock a:link, .xmodule_display.xmodule_CourseInfoBlock a:visited, .xmodule_display.xmodule_CourseInfoBlock a:hover, diff --git a/xmodule/static/css-builtin-blocks/HtmlBlockEditor.css b/xmodule/static/css-builtin-blocks/HtmlBlockEditor.css index 75502f45670a..c7ef3b7ec147 100644 --- a/xmodule/static/css-builtin-blocks/HtmlBlockEditor.css +++ b/xmodule/static/css-builtin-blocks/HtmlBlockEditor.css @@ -113,7 +113,8 @@ height: 21px; } -.xmodule_edit.xmodule_AboutBlock .editor .editor-bar button:hover, .xmodule_edit.xmodule_AboutBlock .editor .editor-bar button:focus, +.xmodule_edit.xmodule_AboutBlock .editor .editor-bar button:hover, +.xmodule_edit.xmodule_AboutBlock .editor .editor-bar button:focus, .xmodule_edit.xmodule_CourseInfoBlock .editor .editor-bar button:hover, .xmodule_edit.xmodule_CourseInfoBlock .editor .editor-bar button:focus, .xmodule_edit.xmodule_HtmlBlock .editor .editor-bar button:hover, diff --git a/xmodule/static/css-builtin-blocks/PollBlockDisplay.css b/xmodule/static/css-builtin-blocks/PollBlockDisplay.css index 436e0c966f1b..cf9058281dd4 100644 --- a/xmodule/static/css-builtin-blocks/PollBlockDisplay.css +++ b/xmodule/static/css-builtin-blocks/PollBlockDisplay.css @@ -7,7 +7,8 @@ padding: 0; } - .xmodule_display.xmodule_PollBlock div.poll_question canvas, .xmodule_display.xmodule_PollBlock div.poll_question img { + .xmodule_display.xmodule_PollBlock div.poll_question canvas, + .xmodule_display.xmodule_PollBlock div.poll_question img { page-break-inside: avoid; } } diff --git a/xmodule/static/css-builtin-blocks/ProblemBlockDisplay.css b/xmodule/static/css-builtin-blocks/ProblemBlockDisplay.css index 4b2a16a0fc0f..3cd20ab7608e 100644 --- a/xmodule/static/css-builtin-blocks/ProblemBlockDisplay.css +++ b/xmodule/static/css-builtin-blocks/ProblemBlockDisplay.css @@ -1,6 +1,38 @@ @import url("https://fonts.googleapis.com/css?family=Open+Sans:300,400,400i,600,700"); -.xmodule_display.xmodule_ProblemBlock div.problem .choicegroup input + label.choicegroup_correct .status-icon::after, .xmodule_display.xmodule_ProblemBlock div.problem .choicetextgroup input + label.choicegroup_correct .status-icon::after, .xmodule_display.xmodule_ProblemBlock div.problem .choicetextgroup .choicegroup input + label.choicetextgroup_correct .status-icon::after, .xmodule_display.xmodule_ProblemBlock div.problem .choicetextgroup input + label.choicetextgroup_correct .status-icon::after, .xmodule_display.xmodule_ProblemBlock div.problem .choicetextgroup .choicegroup input + section.choicetextgroup_correct .status-icon::after, .xmodule_display.xmodule_ProblemBlock div.problem .choicetextgroup input + section.choicetextgroup_correct .status-icon::after, .xmodule_display.xmodule_ProblemBlock div.problem .choicegroup input + label.choicegroup_partially-correct .status-icon::after, .xmodule_display.xmodule_ProblemBlock div.problem .choicetextgroup input + label.choicegroup_partially-correct .status-icon::after, .xmodule_display.xmodule_ProblemBlock div.problem .choicetextgroup .choicegroup input + label.choicetextgroup_partially-correct .status-icon::after, .xmodule_display.xmodule_ProblemBlock div.problem .choicetextgroup input + label.choicetextgroup_partially-correct .status-icon::after, .xmodule_display.xmodule_ProblemBlock div.problem .choicetextgroup .choicegroup input + section.choicetextgroup_partially-correct .status-icon::after, .xmodule_display.xmodule_ProblemBlock div.problem .choicetextgroup input + section.choicetextgroup_partially-correct .status-icon::after, .xmodule_display.xmodule_ProblemBlock div.problem .choicegroup input + label.choicegroup_incorrect .status-icon::after, .xmodule_display.xmodule_ProblemBlock div.problem .choicetextgroup input + label.choicegroup_incorrect .status-icon::after, .xmodule_display.xmodule_ProblemBlock div.problem .choicetextgroup .choicegroup input + label.choicetextgroup_incorrect .status-icon::after, .xmodule_display.xmodule_ProblemBlock div.problem .choicetextgroup input + label.choicetextgroup_incorrect .status-icon::after, .xmodule_display.xmodule_ProblemBlock div.problem .choicetextgroup .choicegroup input + section.choicetextgroup_incorrect .status-icon::after, .xmodule_display.xmodule_ProblemBlock div.problem .choicetextgroup input + section.choicetextgroup_incorrect .status-icon::after, .xmodule_display.xmodule_ProblemBlock div.problem .indicator-container .status.correct .status-icon::after, .xmodule_display.xmodule_ProblemBlock div.problem .indicator-container .status.partially-correct .status-icon::after, .xmodule_display.xmodule_ProblemBlock div.problem .indicator-container .status.incorrect .status-icon::after, .xmodule_display.xmodule_ProblemBlock .problem .capa_inputtype.textline > .incorrect .status .status-icon::after, .xmodule_display.xmodule_ProblemBlock .problem .inputtype.formulaequationinput > .incorrect .status .status-icon::after, .xmodule_display.xmodule_ProblemBlock .problem .capa_inputtype.textline > .partially-correct .status .status-icon::after, .xmodule_display.xmodule_ProblemBlock .problem .inputtype.formulaequationinput > .partially-correct .status .status-icon::after, .xmodule_display.xmodule_ProblemBlock .problem .capa_inputtype.textline > .correct .status .status-icon::after, .xmodule_display.xmodule_ProblemBlock .problem .inputtype.formulaequationinput > .correct .status .status-icon::after, .xmodule_display.xmodule_ProblemBlock div.problem .imageinput.capa_inputtype .correct .status-icon::after, .xmodule_display.xmodule_ProblemBlock div.problem .imageinput.capa_inputtype .incorrect .status-icon::after, .xmodule_display.xmodule_ProblemBlock div.problem .imageinput.capa_inputtype .partially-correct .status-icon::after, .xmodule_display.xmodule_ProblemBlock div.problem .annotation-input .correct .status-icon::after, .xmodule_display.xmodule_ProblemBlock div.problem .annotation-input .incorrect .status-icon::after, .xmodule_display.xmodule_ProblemBlock div.problem .annotation-input .partially-correct .status-icon::after { +.xmodule_display.xmodule_ProblemBlock div.problem .choicegroup input+label.choicegroup_correct .status-icon::after, +.xmodule_display.xmodule_ProblemBlock div.problem .choicetextgroup input+label.choicegroup_correct .status-icon::after, +.xmodule_display.xmodule_ProblemBlock div.problem .choicetextgroup .choicegroup input+label.choicetextgroup_correct .status-icon::after, +.xmodule_display.xmodule_ProblemBlock div.problem .choicetextgroup input+label.choicetextgroup_correct .status-icon::after, +.xmodule_display.xmodule_ProblemBlock div.problem .choicetextgroup .choicegroup input+section.choicetextgroup_correct .status-icon::after, +.xmodule_display.xmodule_ProblemBlock div.problem .choicetextgroup input+section.choicetextgroup_correct .status-icon::after, +.xmodule_display.xmodule_ProblemBlock div.problem .choicegroup input+label.choicegroup_partially-correct .status-icon::after, +.xmodule_display.xmodule_ProblemBlock div.problem .choicetextgroup input+label.choicegroup_partially-correct .status-icon::after, +.xmodule_display.xmodule_ProblemBlock div.problem .choicetextgroup .choicegroup input+label.choicetextgroup_partially-correct .status-icon::after, +.xmodule_display.xmodule_ProblemBlock div.problem .choicetextgroup input+label.choicetextgroup_partially-correct .status-icon::after, +.xmodule_display.xmodule_ProblemBlock div.problem .choicetextgroup .choicegroup input+section.choicetextgroup_partially-correct .status-icon::after, +.xmodule_display.xmodule_ProblemBlock div.problem .choicetextgroup input+section.choicetextgroup_partially-correct .status-icon::after, +.xmodule_display.xmodule_ProblemBlock div.problem .choicegroup input+label.choicegroup_incorrect .status-icon::after, +.xmodule_display.xmodule_ProblemBlock div.problem .choicetextgroup input+label.choicegroup_incorrect .status-icon::after, +.xmodule_display.xmodule_ProblemBlock div.problem .choicetextgroup .choicegroup input+label.choicetextgroup_incorrect .status-icon::after, +.xmodule_display.xmodule_ProblemBlock div.problem .choicetextgroup input+label.choicetextgroup_incorrect .status-icon::after, +.xmodule_display.xmodule_ProblemBlock div.problem .choicetextgroup .choicegroup input+section.choicetextgroup_incorrect .status-icon::after, +.xmodule_display.xmodule_ProblemBlock div.problem .choicetextgroup input+section.choicetextgroup_incorrect .status-icon::after, +.xmodule_display.xmodule_ProblemBlock div.problem .indicator-container .status.correct .status-icon::after, +.xmodule_display.xmodule_ProblemBlock div.problem .indicator-container .status.partially-correct .status-icon::after, +.xmodule_display.xmodule_ProblemBlock div.problem .indicator-container .status.incorrect .status-icon::after, +.xmodule_display.xmodule_ProblemBlock .problem .capa_inputtype.textline>.incorrect .status .status-icon::after, +.xmodule_display.xmodule_ProblemBlock .problem .inputtype.formulaequationinput>.incorrect .status .status-icon::after, +.xmodule_display.xmodule_ProblemBlock .problem .capa_inputtype.textline>.partially-correct .status .status-icon::after, +.xmodule_display.xmodule_ProblemBlock .problem .inputtype.formulaequationinput>.partially-correct .status .status-icon::after, +.xmodule_display.xmodule_ProblemBlock .problem .capa_inputtype.textline>.correct .status .status-icon::after, +.xmodule_display.xmodule_ProblemBlock .problem .inputtype.formulaequationinput>.correct .status .status-icon::after, +.xmodule_display.xmodule_ProblemBlock div.problem .imageinput.capa_inputtype .correct .status-icon::after, +.xmodule_display.xmodule_ProblemBlock div.problem .imageinput.capa_inputtype .incorrect .status-icon::after, +.xmodule_display.xmodule_ProblemBlock div.problem .imageinput.capa_inputtype .partially-correct .status-icon::after, +.xmodule_display.xmodule_ProblemBlock div.problem .annotation-input .correct .status-icon::after, +.xmodule_display.xmodule_ProblemBlock div.problem .annotation-input .incorrect .status-icon::after, +.xmodule_display.xmodule_ProblemBlock div.problem .annotation-input .partially-correct .status-icon::after { font-family: FontAwesome; -webkit-font-smoothing: antialiased; display: inline-block; @@ -33,12 +65,14 @@ font-weight: bold; } -.xmodule_display.xmodule_ProblemBlock .feedback-hint-incorrect, .xmodule_display.xmodule_ProblemBlock .feedback-hint-partially-correct, +.xmodule_display.xmodule_ProblemBlock .feedback-hint-incorrect, +.xmodule_display.xmodule_ProblemBlock .feedback-hint-partially-correct, .xmodule_display.xmodule_ProblemBlock .feedback-hint-correct { margin-top: calc((var(--baseline) / 4)); } -.xmodule_display.xmodule_ProblemBlock .feedback-hint-incorrect .icon, .xmodule_display.xmodule_ProblemBlock .feedback-hint-partially-correct .icon, +.xmodule_display.xmodule_ProblemBlock .feedback-hint-incorrect .icon, +.xmodule_display.xmodule_ProblemBlock .feedback-hint-partially-correct .icon, .xmodule_display.xmodule_ProblemBlock .feedback-hint-correct .icon { margin-right: calc((var(--baseline) / 4)); } @@ -116,7 +150,7 @@ display: inline; } -.xmodule_display.xmodule_ProblemBlock div.problem .inline + p { +.xmodule_display.xmodule_ProblemBlock div.problem .inline+p { margin-top: var(--baseline); } @@ -125,7 +159,8 @@ font-size: var(--small-font-size); } -.xmodule_display.xmodule_ProblemBlock div.problem form > label, .xmodule_display.xmodule_ProblemBlock div.problem .problem-group-label { +.xmodule_display.xmodule_ProblemBlock div.problem form>label, +.xmodule_display.xmodule_ProblemBlock div.problem .problem-group-label { display: block; margin-bottom: var(--baseline); font: inherit; @@ -133,28 +168,31 @@ -webkit-font-smoothing: initial; } -.xmodule_display.xmodule_ProblemBlock div.problem .problem-group-label + .question-description { +.xmodule_display.xmodule_ProblemBlock div.problem .problem-group-label+.question-description { margin-top: calc(-1 * var(--baseline)); } -.xmodule_display.xmodule_ProblemBlock .wrapper-problem-response + .wrapper-problem-response, -.xmodule_display.xmodule_ProblemBlock .wrapper-problem-response + p { +.xmodule_display.xmodule_ProblemBlock .wrapper-problem-response+.wrapper-problem-response, +.xmodule_display.xmodule_ProblemBlock .wrapper-problem-response+p { margin-top: calc((var(--baseline) * 1.5)); } -.xmodule_display.xmodule_ProblemBlock div.problem .choicegroup, .xmodule_display.xmodule_ProblemBlock div.problem .choicetextgroup { +.xmodule_display.xmodule_ProblemBlock div.problem .choicegroup, +.xmodule_display.xmodule_ProblemBlock div.problem .choicetextgroup { min-width: 100px; width: auto !important; width: 100px; } -.xmodule_display.xmodule_ProblemBlock div.problem .choicegroup:after, .xmodule_display.xmodule_ProblemBlock div.problem .choicetextgroup:after { +.xmodule_display.xmodule_ProblemBlock div.problem .choicegroup:after, +.xmodule_display.xmodule_ProblemBlock div.problem .choicetextgroup:after { content: ""; display: table; clear: both; } -.xmodule_display.xmodule_ProblemBlock div.problem .choicegroup label, .xmodule_display.xmodule_ProblemBlock div.problem .choicetextgroup label { +.xmodule_display.xmodule_ProblemBlock div.problem .choicegroup label, +.xmodule_display.xmodule_ProblemBlock div.problem .choicetextgroup label { box-sizing: border-box; display: inline-block; clear: both; @@ -165,60 +203,188 @@ width: 100%; } -.xmodule_display.xmodule_ProblemBlock div.problem .choicegroup label::after, .xmodule_display.xmodule_ProblemBlock div.problem .choicetextgroup label::after { +.xmodule_display.xmodule_ProblemBlock div.problem .choicegroup label::after, +.xmodule_display.xmodule_ProblemBlock div.problem .choicetextgroup label::after { margin-left: calc((var(--baseline) * 0.75)); } -.xmodule_display.xmodule_ProblemBlock div.problem .choicegroup .indicator-container, .xmodule_display.xmodule_ProblemBlock div.problem .choicetextgroup .indicator-container { +.xmodule_display.xmodule_ProblemBlock div.problem .choicegroup .indicator-container, +.xmodule_display.xmodule_ProblemBlock div.problem .choicetextgroup .indicator-container { min-height: 1px; width: 25px; display: inline-block; } -.xmodule_display.xmodule_ProblemBlock div.problem .choicegroup fieldset, .xmodule_display.xmodule_ProblemBlock div.problem .choicetextgroup fieldset { +.xmodule_display.xmodule_ProblemBlock div.problem .choicegroup fieldset, +.xmodule_display.xmodule_ProblemBlock div.problem .choicetextgroup fieldset { box-sizing: border-box; } -.xmodule_display.xmodule_ProblemBlock div.problem .choicegroup input[type="radio"], .xmodule_display.xmodule_ProblemBlock div.problem .choicetextgroup input[type="radio"], .xmodule_display.xmodule_ProblemBlock div.problem .choicegroup input[type="checkbox"], .xmodule_display.xmodule_ProblemBlock div.problem .choicetextgroup input[type="checkbox"] { +.xmodule_display.xmodule_ProblemBlock div.problem .choicegroup input[type="radio"], +.xmodule_display.xmodule_ProblemBlock div.problem .choicetextgroup input[type="radio"], +.xmodule_display.xmodule_ProblemBlock div.problem .choicegroup input[type="checkbox"], +.xmodule_display.xmodule_ProblemBlock div.problem .choicetextgroup input[type="checkbox"] { margin: calc((var(--baseline) / 4)); margin-right: calc((var(--baseline) / 2)); } -.xmodule_display.xmodule_ProblemBlock div.problem .choicegroup input:focus + label, .xmodule_display.xmodule_ProblemBlock div.problem .choicetextgroup input:focus + label, .xmodule_display.xmodule_ProblemBlock div.problem .choicegroup input:hover + label, .xmodule_display.xmodule_ProblemBlock div.problem .choicetextgroup input:hover + label { +.xmodule_display.xmodule_ProblemBlock div.problem .choicegroup input:focus+label, +.xmodule_display.xmodule_ProblemBlock div.problem .choicetextgroup input:focus+label, +.xmodule_display.xmodule_ProblemBlock div.problem .choicegroup input:hover+label, +.xmodule_display.xmodule_ProblemBlock div.problem .choicetextgroup input:hover+label { border: 2px solid var(--blue); } -.xmodule_display.xmodule_ProblemBlock div.problem .choicegroup input + label.choicegroup_correct, .xmodule_display.xmodule_ProblemBlock div.problem .choicetextgroup input + label.choicegroup_correct, .xmodule_display.xmodule_ProblemBlock div.problem .choicetextgroup .choicegroup input + label.choicetextgroup_correct, .xmodule_display.xmodule_ProblemBlock div.problem .choicetextgroup input + label.choicetextgroup_correct, .xmodule_display.xmodule_ProblemBlock div.problem .choicetextgroup .choicegroup input + section.choicetextgroup_correct, .xmodule_display.xmodule_ProblemBlock div.problem .choicetextgroup input + section.choicetextgroup_correct, .xmodule_display.xmodule_ProblemBlock div.problem .choicegroup input:focus + label.choicegroup_correct, .xmodule_display.xmodule_ProblemBlock div.problem .choicetextgroup input:focus + label.choicegroup_correct, .xmodule_display.xmodule_ProblemBlock div.problem .choicetextgroup .choicegroup input:focus + label.choicetextgroup_correct, .xmodule_display.xmodule_ProblemBlock div.problem .choicetextgroup input:focus + label.choicetextgroup_correct, .xmodule_display.xmodule_ProblemBlock div.problem .choicetextgroup .choicegroup input:focus + section.choicetextgroup_correct, .xmodule_display.xmodule_ProblemBlock div.problem .choicetextgroup input:focus + section.choicetextgroup_correct, .xmodule_display.xmodule_ProblemBlock div.problem .choicegroup input:hover + label.choicegroup_correct, .xmodule_display.xmodule_ProblemBlock div.problem .choicetextgroup input:hover + label.choicegroup_correct, .xmodule_display.xmodule_ProblemBlock div.problem .choicetextgroup .choicegroup input:hover + label.choicetextgroup_correct, .xmodule_display.xmodule_ProblemBlock div.problem .choicetextgroup input:hover + label.choicetextgroup_correct, .xmodule_display.xmodule_ProblemBlock div.problem .choicetextgroup .choicegroup input:hover + section.choicetextgroup_correct, .xmodule_display.xmodule_ProblemBlock div.problem .choicetextgroup input:hover + section.choicetextgroup_correct { +.xmodule_display.xmodule_ProblemBlock div.problem .choicegroup input+label.choicegroup_correct, +.xmodule_display.xmodule_ProblemBlock div.problem .choicetextgroup input+label.choicegroup_correct, +.xmodule_display.xmodule_ProblemBlock div.problem .choicetextgroup .choicegroup input+label.choicetextgroup_correct, +.xmodule_display.xmodule_ProblemBlock div.problem .choicetextgroup input+label.choicetextgroup_correct, +.xmodule_display.xmodule_ProblemBlock div.problem .choicetextgroup .choicegroup input+section.choicetextgroup_correct, +.xmodule_display.xmodule_ProblemBlock div.problem .choicetextgroup input+section.choicetextgroup_correct, +.xmodule_display.xmodule_ProblemBlock div.problem .choicegroup input:focus+label.choicegroup_correct, +.xmodule_display.xmodule_ProblemBlock div.problem .choicetextgroup input:focus+label.choicegroup_correct, +.xmodule_display.xmodule_ProblemBlock div.problem .choicetextgroup .choicegroup input:focus+label.choicetextgroup_correct, +.xmodule_display.xmodule_ProblemBlock div.problem .choicetextgroup input:focus+label.choicetextgroup_correct, +.xmodule_display.xmodule_ProblemBlock div.problem .choicetextgroup .choicegroup input:focus+section.choicetextgroup_correct, +.xmodule_display.xmodule_ProblemBlock div.problem .choicetextgroup input:focus+section.choicetextgroup_correct, +.xmodule_display.xmodule_ProblemBlock div.problem .choicegroup input:hover+label.choicegroup_correct, +.xmodule_display.xmodule_ProblemBlock div.problem .choicetextgroup input:hover+label.choicegroup_correct, +.xmodule_display.xmodule_ProblemBlock div.problem .choicetextgroup .choicegroup input:hover+label.choicetextgroup_correct, +.xmodule_display.xmodule_ProblemBlock div.problem .choicetextgroup input:hover+label.choicetextgroup_correct, +.xmodule_display.xmodule_ProblemBlock div.problem .choicetextgroup .choicegroup input:hover+section.choicetextgroup_correct, +.xmodule_display.xmodule_ProblemBlock div.problem .choicetextgroup input:hover+section.choicetextgroup_correct { border: 2px solid var(--correct); } -.xmodule_display.xmodule_ProblemBlock div.problem .choicegroup input + label.choicegroup_correct .status-icon::after, .xmodule_display.xmodule_ProblemBlock div.problem .choicetextgroup input + label.choicegroup_correct .status-icon::after, .xmodule_display.xmodule_ProblemBlock div.problem .choicetextgroup .choicegroup input + label.choicetextgroup_correct .status-icon::after, .xmodule_display.xmodule_ProblemBlock div.problem .choicetextgroup input + label.choicetextgroup_correct .status-icon::after, .xmodule_display.xmodule_ProblemBlock div.problem .choicetextgroup .choicegroup input + section.choicetextgroup_correct .status-icon::after, .xmodule_display.xmodule_ProblemBlock div.problem .choicetextgroup input + section.choicetextgroup_correct .status-icon::after, .xmodule_display.xmodule_ProblemBlock div.problem .choicegroup input:focus + label.choicegroup_correct .status-icon::after, .xmodule_display.xmodule_ProblemBlock div.problem .choicetextgroup input:focus + label.choicegroup_correct .status-icon::after, .xmodule_display.xmodule_ProblemBlock div.problem .choicetextgroup .choicegroup input:focus + label.choicetextgroup_correct .status-icon::after, .xmodule_display.xmodule_ProblemBlock div.problem .choicetextgroup input:focus + label.choicetextgroup_correct .status-icon::after, .xmodule_display.xmodule_ProblemBlock div.problem .choicetextgroup .choicegroup input:focus + section.choicetextgroup_correct .status-icon::after, .xmodule_display.xmodule_ProblemBlock div.problem .choicetextgroup input:focus + section.choicetextgroup_correct .status-icon::after, .xmodule_display.xmodule_ProblemBlock div.problem .choicegroup input:hover + label.choicegroup_correct .status-icon::after, .xmodule_display.xmodule_ProblemBlock div.problem .choicetextgroup input:hover + label.choicegroup_correct .status-icon::after, .xmodule_display.xmodule_ProblemBlock div.problem .choicetextgroup .choicegroup input:hover + label.choicetextgroup_correct .status-icon::after, .xmodule_display.xmodule_ProblemBlock div.problem .choicetextgroup input:hover + label.choicetextgroup_correct .status-icon::after, .xmodule_display.xmodule_ProblemBlock div.problem .choicetextgroup .choicegroup input:hover + section.choicetextgroup_correct .status-icon::after, .xmodule_display.xmodule_ProblemBlock div.problem .choicetextgroup input:hover + section.choicetextgroup_correct .status-icon::after { +.xmodule_display.xmodule_ProblemBlock div.problem .choicegroup input+label.choicegroup_correct .status-icon::after, +.xmodule_display.xmodule_ProblemBlock div.problem .choicetextgroup input+label.choicegroup_correct .status-icon::after, +.xmodule_display.xmodule_ProblemBlock div.problem .choicetextgroup .choicegroup input+label.choicetextgroup_correct .status-icon::after, +.xmodule_display.xmodule_ProblemBlock div.problem .choicetextgroup input+label.choicetextgroup_correct .status-icon::after, +.xmodule_display.xmodule_ProblemBlock div.problem .choicetextgroup .choicegroup input+section.choicetextgroup_correct .status-icon::after, +.xmodule_display.xmodule_ProblemBlock div.problem .choicetextgroup input+section.choicetextgroup_correct .status-icon::after, +.xmodule_display.xmodule_ProblemBlock div.problem .choicegroup input:focus+label.choicegroup_correct .status-icon::after, +.xmodule_display.xmodule_ProblemBlock div.problem .choicetextgroup input:focus+label.choicegroup_correct .status-icon::after, +.xmodule_display.xmodule_ProblemBlock div.problem .choicetextgroup .choicegroup input:focus+label.choicetextgroup_correct .status-icon::after, +.xmodule_display.xmodule_ProblemBlock div.problem .choicetextgroup input:focus+label.choicetextgroup_correct .status-icon::after, +.xmodule_display.xmodule_ProblemBlock div.problem .choicetextgroup .choicegroup input:focus+section.choicetextgroup_correct .status-icon::after, +.xmodule_display.xmodule_ProblemBlock div.problem .choicetextgroup input:focus+section.choicetextgroup_correct .status-icon::after, +.xmodule_display.xmodule_ProblemBlock div.problem .choicegroup input:hover+label.choicegroup_correct .status-icon::after, +.xmodule_display.xmodule_ProblemBlock div.problem .choicetextgroup input:hover+label.choicegroup_correct .status-icon::after, +.xmodule_display.xmodule_ProblemBlock div.problem .choicetextgroup .choicegroup input:hover+label.choicetextgroup_correct .status-icon::after, +.xmodule_display.xmodule_ProblemBlock div.problem .choicetextgroup input:hover+label.choicetextgroup_correct .status-icon::after, +.xmodule_display.xmodule_ProblemBlock div.problem .choicetextgroup .choicegroup input:hover+section.choicetextgroup_correct .status-icon::after, +.xmodule_display.xmodule_ProblemBlock div.problem .choicetextgroup input:hover+section.choicetextgroup_correct .status-icon::after { color: var(--correct); font-size: 1.2em; content: ""; } -.xmodule_display.xmodule_ProblemBlock div.problem .choicegroup input + label.choicegroup_partially-correct, .xmodule_display.xmodule_ProblemBlock div.problem .choicetextgroup input + label.choicegroup_partially-correct, .xmodule_display.xmodule_ProblemBlock div.problem .choicetextgroup .choicegroup input + label.choicetextgroup_partially-correct, .xmodule_display.xmodule_ProblemBlock div.problem .choicetextgroup input + label.choicetextgroup_partially-correct, .xmodule_display.xmodule_ProblemBlock div.problem .choicetextgroup .choicegroup input + section.choicetextgroup_partially-correct, .xmodule_display.xmodule_ProblemBlock div.problem .choicetextgroup input + section.choicetextgroup_partially-correct, .xmodule_display.xmodule_ProblemBlock div.problem .choicegroup input:focus + label.choicegroup_partially-correct, .xmodule_display.xmodule_ProblemBlock div.problem .choicetextgroup input:focus + label.choicegroup_partially-correct, .xmodule_display.xmodule_ProblemBlock div.problem .choicetextgroup .choicegroup input:focus + label.choicetextgroup_partially-correct, .xmodule_display.xmodule_ProblemBlock div.problem .choicetextgroup input:focus + label.choicetextgroup_partially-correct, .xmodule_display.xmodule_ProblemBlock div.problem .choicetextgroup .choicegroup input:focus + section.choicetextgroup_partially-correct, .xmodule_display.xmodule_ProblemBlock div.problem .choicetextgroup input:focus + section.choicetextgroup_partially-correct, .xmodule_display.xmodule_ProblemBlock div.problem .choicegroup input:hover + label.choicegroup_partially-correct, .xmodule_display.xmodule_ProblemBlock div.problem .choicetextgroup input:hover + label.choicegroup_partially-correct, .xmodule_display.xmodule_ProblemBlock div.problem .choicetextgroup .choicegroup input:hover + label.choicetextgroup_partially-correct, .xmodule_display.xmodule_ProblemBlock div.problem .choicetextgroup input:hover + label.choicetextgroup_partially-correct, .xmodule_display.xmodule_ProblemBlock div.problem .choicetextgroup .choicegroup input:hover + section.choicetextgroup_partially-correct, .xmodule_display.xmodule_ProblemBlock div.problem .choicetextgroup input:hover + section.choicetextgroup_partially-correct { +.xmodule_display.xmodule_ProblemBlock div.problem .choicegroup input+label.choicegroup_partially-correct, +.xmodule_display.xmodule_ProblemBlock div.problem .choicetextgroup input+label.choicegroup_partially-correct, +.xmodule_display.xmodule_ProblemBlock div.problem .choicetextgroup .choicegroup input+label.choicetextgroup_partially-correct, +.xmodule_display.xmodule_ProblemBlock div.problem .choicetextgroup input+label.choicetextgroup_partially-correct, +.xmodule_display.xmodule_ProblemBlock div.problem .choicetextgroup .choicegroup input+section.choicetextgroup_partially-correct, +.xmodule_display.xmodule_ProblemBlock div.problem .choicetextgroup input+section.choicetextgroup_partially-correct, +.xmodule_display.xmodule_ProblemBlock div.problem .choicegroup input:focus+label.choicegroup_partially-correct, +.xmodule_display.xmodule_ProblemBlock div.problem .choicetextgroup input:focus+label.choicegroup_partially-correct, +.xmodule_display.xmodule_ProblemBlock div.problem .choicetextgroup .choicegroup input:focus+label.choicetextgroup_partially-correct, +.xmodule_display.xmodule_ProblemBlock div.problem .choicetextgroup input:focus+label.choicetextgroup_partially-correct, +.xmodule_display.xmodule_ProblemBlock div.problem .choicetextgroup .choicegroup input:focus+section.choicetextgroup_partially-correct, +.xmodule_display.xmodule_ProblemBlock div.problem .choicetextgroup input:focus+section.choicetextgroup_partially-correct, +.xmodule_display.xmodule_ProblemBlock div.problem .choicegroup input:hover+label.choicegroup_partially-correct, +.xmodule_display.xmodule_ProblemBlock div.problem .choicetextgroup input:hover+label.choicegroup_partially-correct, +.xmodule_display.xmodule_ProblemBlock div.problem .choicetextgroup .choicegroup input:hover+label.choicetextgroup_partially-correct, +.xmodule_display.xmodule_ProblemBlock div.problem .choicetextgroup input:hover+label.choicetextgroup_partially-correct, +.xmodule_display.xmodule_ProblemBlock div.problem .choicetextgroup .choicegroup input:hover+section.choicetextgroup_partially-correct, +.xmodule_display.xmodule_ProblemBlock div.problem .choicetextgroup input:hover+section.choicetextgroup_partially-correct { border: 2px solid var(--partially-correct); } -.xmodule_display.xmodule_ProblemBlock div.problem .choicegroup input + label.choicegroup_partially-correct .status-icon::after, .xmodule_display.xmodule_ProblemBlock div.problem .choicetextgroup input + label.choicegroup_partially-correct .status-icon::after, .xmodule_display.xmodule_ProblemBlock div.problem .choicetextgroup .choicegroup input + label.choicetextgroup_partially-correct .status-icon::after, .xmodule_display.xmodule_ProblemBlock div.problem .choicetextgroup input + label.choicetextgroup_partially-correct .status-icon::after, .xmodule_display.xmodule_ProblemBlock div.problem .choicetextgroup .choicegroup input + section.choicetextgroup_partially-correct .status-icon::after, .xmodule_display.xmodule_ProblemBlock div.problem .choicetextgroup input + section.choicetextgroup_partially-correct .status-icon::after, .xmodule_display.xmodule_ProblemBlock div.problem .choicegroup input:focus + label.choicegroup_partially-correct .status-icon::after, .xmodule_display.xmodule_ProblemBlock div.problem .choicetextgroup input:focus + label.choicegroup_partially-correct .status-icon::after, .xmodule_display.xmodule_ProblemBlock div.problem .choicetextgroup .choicegroup input:focus + label.choicetextgroup_partially-correct .status-icon::after, .xmodule_display.xmodule_ProblemBlock div.problem .choicetextgroup input:focus + label.choicetextgroup_partially-correct .status-icon::after, .xmodule_display.xmodule_ProblemBlock div.problem .choicetextgroup .choicegroup input:focus + section.choicetextgroup_partially-correct .status-icon::after, .xmodule_display.xmodule_ProblemBlock div.problem .choicetextgroup input:focus + section.choicetextgroup_partially-correct .status-icon::after, .xmodule_display.xmodule_ProblemBlock div.problem .choicegroup input:hover + label.choicegroup_partially-correct .status-icon::after, .xmodule_display.xmodule_ProblemBlock div.problem .choicetextgroup input:hover + label.choicegroup_partially-correct .status-icon::after, .xmodule_display.xmodule_ProblemBlock div.problem .choicetextgroup .choicegroup input:hover + label.choicetextgroup_partially-correct .status-icon::after, .xmodule_display.xmodule_ProblemBlock div.problem .choicetextgroup input:hover + label.choicetextgroup_partially-correct .status-icon::after, .xmodule_display.xmodule_ProblemBlock div.problem .choicetextgroup .choicegroup input:hover + section.choicetextgroup_partially-correct .status-icon::after, .xmodule_display.xmodule_ProblemBlock div.problem .choicetextgroup input:hover + section.choicetextgroup_partially-correct .status-icon::after { +.xmodule_display.xmodule_ProblemBlock div.problem .choicegroup input+label.choicegroup_partially-correct .status-icon::after, +.xmodule_display.xmodule_ProblemBlock div.problem .choicetextgroup input+label.choicegroup_partially-correct .status-icon::after, +.xmodule_display.xmodule_ProblemBlock div.problem .choicetextgroup .choicegroup input+label.choicetextgroup_partially-correct .status-icon::after, +.xmodule_display.xmodule_ProblemBlock div.problem .choicetextgroup input+label.choicetextgroup_partially-correct .status-icon::after, +.xmodule_display.xmodule_ProblemBlock div.problem .choicetextgroup .choicegroup input+section.choicetextgroup_partially-correct .status-icon::after, +.xmodule_display.xmodule_ProblemBlock div.problem .choicetextgroup input+section.choicetextgroup_partially-correct .status-icon::after, +.xmodule_display.xmodule_ProblemBlock div.problem .choicegroup input:focus+label.choicegroup_partially-correct .status-icon::after, +.xmodule_display.xmodule_ProblemBlock div.problem .choicetextgroup input:focus+label.choicegroup_partially-correct .status-icon::after, +.xmodule_display.xmodule_ProblemBlock div.problem .choicetextgroup .choicegroup input:focus+label.choicetextgroup_partially-correct .status-icon::after, +.xmodule_display.xmodule_ProblemBlock div.problem .choicetextgroup input:focus+label.choicetextgroup_partially-correct .status-icon::after, +.xmodule_display.xmodule_ProblemBlock div.problem .choicetextgroup .choicegroup input:focus+section.choicetextgroup_partially-correct .status-icon::after, +.xmodule_display.xmodule_ProblemBlock div.problem .choicetextgroup input:focus+section.choicetextgroup_partially-correct .status-icon::after, +.xmodule_display.xmodule_ProblemBlock div.problem .choicegroup input:hover+label.choicegroup_partially-correct .status-icon::after, +.xmodule_display.xmodule_ProblemBlock div.problem .choicetextgroup input:hover+label.choicegroup_partially-correct .status-icon::after, +.xmodule_display.xmodule_ProblemBlock div.problem .choicetextgroup .choicegroup input:hover+label.choicetextgroup_partially-correct .status-icon::after, +.xmodule_display.xmodule_ProblemBlock div.problem .choicetextgroup input:hover+label.choicetextgroup_partially-correct .status-icon::after, +.xmodule_display.xmodule_ProblemBlock div.problem .choicetextgroup .choicegroup input:hover+section.choicetextgroup_partially-correct .status-icon::after, +.xmodule_display.xmodule_ProblemBlock div.problem .choicetextgroup input:hover+section.choicetextgroup_partially-correct .status-icon::after { color: var(--partially-correct); font-size: 1.2em; content: ""; } -.xmodule_display.xmodule_ProblemBlock div.problem .choicegroup input + label.choicegroup_incorrect, .xmodule_display.xmodule_ProblemBlock div.problem .choicetextgroup input + label.choicegroup_incorrect, .xmodule_display.xmodule_ProblemBlock div.problem .choicetextgroup .choicegroup input + label.choicetextgroup_incorrect, .xmodule_display.xmodule_ProblemBlock div.problem .choicetextgroup input + label.choicetextgroup_incorrect, .xmodule_display.xmodule_ProblemBlock div.problem .choicetextgroup .choicegroup input + section.choicetextgroup_incorrect, .xmodule_display.xmodule_ProblemBlock div.problem .choicetextgroup input + section.choicetextgroup_incorrect, .xmodule_display.xmodule_ProblemBlock div.problem .choicegroup input:focus + label.choicegroup_incorrect, .xmodule_display.xmodule_ProblemBlock div.problem .choicetextgroup input:focus + label.choicegroup_incorrect, .xmodule_display.xmodule_ProblemBlock div.problem .choicetextgroup .choicegroup input:focus + label.choicetextgroup_incorrect, .xmodule_display.xmodule_ProblemBlock div.problem .choicetextgroup input:focus + label.choicetextgroup_incorrect, .xmodule_display.xmodule_ProblemBlock div.problem .choicetextgroup .choicegroup input:focus + section.choicetextgroup_incorrect, .xmodule_display.xmodule_ProblemBlock div.problem .choicetextgroup input:focus + section.choicetextgroup_incorrect, .xmodule_display.xmodule_ProblemBlock div.problem .choicegroup input:hover + label.choicegroup_incorrect, .xmodule_display.xmodule_ProblemBlock div.problem .choicetextgroup input:hover + label.choicegroup_incorrect, .xmodule_display.xmodule_ProblemBlock div.problem .choicetextgroup .choicegroup input:hover + label.choicetextgroup_incorrect, .xmodule_display.xmodule_ProblemBlock div.problem .choicetextgroup input:hover + label.choicetextgroup_incorrect, .xmodule_display.xmodule_ProblemBlock div.problem .choicetextgroup .choicegroup input:hover + section.choicetextgroup_incorrect, .xmodule_display.xmodule_ProblemBlock div.problem .choicetextgroup input:hover + section.choicetextgroup_incorrect { +.xmodule_display.xmodule_ProblemBlock div.problem .choicegroup input+label.choicegroup_incorrect, +.xmodule_display.xmodule_ProblemBlock div.problem .choicetextgroup input+label.choicegroup_incorrect, +.xmodule_display.xmodule_ProblemBlock div.problem .choicetextgroup .choicegroup input+label.choicetextgroup_incorrect, +.xmodule_display.xmodule_ProblemBlock div.problem .choicetextgroup input+label.choicetextgroup_incorrect, +.xmodule_display.xmodule_ProblemBlock div.problem .choicetextgroup .choicegroup input+section.choicetextgroup_incorrect, +.xmodule_display.xmodule_ProblemBlock div.problem .choicetextgroup input+section.choicetextgroup_incorrect, +.xmodule_display.xmodule_ProblemBlock div.problem .choicegroup input:focus+label.choicegroup_incorrect, +.xmodule_display.xmodule_ProblemBlock div.problem .choicetextgroup input:focus+label.choicegroup_incorrect, +.xmodule_display.xmodule_ProblemBlock div.problem .choicetextgroup .choicegroup input:focus+label.choicetextgroup_incorrect, +.xmodule_display.xmodule_ProblemBlock div.problem .choicetextgroup input:focus+label.choicetextgroup_incorrect, +.xmodule_display.xmodule_ProblemBlock div.problem .choicetextgroup .choicegroup input:focus+section.choicetextgroup_incorrect, +.xmodule_display.xmodule_ProblemBlock div.problem .choicetextgroup input:focus+section.choicetextgroup_incorrect, +.xmodule_display.xmodule_ProblemBlock div.problem .choicegroup input:hover+label.choicegroup_incorrect, +.xmodule_display.xmodule_ProblemBlock div.problem .choicetextgroup input:hover+label.choicegroup_incorrect, +.xmodule_display.xmodule_ProblemBlock div.problem .choicetextgroup .choicegroup input:hover+label.choicetextgroup_incorrect, +.xmodule_display.xmodule_ProblemBlock div.problem .choicetextgroup input:hover+label.choicetextgroup_incorrect, +.xmodule_display.xmodule_ProblemBlock div.problem .choicetextgroup .choicegroup input:hover+section.choicetextgroup_incorrect, +.xmodule_display.xmodule_ProblemBlock div.problem .choicetextgroup input:hover+section.choicetextgroup_incorrect { border: 2px solid var(--incorrect); } -.xmodule_display.xmodule_ProblemBlock div.problem .choicegroup input + label.choicegroup_incorrect .status-icon::after, .xmodule_display.xmodule_ProblemBlock div.problem .choicetextgroup input + label.choicegroup_incorrect .status-icon::after, .xmodule_display.xmodule_ProblemBlock div.problem .choicetextgroup .choicegroup input + label.choicetextgroup_incorrect .status-icon::after, .xmodule_display.xmodule_ProblemBlock div.problem .choicetextgroup input + label.choicetextgroup_incorrect .status-icon::after, .xmodule_display.xmodule_ProblemBlock div.problem .choicetextgroup .choicegroup input + section.choicetextgroup_incorrect .status-icon::after, .xmodule_display.xmodule_ProblemBlock div.problem .choicetextgroup input + section.choicetextgroup_incorrect .status-icon::after, .xmodule_display.xmodule_ProblemBlock div.problem .choicegroup input:focus + label.choicegroup_incorrect .status-icon::after, .xmodule_display.xmodule_ProblemBlock div.problem .choicetextgroup input:focus + label.choicegroup_incorrect .status-icon::after, .xmodule_display.xmodule_ProblemBlock div.problem .choicetextgroup .choicegroup input:focus + label.choicetextgroup_incorrect .status-icon::after, .xmodule_display.xmodule_ProblemBlock div.problem .choicetextgroup input:focus + label.choicetextgroup_incorrect .status-icon::after, .xmodule_display.xmodule_ProblemBlock div.problem .choicetextgroup .choicegroup input:focus + section.choicetextgroup_incorrect .status-icon::after, .xmodule_display.xmodule_ProblemBlock div.problem .choicetextgroup input:focus + section.choicetextgroup_incorrect .status-icon::after, .xmodule_display.xmodule_ProblemBlock div.problem .choicegroup input:hover + label.choicegroup_incorrect .status-icon::after, .xmodule_display.xmodule_ProblemBlock div.problem .choicetextgroup input:hover + label.choicegroup_incorrect .status-icon::after, .xmodule_display.xmodule_ProblemBlock div.problem .choicetextgroup .choicegroup input:hover + label.choicetextgroup_incorrect .status-icon::after, .xmodule_display.xmodule_ProblemBlock div.problem .choicetextgroup input:hover + label.choicetextgroup_incorrect .status-icon::after, .xmodule_display.xmodule_ProblemBlock div.problem .choicetextgroup .choicegroup input:hover + section.choicetextgroup_incorrect .status-icon::after, .xmodule_display.xmodule_ProblemBlock div.problem .choicetextgroup input:hover + section.choicetextgroup_incorrect .status-icon::after { +.xmodule_display.xmodule_ProblemBlock div.problem .choicegroup input+label.choicegroup_incorrect .status-icon::after, +.xmodule_display.xmodule_ProblemBlock div.problem .choicetextgroup input+label.choicegroup_incorrect .status-icon::after, +.xmodule_display.xmodule_ProblemBlock div.problem .choicetextgroup .choicegroup input+label.choicetextgroup_incorrect .status-icon::after, +.xmodule_display.xmodule_ProblemBlock div.problem .choicetextgroup input+label.choicetextgroup_incorrect .status-icon::after, +.xmodule_display.xmodule_ProblemBlock div.problem .choicetextgroup .choicegroup input+section.choicetextgroup_incorrect .status-icon::after, +.xmodule_display.xmodule_ProblemBlock div.problem .choicetextgroup input+section.choicetextgroup_incorrect .status-icon::after, +.xmodule_display.xmodule_ProblemBlock div.problem .choicegroup input:focus+label.choicegroup_incorrect .status-icon::after, +.xmodule_display.xmodule_ProblemBlock div.problem .choicetextgroup input:focus+label.choicegroup_incorrect .status-icon::after, +.xmodule_display.xmodule_ProblemBlock div.problem .choicetextgroup .choicegroup input:focus+label.choicetextgroup_incorrect .status-icon::after, +.xmodule_display.xmodule_ProblemBlock div.problem .choicetextgroup input:focus+label.choicetextgroup_incorrect .status-icon::after, +.xmodule_display.xmodule_ProblemBlock div.problem .choicetextgroup .choicegroup input:focus+section.choicetextgroup_incorrect .status-icon::after, +.xmodule_display.xmodule_ProblemBlock div.problem .choicetextgroup input:focus+section.choicetextgroup_incorrect .status-icon::after, +.xmodule_display.xmodule_ProblemBlock div.problem .choicegroup input:hover+label.choicegroup_incorrect .status-icon::after, +.xmodule_display.xmodule_ProblemBlock div.problem .choicetextgroup input:hover+label.choicegroup_incorrect .status-icon::after, +.xmodule_display.xmodule_ProblemBlock div.problem .choicetextgroup .choicegroup input:hover+label.choicetextgroup_incorrect .status-icon::after, +.xmodule_display.xmodule_ProblemBlock div.problem .choicetextgroup input:hover+label.choicetextgroup_incorrect .status-icon::after, +.xmodule_display.xmodule_ProblemBlock div.problem .choicetextgroup .choicegroup input:hover+section.choicetextgroup_incorrect .status-icon::after, +.xmodule_display.xmodule_ProblemBlock div.problem .choicetextgroup input:hover+section.choicetextgroup_incorrect .status-icon::after { color: var(--incorrect); font-size: 1.2em; content: ""; } -.xmodule_display.xmodule_ProblemBlock div.problem .choicegroup input + label.choicegroup_submitted, .xmodule_display.xmodule_ProblemBlock div.problem .choicetextgroup input + label.choicegroup_submitted, .xmodule_display.xmodule_ProblemBlock div.problem .choicetextgroup .choicegroup input + label.choicetextgroup_submitted, .xmodule_display.xmodule_ProblemBlock div.problem .choicetextgroup input + label.choicetextgroup_submitted, .xmodule_display.xmodule_ProblemBlock div.problem .choicetextgroup .choicegroup input + section.choicetextgroup_submitted, .xmodule_display.xmodule_ProblemBlock div.problem .choicetextgroup input + section.choicetextgroup_submitted, .xmodule_display.xmodule_ProblemBlock div.problem .choicegroup input:focus + label.choicegroup_submitted, .xmodule_display.xmodule_ProblemBlock div.problem .choicetextgroup input:focus + label.choicegroup_submitted, .xmodule_display.xmodule_ProblemBlock div.problem .choicetextgroup .choicegroup input:focus + label.choicetextgroup_submitted, .xmodule_display.xmodule_ProblemBlock div.problem .choicetextgroup input:focus + label.choicetextgroup_submitted, .xmodule_display.xmodule_ProblemBlock div.problem .choicetextgroup .choicegroup input:focus + section.choicetextgroup_submitted, .xmodule_display.xmodule_ProblemBlock div.problem .choicetextgroup input:focus + section.choicetextgroup_submitted, .xmodule_display.xmodule_ProblemBlock div.problem .choicegroup input:hover + label.choicegroup_submitted, .xmodule_display.xmodule_ProblemBlock div.problem .choicetextgroup input:hover + label.choicegroup_submitted, .xmodule_display.xmodule_ProblemBlock div.problem .choicetextgroup .choicegroup input:hover + label.choicetextgroup_submitted, .xmodule_display.xmodule_ProblemBlock div.problem .choicetextgroup input:hover + label.choicetextgroup_submitted, .xmodule_display.xmodule_ProblemBlock div.problem .choicetextgroup .choicegroup input:hover + section.choicetextgroup_submitted, .xmodule_display.xmodule_ProblemBlock div.problem .choicetextgroup input:hover + section.choicetextgroup_submitted { +.xmodule_display.xmodule_ProblemBlock div.problem .choicegroup input+label.choicegroup_submitted, +.xmodule_display.xmodule_ProblemBlock div.problem .choicetextgroup input+label.choicegroup_submitted, +.xmodule_display.xmodule_ProblemBlock div.problem .choicetextgroup .choicegroup input+label.choicetextgroup_submitted, +.xmodule_display.xmodule_ProblemBlock div.problem .choicetextgroup input+label.choicetextgroup_submitted, +.xmodule_display.xmodule_ProblemBlock div.problem .choicetextgroup .choicegroup input+section.choicetextgroup_submitted, +.xmodule_display.xmodule_ProblemBlock div.problem .choicetextgroup input+section.choicetextgroup_submitted, +.xmodule_display.xmodule_ProblemBlock div.problem .choicegroup input:focus+label.choicegroup_submitted, +.xmodule_display.xmodule_ProblemBlock div.problem .choicetextgroup input:focus+label.choicegroup_submitted, +.xmodule_display.xmodule_ProblemBlock div.problem .choicetextgroup .choicegroup input:focus+label.choicetextgroup_submitted, +.xmodule_display.xmodule_ProblemBlock div.problem .choicetextgroup input:focus+label.choicetextgroup_submitted, +.xmodule_display.xmodule_ProblemBlock div.problem .choicetextgroup .choicegroup input:focus+section.choicetextgroup_submitted, +.xmodule_display.xmodule_ProblemBlock div.problem .choicetextgroup input:focus+section.choicetextgroup_submitted, +.xmodule_display.xmodule_ProblemBlock div.problem .choicegroup input:hover+label.choicegroup_submitted, +.xmodule_display.xmodule_ProblemBlock div.problem .choicetextgroup input:hover+label.choicegroup_submitted, +.xmodule_display.xmodule_ProblemBlock div.problem .choicetextgroup .choicegroup input:hover+label.choicetextgroup_submitted, +.xmodule_display.xmodule_ProblemBlock div.problem .choicetextgroup input:hover+label.choicetextgroup_submitted, +.xmodule_display.xmodule_ProblemBlock div.problem .choicetextgroup .choicegroup input:hover+section.choicetextgroup_submitted, +.xmodule_display.xmodule_ProblemBlock div.problem .choicetextgroup input:hover+section.choicetextgroup_submitted { border: 2px solid var(--submitted); } @@ -251,7 +417,7 @@ white-space: normal; } -.xmodule_display.xmodule_ProblemBlock div.problem .choicegroup legend + .question-description { +.xmodule_display.xmodule_ProblemBlock div.problem .choicegroup legend+.question-description { margin-top: calc(-1 * var(--baseline)); max-width: 100%; white-space: normal; @@ -283,7 +449,9 @@ content: ""; } -.xmodule_display.xmodule_ProblemBlock div.problem .indicator-container .status.submitted .status-icon, .xmodule_display.xmodule_ProblemBlock div.problem .indicator-container .status.unsubmitted .status-icon, .xmodule_display.xmodule_ProblemBlock div.problem .indicator-container .status.unanswered .status-icon { +.xmodule_display.xmodule_ProblemBlock div.problem .indicator-container .status.submitted .status-icon, +.xmodule_display.xmodule_ProblemBlock div.problem .indicator-container .status.unsubmitted .status-icon, +.xmodule_display.xmodule_ProblemBlock div.problem .indicator-container .status.unanswered .status-icon { content: ''; } @@ -294,22 +462,22 @@ content: " "; } -.xmodule_display.xmodule_ProblemBlock div.problem .solution-span > span { +.xmodule_display.xmodule_ProblemBlock div.problem .solution-span>span { margin: var(--baseline) 0; display: block; position: relative; } -.xmodule_display.xmodule_ProblemBlock div.problem .solution-span > span:empty { +.xmodule_display.xmodule_ProblemBlock div.problem .solution-span>span:empty { display: none; } -.xmodule_display.xmodule_ProblemBlock div.problem .targeted-feedback-span > span { +.xmodule_display.xmodule_ProblemBlock div.problem .targeted-feedback-span>span { display: block; position: relative; } -.xmodule_display.xmodule_ProblemBlock div.problem .targeted-feedback-span > span:empty { +.xmodule_display.xmodule_ProblemBlock div.problem .targeted-feedback-span>span:empty { display: none; } @@ -325,11 +493,13 @@ color: var(--blue); } -.xmodule_display.xmodule_ProblemBlock div.problem div.correct input, .xmodule_display.xmodule_ProblemBlock div.problem div.ui-icon-check input { +.xmodule_display.xmodule_ProblemBlock div.problem div.correct input, +.xmodule_display.xmodule_ProblemBlock div.problem div.ui-icon-check input { border-color: var(--correct); } -.xmodule_display.xmodule_ProblemBlock div.problem div.partially-correct input, .xmodule_display.xmodule_ProblemBlock div.problem div.ui-icon-check input { +.xmodule_display.xmodule_ProblemBlock div.problem div.partially-correct input, +.xmodule_display.xmodule_ProblemBlock div.problem div.ui-icon-check input { border-color: var(--partially-correct); } @@ -341,11 +511,13 @@ border-color: var(--incorrect); } -.xmodule_display.xmodule_ProblemBlock div.problem div.incorrect input, .xmodule_display.xmodule_ProblemBlock div.problem div.incomplete input { +.xmodule_display.xmodule_ProblemBlock div.problem div.incorrect input, +.xmodule_display.xmodule_ProblemBlock div.problem div.incomplete input { border-color: var(--incorrect); } -.xmodule_display.xmodule_ProblemBlock div.problem div.submitted input, .xmodule_display.xmodule_ProblemBlock div.problem div.ui-icon-check input { +.xmodule_display.xmodule_ProblemBlock div.problem div.submitted input, +.xmodule_display.xmodule_ProblemBlock div.problem div.ui-icon-check input { border-color: var(--submitted); } @@ -383,7 +555,9 @@ display: inline-block; } -.xmodule_display.xmodule_ProblemBlock div.problem div div.equation span.MathJax_CHTML, .xmodule_display.xmodule_ProblemBlock div.problem div div.equation span.MathJax, .xmodule_display.xmodule_ProblemBlock div.problem div div.equation span.MathJax_SVG { +.xmodule_display.xmodule_ProblemBlock div.problem div div.equation span.MathJax_CHTML, +.xmodule_display.xmodule_ProblemBlock div.problem div div.equation span.MathJax, +.xmodule_display.xmodule_ProblemBlock div.problem div div.equation span.MathJax_SVG { padding: 6px; min-width: 30px; border: 1px solid #e3e3e3; @@ -406,7 +580,8 @@ background: url("var(--static-path)/images/unanswered-icon.png") center center no-repeat; } -.xmodule_display.xmodule_ProblemBlock div.problem div span.processing, .xmodule_display.xmodule_ProblemBlock div.problem div span.ui-icon-processing { +.xmodule_display.xmodule_ProblemBlock div.problem div span.processing, +.xmodule_display.xmodule_ProblemBlock div.problem div span.ui-icon-processing { display: inline-block; position: relative; top: 6px; @@ -424,7 +599,8 @@ background: url("var(--static-path)/images/correct-icon.png") center center no-repeat; } -.xmodule_display.xmodule_ProblemBlock div.problem div span.incomplete, .xmodule_display.xmodule_ProblemBlock div.problem div span.ui-icon-close { +.xmodule_display.xmodule_ProblemBlock div.problem div span.incomplete, +.xmodule_display.xmodule_ProblemBlock div.problem div span.ui-icon-close { display: inline-block; position: relative; top: 3px; @@ -528,7 +704,7 @@ margin: var(--baseline) 0px; } -.xmodule_display.xmodule_ProblemBlock div.problem div.inline > span { +.xmodule_display.xmodule_ProblemBlock div.problem div.inline>span { display: inline; } @@ -578,15 +754,18 @@ table-layout: auto; } -.xmodule_display.xmodule_ProblemBlock div.problem table td.cont-justified-left, .xmodule_display.xmodule_ProblemBlock div.problem table th.cont-justified-left { +.xmodule_display.xmodule_ProblemBlock div.problem table td.cont-justified-left, +.xmodule_display.xmodule_ProblemBlock div.problem table th.cont-justified-left { text-align: left !important; } -.xmodule_display.xmodule_ProblemBlock div.problem table td.cont-justified-right, .xmodule_display.xmodule_ProblemBlock div.problem table th.cont-justified-right { +.xmodule_display.xmodule_ProblemBlock div.problem table td.cont-justified-right, +.xmodule_display.xmodule_ProblemBlock div.problem table th.cont-justified-right { text-align: right !important; } -.xmodule_display.xmodule_ProblemBlock div.problem table td.cont-justified-center, .xmodule_display.xmodule_ProblemBlock div.problem table th.cont-justified-center { +.xmodule_display.xmodule_ProblemBlock div.problem table td.cont-justified-center, +.xmodule_display.xmodule_ProblemBlock div.problem table th.cont-justified-center { text-align: center !important; } @@ -598,7 +777,9 @@ text-align: left; } -.xmodule_display.xmodule_ProblemBlock div.problem table caption, .xmodule_display.xmodule_ProblemBlock div.problem table th, .xmodule_display.xmodule_ProblemBlock div.problem table td { +.xmodule_display.xmodule_ProblemBlock div.problem table caption, +.xmodule_display.xmodule_ProblemBlock div.problem table th, +.xmodule_display.xmodule_ProblemBlock div.problem table td { padding: .25em .75em .25em 0; padding: .25rem .75rem .25rem 0; } @@ -611,7 +792,9 @@ background: #f1f1f1; } -.xmodule_display.xmodule_ProblemBlock div.problem table tr, .xmodule_display.xmodule_ProblemBlock div.problem table td, .xmodule_display.xmodule_ProblemBlock div.problem table th { +.xmodule_display.xmodule_ProblemBlock div.problem table tr, +.xmodule_display.xmodule_ProblemBlock div.problem table td, +.xmodule_display.xmodule_ProblemBlock div.problem table th { vertical-align: middle; } @@ -635,7 +818,7 @@ line-height: 1.4; } -.xmodule_display.xmodule_ProblemBlock div.problem pre > code { +.xmodule_display.xmodule_ProblemBlock div.problem pre>code { margin: 0; padding: 0; border: none; @@ -643,7 +826,8 @@ white-space: pre; } -.xmodule_display.xmodule_ProblemBlock .problem .capa_inputtype.textline input, .xmodule_display.xmodule_ProblemBlock .problem .inputtype.formulaequationinput input { +.xmodule_display.xmodule_ProblemBlock .problem .capa_inputtype.textline input, +.xmodule_display.xmodule_ProblemBlock .problem .inputtype.formulaequationinput input { box-sizing: border-box; border: 2px solid var(--gray-l4); border-radius: 3px; @@ -651,60 +835,75 @@ height: 46px; } -.xmodule_display.xmodule_ProblemBlock .problem .capa_inputtype.textline .status, .xmodule_display.xmodule_ProblemBlock .problem .inputtype.formulaequationinput .status { +.xmodule_display.xmodule_ProblemBlock .problem .capa_inputtype.textline .status, +.xmodule_display.xmodule_ProblemBlock .problem .inputtype.formulaequationinput .status { display: inline-block; margin-top: calc((var(--baseline) / 2)); background: none; } -.xmodule_display.xmodule_ProblemBlock .problem .capa_inputtype.textline > .incorrect input, .xmodule_display.xmodule_ProblemBlock .problem .inputtype.formulaequationinput > .incorrect input { +.xmodule_display.xmodule_ProblemBlock .problem .capa_inputtype.textline>.incorrect input, +.xmodule_display.xmodule_ProblemBlock .problem .inputtype.formulaequationinput>.incorrect input { border: 2px solid var(--incorrect); } -.xmodule_display.xmodule_ProblemBlock .problem .capa_inputtype.textline > .incorrect .status .status-icon::after, .xmodule_display.xmodule_ProblemBlock .problem .inputtype.formulaequationinput > .incorrect .status .status-icon::after { +.xmodule_display.xmodule_ProblemBlock .problem .capa_inputtype.textline>.incorrect .status .status-icon::after, +.xmodule_display.xmodule_ProblemBlock .problem .inputtype.formulaequationinput>.incorrect .status .status-icon::after { color: var(--incorrect); font-size: 1.2em; content: ""; } -.xmodule_display.xmodule_ProblemBlock .problem .capa_inputtype.textline > .partially-correct input, .xmodule_display.xmodule_ProblemBlock .problem .inputtype.formulaequationinput > .partially-correct input { +.xmodule_display.xmodule_ProblemBlock .problem .capa_inputtype.textline>.partially-correct input, +.xmodule_display.xmodule_ProblemBlock .problem .inputtype.formulaequationinput>.partially-correct input { border: 2px solid var(--partially-correct); } -.xmodule_display.xmodule_ProblemBlock .problem .capa_inputtype.textline > .partially-correct .status .status-icon::after, .xmodule_display.xmodule_ProblemBlock .problem .inputtype.formulaequationinput > .partially-correct .status .status-icon::after { +.xmodule_display.xmodule_ProblemBlock .problem .capa_inputtype.textline>.partially-correct .status .status-icon::after, +.xmodule_display.xmodule_ProblemBlock .problem .inputtype.formulaequationinput>.partially-correct .status .status-icon::after { color: var(--partially-correct); font-size: 1.2em; content: ""; } -.xmodule_display.xmodule_ProblemBlock .problem .capa_inputtype.textline > .correct input, .xmodule_display.xmodule_ProblemBlock .problem .inputtype.formulaequationinput > .correct input { +.xmodule_display.xmodule_ProblemBlock .problem .capa_inputtype.textline>.correct input, +.xmodule_display.xmodule_ProblemBlock .problem .inputtype.formulaequationinput>.correct input { border: 2px solid var(--correct); } -.xmodule_display.xmodule_ProblemBlock .problem .capa_inputtype.textline > .correct .status .status-icon::after, .xmodule_display.xmodule_ProblemBlock .problem .inputtype.formulaequationinput > .correct .status .status-icon::after { +.xmodule_display.xmodule_ProblemBlock .problem .capa_inputtype.textline>.correct .status .status-icon::after, +.xmodule_display.xmodule_ProblemBlock .problem .inputtype.formulaequationinput>.correct .status .status-icon::after { color: var(--correct); font-size: 1.2em; content: ""; } -.xmodule_display.xmodule_ProblemBlock .problem .capa_inputtype.textline > .submitted input, .xmodule_display.xmodule_ProblemBlock .problem .inputtype.formulaequationinput > .submitted input { +.xmodule_display.xmodule_ProblemBlock .problem .capa_inputtype.textline>.submitted input, +.xmodule_display.xmodule_ProblemBlock .problem .inputtype.formulaequationinput>.submitted input { border: 2px solid var(--submitted); } -.xmodule_display.xmodule_ProblemBlock .problem .capa_inputtype.textline > .submitted .status, .xmodule_display.xmodule_ProblemBlock .problem .inputtype.formulaequationinput > .submitted .status { +.xmodule_display.xmodule_ProblemBlock .problem .capa_inputtype.textline>.submitted .status, +.xmodule_display.xmodule_ProblemBlock .problem .inputtype.formulaequationinput>.submitted .status { content: ''; } -.xmodule_display.xmodule_ProblemBlock .problem .capa_inputtype.textline > .unanswered input, .xmodule_display.xmodule_ProblemBlock .problem .capa_inputtype.textline > .unsubmitted input, .xmodule_display.xmodule_ProblemBlock .problem .inputtype.formulaequationinput > .unanswered input, .xmodule_display.xmodule_ProblemBlock .problem .inputtype.formulaequationinput > .unsubmitted input { +.xmodule_display.xmodule_ProblemBlock .problem .capa_inputtype.textline>.unanswered input, +.xmodule_display.xmodule_ProblemBlock .problem .capa_inputtype.textline>.unsubmitted input, +.xmodule_display.xmodule_ProblemBlock .problem .inputtype.formulaequationinput>.unanswered input, +.xmodule_display.xmodule_ProblemBlock .problem .inputtype.formulaequationinput>.unsubmitted input { border: 2px solid var(--gray-l4); } -.xmodule_display.xmodule_ProblemBlock .problem .capa_inputtype.textline > .unanswered .status .status-icon::after, .xmodule_display.xmodule_ProblemBlock .problem .capa_inputtype.textline > .unsubmitted .status .status-icon::after, .xmodule_display.xmodule_ProblemBlock .problem .inputtype.formulaequationinput > .unanswered .status .status-icon::after, .xmodule_display.xmodule_ProblemBlock .problem .inputtype.formulaequationinput > .unsubmitted .status .status-icon::after { +.xmodule_display.xmodule_ProblemBlock .problem .capa_inputtype.textline>.unanswered .status .status-icon::after, +.xmodule_display.xmodule_ProblemBlock .problem .capa_inputtype.textline>.unsubmitted .status .status-icon::after, +.xmodule_display.xmodule_ProblemBlock .problem .inputtype.formulaequationinput>.unanswered .status .status-icon::after, +.xmodule_display.xmodule_ProblemBlock .problem .inputtype.formulaequationinput>.unsubmitted .status .status-icon::after { content: ''; display: inline-block; } -.xmodule_display.xmodule_ProblemBlock .problem .inputtype.formulaequationinput > div input { +.xmodule_display.xmodule_ProblemBlock .problem .inputtype.formulaequationinput>div input { direction: ltr; text-align: left; } @@ -819,7 +1018,9 @@ max-width: 110px; } -.xmodule_display.xmodule_ProblemBlock div.problem .action .problem-action-btn:hover, .xmodule_display.xmodule_ProblemBlock div.problem .action .problem-action-btn:focus, .xmodule_display.xmodule_ProblemBlock div.problem .action .problem-action-btn:active { +.xmodule_display.xmodule_ProblemBlock div.problem .action .problem-action-btn:hover, +.xmodule_display.xmodule_ProblemBlock div.problem .action .problem-action-btn:focus, +.xmodule_display.xmodule_ProblemBlock div.problem .action .problem-action-btn:active { color: var(--primary) !important; } @@ -895,19 +1096,11 @@ visibility: hidden; } -.xmodule_display.xmodule_ProblemBlock div.problem -var - -( ---all-text-inputs - -) -{ - display: inline -; - width: auto -; +.xmodule_display.xmodule_ProblemBlock div.problem var (--all-text-inputs) { + display: inline; + width: auto; } + .xmodule_display.xmodule_ProblemBlock div.problem center { display: block; margin: lh() 0; @@ -919,17 +1112,17 @@ var font-size: inherit; } -.xmodule_display.xmodule_ProblemBlock div.problem .detailed-solution > p { +.xmodule_display.xmodule_ProblemBlock div.problem .detailed-solution>p { margin: 0; } -.xmodule_display.xmodule_ProblemBlock div.problem .detailed-solution > p:first-child { +.xmodule_display.xmodule_ProblemBlock div.problem .detailed-solution>p:first-child { margin-bottom: 0; } -.xmodule_display.xmodule_ProblemBlock div.problem .detailed-targeted-feedback > p, -.xmodule_display.xmodule_ProblemBlock div.problem .detailed-targeted-feedback-partially-correct > p, -.xmodule_display.xmodule_ProblemBlock div.problem .detailed-targeted-feedback-correct > p { +.xmodule_display.xmodule_ProblemBlock div.problem .detailed-targeted-feedback>p, +.xmodule_display.xmodule_ProblemBlock div.problem .detailed-targeted-feedback-partially-correct>p, +.xmodule_display.xmodule_ProblemBlock div.problem .detailed-targeted-feedback-correct>p { margin: 0; font-weight: normal; } @@ -1077,7 +1270,7 @@ var margin-bottom: calc(var(--baseline) / 2); } -.xmodule_display.xmodule_ProblemBlock div.problem .capa_reset > h2 { +.xmodule_display.xmodule_ProblemBlock div.problem .capa_reset>h2 { color: #a00; } @@ -1116,7 +1309,7 @@ var box-shadow: inset 0 0 0 1px var(--white); } -.xmodule_display.xmodule_ProblemBlock div.problem .hints div > section { +.xmodule_display.xmodule_ProblemBlock div.problem .hints div>section { padding: 9px; } @@ -1134,7 +1327,7 @@ var font-size: 0.9em; } -.xmodule_display.xmodule_ProblemBlock div.problem .test > section { +.xmodule_display.xmodule_ProblemBlock div.problem .test>section { position: relative; margin-bottom: calc((var(--baseline) / 2)); padding: 9px 9px var(--baseline); @@ -1144,15 +1337,15 @@ var box-shadow: inset 0 0 0 1px #eee; } -.xmodule_display.xmodule_ProblemBlock div.problem .test > section p:last-of-type { +.xmodule_display.xmodule_ProblemBlock div.problem .test>section p:last-of-type { margin-bottom: 0; } -.xmodule_display.xmodule_ProblemBlock div.problem .test > section .shortform { +.xmodule_display.xmodule_ProblemBlock div.problem .test>section .shortform { margin-bottom: .6em; } -.xmodule_display.xmodule_ProblemBlock div.problem .test > section a.full { +.xmodule_display.xmodule_ProblemBlock div.problem .test>section a.full { position: absolute; top: 0; right: 0; @@ -1166,7 +1359,7 @@ var font-size: 1em; } -.xmodule_display.xmodule_ProblemBlock div.problem .test > section a.full.full-top { +.xmodule_display.xmodule_ProblemBlock div.problem .test>section a.full.full-top { position: absolute; top: 1px; right: 0; @@ -1174,7 +1367,7 @@ var left: 0; } -.xmodule_display.xmodule_ProblemBlock div.problem .test > section a.full.full-bottom { +.xmodule_display.xmodule_ProblemBlock div.problem .test>section a.full.full-bottom { position: absolute; top: auto; right: 0; @@ -1315,7 +1508,7 @@ var color: white; } -.xmodule_display.xmodule_ProblemBlock div.problem .rubric input[type=radio]:checked + label { +.xmodule_display.xmodule_ProblemBlock div.problem .rubric input[type=radio]:checked+label { background: #666; color: white; } @@ -1350,7 +1543,8 @@ var content: " \2191"; } -.xmodule_display.xmodule_ProblemBlock div.problem .annotation-input .block, .xmodule_display.xmodule_ProblemBlock div.problem .annotation-input ul.tags { +.xmodule_display.xmodule_ProblemBlock div.problem .annotation-input .block, +.xmodule_display.xmodule_ProblemBlock div.problem .annotation-input ul.tags { margin: .5em 0; padding: 0; } @@ -1394,7 +1588,8 @@ var left: 0; } -.xmodule_display.xmodule_ProblemBlock div.problem .annotation-input ul.tags li .tag-status, .xmodule_display.xmodule_ProblemBlock div.problem .annotation-input ul.tags li .tag { +.xmodule_display.xmodule_ProblemBlock div.problem .annotation-input ul.tags li .tag-status, +.xmodule_display.xmodule_ProblemBlock div.problem .annotation-input ul.tags li .tag { padding: .25em .5em; } @@ -1437,15 +1632,18 @@ var margin-bottom: 0.5em; } -.xmodule_display.xmodule_ProblemBlock div.problem .choicetextgroup label.choicetextgroup_correct input[type="text"], .xmodule_display.xmodule_ProblemBlock div.problem .choicetextgroup section.choicetextgroup_correct input[type="text"] { +.xmodule_display.xmodule_ProblemBlock div.problem .choicetextgroup label.choicetextgroup_correct input[type="text"], +.xmodule_display.xmodule_ProblemBlock div.problem .choicetextgroup section.choicetextgroup_correct input[type="text"] { border-color: var(--correct); } -.xmodule_display.xmodule_ProblemBlock div.problem .choicetextgroup label.choicetextgroup_partially-correct input[type="text"], .xmodule_display.xmodule_ProblemBlock div.problem .choicetextgroup section.choicetextgroup_partially-correct input[type="text"] { +.xmodule_display.xmodule_ProblemBlock div.problem .choicetextgroup label.choicetextgroup_partially-correct input[type="text"], +.xmodule_display.xmodule_ProblemBlock div.problem .choicetextgroup section.choicetextgroup_partially-correct input[type="text"] { border-color: var(--partially-correct); } -.xmodule_display.xmodule_ProblemBlock div.problem .choicetextgroup label.choicetextgroup_show_correct::after, .xmodule_display.xmodule_ProblemBlock div.problem .choicetextgroup section.choicetextgroup_show_correct::after { +.xmodule_display.xmodule_ProblemBlock div.problem .choicetextgroup label.choicetextgroup_show_correct::after, +.xmodule_display.xmodule_ProblemBlock div.problem .choicetextgroup section.choicetextgroup_show_correct::after { margin-left: calc((var(--baseline) * 0.75)); content: url("var(--static-path)/images/correct-icon.png"); } @@ -1462,11 +1660,13 @@ var height: 20px; } -.xmodule_display.xmodule_ProblemBlock div.problem .imageinput.capa_inputtype .status.unsubmitted .status-icon, .xmodule_display.xmodule_ProblemBlock div.problem .imageinput.capa_inputtype .status.unanswered .status-icon { +.xmodule_display.xmodule_ProblemBlock div.problem .imageinput.capa_inputtype .status.unsubmitted .status-icon, +.xmodule_display.xmodule_ProblemBlock div.problem .imageinput.capa_inputtype .status.unanswered .status-icon { content: ''; } -.xmodule_display.xmodule_ProblemBlock div.problem .imageinput.capa_inputtype .status.unsubmitted .status-message, .xmodule_display.xmodule_ProblemBlock div.problem .imageinput.capa_inputtype .status.unanswered .status-message { +.xmodule_display.xmodule_ProblemBlock div.problem .imageinput.capa_inputtype .status.unsubmitted .status-message, +.xmodule_display.xmodule_ProblemBlock div.problem .imageinput.capa_inputtype .status.unanswered .status-message { display: none; } @@ -1500,11 +1700,13 @@ var height: 20px; } -.xmodule_display.xmodule_ProblemBlock div.problem .annotation-input .tag-status.unsubmitted .status-icon, .xmodule_display.xmodule_ProblemBlock div.problem .annotation-input .tag-status.unanswered .status-icon { +.xmodule_display.xmodule_ProblemBlock div.problem .annotation-input .tag-status.unsubmitted .status-icon, +.xmodule_display.xmodule_ProblemBlock div.problem .annotation-input .tag-status.unanswered .status-icon { content: ''; } -.xmodule_display.xmodule_ProblemBlock div.problem .annotation-input .tag-status.unsubmitted .status-message, .xmodule_display.xmodule_ProblemBlock div.problem .annotation-input .tag-status.unanswered .status-message { +.xmodule_display.xmodule_ProblemBlock div.problem .annotation-input .tag-status.unsubmitted .status-message, +.xmodule_display.xmodule_ProblemBlock div.problem .annotation-input .tag-status.unanswered .status-message { display: none; } diff --git a/xmodule/static/css-builtin-blocks/ProblemBlockEditor.css b/xmodule/static/css-builtin-blocks/ProblemBlockEditor.css index 21399a02ce9f..467717a4076e 100644 --- a/xmodule/static/css-builtin-blocks/ProblemBlockEditor.css +++ b/xmodule/static/css-builtin-blocks/ProblemBlockEditor.css @@ -73,7 +73,8 @@ height: 21px; } -.xmodule_edit.xmodule_ProblemBlock .editor .editor-bar button:hover, .xmodule_edit.xmodule_ProblemBlock .editor .editor-bar button:focus { +.xmodule_edit.xmodule_ProblemBlock .editor .editor-bar button:hover, +.xmodule_edit.xmodule_ProblemBlock .editor .editor-bar button:focus { background: rgba(255, 255, 255, 0.5); } @@ -131,7 +132,8 @@ cursor: none; } -.xmodule_edit.xmodule_ProblemBlock .editor-bar .editor-tabs .advanced-toggle.current:hover, .xmodule_edit.xmodule_ProblemBlock .editor-bar .editor-tabs .advanced-toggle.current:focus { +.xmodule_edit.xmodule_ProblemBlock .editor-bar .editor-tabs .advanced-toggle.current:hover, +.xmodule_edit.xmodule_ProblemBlock .editor-bar .editor-tabs .advanced-toggle.current:focus { box-shadow: 0 0 0 0 !important; background-color: var(--white); } @@ -205,7 +207,7 @@ background: none; } -.xmodule_edit.xmodule_ProblemBlock .problem-editor .markdown-box + .CodeMirror { +.xmodule_edit.xmodule_ProblemBlock .problem-editor .markdown-box+.CodeMirror { padding: 10px; width: 69%; } diff --git a/xmodule/static/css-builtin-blocks/VideoBlockDisplay.css b/xmodule/static/css-builtin-blocks/VideoBlockDisplay.css index 0c4ac98d42c9..29e9fce6ef58 100644 --- a/xmodule/static/css-builtin-blocks/VideoBlockDisplay.css +++ b/xmodule/static/css-builtin-blocks/VideoBlockDisplay.css @@ -4,7 +4,8 @@ margin-bottom: calc((var(--baseline) * 1.5)); } -.xmodule_display.xmodule_VideoBlock .is-hidden, .xmodule_display.xmodule_VideoBlock .video.closed .subtitles { +.xmodule_display.xmodule_VideoBlock .is-hidden, +.xmodule_display.xmodule_VideoBlock .video.closed .subtitles { display: none; } @@ -23,7 +24,9 @@ clear: both; } -.xmodule_display.xmodule_VideoBlock .video:focus, .xmodule_display.xmodule_VideoBlock .video:active, .xmodule_display.xmodule_VideoBlock .video:hover { +.xmodule_display.xmodule_VideoBlock .video:focus, +.xmodule_display.xmodule_VideoBlock .video:active, +.xmodule_display.xmodule_VideoBlock .video:hover { border: 0; } @@ -107,7 +110,8 @@ margin: 0; } -.xmodule_display.xmodule_VideoBlock .video .wrapper-downloads .wrapper-download-transcripts .list-download-transcripts .transcript-option a.btn, .xmodule_display.xmodule_VideoBlock .video .wrapper-downloads .wrapper-download-transcripts .list-download-transcripts .transcript-option a.btn-link { +.xmodule_display.xmodule_VideoBlock .video .wrapper-downloads .wrapper-download-transcripts .list-download-transcripts .transcript-option a.btn, +.xmodule_display.xmodule_VideoBlock .video .wrapper-downloads .wrapper-download-transcripts .list-download-transcripts .transcript-option a.btn-link { font-size: 16px !important; font-weight: unset; } @@ -257,12 +261,14 @@ opacity: 0.5; } -.xmodule_display.xmodule_VideoBlock .video .video-wrapper .closed-captions.is-visible:hover, .xmodule_display.xmodule_VideoBlock .video .video-wrapper .closed-captions.is-visible.is-dragging { +.xmodule_display.xmodule_VideoBlock .video .video-wrapper .closed-captions.is-visible:hover, +.xmodule_display.xmodule_VideoBlock .video .video-wrapper .closed-captions.is-visible.is-dragging { background: black; cursor: move; } -.xmodule_display.xmodule_VideoBlock .video .video-wrapper .closed-captions.is-visible:hover::before, .xmodule_display.xmodule_VideoBlock .video .video-wrapper .closed-captions.is-visible.is-dragging::before { +.xmodule_display.xmodule_VideoBlock .video .video-wrapper .closed-captions.is-visible:hover::before, +.xmodule_display.xmodule_VideoBlock .video .video-wrapper .closed-captions.is-visible.is-dragging::before { opacity: 1; } @@ -271,11 +277,11 @@ min-height: 158px; } -.xmodule_display.xmodule_VideoBlock .video .video-wrapper .video-player > div { +.xmodule_display.xmodule_VideoBlock .video .video-wrapper .video-player>div { height: 100%; } -.xmodule_display.xmodule_VideoBlock .video .video-wrapper .video-player > div.hidden { +.xmodule_display.xmodule_VideoBlock .video .video-wrapper .video-player>div.hidden { display: none; } @@ -318,7 +324,8 @@ } .xmodule_display.xmodule_VideoBlock .video .video-wrapper .video-controls:hover ul, -.xmodule_display.xmodule_VideoBlock .video .video-wrapper .video-controls:hover div, .xmodule_display.xmodule_VideoBlock .video .video-wrapper .video-controls:focus ul, +.xmodule_display.xmodule_VideoBlock .video .video-wrapper .video-controls:hover div, +.xmodule_display.xmodule_VideoBlock .video .video-wrapper .video-controls:focus ul, .xmodule_display.xmodule_VideoBlock .video .video-wrapper .video-controls:focus div { opacity: 1; } @@ -336,11 +343,14 @@ color: #cfd8dc; } -.xmodule_display.xmodule_VideoBlock .video .video-wrapper .video-controls .control:hover, .xmodule_display.xmodule_VideoBlock .video .video-wrapper .video-controls .control:focus { +.xmodule_display.xmodule_VideoBlock .video .video-wrapper .video-controls .control:hover, +.xmodule_display.xmodule_VideoBlock .video .video-wrapper .video-controls .control:focus { background: #171a1b; } -.xmodule_display.xmodule_VideoBlock .video .video-wrapper .video-controls .control:active, .xmodule_display.xmodule_VideoBlock .video .video-wrapper .video-controls .is-active.control, .xmodule_display.xmodule_VideoBlock .video .video-wrapper .video-controls .active.control { +.xmodule_display.xmodule_VideoBlock .video .video-wrapper .video-controls .control:active, +.xmodule_display.xmodule_VideoBlock .video .video-wrapper .video-controls .is-active.control, +.xmodule_display.xmodule_VideoBlock .video .video-wrapper .video-controls .active.control { color: #0ea6ec; } @@ -402,7 +412,8 @@ box-shadow: none; } -.xmodule_display.xmodule_VideoBlock .video .video-wrapper .video-controls .slider .ui-slider-handle:focus, .xmodule_display.xmodule_VideoBlock .video .video-wrapper .video-controls .slider .ui-slider-handle:hover { +.xmodule_display.xmodule_VideoBlock .video .video-wrapper .video-controls .slider .ui-slider-handle:focus, +.xmodule_display.xmodule_VideoBlock .video .video-wrapper .video-controls .slider .ui-slider-handle:hover { background-color: #db8baf; border-color: #db8baf; } @@ -456,7 +467,7 @@ } .xmodule_display.xmodule_VideoBlock .video .video-wrapper .video-controls .secondary-controls .speed-button:focus, -.xmodule_display.xmodule_VideoBlock .video .video-wrapper .video-controls .secondary-controls .volume > .control:focus, +.xmodule_display.xmodule_VideoBlock .video .video-wrapper .video-controls .secondary-controls .volume>.control:focus, .xmodule_display.xmodule_VideoBlock .video .video-wrapper .video-controls .secondary-controls .add-fullscreen:focus, .xmodule_display.xmodule_VideoBlock .video .video-wrapper .video-controls .secondary-controls .auto-advance:focus, .xmodule_display.xmodule_VideoBlock .video .video-wrapper .video-controls .secondary-controls .quality-control:focus, @@ -504,7 +515,8 @@ white-space: nowrap; } -.xmodule_display.xmodule_VideoBlock .video .video-wrapper .video-controls .secondary-controls .menu-container .menu li .speed-option:hover, .xmodule_display.xmodule_VideoBlock .video .video-wrapper .video-controls .secondary-controls .menu-container .menu li .speed-option:focus, +.xmodule_display.xmodule_VideoBlock .video .video-wrapper .video-controls .secondary-controls .menu-container .menu li .speed-option:hover, +.xmodule_display.xmodule_VideoBlock .video .video-wrapper .video-controls .secondary-controls .menu-container .menu li .speed-option:focus, .xmodule_display.xmodule_VideoBlock .video .video-wrapper .video-controls .secondary-controls .menu-container .menu li .control-lang:hover, .xmodule_display.xmodule_VideoBlock .video .video-wrapper .video-controls .secondary-controls .menu-container .menu li .control-lang:focus { background-color: #4f595d; @@ -576,7 +588,7 @@ opacity: 1; } -.xmodule_display.xmodule_VideoBlock .video .video-wrapper .video-controls .secondary-controls .volume:not(:first-child) > a { +.xmodule_display.xmodule_VideoBlock .video .video-wrapper .video-controls .secondary-controls .volume:not(:first-child)>a { border-left: none; } @@ -613,7 +625,8 @@ box-shadow: none; } -.xmodule_display.xmodule_VideoBlock .video .video-wrapper .video-controls .secondary-controls .volume .volume-slider-container .volume-slider .ui-slider-handle:hover, .xmodule_display.xmodule_VideoBlock .video .video-wrapper .video-controls .secondary-controls .volume .volume-slider-container .volume-slider .ui-slider-handle:focus { +.xmodule_display.xmodule_VideoBlock .video .video-wrapper .video-controls .secondary-controls .volume .volume-slider-container .volume-slider .ui-slider-handle:hover, +.xmodule_display.xmodule_VideoBlock .video .video-wrapper .video-controls .secondary-controls .volume .volume-slider-container .volume-slider .ui-slider-handle:focus { background: #db8baf; border-color: #db8baf; } @@ -634,7 +647,8 @@ color: #0ea6ec; } -.xmodule_display.xmodule_VideoBlock .video .video-wrapper .video-controls .secondary-controls .quality-control.is-hidden, .xmodule_display.xmodule_VideoBlock .video.closed .video-wrapper .video-controls .secondary-controls .quality-control.subtitles { +.xmodule_display.xmodule_VideoBlock .video .video-wrapper .video-controls .secondary-controls .quality-control.is-hidden, +.xmodule_display.xmodule_VideoBlock .video.closed .video-wrapper .video-controls .secondary-controls .quality-control.subtitles { display: none !important; } @@ -642,7 +656,7 @@ color: #0ea6ec; } -.xmodule_display.xmodule_VideoBlock .video .video-wrapper .video-controls .secondary-controls .lang > .hide-subtitles { +.xmodule_display.xmodule_VideoBlock .video .video-wrapper .video-controls .secondary-controls .lang>.hide-subtitles { transition: none; } @@ -706,7 +720,8 @@ outline-offset: -1px; } -.xmodule_display.xmodule_VideoBlock .video .subtitles .subtitles-menu li:hover, .xmodule_display.xmodule_VideoBlock .video .subtitles .subtitles-menu li:focus { +.xmodule_display.xmodule_VideoBlock .video .subtitles .subtitles-menu li:hover, +.xmodule_display.xmodule_VideoBlock .video .subtitles .subtitles-menu li:focus { text-decoration: underline; } @@ -881,11 +896,16 @@ width: calc((var(--baseline) * 4)); } -.xmodule_display.xmodule_VideoBlock .video .video-pre-roll .btn-play.btn-pre-roll:hover, .xmodule_display.xmodule_VideoBlock .video .video-pre-roll .btn-play.btn-pre-roll:focus { +.xmodule_display.xmodule_VideoBlock .video .video-pre-roll .btn-play.btn-pre-roll:hover, +.xmodule_display.xmodule_VideoBlock .video .video-pre-roll .btn-play.btn-pre-roll:focus { background: var(--blue); } -.xmodule_display.xmodule_VideoBlock .video .video-wrapper .video-controls .slider .ui-slider-handle, .xmodule_display.xmodule_VideoBlock .video .video-wrapper .video-controls .secondary-controls .menu-container .menu li, .xmodule_display.xmodule_VideoBlock .video .video-wrapper .video-controls .secondary-controls .volume .volume-slider-container .volume-slider .ui-slider-handle, .xmodule_display.xmodule_VideoBlock .video .subtitles .subtitles-menu li, .xmodule_display.xmodule_VideoBlock .a11y-menu-container .a11y-menu-list li { +.xmodule_display.xmodule_VideoBlock .video .video-wrapper .video-controls .slider .ui-slider-handle, +.xmodule_display.xmodule_VideoBlock .video .video-wrapper .video-controls .secondary-controls .menu-container .menu li, +.xmodule_display.xmodule_VideoBlock .video .video-wrapper .video-controls .secondary-controls .volume .volume-slider-container .volume-slider .ui-slider-handle, +.xmodule_display.xmodule_VideoBlock .video .subtitles .subtitles-menu li, +.xmodule_display.xmodule_VideoBlock .a11y-menu-container .a11y-menu-list li { cursor: pointer; } @@ -893,15 +913,19 @@ z-index: 0; } -.xmodule_display.xmodule_VideoBlock .video .video-wrapper .video-controls .secondary-controls .menu-container .menu, .xmodule_display.xmodule_VideoBlock .video .video-wrapper .video-controls .secondary-controls .volume .volume-slider-container { +.xmodule_display.xmodule_VideoBlock .video .video-wrapper .video-controls .secondary-controls .menu-container .menu, +.xmodule_display.xmodule_VideoBlock .video .video-wrapper .video-controls .secondary-controls .volume .volume-slider-container { z-index: 10; } -.xmodule_display.xmodule_VideoBlock .video .video-pre-roll, .xmodule_display.xmodule_VideoBlock .a11y-menu-container .a11y-menu-list { +.xmodule_display.xmodule_VideoBlock .video .video-pre-roll, +.xmodule_display.xmodule_VideoBlock .a11y-menu-container .a11y-menu-list { z-index: 1000; } -.xmodule_display.xmodule_VideoBlock .video.video-fullscreen, .xmodule_display.xmodule_VideoBlock .video.video-fullscreen .tc-wrapper .video-controls, .xmodule_display.xmodule_VideoBlock .overlay { +.xmodule_display.xmodule_VideoBlock .video.video-fullscreen, +.xmodule_display.xmodule_VideoBlock .video.video-fullscreen .tc-wrapper .video-controls, +.xmodule_display.xmodule_VideoBlock .overlay { z-index: 10000; } @@ -910,7 +934,7 @@ z-index: 100000; } -.xmodule_display.xmodule_VideoBlock .video-tracks .a11y-menu-container > a::after { +.xmodule_display.xmodule_VideoBlock .video-tracks .a11y-menu-container>a::after { font-family: FontAwesome; -webkit-font-smoothing: antialiased; display: inline-block; @@ -953,7 +977,8 @@ line-height: 23px; } -.xmodule_display.xmodule_VideoBlock .a11y-menu-container .a11y-menu-list li a:hover, .xmodule_display.xmodule_VideoBlock .a11y-menu-container .a11y-menu-list li a:focus { +.xmodule_display.xmodule_VideoBlock .a11y-menu-container .a11y-menu-list li a:hover, +.xmodule_display.xmodule_VideoBlock .a11y-menu-container .a11y-menu-list li a:focus { color: var(--gray-d1); } @@ -973,16 +998,16 @@ border-left: 1px solid #eee; } -.xmodule_display.xmodule_VideoBlock .video-tracks .a11y-menu-container.open > a { +.xmodule_display.xmodule_VideoBlock .video-tracks .a11y-menu-container.open>a { background-color: var(--action-primary-active-bg); color: var(--very-light-text); } -.xmodule_display.xmodule_VideoBlock .video-tracks .a11y-menu-container.open > a::after { +.xmodule_display.xmodule_VideoBlock .video-tracks .a11y-menu-container.open>a::after { color: var(--very-light-text); } -.xmodule_display.xmodule_VideoBlock .video-tracks .a11y-menu-container > a { +.xmodule_display.xmodule_VideoBlock .video-tracks .a11y-menu-container>a { transition: all var(--tmg-f2) ease-in-out 0s; font-size: 12px; display: block; @@ -997,7 +1022,7 @@ text-overflow: ellipsis; } -.xmodule_display.xmodule_VideoBlock .video-tracks .a11y-menu-container > a::after { +.xmodule_display.xmodule_VideoBlock .video-tracks .a11y-menu-container>a::after { content: "\f0d7"; position: absolute; right: calc((var(--baseline) * 0.5)); @@ -1052,10 +1077,10 @@ outline: none; } -.xmodule_display.xmodule_VideoBlock .contextmenu .menu-item > span, -.xmodule_display.xmodule_VideoBlock .contextmenu .submenu-item > span, -.xmodule_display.xmodule_VideoBlock .submenu .menu-item > span, -.xmodule_display.xmodule_VideoBlock .submenu .submenu-item > span { +.xmodule_display.xmodule_VideoBlock .contextmenu .menu-item>span, +.xmodule_display.xmodule_VideoBlock .contextmenu .submenu-item>span, +.xmodule_display.xmodule_VideoBlock .submenu .menu-item>span, +.xmodule_display.xmodule_VideoBlock .submenu .submenu-item>span { color: #333; } @@ -1074,10 +1099,10 @@ color: var(--white); } -.xmodule_display.xmodule_VideoBlock .contextmenu .menu-item:focus > span, -.xmodule_display.xmodule_VideoBlock .contextmenu .submenu-item:focus > span, -.xmodule_display.xmodule_VideoBlock .submenu .menu-item:focus > span, -.xmodule_display.xmodule_VideoBlock .submenu .submenu-item:focus > span { +.xmodule_display.xmodule_VideoBlock .contextmenu .menu-item:focus>span, +.xmodule_display.xmodule_VideoBlock .contextmenu .submenu-item:focus>span, +.xmodule_display.xmodule_VideoBlock .submenu .menu-item:focus>span, +.xmodule_display.xmodule_VideoBlock .submenu .submenu-item:focus>span { color: var(--white); } @@ -1107,13 +1132,13 @@ color: var(--white); } -.xmodule_display.xmodule_VideoBlock .contextmenu .submenu-item.is-opened > span, -.xmodule_display.xmodule_VideoBlock .submenu .submenu-item.is-opened > span { +.xmodule_display.xmodule_VideoBlock .contextmenu .submenu-item.is-opened>span, +.xmodule_display.xmodule_VideoBlock .submenu .submenu-item.is-opened>span { color: var(--white); } -.xmodule_display.xmodule_VideoBlock .contextmenu .submenu-item.is-opened > .submenu, -.xmodule_display.xmodule_VideoBlock .submenu .submenu-item.is-opened > .submenu { +.xmodule_display.xmodule_VideoBlock .contextmenu .submenu-item.is-opened>.submenu, +.xmodule_display.xmodule_VideoBlock .submenu .submenu-item.is-opened>.submenu { display: block; } diff --git a/xmodule/static/css-builtin-blocks/VideoBlockEditor.css b/xmodule/static/css-builtin-blocks/VideoBlockEditor.css index 148f4054a1a0..c509a017ba60 100644 --- a/xmodule/static/css-builtin-blocks/VideoBlockEditor.css +++ b/xmodule/static/css-builtin-blocks/VideoBlockEditor.css @@ -122,7 +122,8 @@ cursor: default; } -.xmodule_edit.xmodule_VideoBlock .editor-with-tabs .edit-header .editor-tabs .inner_tab_wrap a.tab:hover, .xmodule_edit.xmodule_VideoBlock .editor-with-tabs .edit-header .editor-tabs .inner_tab_wrap a.tab:focus { +.xmodule_edit.xmodule_VideoBlock .editor-with-tabs .edit-header .editor-tabs .inner_tab_wrap a.tab:hover, +.xmodule_edit.xmodule_VideoBlock .editor-with-tabs .edit-header .editor-tabs .inner_tab_wrap a.tab:focus { box-shadow: inset 0 1px 2px 1px var(--shadow); background-image: linear-gradient(#009fe6, #009fe6) !important; } @@ -139,7 +140,7 @@ display: none; } -.xmodule_edit.xmodule_VideoBlock .editor-with-tabs .comp-subtitles-entry .comp-subtitles-import-list > li { +.xmodule_edit.xmodule_VideoBlock .editor-with-tabs .comp-subtitles-entry .comp-subtitles-import-list>li { display: block; margin: calc(var(--baseline) / 2) 0; }