Skip to content
New issue

Have a question about this project? Sign up for a free GitHub account to open an issue and contact its maintainers and the community.

By clicking “Sign up for GitHub”, you agree to our terms of service and privacy statement. We’ll occasionally send you account related emails.

Already on GitHub? Sign in to your account

feat!: Dropping Sass support from builtin poll block #35516

Closed
wants to merge 7 commits into from
Closed
Show file tree
Hide file tree
Changes from 1 commit
Commits
File filter

Filter by extension

Filter by extension

Conversations
Failed to load comments.
Loading
Jump to
Jump to file
Failed to load files.
Loading
Diff view
Diff view
Prev Previous commit
Next Next commit
chore: add more implementation
  • Loading branch information
farhan committed Sep 23, 2024
commit a829e9b993a034caeb8eb1cafc4a1dc8d4a823bb
221 changes: 221 additions & 0 deletions xmodule/assets/PollBlockDisplay.css
Original file line number Diff line number Diff line change
@@ -0,0 +1,221 @@
@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;
width: auto;
padding: 0;
}

.xmodule_display.xmodule_PollBlock div.poll_question canvas, .xmodule_display.xmodule_PollBlock div.poll_question img {
page-break-inside: avoid;
}
}

.xmodule_display.xmodule_PollBlock div.poll_question .inline {
display: inline;
}

.xmodule_display.xmodule_PollBlock div.poll_question h3 {
margin-top: 0;
margin-bottom: calc((var(--baseline) * 0.75));
color: #fe57a1;
font-size: 1.9em;
}

.xmodule_display.xmodule_PollBlock div.poll_question h3.problem-header div.staff {
margin-top: calc((var(--baseline) * 1.5));
font-size: 80%;
}

@media print {
.xmodule_display.xmodule_PollBlock div.poll_question h3 {
display: block;
width: auto;
border-right: 0;
}
}

.xmodule_display.xmodule_PollBlock div.poll_question p {
text-align: justify;
font-weight: bold;
}

.xmodule_display.xmodule_PollBlock div.poll_question .poll_answer {
margin-bottom: var(--baseline);
}

.xmodule_display.xmodule_PollBlock div.poll_question .poll_answer.short {
clear: both;
}

.xmodule_display.xmodule_PollBlock div.poll_question .poll_answer .question {
height: auto;
clear: both;
min-height: 30px;
}

.xmodule_display.xmodule_PollBlock div.poll_question .poll_answer .question.short {
clear: none;
width: 30%;
display: inline;
float: left;
}

