Skip to content

E
edx-ora2
Commit c2a60ee4 by cahrens
Options

Update icons to font awesome. 

Also remove overly-gratuitous usage of caret-right.
TNL-3741
parent 2bd3d401
Showing with 51 additions and 58 deletions
AUTHORS
......@@ -23,3 +23,4 @@ William Ono <william.ono@ubc.ca>
Pan Luo <pan.luo@ubc.ca>
Eric Fischer <efischer@edx.org>
Andy Armstrong <andya@edx.org>
Christina Roberts <christina@edx.org>
openassessment/templates/openassessmentblock/grade/oa_grade_complete.html
......@@ -41,7 +41,7 @@
{% with criterion_num=forloop.counter %}
<li class="question question--{{ criterion_num }} ui-toggle-visibility">
<h4 class="question__title ui-toggle-visibility__control">
<i class="ico icon-caret-right"></i>
<i class="icon fa fa-caret-right"></i>
<span class="question__title__copy">{{ criterion.label }}</span>
<span class="question__score">
......@@ -75,7 +75,7 @@
{{ part.option.label }}
<span class="ui-hint hint--top" data-hint="{{ part.option.explanation }}">
<i class="ico icon-info-sign"
<i class="icon fa fa-info-circle"
title="{% blocktrans with name=part.option.label %}More information about {{ name }}{% endblocktrans %}"></i>
</span>
......@@ -106,7 +106,7 @@
{{ part.option.label }}
<span class="ui-hint hint--top" data-hint="{{ part.option.explanation }}">
<i class="ico icon-info-sign"
<i class="icon fa fa-info-circle"
title="{% blocktrans with name=part.option.label %}More information about {{ name }}{% endblocktrans %}"></i>
</span>
</span>
......@@ -130,7 +130,7 @@
{{ part.option.label }}
<span class="ui-hint hint--top" data-hint="{{ part.option.explanation }}">
<i class="ico icon-info-sign"
<i class="icon fa fa-info-circle"
title="{% blocktrans with name=part.option.label %}More information about {{ name }}{% endblocktrans %}"></i>
</span>
</span>
......@@ -144,7 +144,7 @@
<li class="answer--feedback ui-toggle-visibility {% if criterion.options %}is--collapsed{% endif %}">
{% if criterion.options %}
<h5 class="answer--feedback__title ui-toggle-visibility__control">
<i class="ico icon-caret-right"></i>
<i class="icon fa fa-caret-right"></i>
{% if criterion.self_feedback %}
<span class="answer--feedback__title__copy">{% trans "Additional Comments" %} ({{ criterion.peer_feedback|length|add:'1' }})</span>
{% else %}
......@@ -187,7 +187,7 @@
{% if peer_assessments or self_assessment.feedback %}
<li class="question question--feedback ui-toggle-visibility">
<h4 class="question__title ui-toggle-visibility__control">
<i class="ico icon-caret-right"></i>
<i class="icon fa fa-caret-right"></i>
<span class="question__title__copy">{% trans "Additional comments on your response" %}</span>
</h4>
......@@ -235,7 +235,7 @@
{% if peer_assessments %}
<form id="submission__feedback" class="submission__feedback ui-toggle-visibility step__content__section is--collapsed" method="post">
<h3 class="submission__feedback__title ui-toggle-visibility__control">
<i class="ico icon-caret-right"></i>
<i class="icon fa fa-caret-right"></i>
<span class="submission__feedback__title__copy">{% trans "Provide Feedback on Peer Assessments" %}</span>
</h3>
......@@ -244,7 +244,7 @@
<div class="submission__feedback__content {{ has_submitted_feedback|yesno:"is--submitted," }}">
<span class="transition__status is--hidden" aria-hidden="true">
<span class="wrapper--anim">
<i class="ico icon-refresh icon-spin"></i>
<i class="icon fa fa-spinner fa-spin"></i>
<span class="copy">{% trans "Submitting Feedback" %}</span>
</span>
</span>
......
openassessment/templates/openassessmentblock/oa_base.html
......@@ -30,7 +30,7 @@
<span class="step__status">
<span class="step__status__label">{% trans "This step's status:" %}</span>
<span class="step__status__value">
<i class="ico icon-refresh icon-spin"></i>
<i class="icon fa fa-spinner fa-spin"></i>
<span class="copy">{% trans "Loading" %}</span>
</span>
</span>
......
openassessment/templates/openassessmentblock/oa_rubric.html
......@@ -9,7 +9,7 @@
id="assessment__rubric__question--{{ criterion.order_num }}"
>
<h4 class="question__title ui-toggle-visibility__control">
<i class="ico icon-caret-right"></i>
<i class="icon fa fa-caret-right"></i>
<span class="ui-toggle-visibility__control__copy question__title__copy">{{ criterion.prompt }}</span>
<span class="label--required sr">* ({% trans "Required" %})</span>
</h4>
......
openassessment/templates/openassessmentblock/peer/oa_peer_assessment.html
......@@ -89,7 +89,6 @@
<li class="list--actions__item">
<button type="submit" id="peer-assessment--001__assessment__submit" class="action action--submit is--disabled">
<span class="copy">{{ submit_button_text }}</span>
<i class="ico icon-caret-right"></i>
</button>
</li>
</ul>
......
openassessment/templates/openassessmentblock/peer/oa_peer_cancelled.html
......@@ -11,7 +11,7 @@
<span class="step__status">
<span class="step__status__label">{% trans "This step's status" %}:</span>
<span class="step__status__value">
<i class="ico icon-warning-sign"></i>
<i class="icon fa fa-exclamation-triangle"></i>
<span class="copy">
{% trans "Cancelled" %}
</span>
......
openassessment/templates/openassessmentblock/peer/oa_peer_closed.html
......@@ -10,7 +10,7 @@
<span class="step__status__label">{% trans "This step's status" %}:</span>
<span class="step__status__value">
<span class="copy">
<i class="ico icon-warning-sign"></i>
<i class="icon fa fa-exclamation-triangle"></i>
{% with graded_string=graded|stringformat:"s" must_grade_string=must_grade|stringformat:"s" %}
{% blocktrans with num_graded='<span class="step__status__value--completed">'|safe|add:graded_string|add:"</span>"|safe num_must_grade='<span class="step__status__value--required">'|safe|add:must_grade_string|add:"</span>"|safe %}
Incomplete ({{ num_graded }} of {{ num_must_grade }})
......
openassessment/templates/openassessmentblock/peer/oa_peer_complete.html
......@@ -9,7 +9,7 @@
<span class="step__status">
<span class="step__status__label">{% trans "This step's status" %}:</span>
<span class="step__status__value">
<i class="ico icon-ok"></i>
<i class="icon fa fa-check"></i>
<span class="copy">
<span class="step__status__value--completed">{{ graded }}</span> {% trans "Completed" %}
</span>
......@@ -35,7 +35,6 @@
<li class="list--actions__item">
<button type="submit" id="peer-assessment__continue__grading" class="action action--continue--grading">
<span class="copy">{% trans "Continue Assessing Peers" %}</span>
<i class="ico icon-caret-right"></i>
</button>
</li>
</ul>
......
openassessment/templates/openassessmentblock/peer/oa_peer_turbo_mode.html
......@@ -13,7 +13,7 @@
<span class="step__status">
<span class="step__status__label">{% trans "This step's status" %}:</span>
<span class="step__status__value">
<i class="ico icon-ok"></i>
<i class="icon fa fa-check"></i>
<span class="copy">
{% with graded_string=graded|stringformat:"s" %}
{% blocktrans with num_graded='<span class="step__status__value--completed">'|safe|add:graded_string|add:'</span>'|safe %}
......@@ -65,7 +65,7 @@
id="assessment__rubric__question--{{ criterion.order_num }}"
>
<h4 class="question__title ui-toggle-visibility__control">
<i class="ico icon-caret-right"></i>
<i class="icon fa fa-caret-right"></i>
<span class="ui-toggle-visibility__control__copy question__title__copy">{{ criterion.prompt }}</span>
<span class="label--required sr">* ({% trans "Required" %})</span>
</h4>
......@@ -142,7 +142,6 @@
<li class="list--actions__item">
<button type="submit" id="peer-assessment--001__assessment__submit" class="action action--submit is--disabled">
<span class="copy">{{ submit_button_text }}</span>
<i class="ico icon-caret-right"></i>
</button>
</li>
</ul>
......
openassessment/templates/openassessmentblock/peer/oa_peer_turbo_mode_waiting.html
......@@ -9,7 +9,7 @@
<span class="step__status">
<span class="step__status__label">{% trans "This step's status" %}:</span>
<span class="step__status__value">
<i class="ico icon-ok"></i>
<i class="icon fa fa-check"></i>
<span class="copy">
{% with graded_string=graded|stringformat:"s" %}
{% blocktrans with num_graded='<span class="step__status__value--completed">'|safe|add:graded_string|add:'</span>'|safe %}
......
openassessment/templates/openassessmentblock/response/oa_response.html
......@@ -142,7 +142,6 @@
<a aria-role="button" href="#" id="step--response__submit"
class="action action--submit step--response__submit {{ submit_enabled|yesno:",is--disabled" }}">
<span class="copy">{% trans "Submit your response and move to the next step" %}</span>
<i class="ico icon-caret-right"></i>
</a>
</li>
</ul>
......
openassessment/templates/openassessmentblock/response/oa_response_cancelled.html
......@@ -10,7 +10,7 @@
<span class="step__status">
<span class="step__status__label">{% trans "This step's status" %}:</span>
<span class="step__status__value">
<i class="ico icon-warning-sign"></i>
<i class="icon fa fa-exclamation-triangle"></i>
<span class="copy">{% trans "Cancelled" %}</span>
</span>
</span>
......
openassessment/templates/openassessmentblock/response/oa_response_closed.html
......@@ -8,7 +8,7 @@
<span class="step__status">
<span class="step__status__label">{% trans "This step's status" %}:</span>
<span class="step__status__value">
<i class="ico icon-warning-sign"></i>
<i class="icon fa fa-exclamation-triangle"></i>
<span class="copy">{% trans "Incomplete" %}</span>
</span>
</span>
......
openassessment/templates/openassessmentblock/response/oa_response_graded.html
......@@ -9,7 +9,7 @@
<span class="step__status">
<span class="step__status__label">{% trans "This step's status" %}:</span>
<span class="step__status__value">
<i class="ico icon-ok"></i>
<i class="icon fa fa-check"></i>
<span class="copy">{% trans "Complete" %}</span>
</span>
</span>
......
openassessment/templates/openassessmentblock/response/oa_response_submitted.html
......@@ -9,7 +9,7 @@
<span class="step__status">
<span class="step__status__label">{% trans "This step's status" %}:</span>
<span class="step__status__value">
<i class="ico icon-ok"></i>
<i class="icon fa fa-check"></i>
<span class="copy">{% trans "Complete" %}</span>
</span>
</span>
......
openassessment/templates/openassessmentblock/self/oa_self_assessment.html
......@@ -63,7 +63,6 @@
<li class="list--actions__item">
<button type="submit" id="self-assessment--001__assessment__submit" class="action action--submit is--disabled">
<span class="copy">{% trans "Submit Your Assessment" %}</span>
<i class="ico icon-caret-right"></i>
</button>
</li>
</ul>
......
openassessment/templates/openassessmentblock/self/oa_self_cancelled.html
......@@ -11,7 +11,7 @@
<span class="step__status">
<span class="step__status__label">{% trans "This step's status" %}:</span>
<span class="step__status__value">
<i class="ico icon-warning-sign"></i>
<i class="icon fa fa-exclamation-triangle"></i>
<span class="copy">
{% trans "Cancelled" %}
</span>
......
openassessment/templates/openassessmentblock/self/oa_self_closed.html
......@@ -9,7 +9,7 @@
<span class="step__status">
<span class="step__status__label">{% trans "This step's status" %}:</span>
<span class="step__status__value">
<i class="ico icon-warning-sign"></i>
<i class="icon fa fa-exclamation-triangle"></i>
<span class="copy">{% trans "Incomplete" %}</span>
</span>
</span>
......
openassessment/templates/openassessmentblock/self/oa_self_complete.html
......@@ -9,7 +9,7 @@
<span class="step__status">
<span class="step__status__label">{% trans "This step's status" %}:</span>
<span class="step__status__value">
<i class="ico icon-ok"></i>
<i class="icon fa fa-check"></i>
<span class="copy">{% trans "Complete" %}</span>
</span>
</span>
......
openassessment/templates/openassessmentblock/staff_area/staff_area.html
......@@ -10,7 +10,6 @@
<div id="openassessment__staff-tools" class="wrapper--staff-tools wrapper--ui-staff is--hidden">
<div class="staff-info ui-staff">
<h2 class="staff-info__title ui-staff__title">
<i class="ico icon-caret-right"></i>
<span class="staff-info__title__copy">{% trans "Course Staff Tools" %}</span>
<button class="ui-staff_close_button"><span class="sr">{% trans "Close" %}</span> <i class="icon fa fa-close" aria-hidden="true"></i></button>
</h2>
......@@ -84,7 +83,6 @@
<div id="openassessment__staff-info" class="wrapper--staff-info wrapper--ui-staff is--hidden">
<div class="staff-info ui-staff">
<h2 class="staff-info__title ui-staff__title">
<i class="ico icon-caret-right"></i>
<span class="staff-info__title__copy">{% trans "Course Staff Information" %}</span>
<button class="ui-staff_close_button"><span class="sr">{% trans "Close" %}</span> <i class="icon fa fa-close" aria-hidden="true"></i></button>
</h2>
......
openassessment/templates/openassessmentblock/staff_area/student_info.html
......@@ -39,7 +39,7 @@
class="openassessment__staff-info__cancel__submission wrapper--ui-staff wrapper--ui--collapse">
<div class="ui-staff ui-toggle-visibility is--collapsed">
<h2 class="staff-info__title ui-staff__title ui-toggle-visibility__control">
<i class="ico icon-caret-right"></i>
<i class="icon fa fa-caret-right"></i>
<span>{% trans "Remove submission from peer grading" %}</span>
</h2>
......
openassessment/templates/openassessmentblock/student_training/student_training.html
......@@ -86,7 +86,7 @@
id="assessment__rubric__question--{{ criterion.order_num }}"
>
<h4 class="question__title ui-toggle-visibility__control">
<i class="ico icon-caret-right"></i>
<i class="icon fa fa-caret-right"></i>
<span class="question__title__copy">{{ criterion.prompt }}</span>
<span class="label--required sr">* ({% trans "Required" %})</span>
</h4>
......@@ -143,7 +143,6 @@
<li class="list--actions__item">
<button type="submit" id="student-training--001__assessment__submit" class="action action--submit is--disabled">
<span class="copy">{% trans "Compare your selections with the instructor's selections" %}</span>
<i class="ico icon-caret-right"></i>
</button>
</li>
</ul>
......
openassessment/templates/openassessmentblock/student_training/student_training_cancelled.html
......@@ -10,7 +10,7 @@
<span class="step__status">
<span class="step__status__label">{% trans "This step's status" %}:</span>
<span class="step__status__value">
<i class="ico icon-warning-sign"></i>
<i class="icon fa fa-exclamation-triangle"></i>
<span class="copy">{% trans "Cancelled" %}</span>
</span>
</span>
......
openassessment/templates/openassessmentblock/student_training/student_training_closed.html
......@@ -9,7 +9,7 @@
<span class="step__status">
<span class="step__status__label">{% trans "This step's status" %}:</span>
<span class="step__status__value">
<i class="ico icon-warning-sign"></i>
<i class="icon fa fa-exclamation-triangle"></i>
<span class="copy">{% trans "Incomplete" %}</span>
</span>
</span>
......
openassessment/templates/openassessmentblock/student_training/student_training_complete.html
......@@ -9,7 +9,7 @@
<span class="step__status">
<span class="step__status__label">{% trans "This step's status" %}:</span>
<span class="step__status__value">
<i class="ico icon-ok"></i>
<i class="icon fa fa-check"></i>
<span class="copy">{% trans "Complete" %}</span>
</span>
</span>
......
openassessment/xblock/static/css/openassessment-ltr.css
This source diff could not be displayed because it is too large. You can view the blob instead.
openassessment/xblock/static/css/openassessment-rtl.css
This source diff could not be displayed because it is too large. You can view the blob instead.
openassessment/xblock/static/js/src/lms/oa_base.js
......@@ -145,7 +145,7 @@ OpenAssessment.BaseView.prototype = {
showLoadError: function(step) {
var container = '#openassessment__' + step;
$(container).toggleClass('has--error', true);
$(container + ' .step__status__value i').removeClass().addClass('ico icon-warning-sign');
$(container + ' .step__status__value i').removeClass().addClass('icon fa fa-exclamation-triangle');
$(container + ' .step__status__value .copy').html(gettext('Unable to Load'));
}
};
......
openassessment/xblock/static/sass/oa/elements/_navigation.scss
......@@ -17,12 +17,12 @@
text-decoration: none;
// optional icon
.ico, .ui-toggle-visibility__control__copy {
.icon, .ui-toggle-visibility__control__copy {
display: inline-block;
vertical-align: middle;
}
> .ico {
> .icon {
@include transition(all $tmg-f2 ease-in-out 0s);
@include transform(rotate(bidi-rotate-angle(90deg)));
}
......@@ -53,7 +53,7 @@
// STATE: is collapsed
&.is--collapsed {
>.ui-toggle-visibility__control > .ico {
>.ui-toggle-visibility__control > .icon {
@include transform(rotate(bidi-rotate-angle(0deg)));
@include transform-origin(50% 50%);
}
......@@ -79,7 +79,7 @@
.ui-hint {
@extend %fake-link;
.ico {
.icon {
@include margin-left(($baseline-h/8));
}
......
openassessment/xblock/static/sass/oa/utilities/_extends.scss
......@@ -164,7 +164,7 @@
border-bottom: ($baseline-v/10) solid $heading-color;
padding-bottom: ($baseline-v/4);
.ico {
.icon {
display: inline-block;
vertical-align: middle;
}
......
openassessment/xblock/static/sass/oa/utilities/_shame.scss
......@@ -172,7 +172,7 @@
// --------------------
// rules to overcome any poorly defined, scoped, or architected edX Studio problem preview/rendering CSS.
.ico {
.icon {
font-style: normal;
}
......
openassessment/xblock/static/sass/oa/views/_oa-base.scss
......@@ -150,7 +150,7 @@
}
}
.ico {
.icon {
@extend %icon-3;
display: inline-block;
vertical-align: baseline;
......@@ -257,15 +257,15 @@
@extend %btn--primary;
@extend %action-2;
.copy, .ico {
.copy, .icon {
display: inline;
}
.ico {
.icon {
@extend %icon-2;
}
.icon-caret-right:before {
.fa-caret-right:before {
@include transform(rotate(bidi-rotate-angle(0deg)));
}
......@@ -301,7 +301,7 @@
@include animation(pulse $tmg-s3 ease-in-out infinite);
}
.ico {
.icon {
display: inline-block;
color: $copy-secondary-color;
}
......@@ -333,7 +333,7 @@
.step__status__value {
background: $color-incomplete;
.copy, .ico {
.copy, .icon {
color: $white-t;
}
}
......@@ -353,7 +353,7 @@
.step__status__value {
background: $color-unavailable;
.ico {
.icon {
display: inline-block;
color: $copy-secondary-color;
}
......@@ -374,7 +374,7 @@
.step__status__value {
background: $color-unavailable;
.ico {
.icon {
display: inline-block;
color: $copy-secondary-color;
}
......@@ -403,11 +403,11 @@
.step__status__value {
background: $color-complete;
.ico {
.icon {
display: inline-block;
}
.copy, .ico {
.copy, .icon {
color: $white-t;
}
}
......@@ -424,7 +424,7 @@
.step__status__value {
background: $color-error;
.copy, .ico {
.copy, .icon {
color: $white-t;
}
}
......@@ -1063,7 +1063,7 @@
margin-bottom: ($baseline-v/2);
color: $heading-color;
.ico {
.icon {
@extend %icon-1;
display: inline-block;
vertical-align: middle;
......
openassessment/xblock/static/sass/xb/elements/_controls.scss
......@@ -81,7 +81,7 @@
}
// CASE: icons in buttons
.copy, .ico {
.copy, .icon {
display: inline-block;
vertical-align: middle;
}
......
openassessment/xblock/static/sass/xb/elements/_system-feedback.scss
......@@ -160,12 +160,12 @@
@include animation(pulse $tmg-s3 ease-in-out infinite);
}
.ico, .copy {
.icon, .copy {
display: block;
color: $copy-secondary-color;
}
.ico {
.icon {
@extend %icon-0;
margin-bottom: ($baseline-v/2);
}
......
Markdown is supported
0% or
You are about to add 0 people to the discussion. Proceed with caution.
Finish editing this message first!
Please register or to comment