.xmodule_display.xmodule_PollBlock div.poll_question .poll_answer .question .button {
-webkit-appearance: none;
-webkit-background-clip: padding-box;
-webkit-border-image: none;
-webkit-box-align: center;
-webkit-box-shadow: white 0px 1px 0px 0px inset;
-webkit-font-smoothing: antialiased;
-webkit-rtl-ordering: logical;
-webkit-user-select: text;
-webkit-writing-mode: horizontal-tb;
background-clip: padding-box;
background-color: #eeeeee;
background-image: -webkit-linear-gradient(top, #eeeeee, #d2d2d2);
border-bottom-color: #cacaca;
border-bottom-left-radius: 3px;
border-bottom-right-radius: 3px;
border-bottom-style: solid;
border-bottom-width: 1px;
border-left-color: #cacaca;
border-left-style: solid;
border-left-width: 1px;
border-right-color: #cacaca;
border-right-style: solid;
border-right-width: 1px;
border-top-color: #cacaca;
border-top-left-radius: 3px;
border-top-right-radius: 3px;
border-top-style: solid;
border-top-width: 1px;
box-shadow: white 0px 1px 0px 0px inset;
box-sizing: border-box;
color: #333333;
/* display: inline-block; */
display: inline;
float: left;
font-family: 'Open Sans', Verdana, Geneva, sans-serif;
font-size: 13px;
font-style: normal;
font-variant: normal;
font-weight: bold;
letter-spacing: normal;
line-height: 25.59375px;
margin-bottom: calc((var(--baseline) * 0.75));
margin: 0;
padding: 0px;
text-align: center;
text-decoration: none;
text-indent: 0px;
text-shadow: #f8f8f8 0px 1px 0px;
text-transform: none;
vertical-align: top;
white-space: pre-line;
width: 25px;
height: 25px;
word-spacing: 0px;
writing-mode: lr-tb;
}

.xmodule_display.xmodule_PollBlock div.poll_question .poll_answer .question .button.answered {
-webkit-box-shadow: #61b8e1 0px 1px 0px 0px inset;
background-color: #1d9dd9;
background-image: -webkit-linear-gradient(top, #1d9dd9, #0e7cb0);
border-bottom-color: #0d72a2;
border-left-color: #0d72a2;
border-right-color: #0d72a2;
border-top-color: #0d72a2;
box-shadow: #61b8e1 0px 1px 0px 0px inset;
color: white;
text-shadow: #076794 0px 1px 0px;
background-image: none;
}

.xmodule_display.xmodule_PollBlock div.poll_question .poll_answer .question .text {
display: inline;
float: left;
width: 80%;
text-align: left;
min-height: 30px;
margin-left: var(--baseline);
height: auto;
margin-bottom: var(--baseline);
}

.xmodule_display.xmodule_PollBlock div.poll_question .poll_answer .question .text.short {
width: 100px;
}

.xmodule_display.xmodule_PollBlock div.poll_question .poll_answer .stats {
min-height: 40px;
margin-top: var(--baseline);
clear: both;
}

.xmodule_display.xmodule_PollBlock div.poll_question .poll_answer .stats.short {
margin-top: 0;
clear: none;
display: inline;
float: right;
width: 70%;
}

.xmodule_display.xmodule_PollBlock div.poll_question .poll_answer .stats .bar {
width: 75%;
height: 20px;
border: 1px solid black;
display: inline;
float: left;
margin-right: calc((var(--baseline) / 2));
}

.xmodule_display.xmodule_PollBlock div.poll_question .poll_answer .stats .bar.short {
width: 65%;
height: 20px;
margin-top: 3px;
}

.xmodule_display.xmodule_PollBlock div.poll_question .poll_answer .stats .bar .percent {
background-color: gray;
width: 0;
height: 20px;
}

.xmodule_display.xmodule_PollBlock div.poll_question .poll_answer .stats .number {
width: 80px;
display: inline;
float: right;
height: 28px;
text-align: right;
}

.xmodule_display.xmodule_PollBlock div.poll_question .poll_answer .stats .number.short {
width: 120px;
height: auto;
}

.xmodule_display.xmodule_PollBlock div.poll_question .poll_answer.answered {
-webkit-box-shadow: #61b8e1 0 1px 0 0 inset;
background-color: #1d9dd9;
background-image: -webkit-linear-gradient(top, #1d9dd9, #0e7cb0);
border-bottom-color: #0d72a2;
border-left-color: #0d72a2;
border-right-color: #0d72a2;
border-top-color: #0d72a2;
box-shadow: #61b8e1 0 1px 0 0 inset;
color: white;
text-shadow: #076794 0 1px 0;
}

.xmodule_display.xmodule_PollBlock div.poll_question .button.reset-button {
clear: both;
float: right;
}
3 changes: 0 additions & 3 deletions xmodule/assets/PollBlockDisplay.scss

This file was deleted.

4 changes: 2 additions & 2 deletions xmodule/poll_block.py
Original file line number Diff line number Diff line change
Expand Up @@ -21,7 +21,7 @@
from openedx.core.djangolib.markup import Text, HTML
from xmodule.mako_block import MakoTemplateBlockBase
from xmodule.stringify import stringify_children
from xmodule.util.builtin_assets import add_webpack_js_to_fragment, add_sass_to_fragment
from xmodule.util.builtin_assets import add_webpack_js_to_fragment, add_css_to_fragment
from xmodule.x_module import (
ResourceTemplates,
shim_xmodule_js,
Expand Down Expand Up @@ -136,7 +136,7 @@ def student_view(self, _context):
'configuration_json': self.dump_poll(),
}
fragment.add_content(self.runtime.service(self, 'mako').render_lms_template('poll.html', params))
add_sass_to_fragment(fragment, 'PollBlockDisplay.scss')
add_css_to_fragment(fragment, 'PollBlockDisplay.css')
add_webpack_js_to_fragment(fragment, 'PollBlockDisplay')
shim_xmodule_js(fragment, 'Poll')
return fragment
Expand Down
Loading