Commit 9dd22206 by Brian Talbot

Merge pull request #6055 from edx/clrux/update-font-awesome-4.2.0-v2

Upgrade: Font Awesome 4.2.0 - Take #2
parents a8be7021 c5d2dd75
...@@ -21,8 +21,8 @@ define(['jquery.form', 'js/index'], function() { ...@@ -21,8 +21,8 @@ define(['jquery.form', 'js/index'], function() {
.find('.label') .find('.label')
.text('Sorry, there was error with your request'); .text('Sorry, there was error with your request');
$('#request-coursecreator-submit') $('#request-coursecreator-submit')
.find('.icon-cog') .find('.fa-cog')
.toggleClass('icon-spin'); .toggleClass('fa-spin');
}; };
$('#request-coursecreator').ajaxForm({ $('#request-coursecreator').ajaxForm({
......
...@@ -35,8 +35,8 @@ define([ ...@@ -35,8 +35,8 @@ define([
usageUnit: '.group-configuration-usage-unit', usageUnit: '.group-configuration-usage-unit',
usageUnitAnchor: '.group-configuration-usage-unit a', usageUnitAnchor: '.group-configuration-usage-unit a',
usageUnitMessage: '.group-configuration-validation-message', usageUnitMessage: '.group-configuration-validation-message',
usageUnitWarningIcon: '.group-configuration-usage-unit i.icon-warning-sign', usageUnitWarningIcon: '.group-configuration-usage-unit i.fa-warning',
usageUnitErrorIcon: '.group-configuration-usage-unit i.icon-exclamation-sign', usageUnitErrorIcon: '.group-configuration-usage-unit i.fa-exclamation-circle',
warningMessage: '.group-configuration-validation-text', warningMessage: '.group-configuration-validation-text',
warningIcon: '.wrapper-group-configuration-validation > i', warningIcon: '.wrapper-group-configuration-validation > i',
note: '.wrapper-delete-button' note: '.wrapper-delete-button'
......
...@@ -438,9 +438,9 @@ define(["jquery", "underscore", "underscore.string", "js/common_helpers/ajax_hel ...@@ -438,9 +438,9 @@ define(["jquery", "underscore", "underscore.string", "js/common_helpers/ajax_hel
verifyExplicitStaffOnly = function(isStaffOnly) { verifyExplicitStaffOnly = function(isStaffOnly) {
if (isStaffOnly) { if (isStaffOnly) {
expect(containerPage.$('.action-staff-lock i')).toHaveClass('icon-check'); expect(containerPage.$('.action-staff-lock i')).toHaveClass('fa-check-square-o');
} else { } else {
expect(containerPage.$('.action-staff-lock i')).toHaveClass('icon-check-empty'); expect(containerPage.$('.action-staff-lock i')).toHaveClass('fa-square-o');
} }
}; };
......
...@@ -17,9 +17,9 @@ define(['jquery', 'js/models/xblock_validation', 'js/views/xblock_validation', ' ...@@ -17,9 +17,9 @@ define(['jquery', 'js/models/xblock_validation', 'js/views/xblock_validation', '
it('has a getIcon method', function() { it('has a getIcon method', function() {
var getIcon = view.getIcon.bind(view); var getIcon = view.getIcon.bind(view);
expect(getIcon(model.WARNING)).toBe('icon-warning-sign'); expect(getIcon(model.WARNING)).toBe('fa-warning-sign');
expect(getIcon(model.NOT_CONFIGURED)).toBe('icon-warning-sign'); expect(getIcon(model.NOT_CONFIGURED)).toBe('fa-warning-sign');
expect(getIcon(model.ERROR)).toBe('icon-exclamation-sign'); expect(getIcon(model.ERROR)).toBe('fa-exclamation-circle');
expect(getIcon("unknown")).toBeNull(); expect(getIcon("unknown")).toBeNull();
}); });
......
...@@ -50,7 +50,7 @@ define(["domReady", "jquery", "underscore", "js/views/utils/create_course_utils" ...@@ -50,7 +50,7 @@ define(["domReady", "jquery", "underscore", "js/views/utils/create_course_utils"
// Go into creating re-run state // Go into creating re-run state
$('.rerun-course-save').addClass('is-disabled').attr('aria-disabled', true).addClass('is-processing').html( $('.rerun-course-save').addClass('is-disabled').attr('aria-disabled', true).addClass('is-processing').html(
'<i class="icon icon-refresh icon-spin"></i>' + gettext('Processing Re-run Request') '<i class="icon fa fa-refresh fa-spin"></i>' + gettext('Processing Re-run Request')
); );
$('.action-cancel').addClass('is-hidden'); $('.action-cancel').addClass('is-hidden');
}; };
......
...@@ -14,9 +14,9 @@ define( ...@@ -14,9 +14,9 @@ define(
* @param {boolean} isSpinning Turns cog spin on if true, off otherwise. * @param {boolean} isSpinning Turns cog spin on if true, off otherwise.
*/ */
var updateCog = function (elem, isSpinning) { var updateCog = function (elem, isSpinning) {
var cogI = elem.find('i.icon-cog'); var cogI = elem.find('i.fa-cog');
if (isSpinning) { cogI.addClass("icon-spin");} if (isSpinning) { cogI.addClass("fa-spin");}
else { cogI.removeClass("icon-spin");} else { cogI.removeClass("fa-spin");}
}; };
......
...@@ -286,7 +286,7 @@ function(BaseView, _, MetadataModel, AbstractEditor, FileUpload, UploadDialog, V ...@@ -286,7 +286,7 @@ function(BaseView, _, MetadataModel, AbstractEditor, FileUpload, UploadDialog, V
var template = _.template( var template = _.template(
'<li class="list-settings-item">' + '<li class="list-settings-item">' +
'<input type="text" class="input" value="<%= ele %>">' + '<input type="text" class="input" value="<%= ele %>">' +
'<a href="#" class="remove-action remove-setting" data-index="<%= index %>"><i class="icon-remove-sign"></i><span class="sr">Remove</span></a>' + '<a href="#" class="remove-action remove-setting" data-index="<%= index %>"><i class="icon fa fa-remove-sign"></i><span class="sr">Remove</span></a>' +
'</li>' '</li>'
); );
list.append($(template({'ele': ele, 'index': index}))); list.append($(template({'ele': ele, 'index': index})));
...@@ -453,7 +453,7 @@ function(BaseView, _, MetadataModel, AbstractEditor, FileUpload, UploadDialog, V ...@@ -453,7 +453,7 @@ function(BaseView, _, MetadataModel, AbstractEditor, FileUpload, UploadDialog, V
'<li class="list-settings-item">' + '<li class="list-settings-item">' +
'<input type="text" class="input input-key" value="<%= key %>">' + '<input type="text" class="input input-key" value="<%= key %>">' +
'<input type="text" class="input input-value" value="<%= value %>">' + '<input type="text" class="input input-value" value="<%= value %>">' +
'<a href="#" class="remove-action remove-setting" data-value="<%= value %>"><i class="icon-remove-sign"></i><span class="sr">Remove</span></a>' + '<a href="#" class="remove-action remove-setting" data-value="<%= value %>"><i class="icon fa fa-remove-sign"></i><span class="sr">Remove</span></a>' +
'</li>' '</li>'
); );
......
...@@ -10,9 +10,9 @@ define(["domReady", "jquery", "jquery.ui", "underscore", "gettext", "js/views/fe ...@@ -10,9 +10,9 @@ define(["domReady", "jquery", "jquery.ui", "underscore", "gettext", "js/views/fe
var $section = $('.courseware-section'); var $section = $('.courseware-section');
var $button = $(this); var $button = $(this);
var $labelCollapsed = $('<i class="icon-arrow-up"></i> <span class="label">' + var $labelCollapsed = $('<i class="icon fa fa-arrow-up"></i> <span class="label">' +
gettext('Collapse All Sections') + '</span>'); gettext('Collapse All Sections') + '</span>');
var $labelExpanded = $('<i class="icon-arrow-down"></i> <span class="label">' + var $labelExpanded = $('<i class="icon fa fa-arrow-down"></i> <span class="label">' +
gettext('Expand All Sections') + '</span>'); gettext('Expand All Sections') + '</span>');
var buttonLabel = $button.hasClass('is-activated') ? $labelCollapsed : $labelExpanded; var buttonLabel = $button.hasClass('is-activated') ? $labelCollapsed : $labelExpanded;
...@@ -102,7 +102,7 @@ define(["domReady", "jquery", "jquery.ui", "underscore", "gettext", "js/views/fe ...@@ -102,7 +102,7 @@ define(["domReady", "jquery", "jquery.ui", "underscore", "gettext", "js/views/fe
'<strong>' + gettext("Release date:") + '&nbsp;</strong>' + '<strong>' + gettext("Release date:") + '&nbsp;</strong>' +
gettext("{month}/{day}/{year} at {hour}:{minute} UTC") + gettext("{month}/{day}/{year} at {hour}:{minute} UTC") +
'</span>' + '</span>' +
'<a href="#" class="edit-release-date action" data-date="{month}/{day}/{year}" data-time="{hour}:{minute}" data-locator="{locator}"><i class="icon-time"></i> <span class="sr">' + '<a href="#" class="edit-release-date action" data-date="{month}/{day}/{year}" data-time="{hour}:{minute}" data-locator="{locator}"><i class="icon fa fa-time"></i> <span class="sr">' +
gettext("Edit section release date") + gettext("Edit section release date") +
'</span></a>', '</span></a>',
{year: datetime.getUTCFullYear(), month: pad2(datetime.getUTCMonth() + 1), day: pad2(datetime.getUTCDate()), {year: datetime.getUTCFullYear(), month: pad2(datetime.getUTCMonth() + 1), day: pad2(datetime.getUTCDate()),
......
...@@ -13,7 +13,7 @@ define(["js/views/baseview", "underscore", "gettext", "js/models/assignment_grad ...@@ -13,7 +13,7 @@ define(["js/views/baseview", "underscore", "gettext", "js/models/assignment_grad
// TODO move to a template file // TODO move to a template file
'<h4 class="status-label"><%= assignmentType %></h4>' + '<h4 class="status-label"><%= assignmentType %></h4>' +
'<a data-tooltip="Mark/unmark this subsection as graded" class="menu-toggle" href="#">' + '<a data-tooltip="Mark/unmark this subsection as graded" class="menu-toggle" href="#">' +
'<% if (!hideSymbol) {%><i class="icon-ok"></i><%};%>' + '<% if (!hideSymbol) {%><i class="icon fa fa-ok"></i><%};%>' +
'</a>' + '</a>' +
'<ul class="menu">' + '<ul class="menu">' +
'<% graders.each(function(option) { %>' + '<% graders.each(function(option) { %>' +
......
...@@ -218,8 +218,8 @@ define(["jquery", "underscore", "gettext", "js/views/baseview", "js/views/utils/ ...@@ -218,8 +218,8 @@ define(["jquery", "underscore", "gettext", "js/views/baseview", "js/views/utils/
}, },
checkStaffLock: function(check) { checkStaffLock: function(check) {
this.$('.action-staff-lock i').removeClass('icon-check icon-check-empty'); this.$('.action-staff-lock i').removeClass('fa-check-square-o fa-square-o');
this.$('.action-staff-lock i').addClass(check ? 'icon-check' : 'icon-check-empty'); this.$('.action-staff-lock i').addClass(check ? 'fa-check-square-o' : 'fa-square-o');
} }
}); });
......
...@@ -20,7 +20,7 @@ var DetailsView = ValidatingView.extend({ ...@@ -20,7 +20,7 @@ var DetailsView = ValidatingView.extend({
}, },
initialize : function() { initialize : function() {
this.fileAnchorTemplate = _.template('<a href="<%= fullpath %>"> <i class="icon-file"></i><%= filename %></a>'); this.fileAnchorTemplate = _.template('<a href="<%= fullpath %>"> <i class="icon fa fa-file"></i><%= filename %></a>');
// fill in fields // fill in fields
this.$el.find("#course-organization").val(this.model.get('org')); this.$el.find("#course-organization").val(this.model.get('org'));
this.$el.find("#course-number").val(this.model.get('course_id')); this.$el.find("#course-number").val(this.model.get('course_id'));
......
...@@ -29,10 +29,10 @@ define(["jquery", "underscore", "js/views/baseview", "gettext"], ...@@ -29,10 +29,10 @@ define(["jquery", "underscore", "js/views/baseview", "gettext"],
*/ */
getIcon: function (messageType) { getIcon: function (messageType) {
if (messageType === this.model.ERROR) { if (messageType === this.model.ERROR) {
return 'icon-exclamation-sign'; return 'fa-exclamation-circle';
} }
else if (messageType === this.model.WARNING || messageType === this.model.NOT_CONFIGURED) { else if (messageType === this.model.WARNING || messageType === this.model.NOT_CONFIGURED) {
return 'icon-warning-sign'; return 'fa-warning-sign';
} }
return null; return null;
}, },
......
...@@ -697,7 +697,7 @@ body.js { ...@@ -697,7 +697,7 @@ body.js {
@extend %cont-text-sr; @extend %cont-text-sr;
} }
[class^="icon-"] { .icon {
@extend %t-action1; @extend %t-action1;
color: $white; color: $white;
} }
......
...@@ -15,7 +15,7 @@ ...@@ -15,7 +15,7 @@
transition-timing-function: ease-in-out; transition-timing-function: ease-in-out;
} }
.icon-remove-sign { .fa-times-circle {
// needed to override general a element transition properties - need to fix. // needed to override general a element transition properties - need to fix.
transition-duration: $tmg-f2; transition-duration: $tmg-f2;
transition-timing-function: ease-in-out; transition-timing-function: ease-in-out;
......
...@@ -196,7 +196,7 @@ ...@@ -196,7 +196,7 @@
// ==================== // ====================
.button { .button {
[class^="icon-"] { .icon {
display: inline-block; display: inline-block;
vertical-align: middle; vertical-align: middle;
margin-right: ($baseline/4); margin-right: ($baseline/4);
...@@ -281,7 +281,7 @@ ...@@ -281,7 +281,7 @@
background-color: $gray-l1; background-color: $gray-l1;
} }
[class^="icon-"] { .icon {
font-style: normal; font-style: normal;
} }
} }
...@@ -399,7 +399,7 @@ ...@@ -399,7 +399,7 @@
border-top: 1px solid $blue-l1; border-top: 1px solid $blue-l1;
opacity: 0.0; opacity: 0.0;
*[class^="icon-caret"] { .fa-caret-right {
@extend %t-icon5; @extend %t-icon5;
position: absolute; position: absolute;
top: -12px; top: -12px;
......
...@@ -48,7 +48,7 @@ ...@@ -48,7 +48,7 @@
padding: ($baseline/2) ($baseline/2); padding: ($baseline/2) ($baseline/2);
background: transparent; background: transparent;
[class^="icon-"] { .icon {
@include transition(top $tmg-f2 ease-in-out $tmg-f2); @include transition(top $tmg-f2 ease-in-out $tmg-f2);
@extend %t-action3; @extend %t-action3;
display: inline-block; display: inline-block;
......
...@@ -382,6 +382,10 @@ form { ...@@ -382,6 +382,10 @@ form {
@extend %ui-btn-non-blue; @extend %ui-btn-non-blue;
@extend %t-copy-base; @extend %t-copy-base;
padding-top: ($baseline/10); padding-top: ($baseline/10);
.icon.icon {
vertical-align: baseline;
}
} }
.incontext-editor-form { .incontext-editor-form {
......
...@@ -78,7 +78,7 @@ ...@@ -78,7 +78,7 @@
@extend %ui-btn-dd-nav-primary; @extend %ui-btn-dd-nav-primary;
@include transition(all $tmg-f2 ease-in-out 0s); @include transition(all $tmg-f2 ease-in-out 0s);
.label, .icon-caret-down { .label, .fa-caret-down {
} }
...@@ -86,20 +86,20 @@ ...@@ -86,20 +86,20 @@
} }
.icon-caret-down { .fa-caret-down {
opacity: 0.25; opacity: 0.25;
} }
&:hover { &:hover {
.icon-caret-down { .fa-caret-down {
opacity: 1.0; opacity: 1.0;
} }
} }
.nav-sub .nav-item { .nav-sub .nav-item {
[class^="icon-"] { .icon {
display: inline-block; display: inline-block;
vertical-align: middle; vertical-align: middle;
margin-right: ($baseline/4); margin-right: ($baseline/4);
......
// studio - elements - icons & badges // studio - elements - icons & badges
// ==================== // ====================
.icon { .icon {
}
[class^="icon-"] {
font-style: normal; font-style: normal;
} }
...@@ -32,7 +27,7 @@ ...@@ -32,7 +27,7 @@
padding: ($baseline/4) ($baseline/2) ($baseline/4) ($baseline/2); padding: ($baseline/4) ($baseline/2) ($baseline/4) ($baseline/2);
text-transform: uppercase; text-transform: uppercase;
* [class^="icon-"] { .icon {
margin-right: ($baseline/5); margin-right: ($baseline/5);
} }
......
...@@ -72,7 +72,7 @@ ...@@ -72,7 +72,7 @@
vertical-align: baseline; vertical-align: baseline;
} }
[class^="icon-"] { .icon {
display: inline-block; display: inline-block;
vertical-align: baseline; vertical-align: baseline;
} }
......
...@@ -50,7 +50,7 @@ nav { ...@@ -50,7 +50,7 @@ nav {
.title { .title {
.label, .icon-caret-down { .label, .fa-caret-down {
display: inline-block; display: inline-block;
vertical-align: middle; vertical-align: middle;
} }
......
...@@ -33,7 +33,7 @@ ...@@ -33,7 +33,7 @@
padding: ($baseline/2) $baseline; padding: ($baseline/2) $baseline;
color: $gray; color: $gray;
[class^="icon-"] { .icon {
@extend %t-icon6; @extend %t-icon6;
@include margin-right($baseline/4); @include margin-right($baseline/4);
} }
...@@ -95,11 +95,10 @@ ...@@ -95,11 +95,10 @@
@extend %t-action4; @extend %t-action4;
display: block; display: block;
[class^="icon-"] { .icon {
@extend %t-icon4; @extend %t-icon4;
vertical-align: middle; vertical-align: middle;
@include margin-right($baseline/4); @include margin-right($baseline/4);
} }
&:hover, &:active { &:hover, &:active {
......
...@@ -656,7 +656,7 @@ ...@@ -656,7 +656,7 @@
@extend %cont-text-sr; @extend %cont-text-sr;
} }
[class^="icon"] { .icon {
@extend %t-icon6; @extend %t-icon6;
color: $white; color: $white;
width: auto; width: auto;
...@@ -763,7 +763,7 @@ ...@@ -763,7 +763,7 @@
padding: ($baseline/2) ($baseline*0.75); padding: ($baseline/2) ($baseline*0.75);
color: $white; color: $white;
[class^="icon-"] { .icon {
font-style: normal; font-style: normal;
} }
...@@ -785,7 +785,7 @@ ...@@ -785,7 +785,7 @@
&.has-warnings { &.has-warnings {
border-bottom: 3px solid $orange; border-bottom: 3px solid $orange;
.icon-warning-sign { .fa-warning {
margin-right: ($baseline/2); margin-right: ($baseline/2);
color: $orange; color: $orange;
} }
...@@ -794,7 +794,7 @@ ...@@ -794,7 +794,7 @@
&.has-errors { &.has-errors {
border-bottom: 3px solid $red-l2; border-bottom: 3px solid $red-l2;
.icon-exclamation-sign { .fa-exclamation-circle {
margin-right: ($baseline/2); margin-right: ($baseline/2);
color: $red-l2; color: $red-l2;
} }
......
...@@ -95,7 +95,7 @@ ...@@ -95,7 +95,7 @@
} }
} }
[class^="icon-"] { .icon {
display: inline-block; display: inline-block;
vertical-align: middle; vertical-align: middle;
} }
...@@ -131,7 +131,7 @@ ...@@ -131,7 +131,7 @@
.wrapper-xblock.is-collapsible, .wrapper-xblock.is-collapsible,
.wrapper-xblock.xblock-type-container { .wrapper-xblock.xblock-type-container {
[class^="icon-"] { .icon {
font-style: normal; font-style: normal;
} }
...@@ -168,7 +168,7 @@ ...@@ -168,7 +168,7 @@
padding: ($baseline*0.75); padding: ($baseline*0.75);
color: $white; color: $white;
[class^="icon-"] { .icon {
font-style: normal; font-style: normal;
} }
...@@ -189,7 +189,7 @@ ...@@ -189,7 +189,7 @@
&.has-warnings { &.has-warnings {
border-top: 3px solid $orange; border-top: 3px solid $orange;
.icon-warning-sign { .fa-warning {
margin-right: ($baseline/2); margin-right: ($baseline/2);
color: $orange; color: $orange;
} }
...@@ -198,7 +198,7 @@ ...@@ -198,7 +198,7 @@
&.has-errors { &.has-errors {
border-top: 3px solid $red-l2; border-top: 3px solid $red-l2;
.icon-exclamation-sign { .fa-exclamation-circle {
margin-right: ($baseline/2); margin-right: ($baseline/2);
color: $red-l2; color: $red-l2;
} }
...@@ -651,7 +651,7 @@ ...@@ -651,7 +651,7 @@
width: 100%; width: 100%;
padding: ($baseline/2); padding: ($baseline/2);
*[class^="icon-"] { .icon {
margin-right: ($baseline/4); margin-right: ($baseline/4);
} }
} }
...@@ -722,7 +722,7 @@ ...@@ -722,7 +722,7 @@
width: 88%; width: 88%;
padding: ($baseline/2); padding: ($baseline/2);
*[class^="icon-"] { .icon {
margin-right: ($baseline/4); margin-right: ($baseline/4);
} }
} }
......
...@@ -4,11 +4,17 @@ ...@@ -4,11 +4,17 @@
// general - display mode (xblock-student_view or xmodule_display) // general - display mode (xblock-student_view or xmodule_display)
.xmodule_display, .xmodule_display,
.xblock-student_view { .xblock-student_view {
// font styling // font styling
i, i,
em { em {
font-style: italic; font-style: italic;
} }
.icon {
font-style: normal;
}
} }
// ==================== // ====================
...@@ -52,7 +58,7 @@ ...@@ -52,7 +58,7 @@
width: 100%; width: 100%;
padding: ($baseline/2); padding: ($baseline/2);
*[class^="icon-"] { .icon {
margin-right: ($baseline/4); margin-right: ($baseline/4);
} }
} }
...@@ -142,8 +148,8 @@ ...@@ -142,8 +148,8 @@
color: $red; color: $red;
} }
[class^="icon-"], .icon,
[class*=" icon-"] { [class*=" fa-"] {
@extend %t-icon4; @extend %t-icon4;
margin-right: ($baseline/4); margin-right: ($baseline/4);
} }
...@@ -281,7 +287,7 @@ ...@@ -281,7 +287,7 @@
display: block; display: block;
padding: ($baseline/2); padding: ($baseline/2);
*[class^="icon-"] { .icon {
margin-right: ($baseline/4); margin-right: ($baseline/4);
} }
} }
......
...@@ -17,7 +17,7 @@ ...@@ -17,7 +17,7 @@
.nav-actions { .nav-actions {
.icon-cloud-upload { .fa-cloud-upload {
@extend %t-copy; @extend %t-copy;
vertical-align: bottom; vertical-align: bottom;
margin-right: ($baseline/5); margin-right: ($baseline/5);
...@@ -33,10 +33,11 @@ ...@@ -33,10 +33,11 @@
color: $gray; color: $gray;
.new-button { .new-button {
@extend %btn-primary-green;
@extend %t-action3; @extend %t-action3;
@include margin-left($baseline); @include margin-left($baseline);
[class^="icon-"] { .icon {
@include margin-right($baseline/2); @include margin-right($baseline/2);
} }
} }
...@@ -80,11 +81,11 @@ ...@@ -80,11 +81,11 @@
} }
&.action-lock .lock-checkbox ~ .action-button { &.action-lock .lock-checkbox ~ .action-button {
.icon-lock { .fa-lock {
display: none; display: none;
} }
.icon-unlock-alt { .fa-unlock-alt {
display: inline-block; display: inline-block;
} }
} }
...@@ -93,11 +94,11 @@ ...@@ -93,11 +94,11 @@
background-color: $gray; background-color: $gray;
color: $white; color: $white;
.icon-lock { .fa-lock {
display: inline-block; display: inline-block;
} }
.icon-unlock-alt { .fa-unlock-alt {
display: none; display: none;
} }
} }
...@@ -172,7 +173,7 @@ ...@@ -172,7 +173,7 @@
background: none; background: none;
padding: 0; padding: 0;
[class^="icon-"] { .icon {
@extend %t-action1; @extend %t-action1;
} }
......
...@@ -43,7 +43,7 @@ ...@@ -43,7 +43,7 @@
} }
} }
} }
// <span class="viz viz-checklist-status"><span class="viz value viz-checklist-status-value"><span class="int">0</span>% of checklist completed</span></span>
// header/title // header/title
header { header {
...@@ -91,7 +91,7 @@ ...@@ -91,7 +91,7 @@
color: $gray-l2; color: $gray-l2;
.icon-ok { .fa-check-square-o {
@extend %t-icon4; @extend %t-icon4;
display: inline-block; display: inline-block;
margin-left: ($baseline/2); margin-left: ($baseline/2);
...@@ -128,7 +128,7 @@ ...@@ -128,7 +128,7 @@
@include green-button(); @include green-button();
@include float(left); @include float(left);
.icon-add { .fa-plus {
@extend %t-icon7; @extend %t-icon7;
display: inline-block; display: inline-block;
vertical-align: middle; vertical-align: middle;
...@@ -183,13 +183,13 @@ ...@@ -183,13 +183,13 @@
header { header {
.checklist-title, .icon-caret-down { .checklist-title, .fa-caret-down {
color: $green; color: $green;
} }
.checklist-status { .checklist-status {
.status-count, .status-amount, .icon-ok { .status-count, .status-amount, .fa-check-square-o {
color: $green; color: $green;
} }
} }
......
...@@ -65,7 +65,7 @@ ...@@ -65,7 +65,7 @@
padding: ($baseline*1.5) ($baseline*2); padding: ($baseline*1.5) ($baseline*2);
// custom rules to reuse xblock validation styling in ui-well context // custom rules to reuse xblock validation styling in ui-well context
.icon-warning-sign { .fa-warning {
display: none; display: none;
} }
} }
...@@ -175,7 +175,7 @@ ...@@ -175,7 +175,7 @@
margin-bottom: ($baseline/10); margin-bottom: ($baseline/10);
} }
[class^="icon-"] { .icon {
margin-left: ($baseline/4); margin-left: ($baseline/4);
color: $gray-d1; color: $gray-d1;
} }
......
...@@ -89,7 +89,7 @@ ...@@ -89,7 +89,7 @@
margin: 3px flex-gutter() 0 0; margin: 3px flex-gutter() 0 0;
} }
.icon-remove-sign { .fa-times-circle {
@extend %t-action1; @extend %t-action1;
@include transform(rotate(45deg)); @include transform(rotate(45deg));
@include transform-origin(center center); @include transform-origin(center center);
...@@ -114,7 +114,7 @@ ...@@ -114,7 +114,7 @@
.ui-toggle-control { .ui-toggle-control {
@include border-bottom-radius(0); @include border-bottom-radius(0);
.icon-remove-sign { .fa-times-circle {
@include transform(rotate(90deg)); @include transform(rotate(90deg));
@include transform-origin(center center); @include transform-origin(center center);
} }
...@@ -162,7 +162,7 @@ ...@@ -162,7 +162,7 @@
position: relative; position: relative;
overflow: hidden; overflow: hidden;
.icon-cog { .fa-cog {
@include transition(all $tmg-f1 ease-in-out $tmg-f1); @include transition(all $tmg-f1 ease-in-out $tmg-f1);
@extend %t-icon4; @extend %t-icon4;
position: absolute; position: absolute;
...@@ -176,7 +176,7 @@ ...@@ -176,7 +176,7 @@
&.is-submitting { &.is-submitting {
padding-left: ($baseline*2); padding-left: ($baseline*2);
.icon-cog { .fa-cog {
left: ($baseline*0.75); left: ($baseline*0.75);
visibility: visible; visibility: visible;
opacity: 1.0; opacity: 1.0;
...@@ -189,7 +189,7 @@ ...@@ -189,7 +189,7 @@
background: $red; background: $red;
border-color: $red-d1; border-color: $red-d1;
.icon-cog { .fa-cog {
left: ($baseline*0.75); left: ($baseline*0.75);
visibility: visible; visibility: visible;
opacity: 1.0; opacity: 1.0;
......
...@@ -76,7 +76,7 @@ ...@@ -76,7 +76,7 @@
.action { .action {
[class^="icon"] { .icon {
@extend %t-icon2; @extend %t-icon2;
display: inline-block; display: inline-block;
vertical-align: middle; vertical-align: middle;
......
...@@ -45,7 +45,7 @@ ...@@ -45,7 +45,7 @@
.action { .action {
[class^="icon"] { .icon {
@extend %t-icon2; @extend %t-icon2;
display: inline-block; display: inline-block;
vertical-align: middle; vertical-align: middle;
......
...@@ -31,7 +31,7 @@ ...@@ -31,7 +31,7 @@
@extend %t-action3; @extend %t-action3;
margin-left: $baseline; margin-left: $baseline;
[class^="icon-"] { .icon {
margin-right: ($baseline/2); margin-right: ($baseline/2);
} }
} }
...@@ -204,12 +204,12 @@ ...@@ -204,12 +204,12 @@
font-weight: 600; font-weight: 600;
} }
.icon-warning-sign { .fa-warning {
margin: ($baseline/4) ($baseline/2) 0 ($baseline*1.5); margin: ($baseline/4) ($baseline/2) 0 ($baseline*1.5);
color: $orange; color: $orange;
} }
.icon-exclamation-sign { .fa-times-circle {
margin: ($baseline/4) ($baseline/2) 0 ($baseline*1.5); margin: ($baseline/4) ($baseline/2) 0 ($baseline*1.5);
color: $red-l2; color: $red-l2;
} }
...@@ -224,7 +224,7 @@ ...@@ -224,7 +224,7 @@
margin-top: $baseline; margin-top: $baseline;
padding: $baseline ($baseline*1.5) $baseline ($baseline*1.5); padding: $baseline ($baseline*1.5) $baseline ($baseline*1.5);
.icon-warning-sign { .fa-warning {
margin: ($baseline/2) $baseline 0 0; margin: ($baseline/2) $baseline 0 0;
color: $orange; color: $orange;
float: left; float: left;
......
...@@ -57,7 +57,7 @@ ...@@ -57,7 +57,7 @@
margin: $baseline 0; margin: $baseline 0;
padding: ($baseline*0.75) $baseline; padding: ($baseline*0.75) $baseline;
[class^="icon"] { .icon {
@extend %t-icon2; @extend %t-icon2;
display: inline-block; display: inline-block;
vertical-align: middle; vertical-align: middle;
...@@ -133,7 +133,7 @@ ...@@ -133,7 +133,7 @@
float: left; float: left;
width: flex-grid(1,9); width: flex-grid(1,9);
*[class^="icon-"] { .icon {
@include transition(opacity $tmg-f1 ease-in-out 0); @include transition(opacity $tmg-f1 ease-in-out 0);
@extend %t-icon4; @extend %t-icon4;
position: absolute; position: absolute;
...@@ -193,17 +193,17 @@ ...@@ -193,17 +193,17 @@
&.is-not-started { &.is-not-started {
opacity: 0.5; opacity: 0.5;
.icon-warning-sign { .fa-warning {
visibility: hidden; visibility: hidden;
opacity: 0.0; opacity: 0.0;
} }
.icon-cog { .fa-cog {
visibility: visible; visibility: visible;
opacity: 1.0; opacity: 1.0;
} }
.icon-check { .fa-check {
opacity: 0.3; opacity: 0.3;
} }
} }
...@@ -211,12 +211,12 @@ ...@@ -211,12 +211,12 @@
// STATE: started // STATE: started
&.is-started { &.is-started {
.icon-warning-sign { .fa-warning {
visibility: hidden; visibility: hidden;
opacity: 0.0; opacity: 0.0;
} }
.icon-cog { .fa-cog {
visibility: visible; visibility: visible;
opacity: 1.0; opacity: 1.0;
} }
...@@ -225,17 +225,17 @@ ...@@ -225,17 +225,17 @@
// STATE: completed // STATE: completed
&.is-complete { &.is-complete {
.icon-cog { .fa-cog {
visibility: visible; visibility: visible;
opacity: 1.0; opacity: 1.0;
} }
.icon-warning-sign { .fa-warning {
visibility: hidden; visibility: hidden;
opacity: 0.0; opacity: 0.0;
} }
*[class^="icon-"] { .icon {
color: $green; color: $green;
} }
...@@ -251,17 +251,17 @@ ...@@ -251,17 +251,17 @@
// STATE: error // STATE: error
&.has-error { &.has-error {
.icon-cog { .fa-cog {
visibility: hidden; visibility: hidden;
opacity: 0.0; opacity: 0.0;
} }
.icon-warning-sign { .fa-warning {
visibility: visible; visibility: visible;
opacity: 1.0; opacity: 1.0;
} }
*[class^="icon-"] { .icon {
color: $red; color: $red;
} }
......
...@@ -162,7 +162,7 @@ ...@@ -162,7 +162,7 @@
right: ($baseline/2); right: ($baseline/2);
opacity: 0.0; opacity: 0.0;
[class^="icon-"] { .icon {
@include border-top-radius(3px); @include border-top-radius(3px);
@extend %t-icon4; @extend %t-icon4;
display: inline-block; display: inline-block;
......
...@@ -311,6 +311,15 @@ ...@@ -311,6 +311,15 @@
width: flex-grid(5, 6); width: flex-grid(5, 6);
line-height: 0; line-height: 0;
} }
.action-edit.action-inline {
.icon {
@include margin-right(0);
@include transform(none);
vertical-align: middle;
}
}
} }
.section-header-actions { .section-header-actions {
...@@ -400,6 +409,15 @@ ...@@ -400,6 +409,15 @@
margin-top: -($baseline/10); margin-top: -($baseline/10);
line-height: 0; line-height: 0;
} }
.action-edit.action-inline {
.icon {
@include transform(none);
margin-right: 0;
vertical-align: middle;
}
}
} }
.subsection-header-actions { .subsection-header-actions {
...@@ -575,7 +593,7 @@ ...@@ -575,7 +593,7 @@
border-top: 1px solid $blue-l1; border-top: 1px solid $blue-l1;
opacity: 0.0; opacity: 0.0;
*[class^="icon-caret"] { .fa-caret-right {
@extend %t-icon5; @extend %t-icon5;
position: absolute; position: absolute;
top: -12px; top: -12px;
......
...@@ -336,7 +336,7 @@ ...@@ -336,7 +336,7 @@
@extend %t-action3; @extend %t-action3;
@extend %t-strong; @extend %t-strong;
[class^="icon-"] { .icon {
@extend %t-icon5; @extend %t-icon5;
display: inline-block; display: inline-block;
vertical-align: middle; vertical-align: middle;
...@@ -508,14 +508,15 @@ ...@@ -508,14 +508,15 @@
height: ($baseline*2); height: ($baseline*2);
position: relative; position: relative;
display: inline-block; display: inline-block;
vertical-align: middle;
margin-right: flex-gutter(); margin-right: flex-gutter();
vertical-align: middle;
text-align: center;
border-radius: 20px; border-radius: 20px;
border: 1px solid $darkGrey; border: 1px solid $darkGrey;
background-color: #d1dae3; background-color: #d1dae3;
color: #6d788b; color: #6d788b;
.plus-icon { .icon {
position: absolute; position: absolute;
top: 50%; top: 50%;
left: 50%; left: 50%;
......
...@@ -92,11 +92,11 @@ ...@@ -92,11 +92,11 @@
} }
&.action-visible .toggle-checkbox ~ .action-button { &.action-visible .toggle-checkbox ~ .action-button {
.icon-eye-open { .fa-eye {
display: inline-block; display: inline-block;
} }
.icon-eye-close { .fa-eye-slash {
display: none; display: none;
} }
} }
...@@ -105,11 +105,11 @@ ...@@ -105,11 +105,11 @@
background-color: $gray; background-color: $gray;
color: $white; color: $white;
.icon-eye-open { .fa-eye {
display: none; display: none;
} }
.icon-eye-close { .fa-eye-slash {
display: inline-block; display: inline-block;
} }
} }
...@@ -274,7 +274,7 @@ ...@@ -274,7 +274,7 @@
} }
} }
[class^="icon-"] { .icon {
display: inline-block; display: inline-block;
vertical-align: bottom; vertical-align: bottom;
} }
......
...@@ -41,7 +41,7 @@ ...@@ -41,7 +41,7 @@
<h3 class="sr">${_("Page Actions")}</h3> <h3 class="sr">${_("Page Actions")}</h3>
<ul> <ul>
<li class="nav-item"> <li class="nav-item">
<a href="#" class="button upload-button new-button"><i class="icon-plus"></i> ${_("Upload New File")}</a> <a href="#" class="button upload-button new-button"><i class="icon fa fa-plus"></i> ${_("Upload New File")}</a>
</li> </li>
</ul> </ul>
</nav> </nav>
...@@ -53,7 +53,7 @@ ...@@ -53,7 +53,7 @@
<article class="content-primary" role="main"> <article class="content-primary" role="main">
<div class="wrapper-assets" /> <div class="wrapper-assets" />
<div class="ui-loading"> <div class="ui-loading">
<p><span class="spin"><i class="icon-refresh"></i></span> <span class="copy">${_("Loading&hellip;")}</span></p> <p><span class="spin"><i class="icon fa fa-refresh"></i></span> <span class="copy">${_("Loading&hellip;")}</span></p>
</div> </div>
</article> </article>
...@@ -84,7 +84,7 @@ ...@@ -84,7 +84,7 @@
</div> </div>
<div class="upload-modal modal"> <div class="upload-modal modal">
<a href="#" class="close-button"><i class="icon-remove-sign"></i> <span class="sr">${_('close')}</span></a> <a href="#" class="close-button"><i class="icon fa fa-times-circle"></i> <span class="sr">${_('close')}</span></a>
<div class="modal-body"> <div class="modal-body">
<h1 class="title">${_("Upload New File")}</h1> <h1 class="title">${_("Upload New File")}</h1>
<h2>${_("Max per-file size: {max_filesize}MB").format(max_filesize=max_file_size_in_mbs)}</h2> <h2>${_("Max per-file size: {max_filesize}MB").format(max_filesize=max_file_size_in_mbs)}</h2>
...@@ -111,14 +111,14 @@ ...@@ -111,14 +111,14 @@
<!-- alert: save confirmed with close --> <!-- alert: save confirmed with close -->
<div class="wrapper wrapper-alert wrapper-alert-confirmation" role="status"> <div class="wrapper wrapper-alert wrapper-alert-confirmation" role="status">
<div class="alert confirmation"> <div class="alert confirmation">
<i class="icon-ok"></i> <i class="icon fa fa-check"></i>
<div class="copy"> <div class="copy">
<h2 class="title title-3">${_('Your file has been deleted.')}</h2> <h2 class="title title-3">${_('Your file has been deleted.')}</h2>
</div> </div>
<a href="" rel="view" class="action action-alert-close"> <a href="" rel="view" class="action action-alert-close">
<i class="icon-remove-sign"></i> <i class="icon fa fa-times-circle"></i>
<span class="label">${_('close alert')}</span> <span class="label">${_('close alert')}</span>
</a> </a>
</div> </div>
......
...@@ -8,19 +8,19 @@ ...@@ -8,19 +8,19 @@
<ul class="component-actions"> <ul class="component-actions">
<li class="action-item action-edit"> <li class="action-item action-edit">
<a href="#" class="edit-button action-button"> <a href="#" class="edit-button action-button">
<i class="icon-pencil"></i> <i class="icon fa fa-pencil"></i>
<span class="action-button-text">${_("Edit")}</span> <span class="action-button-text">${_("Edit")}</span>
</a> </a>
</li> </li>
<li class="action-item action-duplicate"> <li class="action-item action-duplicate">
<a href="#" data-tooltip="${_("Duplicate")}" class="duplicate-button action-button"> <a href="#" data-tooltip="${_("Duplicate")}" class="duplicate-button action-button">
<i class="icon-copy"></i> <i class="icon fa fa-copy"></i>
<span class="sr">${_("Duplicate this component")}</span> <span class="sr">${_("Duplicate this component")}</span>
</a> </a>
</li> </li>
<li class="action-item action-delete"> <li class="action-item action-delete">
<a href="#" data-tooltip="${_("Delete")}" class="delete-button action-button"> <a href="#" data-tooltip="${_("Delete")}" class="delete-button action-button">
<i class="icon-trash"></i> <i class="icon fa fa-trash-o"></i>
<span class="sr">${_("Delete this component")}</span> <span class="sr">${_("Delete this component")}</span>
</a> </a>
</li> </li>
......
...@@ -84,7 +84,7 @@ templates = ["basic-modal", "modal-button", "edit-xblock-modal", ...@@ -84,7 +84,7 @@ templates = ["basic-modal", "modal-button", "edit-xblock-modal",
% else: % else:
<li class="action-item action-edit nav-item"> <li class="action-item action-edit nav-item">
<a href="#" class="button button-edit action-button edit-button"> <a href="#" class="button button-edit action-button edit-button">
<i class="icon-pencil"></i> <i class="icon fa fa-pencil"></i>
<span class="action-button-text">${_("Edit")}</span> <span class="action-button-text">${_("Edit")}</span>
</a> </a>
</li> </li>
...@@ -103,7 +103,7 @@ templates = ["basic-modal", "modal-button", "edit-xblock-modal", ...@@ -103,7 +103,7 @@ templates = ["basic-modal", "modal-button", "edit-xblock-modal",
<section class="wrapper-xblock level-page is-hidden studio-xblock-wrapper" data-locator="${xblock_locator | h}" data-course-key="${xblock_locator.course_key | h}"> <section class="wrapper-xblock level-page is-hidden studio-xblock-wrapper" data-locator="${xblock_locator | h}" data-course-key="${xblock_locator.course_key | h}">
</section> </section>
<div class="ui-loading"> <div class="ui-loading">
<p><span class="spin"><i class="icon-refresh"></i></span> <span class="copy">${_("Loading...")}</span></p> <p><span class="spin"><i class="icon fa fa-refresh"></i></span> <span class="copy">${_("Loading...")}</span></p>
</div> </div>
</article> </article>
<aside class="content-supplementary" role="complementary"> <aside class="content-supplementary" role="complementary">
......
...@@ -37,7 +37,7 @@ ...@@ -37,7 +37,7 @@
<h3 class="sr">${_('Page Actions')}</h3> <h3 class="sr">${_('Page Actions')}</h3>
<ul> <ul>
<li class="nav-item"> <li class="nav-item">
<a href="#" class=" button new-button new-update-button"><i class="icon-plus"></i> ${_('New Update')}</a> <a href="#" class=" button new-button new-update-button"><i class="icon fa fa-plus"></i> ${_('New Update')}</a>
</li> </li>
</ul> </ul>
</nav> </nav>
......
...@@ -31,7 +31,7 @@ from contentstore.utils import reverse_usage_url ...@@ -31,7 +31,7 @@ from contentstore.utils import reverse_usage_url
%if notification_dismiss_url is not None: %if notification_dismiss_url is not None:
<div class="wrapper wrapper-alert wrapper-alert-announcement is-shown"> <div class="wrapper wrapper-alert wrapper-alert-announcement is-shown">
<div class="alert announcement has-actions"> <div class="alert announcement has-actions">
<i class="feedback-symbol icon-bullhorn"></i> <i class="feedback-symbol fa fa-bullhorn"></i>
<div class="copy"> <div class="copy">
<h2 class="title title-3">${_("This course was created as a re-run. Some manual configuration is needed.")}</h2> <h2 class="title title-3">${_("This course was created as a re-run. Some manual configuration is needed.")}</h2>
...@@ -42,7 +42,7 @@ from contentstore.utils import reverse_usage_url ...@@ -42,7 +42,7 @@ from contentstore.utils import reverse_usage_url
<ul class="nav-actions"> <ul class="nav-actions">
<li class="action action-dismiss"> <li class="action action-dismiss">
<a href="#" class="button dismiss-button" data-dismiss-link='${notification_dismiss_url}'> <a href="#" class="button dismiss-button" data-dismiss-link='${notification_dismiss_url}'>
<i class="icon icon-remove-sign"></i> <i class="icon fa fa-times-circle"></i>
<span class="button-copy">${_("Dismiss")}</span> <span class="button-copy">${_("Dismiss")}</span>
</a> </a>
</li> </li>
...@@ -65,13 +65,13 @@ from contentstore.utils import reverse_usage_url ...@@ -65,13 +65,13 @@ from contentstore.utils import reverse_usage_url
<ul> <ul>
<li class="nav-item"> <li class="nav-item">
<a href="#" class="button button-new" data-category="chapter" data-parent="${context_course.location | h}" data-default-name="${_('Section')}" title="${_('Click to add a new section')}"> <a href="#" class="button button-new" data-category="chapter" data-parent="${context_course.location | h}" data-default-name="${_('Section')}" title="${_('Click to add a new section')}">
<i class="icon-plus"></i>${_('New Section')} <i class="icon fa fa-plus"></i>${_('New Section')}
</a> </a>
</li> </li>
<li class="nav-item"> <li class="nav-item">
<a href="#" class="button button-toggle button-toggle-expand-collapse collapse-all is-hidden"> <a href="#" class="button button-toggle button-toggle-expand-collapse collapse-all is-hidden">
<span class="collapse-all"><i class="icon-arrow-up"></i> <span class="label">${_("Collapse All Sections")}</span></span> <span class="collapse-all"><i class="icon fa fa-arrow-up"></i> <span class="label">${_("Collapse All Sections")}</span></span>
<span class="expand-all"><i class="icon-arrow-down"></i> <span class="label">${_("Expand All Sections")}</span></span> <span class="expand-all"><i class="icon fa fa-arrow-down"></i> <span class="label">${_("Expand All Sections")}</span></span>
</a> </a>
</li> </li>
<li class="nav-item"> <li class="nav-item">
...@@ -94,7 +94,7 @@ from contentstore.utils import reverse_usage_url ...@@ -94,7 +94,7 @@ from contentstore.utils import reverse_usage_url
<ul class="status-actions"> <ul class="status-actions">
<li class="action-item action-edit"> <li class="action-item action-edit">
<a href="${settings_url}" class="edit-button action-button" data-tooltip="${_("Edit Start Date")}"> <a href="${settings_url}" class="edit-button action-button" data-tooltip="${_("Edit Start Date")}">
<i class="icon-pencil"></i> <i class="icon fa fa-pencil"></i>
<span class="action-button-text sr">${_("Edit Start Date")}</span> <span class="action-button-text sr">${_("Edit Start Date")}</span>
</a> </a>
</li> </li>
...@@ -111,7 +111,7 @@ from contentstore.utils import reverse_usage_url ...@@ -111,7 +111,7 @@ from contentstore.utils import reverse_usage_url
</article> </article>
</div> </div>
<div class="ui-loading"> <div class="ui-loading">
<p><span class="spin"><i class="icon-refresh"></i></span> <span class="copy">${_("Loading...")}</span></p> <p><span class="spin"><i class="icon fa fa-refresh"></i></span> <span class="copy">${_("Loading...")}</span></p>
</div> </div>
</article> </article>
<aside class="content-supplementary" role="complementary"> <aside class="content-supplementary" role="complementary">
......
...@@ -37,7 +37,7 @@ ...@@ -37,7 +37,7 @@
<h3 class="sr">${_("Page Actions")}</h3> <h3 class="sr">${_("Page Actions")}</h3>
<ul> <ul>
<li class="nav-item"> <li class="nav-item">
<a href="#" class="button new-button new-tab"><i class="icon-plus"></i> ${_("New Page")}</a> <a href="#" class="button new-button new-tab"><i class="icon fa fa-plus"></i> ${_("New Page")}</a>
</li> </li>
<li class="nav-item"> <li class="nav-item">
<a href="${lms_link}" rel="external" class="button view-button view-live-button">${_("View Live")}</a> <a href="${lms_link}" rel="external" class="button view-button view-live-button">${_("View Live")}</a>
...@@ -105,7 +105,7 @@ ...@@ -105,7 +105,7 @@
% else: % else:
<input type="checkbox" class="toggle-checkbox" data-tooltip="${_('Show/hide page')}" /> <input type="checkbox" class="toggle-checkbox" data-tooltip="${_('Show/hide page')}" />
% endif % endif
<div class="action-button"><i class="icon-eye-open"></i><i class="icon-eye-close"></i></div> <div class="action-button"><i class="icon fa fa-eye"></i><i class="icon fa fa-eye-slash"></i></div>
</li> </li>
% endif % endif
...@@ -131,7 +131,7 @@ ...@@ -131,7 +131,7 @@
</div> </div>
<div class="add-pages"> <div class="add-pages">
<p>${_("You can add additional custom pages to your course.")} <a href="#" class="button new-button new-tab"><i class="icon-plus"></i>${_("Add a New Page")}</a></p> <p>${_("You can add additional custom pages to your course.")} <a href="#" class="button new-button new-tab"><i class="icon fa fa-plus"></i>${_("Add a New Page")}</a></p>
</div> </div>
</article> </article>
</div> </div>
...@@ -163,7 +163,7 @@ ...@@ -163,7 +163,7 @@
</figure> </figure>
<a href="#" rel="view" class="action action-modal-close"> <a href="#" rel="view" class="action action-modal-close">
<i class="icon-remove-sign"></i> <i class="icon fa fa-times-circle"></i>
<span class="label">${_("close modal")}</span> <span class="label">${_("close modal")}</span>
</a> </a>
</div> </div>
......
...@@ -53,7 +53,7 @@ ...@@ -53,7 +53,7 @@
<ul class="list-actions"> <ul class="list-actions">
<li class="item-action"> <li class="item-action">
<a class="action action-export action-primary" href="${export_url}"> <a class="action action-export action-primary" href="${export_url}">
<i class="icon-download"></i> <i class="icon fa fa-arrow-circle-o-down"></i>
<span class="copy">${_("Export Course Content")}</span> <span class="copy">${_("Export Course Content")}</span>
</a> </a>
</li> </li>
......
...@@ -39,7 +39,7 @@ ...@@ -39,7 +39,7 @@
<ul class="list-actions"> <ul class="list-actions">
<li class="item-action"> <li class="item-action">
<a class="action action-export-git"" action-primary" href="${reverse('export_git', kwargs=dict(course_key_string=unicode(context_course.id)))}?action=push"> <a class="action action-export-git"" action-primary" href="${reverse('export_git', kwargs=dict(course_key_string=unicode(context_course.id)))}?action=push">
<i class="icon-download"></i> <i class="icon fa fa-arrow-circle-o-down"></i>
<span class="copy">${_("Export to Git")}</span> <span class="copy">${_("Export to Git")}</span>
</a> </a>
</li> </li>
......
...@@ -37,7 +37,7 @@ ...@@ -37,7 +37,7 @@
<h3 class="sr">${_("Page Actions")}</h3> <h3 class="sr">${_("Page Actions")}</h3>
<ul> <ul>
<li class="nav-item"> <li class="nav-item">
<a href="#" class="button new-button"><i class="icon-plus"></i> ${_("New Group Configuration")}</a> <a href="#" class="button new-button"><i class="icon fa fa-plus"></i> ${_("New Group Configuration")}</a>
</li> </li>
</ul> </ul>
</nav> </nav>
...@@ -55,7 +55,7 @@ ...@@ -55,7 +55,7 @@
</div> </div>
% else: % else:
<div class="ui-loading"> <div class="ui-loading">
<p><span class="spin"><i class="icon-refresh"></i></span> <span class="copy">${_("Loading")}</span></p> <p><span class="spin"><i class="icon fa fa-refresh"></i></span> <span class="copy">${_("Loading")}</span></p>
</div> </div>
% endif % endif
</article> </article>
......
...@@ -40,7 +40,7 @@ ...@@ -40,7 +40,7 @@
<img src="${static.url("images/thumb-hiw-feature1.png")}" alt="${_('{studio_name} Helps You Keep Your Courses Organized').format(studio_name=settings.STUDIO_SHORT_NAME)}" /> <img src="${static.url("images/thumb-hiw-feature1.png")}" alt="${_('{studio_name} Helps You Keep Your Courses Organized').format(studio_name=settings.STUDIO_SHORT_NAME)}" />
<figcaption class="sr">${_("{studio_name} Helps You Keep Your Courses Organized").format(studio_name=settings.STUDIO_NAME)}</figcaption> <figcaption class="sr">${_("{studio_name} Helps You Keep Your Courses Organized").format(studio_name=settings.STUDIO_NAME)}</figcaption>
<span class="action-zoom"> <span class="action-zoom">
<i class="icon-zoom-in"></i> <i class="icon fa fa-search-plus"></i>
</span> </span>
</a> </a>
</figure> </figure>
...@@ -74,7 +74,7 @@ ...@@ -74,7 +74,7 @@
<img src="${static.url("images/thumb-hiw-feature2.png")}" alt="${_('Learning is More than Just Lectures')}" /> <img src="${static.url("images/thumb-hiw-feature2.png")}" alt="${_('Learning is More than Just Lectures')}" />
<figcaption class="sr">${_("Learning is More than Just Lectures")}</figcaption> <figcaption class="sr">${_("Learning is More than Just Lectures")}</figcaption>
<span class="action-zoom"> <span class="action-zoom">
<i class="icon-zoom-in"></i> <i class="icon fa fa-search-plus"></i>
</span> </span>
</a> </a>
</figure> </figure>
...@@ -108,7 +108,7 @@ ...@@ -108,7 +108,7 @@
<img src="${static.url("images/thumb-hiw-feature3.png")}" alt="${_('{studio_name} Gives You Simple, Fast, and Incremental Publishing. With Friends.').format(studio_name=settings.STUDIO_SHORT_NAME)}" /> <img src="${static.url("images/thumb-hiw-feature3.png")}" alt="${_('{studio_name} Gives You Simple, Fast, and Incremental Publishing. With Friends.').format(studio_name=settings.STUDIO_SHORT_NAME)}" />
<figcaption class="sr">${_("{studio_name} Gives You Simple, Fast, and Incremental Publishing. With Friends.").format(studio_name=settings.STUDIO_SHORT_NAME)}</figcaption> <figcaption class="sr">${_("{studio_name} Gives You Simple, Fast, and Incremental Publishing. With Friends.").format(studio_name=settings.STUDIO_SHORT_NAME)}</figcaption>
<span class="action-zoom"> <span class="action-zoom">
<i class="icon-zoom-in"></i> <i class="icon fa fa-search-plus"></i>
</span> </span>
</a> </a>
</figure> </figure>
...@@ -164,7 +164,7 @@ ...@@ -164,7 +164,7 @@
</figure> </figure>
<a href="" rel="view" class="action action-modal-close"> <a href="" rel="view" class="action action-modal-close">
<i class="icon-remove-sign"></i> <i class="icon fa fa-times-circle"></i>
<span class="label">${_("close modal")}</span> <span class="label">${_("close modal")}</span>
</a> </a>
</div> </div>
...@@ -177,7 +177,7 @@ ...@@ -177,7 +177,7 @@
</figure> </figure>
<a href="" rel="view" class="action action-modal-close"> <a href="" rel="view" class="action action-modal-close">
<i class="icon-remove-sign"></i> <i class="icon fa fa-times-circle"></i>
<span class="label">${_("close modal")}</span> <span class="label">${_("close modal")}</span>
</a> </a>
</div> </div>
...@@ -190,7 +190,7 @@ ...@@ -190,7 +190,7 @@
</figure> </figure>
<a href="" rel="view" class="action action-modal-close"> <a href="" rel="view" class="action action-modal-close">
<i class="icon-remove-sign"></i> <i class="icon fa fa-times-circle"></i>
<span class="label">${_("close modal")}</span> <span class="label">${_("close modal")}</span>
</a> </a>
</div> </div>
......
...@@ -7,7 +7,7 @@ ...@@ -7,7 +7,7 @@
<div class="copy"> <div class="copy">
<h2 class="title"> <h2 class="title">
<i class="icon-warning-sign"></i> <i class="icon fa fa-warning"></i>
${_("We're having trouble rendering your component")} ${_("We're having trouble rendering your component")}
</h2> </h2>
......
...@@ -36,7 +36,7 @@ ...@@ -36,7 +36,7 @@
<p class="error-block"></p> <p class="error-block"></p>
<a href="#" class="action action-choose-file choose-file-button"> <a href="#" class="action action-choose-file choose-file-button">
<i class="icon-upload"></i> <i class="icon fa fa-upload"></i>
<span class="copy">${_("Choose a File to Import")}</span> <span class="copy">${_("Choose a File to Import")}</span>
</a> </a>
...@@ -57,8 +57,8 @@ ...@@ -57,8 +57,8 @@
<ol class="status-progress list-progress"> <ol class="status-progress list-progress">
<li class="item-progresspoint item-progresspoint-upload is-complete"> <li class="item-progresspoint item-progresspoint-upload is-complete">
<span class="deco status-visual"> <span class="deco status-visual">
<i class="icon-cog"></i> <i class="icon fa fa-cog"></i>
<i class="icon-warning-sign"></i> <i class="icon fa fa-warning"></i>
</span> </span>
<div class="status-detail"> <div class="status-detail">
...@@ -72,8 +72,8 @@ ...@@ -72,8 +72,8 @@
<li class="item-progresspoint item-progresspoint-unpack is-started"> <li class="item-progresspoint item-progresspoint-unpack is-started">
<span class="deco status-visual"> <span class="deco status-visual">
<i class="icon-cog icon-spin"></i> <i class="icon fa fa-cog fa-spin"></i>
<i class="icon-warning-sign"></i> <i class="icon fa fa-warning"></i>
</span> </span>
<div class="status-detail"> <div class="status-detail">
...@@ -85,8 +85,8 @@ ...@@ -85,8 +85,8 @@
<li class="item-progresspoint item-progresspoint-verify is-not-started"> <li class="item-progresspoint item-progresspoint-verify is-not-started">
<span class="deco status-visual"> <span class="deco status-visual">
<i class="icon-cog"></i> <i class="icon fa fa-cog"></i>
<i class="icon-warning-sign"></i> <i class="icon fa fa-warning"></i>
</span> </span>
<div class="status-detail"> <div class="status-detail">
...@@ -97,8 +97,8 @@ ...@@ -97,8 +97,8 @@
<li class="item-progresspoint item-progresspoint-import is-not-started"> <li class="item-progresspoint item-progresspoint-import is-not-started">
<span class="deco status-visual"> <span class="deco status-visual">
<i class="icon-cog"></i> <i class="icon fa fa-cog"></i>
<i class="icon-warning-sign"></i> <i class="icon fa fa-warning"></i>
</span> </span>
<div class="status-detail"> <div class="status-detail">
...@@ -108,7 +108,7 @@ ...@@ -108,7 +108,7 @@
</li> </li>
<li class="item-progresspoint item-progresspoint-success has-actions is-not-started"> <li class="item-progresspoint item-progresspoint-success has-actions is-not-started">
<span class="deco status-visual"> <span class="deco status-visual">
<i class="icon-check"></i> <i class="icon fa fa-square-o"></i>
</span> </span>
<div class="status-detail"> <div class="status-detail">
......
...@@ -22,7 +22,7 @@ ...@@ -22,7 +22,7 @@
<ul> <ul>
<li class="nav-item"> <li class="nav-item">
% if course_creator_status=='granted': % if course_creator_status=='granted':
<a href="#" class="button new-button new-course-button"><i class="icon-plus icon-inline"></i> <a href="#" class="button new-button new-course-button"><i class="icon fa fa-plus icon-inline"></i>
${_("New Course")}</a> ${_("New Course")}</a>
% elif course_creator_status=='disallowed_for_this_site' and settings.FEATURES.get('STUDIO_REQUEST_EMAIL',''): % elif course_creator_status=='disallowed_for_this_site' and settings.FEATURES.get('STUDIO_REQUEST_EMAIL',''):
<a href="mailto:${settings.FEATURES.get('STUDIO_REQUEST_EMAIL','')}">${_("Email staff to create course")}</a> <a href="mailto:${settings.FEATURES.get('STUDIO_REQUEST_EMAIL','')}">${_("Email staff to create course")}</a>
...@@ -141,7 +141,7 @@ ...@@ -141,7 +141,7 @@
<dl class="course-status"> <dl class="course-status">
<dt class="label sr">${_("This course run is currently being created.")}</dt> <dt class="label sr">${_("This course run is currently being created.")}</dt>
<dd class="value"> <dd class="value">
<i class="icon icon-refresh icon-spin"></i> <i class="icon fa fa-refresh fa-spin"></i>
## Translators: This is a status message, used to inform the user of what the system is doing. This status means that the user has requested to re-run an existing course, and the system is currently in the process of duplicating and configuring the existing course so that it can be re-run. ## Translators: This is a status message, used to inform the user of what the system is doing. This status means that the user has requested to re-run an existing course, and the system is currently in the process of duplicating and configuring the existing course so that it can be re-run.
<span class="copy">${_("Configuring as re-run")}</span> <span class="copy">${_("Configuring as re-run")}</span>
</dd> </dd>
...@@ -183,7 +183,7 @@ ...@@ -183,7 +183,7 @@
<dl class="course-status"> <dl class="course-status">
<dt class="label sr">This re-run processing status:</dt> <dt class="label sr">This re-run processing status:</dt>
<dd class="value"> <dd class="value">
<i class="icon icon-warning-sign"></i> <i class="icon fa fa-warning"></i>
<span class="copy">Configuration Error</span> <span class="copy">Configuration Error</span>
</dd> </dd>
</dl> </dl>
...@@ -195,7 +195,7 @@ ...@@ -195,7 +195,7 @@
<ul class="status-actions"> <ul class="status-actions">
<li class="action action-dismiss"> <li class="action action-dismiss">
<a href="#" class="button dismiss-button" data-dismiss-link="${course_info['dismiss_link']}"> <a href="#" class="button dismiss-button" data-dismiss-link="${course_info['dismiss_link']}">
<i class="icon icon-remove-sign"></i> <i class="icon fa fa-times-circle"></i>
<span class="button-copy">${_("Dismiss")}</span> <span class="button-copy">${_("Dismiss")}</span>
</a> </a>
</li> </li>
...@@ -270,7 +270,7 @@ ...@@ -270,7 +270,7 @@
<ul class="list-actions"> <ul class="list-actions">
<li class="action-item"> <li class="action-item">
<a href="#" class="action-primary action-create action-create-course new-course-button"><i class="icon-plus icon-inline"></i> ${_('Create Your First Course')}</a> <a href="#" class="action-primary action-create action-create-course new-course-button"><i class="icon fa fa-plus icon-inline"></i> ${_('Create Your First Course')}</a>
</li> </li>
</ul> </ul>
</div> </div>
...@@ -283,7 +283,7 @@ ...@@ -283,7 +283,7 @@
%if course_creator_status == "unrequested": %if course_creator_status == "unrequested":
<div class="wrapper wrapper-creationrights"> <div class="wrapper wrapper-creationrights">
<h3 class="title"> <h3 class="title">
<a href="#instruction-creationrights" class="ui-toggle-control show-creationrights"><span class="label">${_('Becoming a Course Creator in {studio_name}').format(studio_name=settings.STUDIO_SHORT_NAME)}</span> <i class="icon-remove-sign"></i></a> <a href="#instruction-creationrights" class="ui-toggle-control show-creationrights"><span class="label">${_('Becoming a Course Creator in {studio_name}').format(studio_name=settings.STUDIO_SHORT_NAME)}</span> <i class="icon fa fa-times-circle"></i></a>
</h3> </h3>
<div class="notice notice-incontext notice-instruction notice-instruction-creationrights ui-toggle-target" id="instruction-creationrights"> <div class="notice notice-incontext notice-instruction notice-instruction-creationrights ui-toggle-target" id="instruction-creationrights">
...@@ -297,7 +297,7 @@ ...@@ -297,7 +297,7 @@
<form id="request-coursecreator" action="${request_course_creator_url}" method="post" enctype="multipart/form-data"> <form id="request-coursecreator" action="${request_course_creator_url}" method="post" enctype="multipart/form-data">
<div class="form-actions"> <div class="form-actions">
<button type="submit" id="request-coursecreator-submit" name="request-coursecreator-submit" class="action-primary action-request"><i class="icon-cog icon-inline icon-spin"></i> <span class="label">${_('Request the Ability to Create Courses')}</span></button> <button type="submit" id="request-coursecreator-submit" name="request-coursecreator-submit" class="action-primary action-request"><i class="icon fa fa-cog icon-inline fa fa-spin"></i> <span class="label">${_('Request the Ability to Create Courses')}</span></button>
</div> </div>
</form> </form>
</div> </div>
...@@ -307,7 +307,7 @@ ...@@ -307,7 +307,7 @@
%elif course_creator_status == "denied": %elif course_creator_status == "denied":
<div class="wrapper wrapper-creationrights is-shown"> <div class="wrapper wrapper-creationrights is-shown">
<h3 class="title"> <h3 class="title">
<a href="#instruction-creationrights" class="ui-toggle-control current show-creationrights"><span class="label">${_('Your Course Creator Request Status')}</span> <i class="icon-remove-sign"></i></a> <a href="#instruction-creationrights" class="ui-toggle-control current show-creationrights"><span class="label">${_('Your Course Creator Request Status')}</span> <i class="icon fa fa-times-circle"></i></a>
</h3> </h3>
<div class="notice notice-incontext notice-instruction notice-instruction-creationrights ui-toggle-target" id="instruction-creationrights"> <div class="notice notice-incontext notice-instruction notice-instruction-creationrights ui-toggle-target" id="instruction-creationrights">
...@@ -335,7 +335,7 @@ ...@@ -335,7 +335,7 @@
%elif course_creator_status == "pending": %elif course_creator_status == "pending":
<div class="wrapper wrapper-creationrights is-shown"> <div class="wrapper wrapper-creationrights is-shown">
<h3 class="title"> <h3 class="title">
<a href="#instruction-creationrights" class="ui-toggle-control current show-creationrights"><span class="label">${_('Your Course Creator Request Status')}</span> <i class="icon-remove-sign"></i></a> <a href="#instruction-creationrights" class="ui-toggle-control current show-creationrights"><span class="label">${_('Your Course Creator Request Status')}</span> <i class="icon fa fa-times-circle"></i></a>
</h3> </h3>
<div class="notice notice-incontext notice-instruction notice-instruction-creationrights ui-toggle-target" id="instruction-creationrights"> <div class="notice notice-incontext notice-instruction notice-instruction-creationrights ui-toggle-target" id="instruction-creationrights">
......
...@@ -27,5 +27,5 @@ ...@@ -27,5 +27,5 @@
</div> </div>
<div class="no-asset-content"> <div class="no-asset-content">
<p><%= gettext("You haven't added any assets to this course yet.") %> <a href="#" class="button upload-button new-button"><i class="icon-plus"></i><%= gettext("Upload your first asset") %></a></p> <p><%= gettext("You haven't added any assets to this course yet.") %> <a href="#" class="button new-button upload-button"><i class="icon fa fa-plus"></i><%= gettext("Upload your first asset") %></a></p>
</div> </div>
<div class="upload-modal modal" style="display: none;"> <div class="upload-modal modal" style="display: none;">
<a href="#" class="close-button"><i class="icon-remove-sign"></i> <span class="sr"><%= gettext('close') %></span></a> <a href="#" class="close-button"><i class="icon fa fa-times-circle"></i> <span class="sr"><%= gettext('close') %></span></a>
<div class="modal-body"> <div class="modal-body">
<h1 class="title"><%= gettext("Upload New File") %></h1> <h1 class="title"><%= gettext("Upload New File") %></h1>
<p class="file-name"> <p class="file-name">
......
...@@ -22,12 +22,12 @@ ...@@ -22,12 +22,12 @@
<td class="actions-col"> <td class="actions-col">
<ul class="actions-list"> <ul class="actions-list">
<li class="action-item action-delete"> <li class="action-item action-delete">
<a href="#" data-tooltip="<%= gettext('Delete this asset') %>" class="remove-asset-button action-button"><i class="icon-remove-sign"></i> <span class="sr"><%= gettext('Delete this asset') %></span></a> <a href="#" data-tooltip="<%= gettext('Delete this asset') %>" class="remove-asset-button action-button"><i class="icon fa fa-times-circle"></i> <span class="sr"><%= gettext('Delete this asset') %></span></a>
</li> </li>
<li class="action-item action-lock"> <li class="action-item action-lock">
<label for="<%= uniqueId %>"><span class="sr"><%= gettext('Lock this asset') %></span></label> <label for="<%= uniqueId %>"><span class="sr"><%= gettext('Lock this asset') %></span></label>
<input type="checkbox" id="<%= uniqueId %>" class="lock-checkbox" data-tooltip="<%= gettext('Lock/unlock file') %>" /> <input type="checkbox" id="<%= uniqueId %>" class="lock-checkbox" data-tooltip="<%= gettext('Lock/unlock file') %>" />
<div class="action-button"><i class="icon-lock"></i><i class="icon-unlock-alt"></i></div> <div class="action-button"><i class="icon fa fa-lock"></i><i class="icon fa fa-unlock-alt"></i></div>
</li> </li>
</ul> </ul>
</td> </td>
...@@ -11,11 +11,11 @@ ...@@ -11,11 +11,11 @@
</span></span> </span></span>
<header> <header>
<h3 class="checklist-title title-2 is-selectable" title="Collapse/Expand this Checklist"> <h3 class="checklist-title title-2 is-selectable" title="Collapse/Expand this Checklist">
<i class="icon-caret-down ui-toggle-expansion"></i> <i class="icon fa fa-caret-down ui-toggle-expansion"></i>
<%= checklistShortDescription %></h3> <%= checklistShortDescription %></h3>
<span class="checklist-status status"> <span class="checklist-status status">
<%= gettext("Tasks Completed:") %> <span class="status-count"><%= itemsChecked %></span>/<span class="status-amount"><%= items.length %></span> <%= gettext("Tasks Completed:") %> <span class="status-count"><%= itemsChecked %></span>/<span class="status-amount"><%= items.length %></span>
<i class="icon-ok"></i> <i class="icon fa fa-check-square-o"></i>
</span> </span>
</header> </header>
......
<% if (currentlyVisibleToStudents) { %> <% if (currentlyVisibleToStudents) { %>
<div class="message has-warnings"> <div class="message has-warnings">
<p class="warning"> <p class="warning">
<i class="icon-warning-sign"></i> <i class="icon fa fa-warning"></i>
<%= gettext("Caution: The last published version of this unit is live. By publishing changes you will change the student experience.") %> <%= gettext("Caution: The last published version of this unit is live. By publishing changes you will change the student experience.") %>
</p> </p>
</div> </div>
......
...@@ -23,11 +23,11 @@ if (staffOnlyMessage) { ...@@ -23,11 +23,11 @@ if (staffOnlyMessage) {
var statusIconClass = ''; var statusIconClass = '';
if (statusType === 'warning') { if (statusType === 'warning') {
statusIconClass = 'icon-file-alt'; statusIconClass = 'fa-file-o';
} else if (statusType === 'error') { } else if (statusType === 'error') {
statusIconClass = 'icon-warning-sign'; statusIconClass = 'fa-warning';
} else if (statusType === 'staff-only') { } else if (statusType === 'staff-only') {
statusIconClass = 'icon-lock'; statusIconClass = 'fa-lock';
} }
var gradingType = gettext('Not Graded'); var gradingType = gettext('Not Graded');
...@@ -39,13 +39,13 @@ if (xblockInfo.get('graded')) { ...@@ -39,13 +39,13 @@ if (xblockInfo.get('graded')) {
<li class="outline-item outline-<%= xblockType %> <%= visibilityClass %> is-draggable <%= includesChildren ? 'is-collapsible' : '' %> <%= isCollapsed ? 'is-collapsed' : '' %>" <li class="outline-item outline-<%= xblockType %> <%= visibilityClass %> is-draggable <%= includesChildren ? 'is-collapsible' : '' %> <%= isCollapsed ? 'is-collapsed' : '' %>"
data-parent="<%= parentInfo.get('id') %>" data-locator="<%= xblockInfo.get('id') %>"> data-parent="<%= parentInfo.get('id') %>" data-locator="<%= xblockInfo.get('id') %>">
<span class="draggable-drop-indicator draggable-drop-indicator-before"><i class="icon-caret-right"></i></span> <span class="draggable-drop-indicator draggable-drop-indicator-before"><i class="icon fa fa-caret-right"></i></span>
<div class="<%= xblockType %>-header"> <div class="<%= xblockType %>-header">
<% if (includesChildren) { %> <% if (includesChildren) { %>
<h3 class="<%= xblockType %>-header-details expand-collapse <%= isCollapsed ? 'expand' : 'collapse' %> ui-toggle-expansion" <h3 class="<%= xblockType %>-header-details expand-collapse <%= isCollapsed ? 'expand' : 'collapse' %> ui-toggle-expansion"
title="<%= interpolate(gettext('Collapse/Expand this %(xblock_type)s'), { xblock_type: xblockTypeDisplayName }, true) %>"> title="<%= interpolate(gettext('Collapse/Expand this %(xblock_type)s'), { xblock_type: xblockTypeDisplayName }, true) %>">
<i class="icon-caret-down icon"></i> <i class="icon fa fa-caret-down"></i>
<% } else { %> <% } else { %>
<h3 class="<%= xblockType %>-header-details"> <h3 class="<%= xblockType %>-header-details">
<% } %> <% } %>
...@@ -65,7 +65,7 @@ if (xblockInfo.get('graded')) { ...@@ -65,7 +65,7 @@ if (xblockInfo.get('graded')) {
<% if (xblockInfo.isPublishable()) { %> <% if (xblockInfo.isPublishable()) { %>
<li class="action-item action-publish"> <li class="action-item action-publish">
<a href="#" data-tooltip="<%= gettext('Publish') %>" class="publish-button action-button"> <a href="#" data-tooltip="<%= gettext('Publish') %>" class="publish-button action-button">
<i class="icon icon-upload-alt"></i> <i class="icon fa fa-upload"></i>
<span class="sr action-button-text"><%= gettext('Publish') %></span> <span class="sr action-button-text"><%= gettext('Publish') %></span>
</a> </a>
</li> </li>
...@@ -73,14 +73,14 @@ if (xblockInfo.get('graded')) { ...@@ -73,14 +73,14 @@ if (xblockInfo.get('graded')) {
<% if (xblockInfo.isEditableOnCourseOutline()) { %> <% if (xblockInfo.isEditableOnCourseOutline()) { %>
<li class="action-item action-configure"> <li class="action-item action-configure">
<a href="#" data-tooltip="<%= gettext('Configure') %>" class="configure-button action-button"> <a href="#" data-tooltip="<%= gettext('Configure') %>" class="configure-button action-button">
<i class="icon-gear"></i> <i class="icon fa fa-gear"></i>
<span class="sr action-button-text"><%= gettext('Configure') %></span> <span class="sr action-button-text"><%= gettext('Configure') %></span>
</a> </a>
</li> </li>
<% } %> <% } %>
<li class="action-item action-delete"> <li class="action-item action-delete">
<a href="#" data-tooltip="<%= gettext('Delete') %>" class="delete-button action-button"> <a href="#" data-tooltip="<%= gettext('Delete') %>" class="delete-button action-button">
<i class="icon icon-trash"></i> <i class="icon fa fa-trash-o"></i>
<span class="sr action-button-text"><%= gettext('Delete') %></span> <span class="sr action-button-text"><%= gettext('Delete') %></span>
</a> </a>
</li> </li>
...@@ -100,13 +100,13 @@ if (xblockInfo.get('graded')) { ...@@ -100,13 +100,13 @@ if (xblockInfo.get('graded')) {
<span class="sr status-release-label"><%= gettext('Release Status:') %></span> <span class="sr status-release-label"><%= gettext('Release Status:') %></span>
<span class="status-release-value"> <span class="status-release-value">
<% if (xblockInfo.get('released_to_students')) { %> <% if (xblockInfo.get('released_to_students')) { %>
<i class="icon icon-check-sign"></i> <i class="icon fa fa-check-square-o"></i>
<%= gettext('Released:') %> <%= gettext('Released:') %>
<% } else if (xblockInfo.get('release_date')) { %> <% } else if (xblockInfo.get('release_date')) { %>
<i class="icon icon-time"></i> <i class="icon fa fa-clock-o"></i>
<%= gettext('Scheduled:') %> <%= gettext('Scheduled:') %>
<% } else { %> <% } else { %>
<i class="icon icon-time"></i> <i class="icon fa fa-clock-o"></i>
<%= gettext('Unscheduled') %> <%= gettext('Unscheduled') %>
<% } %> <% } %>
<% if (xblockInfo.get('release_date')) { %> <% if (xblockInfo.get('release_date')) { %>
...@@ -119,7 +119,7 @@ if (xblockInfo.get('graded')) { ...@@ -119,7 +119,7 @@ if (xblockInfo.get('graded')) {
<div class="status-grading"> <div class="status-grading">
<p> <p>
<span class="sr status-grading-label"> <%= gettext('Graded as:') %> </span> <span class="sr status-grading-label"> <%= gettext('Graded as:') %> </span>
<i class="icon icon-ok"></i> <i class="icon fa fa-check"></i>
<span class="status-grading-value"> <%= gradingType %> </span> <span class="status-grading-value"> <%= gradingType %> </span>
<% if (xblockInfo.get('due_date')) { %> <% if (xblockInfo.get('due_date')) { %>
<span class="status-grading-date"> <%= gettext('Due:') %> <%= xblockInfo.get('due_date') %> </span> <span class="status-grading-date"> <%= gettext('Due:') %> <%= xblockInfo.get('due_date') %> </span>
...@@ -131,7 +131,7 @@ if (xblockInfo.get('graded')) { ...@@ -131,7 +131,7 @@ if (xblockInfo.get('graded')) {
<% if (statusMessage) { %> <% if (statusMessage) { %>
<div class="status-message"> <div class="status-message">
<i class="icon <%= statusIconClass %>"></i> <i class="icon fa <%= statusIconClass %>"></i>
<p class="status-message-copy"><%- statusMessage %></p> <p class="status-message-copy"><%- statusMessage %></p>
</div> </div>
<% } %> <% } %>
...@@ -144,7 +144,7 @@ if (xblockInfo.get('graded')) { ...@@ -144,7 +144,7 @@ if (xblockInfo.get('graded')) {
<a href="#" class="button button-new" data-category="<%= childCategory %>" <a href="#" class="button button-new" data-category="<%= childCategory %>"
data-parent="<%= xblockInfo.get('id') %>" data-default-name="<%= defaultNewChildName %>" data-parent="<%= xblockInfo.get('id') %>" data-default-name="<%= defaultNewChildName %>"
title="<%= interpolate(gettext('Click to add a new %(xblock_type)s'), { xblock_type: defaultNewChildName }, true) %>" > title="<%= interpolate(gettext('Click to add a new %(xblock_type)s'), { xblock_type: defaultNewChildName }, true) %>" >
<i class="icon-plus"></i><%= addChildLabel %> <i class="icon fa fa-plus"></i><%= addChildLabel %>
</a> </a>
</p> </p>
</div> </div>
...@@ -152,7 +152,7 @@ if (xblockInfo.get('graded')) { ...@@ -152,7 +152,7 @@ if (xblockInfo.get('graded')) {
<div class="outline-content <%= xblockType %>-content"> <div class="outline-content <%= xblockType %>-content">
<ol class="<%= typeListClass %> is-sortable"> <ol class="<%= typeListClass %> is-sortable">
<li class="ui-splint ui-splint-indicator"> <li class="ui-splint ui-splint-indicator">
<span class="draggable-drop-indicator draggable-drop-indicator-initial"><i class="icon-caret-right"></i></span> <span class="draggable-drop-indicator draggable-drop-indicator-initial"><i class="icon fa fa-caret-right"></i></span>
</li> </li>
</ol> </ol>
...@@ -161,7 +161,7 @@ if (xblockInfo.get('graded')) { ...@@ -161,7 +161,7 @@ if (xblockInfo.get('graded')) {
<a href="#" class="button button-new" data-category="<%= childCategory %>" <a href="#" class="button button-new" data-category="<%= childCategory %>"
data-parent="<%= xblockInfo.get('id') %>" data-default-name="<%= defaultNewChildName %>" data-parent="<%= xblockInfo.get('id') %>" data-default-name="<%= defaultNewChildName %>"
title="<%= interpolate(gettext('Click to add a new %(xblock_type)s'), { xblock_type: defaultNewChildName }, true) %>" > title="<%= interpolate(gettext('Click to add a new %(xblock_type)s'), { xblock_type: defaultNewChildName }, true) %>" >
<i class="icon icon-plus"></i><%= addChildLabel %> <i class="icon fa fa-plus"></i><%= addChildLabel %>
</a> </a>
</div> </div>
<% } %> <% } %>
...@@ -169,6 +169,6 @@ if (xblockInfo.get('graded')) { ...@@ -169,6 +169,6 @@ if (xblockInfo.get('graded')) {
<% } %> <% } %>
<% if (parentInfo) { %> <% if (parentInfo) { %>
<span class="draggable-drop-indicator draggable-drop-indicator-after"><i class="icon-caret-right"></i></span> <span class="draggable-drop-indicator draggable-drop-indicator-after"><i class="icon fa fa-caret-right"></i></span>
</li> </li>
<% } %> <% } %>
...@@ -15,7 +15,7 @@ ...@@ -15,7 +15,7 @@
<ul class="list-actions"> <ul class="list-actions">
<li class="action-item"> <li class="action-item">
<a href="#" data-tooltip="<%= gettext('Clear Grading Due Date') %>" class="clear-date action-button action-clear"> <a href="#" data-tooltip="<%= gettext('Clear Grading Due Date') %>" class="clear-date action-button action-clear">
<i class="icon-undo"></i> <i class="icon fa fa-undo"></i>
<span class="sr"><%= gettext('Clear Grading Due Date') %></span> <span class="sr"><%= gettext('Clear Grading Due Date') %></span>
</a> </a>
</li> </li>
......
...@@ -11,4 +11,4 @@ ...@@ -11,4 +11,4 @@
<span class="tip tip-stacked"><%= gettext("upload a PDF file or provide the path to a Studio asset file") %></span> <span class="tip tip-stacked"><%= gettext("upload a PDF file or provide the path to a Studio asset file") %></span>
<button class="action action-upload"><%= gettext("Upload PDF") %></button> <button class="action action-upload"><%= gettext("Upload PDF") %></button>
</div> </div>
<a href="" class="action action-close"><i class="icon-remove-sign"></i> <span class="sr"><%= gettext("delete chapter") %></span></a> <a href="" class="action action-close"><i class="icon fa fa-times-circle"></i> <span class="sr"><%= gettext("delete chapter") %></span></a>
...@@ -18,7 +18,7 @@ ...@@ -18,7 +18,7 @@
<legend class="sr"><%= gettext("Chapter information") %></legend> <legend class="sr"><%= gettext("Chapter information") %></legend>
<ol class="chapters list-input enum"></ol> <ol class="chapters list-input enum"></ol>
<button class="action action-add-chapter"><i class="icon-plus"></i> <%= gettext("Add a Chapter") %></button> <button class="action action-add-chapter"><i class="icon fa fa-plus"></i> <%= gettext("Add a Chapter") %></button>
</fieldset> </fieldset>
</div> </div>
<div class="actions"> <div class="actions">
......
...@@ -2,7 +2,7 @@ ...@@ -2,7 +2,7 @@
<header class="group-configuration-header"> <header class="group-configuration-header">
<h3 class="group-configuration-title"> <h3 class="group-configuration-title">
<a href="#" class="group-toggle <% if(showGroups){ print('hide'); } else { print('show'); } %>-groups"> <a href="#" class="group-toggle <% if(showGroups){ print('hide'); } else { print('show'); } %>-groups">
<i class="ui-toggle-expansion icon-caret-<% if(showGroups){ print('down'); } else { print('right'); } %>"></i> <i class="ui-toggle-expansion icon fa fa-caret-<% if(showGroups){ print('down'); } else { print('right'); } %>"></i>
<%= name %> <%= name %>
</a> </a>
</h3> </h3>
...@@ -46,11 +46,11 @@ ...@@ -46,11 +46,11 @@
</li> </li>
<% if (_.isEmpty(usage)) { %> <% if (_.isEmpty(usage)) { %>
<li class="action action-delete wrapper-delete-button"> <li class="action action-delete wrapper-delete-button">
<button class="delete action-icon"><i class="icon-trash"></i><span><%= gettext("Delete") %></span></button> <button class="delete action-icon"><i class="icon fa fa-trash-o"></i><span><%= gettext("Delete") %></span></button>
</li> </li>
<% } else { %> <% } else { %>
<li class="action action-delete wrapper-delete-button" data-tooltip="<%= gettext('Cannot delete when in use by an experiment') %>"> <li class="action action-delete wrapper-delete-button" data-tooltip="<%= gettext('Cannot delete when in use by an experiment') %>">
<button class="delete action-icon is-disabled" aria-disabled="true" ><i class="icon-trash"></i><span><%= gettext("Delete") %></span></button> <button class="delete action-icon is-disabled" aria-disabled="true"><i class="icon fa fa-trash-o"></i><span><%= gettext("Delete") %></span></button>
</li> </li>
<% } %> <% } %>
</ul> </ul>
...@@ -66,9 +66,9 @@ ...@@ -66,9 +66,9 @@
<% if (unit.validation) { %> <% if (unit.validation) { %>
<p> <p>
<% if (unit.validation.type === 'warning') { %> <% if (unit.validation.type === 'warning') { %>
<i class="icon-warning-sign"></i> <i class="icon fa fa-warning"></i>
<% } else if (unit.validation.type === 'error') { %> <% } else if (unit.validation.type === 'error') { %>
<i class="icon-exclamation-sign"></i> <i class="icon fa fa-exclamation-circle"></i>
<% } %> <% } %>
<span class="group-configuration-validation-message"> <span class="group-configuration-validation-message">
<%= unit.validation.text %> <%= unit.validation.text %>
......
...@@ -30,11 +30,11 @@ ...@@ -30,11 +30,11 @@
<label class="groups-fields-label required"><%= gettext("Groups") %></label> <label class="groups-fields-label required"><%= gettext("Groups") %></label>
<span class="tip tip-stacked"><%= gettext("Name of the groups that students will be assigned to, for example, Control, Video, Problems. You must have two or more groups.") %></span> <span class="tip tip-stacked"><%= gettext("Name of the groups that students will be assigned to, for example, Control, Video, Problems. You must have two or more groups.") %></span>
<ol class="groups list-input enum"></ol> <ol class="groups list-input enum"></ol>
<button class="action action-add-group"><i class="icon-plus"></i> <%= gettext("Add another group") %></button> <button class="action action-add-group"><i class="icon fa fa-plus"></i> <%= gettext("Add another group") %></button>
</fieldset> </fieldset>
<% if (!_.isEmpty(usage)) { %> <% if (!_.isEmpty(usage)) { %>
<div class="wrapper-group-configuration-validation"> <div class="wrapper-group-configuration-validation">
<i class="icon-warning-sign"></i> <i class="icon fa fa-warning"></i>
<p class="group-configuration-validation-text"> <p class="group-configuration-validation-text">
<%= gettext('This configuration is currently used in content experiments. If you make changes to the groups, you may need to edit those experiments.') %> <%= gettext('This configuration is currently used in content experiments. If you make changes to the groups, you may need to edit those experiments.') %>
</p> </p>
......
<div class="input-wrap field long text required field-add-group-name group-<%= index %>-name <div class="input-wrap field long text required field-add-group-name group-<%= index %>-name
<% if (error && error.attributes && error.attributes.name) { print('error'); } %>"><input name="group-<%= index %>-name" class="group-name long" value="<%= name %>" type="text"> <% if (error && error.attributes && error.attributes.name) { print('error'); } %>"><input name="group-<%= index %>-name" class="group-name long" value="<%= name %>" type="text">
</div><div class="group-allocation"><%= allocation %>%</div> </div><div class="group-allocation"><%= allocation %>%</div>
<a href="" class="action action-close"><i class="icon-remove-sign"></i> <span class="sr"><%= gettext("delete group") %></span></a> <a href="" class="action action-close"><i class="icon fa fa-times-circle"></i> <span class="sr"><%= gettext("delete group") %></span></a>
...@@ -3,11 +3,11 @@ ...@@ -3,11 +3,11 @@
<div id="<%= uniqueId %>" class="wrapper-dict-settings"> <div id="<%= uniqueId %>" class="wrapper-dict-settings">
<ol class="list-settings"></ol> <ol class="list-settings"></ol>
<a href="#" class="create-action create-setting"> <a href="#" class="create-action create-setting">
<i class="icon-plus"></i><%= gettext("Add") %> <span class="sr"><%= model.get('display_name')%></span> <i class="icon fa fa-plus"></i><%= gettext("Add") %> <span class="sr"><%= model.get('display_name')%></span>
</a> </a>
</div> </div>
<button class="action setting-clear inactive" type="button" name="setting-clear" value="<%= gettext("Clear") %>" data-tooltip="<%= gettext("Clear") %>"> <button class="action setting-clear inactive" type="button" name="setting-clear" value="<%= gettext("Clear") %>" data-tooltip="<%= gettext("Clear") %>">
<i class="icon-undo"></i> <i class="icon fa fa-undo"></i>
<span class="sr">"<%= gettext("Clear Value") %>"</span> <span class="sr">"<%= gettext("Clear Value") %>"</span>
</button> </button>
</div> </div>
......
...@@ -3,7 +3,7 @@ ...@@ -3,7 +3,7 @@
<input type="hidden" id="<%= uniqueId %>" class="input setting-input" value="<%= model.get("value") %>"> <input type="hidden" id="<%= uniqueId %>" class="input setting-input" value="<%= model.get("value") %>">
<div class="wrapper-uploader-actions"></div> <div class="wrapper-uploader-actions"></div>
<button class="action setting-clear inactive" type="button" name="setting-clear" value="<%= gettext("Clear") %>" data-tooltip="<%= gettext("Clear") %>"> <button class="action setting-clear inactive" type="button" name="setting-clear" value="<%= gettext("Clear") %>" data-tooltip="<%= gettext("Clear") %>">
<i class="icon-undo"></i><span class="sr">"<%= gettext("Clear Value") %>"</span> <i class="icon fa fa-undo"></i><span class="sr">"<%= gettext("Clear Value") %>"</span>
</button> </button>
</div> </div>
<span class="tip setting-help"><%= model.get('help') %></span> <span class="tip setting-help"><%= model.get('help') %></span>
...@@ -6,7 +6,7 @@ ...@@ -6,7 +6,7 @@
</ol> </ol>
<a href="#" class="create-action create-setting"> <a href="#" class="create-action create-setting">
<i class="icon-plus"></i><%= gettext("Add") %> <span class="sr"><%= model.get('display_name')%></span> <i class="icon fa fa-plus"></i><%= gettext("Add") %> <span class="sr"><%= model.get('display_name')%></span>
</a> </a>
</div> </div>
<button class="action setting-clear inactive" type="button" name="setting-clear" value="<%= gettext("Clear") %>" data-tooltip="<%= gettext("Clear") %>"> <button class="action setting-clear inactive" type="button" name="setting-clear" value="<%= gettext("Clear") %>" data-tooltip="<%= gettext("Clear") %>">
......
...@@ -2,7 +2,7 @@ ...@@ -2,7 +2,7 @@
<label class="label setting-label" for="<%= uniqueId %>"><%= model.get('display_name') %></label> <label class="label setting-label" for="<%= uniqueId %>"><%= model.get('display_name') %></label>
<input class="input setting-input setting-input-number" type="number" id="<%= uniqueId %>" value='<%= model.get("value") %>'/> <input class="input setting-input setting-input-number" type="number" id="<%= uniqueId %>" value='<%= model.get("value") %>'/>
<button class="action setting-clear inactive" type="button" name="setting-clear" value="<%= gettext("Clear") %>" data-tooltip="<%= gettext("Clear") %>"> <button class="action setting-clear inactive" type="button" name="setting-clear" value="<%= gettext("Clear") %>" data-tooltip="<%= gettext("Clear") %>">
<i class="icon-undo"></i><span class="sr">"<%= gettext("Clear Value") %>"</span> <i class="icon fa fa-undo"></i><span class="sr">"<%= gettext("Clear Value") %>"</span>
</button> </button>
</div> </div>
<span class="tip setting-help"><%= model.get('help') %></span> <span class="tip setting-help"><%= model.get('help') %></span>
...@@ -10,7 +10,7 @@ ...@@ -10,7 +10,7 @@
<% }) %> <% }) %>
</select> </select>
<button class="action setting-clear inactive" type="button" name="setting-clear" value="<%= gettext("Clear") %>" data-tooltip="<%= gettext("Clear") %>"> <button class="action setting-clear inactive" type="button" name="setting-clear" value="<%= gettext("Clear") %>" data-tooltip="<%= gettext("Clear") %>">
<i class="icon-undo"></i><span class="sr">"<%= gettext("Clear Value") %>"</span> <i class="icon fa fa-undo"></i><span class="sr">"<%= gettext("Clear Value") %>"</span>
</button> </button>
</div> </div>
<span class="tip setting-help"><%= model.get('help') %></span> <span class="tip setting-help"><%= model.get('help') %></span>
...@@ -2,7 +2,7 @@ ...@@ -2,7 +2,7 @@
<label class="label setting-label" for="<%= uniqueId %>"><%= model.get('display_name') %></label> <label class="label setting-label" for="<%= uniqueId %>"><%= model.get('display_name') %></label>
<input class="input setting-input" type="text" id="<%= uniqueId %>" value='<%= model.get("value") %>'/> <input class="input setting-input" type="text" id="<%= uniqueId %>" value='<%= model.get("value") %>'/>
<button class="action setting-clear inactive" type="button" name="setting-clear" value="<%= gettext("Clear") %>" data-tooltip="<%= gettext("Clear") %>"> <button class="action setting-clear inactive" type="button" name="setting-clear" value="<%= gettext("Clear") %>" data-tooltip="<%= gettext("Clear") %>">
<i class="icon-undo"></i><span class="sr">"<%= gettext("Clear Value") %>"</span> <i class="icon fa fa-undo"></i><span class="sr">"<%= gettext("Clear Value") %>"</span>
</button> </button>
</div> </div>
<span class="tip setting-help"><%= model.get('help') %></span> <span class="tip setting-help"><%= model.get('help') %></span>
...@@ -28,7 +28,7 @@ ...@@ -28,7 +28,7 @@
% else: % else:
<li class="action-item action-edit nav-item"> <li class="action-item action-edit nav-item">
<a href="#" class="button edit-button action-button"> <a href="#" class="button edit-button action-button">
<i class="icon-pencil"></i> <i class="icon fa fa-pencil"></i>
<span class="action-button-text">${_("Edit")}</span> <span class="action-button-text">${_("Edit")}</span>
</a> </a>
</li> </li>
...@@ -47,7 +47,7 @@ ...@@ -47,7 +47,7 @@
<section class="wrapper-xblock level-page studio-xblock-wrapper" data-locator="locator-container"> <section class="wrapper-xblock level-page studio-xblock-wrapper" data-locator="locator-container">
</section> </section>
<div class="ui-loading is-hidden"> <div class="ui-loading is-hidden">
<p><span class="spin"><i class="icon-refresh"></i></span> <span class="copy">Loading...</span></p> <p><span class="spin"><i class="icon fa fa-refresh"></i></span> <span class="copy">Loading...</span></p>
</div> </div>
</article> </article>
<aside class="content-supplementary" role="complementary"> <aside class="content-supplementary" role="complementary">
......
...@@ -19,7 +19,7 @@ ...@@ -19,7 +19,7 @@
<div class="xblock-header-primary"> <div class="xblock-header-primary">
<div class="header-details"> <div class="header-details">
<a href="#" data-tooltip="Expand or Collapse" class="action expand-collapse expand"> <a href="#" data-tooltip="Expand or Collapse" class="action expand-collapse expand">
<i class="icon-caret-down ui-toggle-expansion"></i> <i class="icon fa fa-caret-down ui-toggle-expansion"></i>
<span class="sr">Expand or Collapse</span> <span class="sr">Expand or Collapse</span>
</a> </a>
<span class="xblock-display-name">Group A</span> <span class="xblock-display-name">Group A</span>
...@@ -124,7 +124,7 @@ ...@@ -124,7 +124,7 @@
<div class="xblock-header-primary"> <div class="xblock-header-primary">
<div class="header-details"> <div class="header-details">
<a href="#" data-tooltip="Expand or Collapse" class="action expand-collapse expand"> <a href="#" data-tooltip="Expand or Collapse" class="action expand-collapse expand">
<i class="icon-caret-down ui-toggle-expansion"></i> <i class="icon fa fa-caret-down ui-toggle-expansion"></i>
<span class="sr">Expand or Collapse</span> <span class="sr">Expand or Collapse</span>
</a> </a>
<span class="xblock-display-name">Group B</span> <span class="xblock-display-name">Group B</span>
......
...@@ -12,13 +12,13 @@ ...@@ -12,13 +12,13 @@
<ul> <ul>
<li class="nav-item"> <li class="nav-item">
<a href="#" class="button button-toggle button-toggle-expand-collapse collapse-all is-hidden"> <a href="#" class="button button-toggle button-toggle-expand-collapse collapse-all is-hidden">
<span class="collapse-all"><i class="icon-arrow-up"></i> <span class="label">Collapse All Sections</span></span> <span class="collapse-all"><i class="icon fa fa-arrow-up"></i> <span class="label">Collapse All Sections</span></span>
<span class="expand-all"><i class="icon-arrow-down"></i> <span class="label">Expand All Sections</span></span> <span class="expand-all"><i class="icon fa fa-arrow-down"></i> <span class="label">Expand All Sections</span></span>
</a> </a>
</li> </li>
<li class="nav-item"> <li class="nav-item">
<a href="#" class="button button-new" data-category="chapter" data-parent="mock-course" data-default-name="Section" title="Click to add a new section"> <a href="#" class="button button-new" data-category="chapter" data-parent="mock-course" data-default-name="Section" title="Click to add a new section">
<i class="icon-plus"></i>New Section <i class="icon fa fa-plus"></i>New Section
</a> </a>
</li> </li>
<li class="nav-item"> <li class="nav-item">
...@@ -37,14 +37,14 @@ ...@@ -37,14 +37,14 @@
<div class="no-content add-xblock-component"> <div class="no-content add-xblock-component">
<p>You haven't added any content to this course yet. <p>You haven't added any content to this course yet.
<a href="#" class="button button-new" data-category="chapter" data-parent="mock-course" data-default-name="Section" title="Click to add a new section"> <a href="#" class="button button-new" data-category="chapter" data-parent="mock-course" data-default-name="Section" title="Click to add a new section">
<i class="icon-plus"></i>Add Section <i class="icon fa fa-plus"></i>Add Section
</a> </a>
</p> </p>
</div> </div>
</article> </article>
</div> </div>
<div class="ui-loading"> <div class="ui-loading">
<p><span class="spin"><i class="icon-refresh"></i></span> <span class="copy">Loading...</span></p> <p><span class="spin"><i class="icon fa fa-refresh"></i></span> <span class="copy">Loading...</span></p>
</div> </div>
</article> </article>
<aside class="content-supplementary" role="complementary"> <aside class="content-supplementary" role="complementary">
......
<div id="page-alert"> <div id="page-alert">
<div class="wrapper wrapper-alert wrapper-alert-announcement is-shown"> <div class="wrapper wrapper-alert wrapper-alert-announcement is-shown">
<div class="alert announcement has-actions"> <div class="alert announcement has-actions">
<i class="feedback-symbol icon-bullhorn"></i> <i class="feedback-symbol icon fa fa-bullhorn"></i>
<div class="copy"> <div class="copy">
<h2 class="title title-3">This course was created as a re-run. Some manual configuration is needed.</h2> <h2 class="title title-3">This course was created as a re-run. Some manual configuration is needed.</h2>
...@@ -14,7 +14,7 @@ ...@@ -14,7 +14,7 @@
<ul class="nav-actions"> <ul class="nav-actions">
<li class="action action-dismiss"> <li class="action action-dismiss">
<a href="#" class="button dismiss-button" data-dismiss-link="dummy_dismiss_url"> <a href="#" class="button dismiss-button" data-dismiss-link="dummy_dismiss_url">
<i class="icon icon-remove-sign"></i> <i class="icon icon fa fa-times-circle"></i>
<span class="button-copy">Dismiss</span> <span class="button-copy">Dismiss</span>
</a> </a>
</li> </li>
......
<header class="xblock-header"> <header class="xblock-header">
<div class="header-details"> <div class="header-details">
<a href="#" data-tooltip="Expand or Collapse" class="action expand-collapse collapse"> <a href="#" data-tooltip="Expand or Collapse" class="action expand-collapse collapse">
<i class="icon-caret-down ui-toggle-expansion"></i> <i class="icon fa fa-caret-down ui-toggle-expansion"></i>
<span class="sr">Expand or Collapse</span> <span class="sr">Expand or Collapse</span>
</a> </a>
<span class="xblock-display-name">Empty Vertical Test</span> <span class="xblock-display-name">Empty Vertical Test</span>
......
...@@ -9,7 +9,7 @@ ...@@ -9,7 +9,7 @@
<h3 class="sr">${_("Page Actions")}</h3> <h3 class="sr">${_("Page Actions")}</h3>
<ul> <ul>
<li class="nav-item"> <li class="nav-item">
<a href="#" class="button new-button"><i class="icon-plus"></i> ${_("New Group Configuration")}</a> <a href="#" class="button new-button"><i class="icon fa fa-plus"></i> ${_("New Group Configuration")}</a>
</li> </li>
</ul> </ul>
</nav> </nav>
...@@ -20,7 +20,7 @@ ...@@ -20,7 +20,7 @@
<section class="content"> <section class="content">
<article class="content-primary" role="main"> <article class="content-primary" role="main">
<div class="ui-loading"> <div class="ui-loading">
<p><span class="spin"><i class="icon-refresh"></i></span> <span class="copy">${_("Loading...")}</span></p> <p><span class="spin"><i class="icon fa fa-refresh"></i></span> <span class="copy">${_("Loading...")}</span></p>
</div> </div>
</article> </article>
<aside class="content-supplementary" role="complementary"></aside> <aside class="content-supplementary" role="complementary"></aside>
......
...@@ -5,7 +5,7 @@ ...@@ -5,7 +5,7 @@
<h3 class="sr">Page Actions</h3> <h3 class="sr">Page Actions</h3>
<ul> <ul>
<li class="nav-item"> <li class="nav-item">
<a href="#" class="button new-button new-course-button"><i class="icon-plus icon-inline"></i> <a href="#" class="button new-button new-course-button"><i class="icon fa fa-plus icon-inline"></i>
New Course</a> New Course</a>
</li> </li>
</ul> </ul>
...@@ -106,7 +106,7 @@ ...@@ -106,7 +106,7 @@
<dl class="course-status"> <dl class="course-status">
<dt class="label sr">This re-run processing status:</dt> <dt class="label sr">This re-run processing status:</dt>
<dd class="value"> <dd class="value">
<i class="icon icon-refresh icon-spin"></i> <i class="icon fa fa-refresh icon-spin"></i>
<span class="copy">Configuring as re-run</span> <span class="copy">Configuring as re-run</span>
</dd> </dd>
</dl> </dl>
...@@ -142,7 +142,7 @@ ...@@ -142,7 +142,7 @@
<dl class="course-status"> <dl class="course-status">
<dt class="label sr">This re-run processing status:</dt> <dt class="label sr">This re-run processing status:</dt>
<dd class="value"> <dd class="value">
<i class="icon icon-warning-sign"></i> <i class="icon fa fa-warning"></i>
<span class="copy">Configuration Error</span> <span class="copy">Configuration Error</span>
</dd> </dd>
</dl> </dl>
...@@ -154,7 +154,7 @@ ...@@ -154,7 +154,7 @@
<ul class="status-actions"> <ul class="status-actions">
<li class="action action-dismiss"> <li class="action action-dismiss">
<a href="#" class="button dismiss-button" data-dismiss-link="dummy_dismiss_url"> <a href="#" class="button dismiss-button" data-dismiss-link="dummy_dismiss_url">
<i class="icon icon-remove-sign"></i> <i class="icon fa fa-times-circle"></i>
<span class="button-copy">Dismiss</span> <span class="button-copy">Dismiss</span>
</a> </a>
</li> </li>
......
...@@ -19,7 +19,7 @@ ...@@ -19,7 +19,7 @@
\t<label class="label setting-label" for="<%= uniqueId %>"><%= model.get('display_name') %></label> \t<label class="label setting-label" for="<%= uniqueId %>"><%= model.get('display_name') %></label>
\t<input class="input setting-input" type="text" id="<%= uniqueId %>" value='<%= model.get("value") %>'/> \t<input class="input setting-input" type="text" id="<%= uniqueId %>" value='<%= model.get("value") %>'/>
\t<button class="action setting-clear inactive" type="button" name="setting-clear" value="<%= gettext("Clear") %>" data-tooltip="<%= gettext("Clear") %>"> \t<button class="action setting-clear inactive" type="button" name="setting-clear" value="<%= gettext("Clear") %>" data-tooltip="<%= gettext("Clear") %>">
<i class="icon-undo"></i><span class="sr">"<%= gettext("Clear Value") %>"</span> <i class="icon fa fa-undo"></i><span class="sr">"<%= gettext("Clear Value") %>"</span>
</button> </button>
</div> </div>
<span class="tip setting-help"><%= model.get('help') %></span> <span class="tip setting-help"><%= model.get('help') %></span>
......
...@@ -15,7 +15,7 @@ ...@@ -15,7 +15,7 @@
\t<label class="label setting-label" for="<%= uniqueId %>"><%= model.get('display_name') %></label> \t<label class="label setting-label" for="<%= uniqueId %>"><%= model.get('display_name') %></label>
\t<input class="input setting-input" type="text" id="<%= uniqueId %>" value='<%= model.get("value") %>'/> \t<input class="input setting-input" type="text" id="<%= uniqueId %>" value='<%= model.get("value") %>'/>
\t<button class="action setting-clear inactive" type="button" name="setting-clear" value="<%= gettext("Clear") %>" data-tooltip="<%= gettext("Clear") %>"> \t<button class="action setting-clear inactive" type="button" name="setting-clear" value="<%= gettext("Clear") %>" data-tooltip="<%= gettext("Clear") %>">
<i class="icon-undo"></i><span class="sr">"<%= gettext("Clear Value") %>"</span> <i class="icon fa fa-undo"></i><span class="sr">"<%= gettext("Clear Value") %>"</span>
</button> </button>
</div> </div>
<span class="tip setting-help"><%= model.get('help') %></span> <span class="tip setting-help"><%= model.get('help') %></span>
......
<div class="no-group-configurations-content"> <div class="no-group-configurations-content">
<p><%= gettext("You haven't created any group configurations yet.") %><a href="#" class="button new-button"><i class="icon-plus"></i><%= gettext("Add your first Group Configuration") %></a></p> <p><%= gettext("You haven't created any group configurations yet.") %><a href="#" class="button new-button"><i class="icon fa fa-plus"></i><%= gettext("Add your first Group Configuration") %></a></p>
</div> </div>
<div class="no-textbook-content"> <div class="no-textbook-content">
<p><%= gettext("You haven't added any textbooks to this course yet.") %><a href="#" class="button new-button"><i class="icon-plus"></i><%= gettext("Add your first textbook") %></a></p> <p><%= gettext("You haven't added any textbooks to this course yet.") %><a href="#" class="button new-button"><i class="icon fa fa-plus"></i><%= gettext("Add your first textbook") %></a></p>
</div> </div>
<nav class="pagination pagination-full bottom"> <nav class="pagination pagination-full bottom">
<ol> <ol>
<li class="nav-item previous"><a class="nav-link previous-page-link" href="#"><i class="icon-angle-left"></i> <span class="nav-label"><%= gettext("Previous") %></span></a></li> <li class="nav-item previous"><a class="nav-link previous-page-link" href="#"><i class="icon fa fa-angle-left"></i> <span class="nav-label"><%= gettext("Previous") %></span></a></li>
<li class="nav-item page"> <li class="nav-item page">
<div class="pagination-form"> <div class="pagination-form">
<label class="page-number-label" for="page-number-input"><%= gettext("Page number") %></label> <label class="page-number-label" for="page-number-input"><%= gettext("Page number") %></label>
...@@ -11,6 +11,6 @@ ...@@ -11,6 +11,6 @@
<span class="page-divider">/</span> <span class="page-divider">/</span>
<span class="total-pages"><%= total_pages %></span> <span class="total-pages"><%= total_pages %></span>
</li> </li>
<li class="nav-item next"><a class="nav-link next-page-link" href="#"><span class="nav-label"><%= gettext("Next") %></span> <i class="icon-angle-right"></i></a></li> <li class="nav-item next"><a class="nav-link next-page-link" href="#"><span class="nav-label"><%= gettext("Next") %></span> <i class="icon fa fa-angle-right"></i></a></li>
</ol> </ol>
</nav> </nav>
...@@ -4,8 +4,8 @@ ...@@ -4,8 +4,8 @@
</div> </div>
<nav class="pagination pagination-compact top"> <nav class="pagination pagination-compact top">
<ol> <ol>
<li class="nav-item previous"><a class="nav-link previous-page-link" href="#"><i class="icon-angle-left"></i> <span class="nav-label"><%= gettext("Previous") %></span></a></li> <li class="nav-item previous"><a class="nav-link previous-page-link" href="#"><i class="icon fa fa-angle-left"></i> <span class="nav-label"><%= gettext("Previous") %></span></a></li>
<li class="nav-item next"><a class="nav-link next-page-link" href="#"><span class="nav-label"><%= gettext("Next") %></span> <i class="icon-angle-right"></i></a></li> <li class="nav-item next"><a class="nav-link next-page-link" href="#"><span class="nav-label"><%= gettext("Next") %></span> <i class="icon fa fa-angle-right"></i></a></li>
</ol> </ol>
</nav> </nav>
</div> </div>
...@@ -80,9 +80,9 @@ var visibleToStaffOnly = visibilityState === 'staff_only'; ...@@ -80,9 +80,9 @@ var visibleToStaffOnly = visibilityState === 'staff_only';
<p class="action-inline"> <p class="action-inline">
<a href="" class="action-staff-lock" role="button" aria-pressed="<%= hasExplicitStaffLock %>"> <a href="" class="action-staff-lock" role="button" aria-pressed="<%= hasExplicitStaffLock %>">
<% if (hasExplicitStaffLock) { %> <% if (hasExplicitStaffLock) { %>
<i class="icon-check"></i> <i class="icon fa fa-check-square-o"></i>
<% } else { %> <% } else { %>
<i class="icon-check-empty"></i> <i class="icon fa fa-square-o"></i>
<% } %> <% } %>
<%= gettext('Hide from students') %> <%= gettext('Hide from students') %>
</a> </a>
......
...@@ -19,7 +19,7 @@ ...@@ -19,7 +19,7 @@
<ul class="list-actions"> <ul class="list-actions">
<li class="action-item"> <li class="action-item">
<a href="#" data-tooltip="<%= gettext('Clear Release Date/Time') %>" class="clear-date action-button action-clear"> <a href="#" data-tooltip="<%= gettext('Clear Release Date/Time') %>" class="clear-date action-button action-clear">
<i class="icon-undo"></i> <i class="icon fa fa-undo"></i>
<span class="sr"><%= gettext('Clear Release Date/Time') %></span> <span class="sr"><%= gettext('Clear Release Date/Time') %></span>
</a> </a>
</li> </li>
......
...@@ -8,7 +8,7 @@ ...@@ -8,7 +8,7 @@
<% if(chapters.length > 1) {%> <% if(chapters.length > 1) {%>
<p><a href="#" class="chapter-toggle <p><a href="#" class="chapter-toggle
<% if(showChapters){ print('hide'); } else { print('show'); } %>-chapters"> <% if(showChapters){ print('hide'); } else { print('show'); } %>-chapters">
<i class="ui-toggle-expansion icon-caret-<% if(showChapters){ print('down'); } else { print('right'); } %>"></i> <i class="ui-toggle-expansion icon fa fa-caret-<% if(showChapters){ print('down'); } else { print('right'); } %>"></i>
<%= chapters.length %> PDF Chapters <%= chapters.length %> PDF Chapters
</a></p> </a></p>
<% } else if(chapters.length === 1) { %> <% } else if(chapters.length === 1) { %>
...@@ -40,7 +40,7 @@ ...@@ -40,7 +40,7 @@
<button class="edit"><%= gettext("Edit") %></button> <button class="edit"><%= gettext("Edit") %></button>
</li> </li>
<li class="action action-delete"> <li class="action action-delete">
<button class="delete action-icon"><i class="icon-trash"></i><span><%= gettext("Delete") %></span></button> <button class="delete action-icon"><i class="icon fa fa-trash-o"></i><span><%= gettext("Delete") %></span></button>
</li> </li>
</ul> </ul>
......
...@@ -5,8 +5,8 @@ ...@@ -5,8 +5,8 @@
<li class="field field-checkbox checkbox-cosmetic"> <li class="field field-checkbox checkbox-cosmetic">
<input type="checkbox" id="staff_lock" name="staff_lock" class="input input-checkbox" /> <input type="checkbox" id="staff_lock" name="staff_lock" class="input input-checkbox" />
<label for="staff_lock" class="label"> <label for="staff_lock" class="label">
<i class="icon-check input-checkbox-checked"></i> <i class="icon fa fa-check-square-o input-checkbox-checked"></i>
<i class="icon-check-empty input-checkbox-unchecked"></i> <i class="icon fa fa-square-o input-checkbox-unchecked"></i>
<%= gettext('Hide from students') %> <%= gettext('Hide from students') %>
</label> </label>
...@@ -32,4 +32,4 @@ ...@@ -32,4 +32,4 @@
</li> </li>
</ul> </ul>
</div> </div>
</form> </form>
\ No newline at end of file
...@@ -9,8 +9,8 @@ ...@@ -9,8 +9,8 @@
> >
<div class="<%= type %> <%= intent %> <% if(obj.actions) { %>has-actions<% } %>"> <div class="<%= type %> <%= intent %> <% if(obj.actions) { %>has-actions<% } %>">
<% if(obj.icon) { %> <% if(obj.icon) { %>
<% var iconClass = {"warning": "warning-sign", "confirmation": "ok", "error": "warning-sign", "announcement": "bullhorn", "step-required": "exclamation-sign", "help": "question-sign", "mini": "cog"} %> <% var iconClass = {"warning": "warning", "confirmation": "ok", "error": "warning", "announcement": "bullhorn", "step-required": "exclamation-circle", "help": "question", "mini": "cog"} %>
<i class="feedback-symbol icon-<%= iconClass[intent] %>"></i> <i class="feedback-symbol fa fa-<%= iconClass[intent] %>"></i>
<% } %> <% } %>
<div class="copy"> <div class="copy">
...@@ -40,7 +40,7 @@ ...@@ -40,7 +40,7 @@
<% if(obj.closeIcon) { %> <% if(obj.closeIcon) { %>
<a href="#" rel="view" class="action action-close action-<%= type %>-close"> <a href="#" rel="view" class="action action-close action-<%= type %>-close">
<i class="icon-remove-sign"></i> <i class="icon fa fa-times-circle"></i>
<span class="label">close <%= type %></span> <span class="label">close <%= type %></span>
</a> </a>
<% } %> <% } %>
......
...@@ -17,7 +17,7 @@ ...@@ -17,7 +17,7 @@
<div class="add-<%= childType %> add-item"> <div class="add-<%= childType %> add-item">
<a href="#" class="button button-new" data-category="<%= childCategory %>" <a href="#" class="button button-new" data-category="<%= childCategory %>"
data-parent="<%= xblockInfo.get('id') %>" data-default-name="<%= defaultNewChildName %>"> data-parent="<%= xblockInfo.get('id') %>" data-default-name="<%= defaultNewChildName %>">
<i class="icon icon-plus"></i><%= addChildLabel %> <i class="icon fa fa-plus"></i><%= addChildLabel %>
</a> </a>
</div> </div>
<% } %> <% } %>
......
...@@ -15,11 +15,11 @@ ...@@ -15,11 +15,11 @@
<hr> <hr>
<ul class = "error-list"> <ul class = "error-list">
<% _.each(response, function(value, index, list) { %> <% _.each(response, function(value, index, list) { %>
<li class = "error-item"> <li class = "error-item">
<span class='error-item-title'> <span class='error-item-title'>
<i class="icon-warning-sign"></i> <i class="icon fa fa-warning"></i>
<strong><%= value.model.display_name %></strong>: <strong><%= value.model.display_name %></strong>:
</span> </span>
<textarea class = "error-item-message" disabled='disabled'><%=value.message%></textarea> <textarea class = "error-item-message" disabled='disabled'><%=value.message%></textarea>
......
...@@ -3,11 +3,11 @@ ...@@ -3,11 +3,11 @@
<div class="wrapper-translations-settings"> <div class="wrapper-translations-settings">
<ol class="list-settings"></ol> <ol class="list-settings"></ol>
<a href="#" class="create-action create-setting"> <a href="#" class="create-action create-setting">
<i class="icon-plus"></i><%= gettext("Add") %> <span class="sr"><%= model.get('display_name')%></span> <i class="icon fa fa-plus"></i><%= gettext("Add") %> <span class="sr"><%= model.get('display_name')%></span>
</a> </a>
</div> </div>
<button class="action setting-clear inactive" type="button" name="setting-clear" value="<%= gettext("Clear") %>" data-tooltip="<%= gettext("Clear") %>"> <button class="action setting-clear inactive" type="button" name="setting-clear" value="<%= gettext("Clear") %>" data-tooltip="<%= gettext("Clear") %>">
<i class="icon-undo"></i> <i class="icon fa fa-undo"></i>
<span class="sr">"<%= gettext("Clear Value") %>"</span> <span class="sr">"<%= gettext("Clear Value") %>"</span>
</button> </button>
</div> </div>
......
<li class="list-settings-item" <li class="list-settings-item"
><a href="#" class="remove-action remove-setting" data-lang="<%= lang %>" data-value="<%= value %>"><i class="icon-remove-sign"></i><span class="sr"><%= gettext("Remove") %></span></a> ><a href="#" class="remove-action remove-setting" data-lang="<%= lang %>" data-value="<%= value %>"><i class="icon fa fa-times-circle"></i><span class="sr"><%= gettext("Remove") %></span></a>
<input type="hidden" class="input" value="<%= value %>"> <input type="hidden" class="input" value="<%= value %>">
<div class="list-settings-buttons"><% if (lang) { <div class="list-settings-buttons"><% if (lang) {
%><a href="#" class="upload-action upload-setting" data-lang="<%= lang %>" data-value="<%= value %>"><%= value ? gettext("Replace") : gettext("Upload") %> %><a href="#" class="upload-action upload-setting" data-lang="<%= lang %>" data-value="<%= value %>"><%= value ? gettext("Replace") : gettext("Upload") %>
......
<div class="transcripts-message-status status-error"> <div class="transcripts-message-status status-error">
<i class="icon-remove"></i> <i class="icon fa fa-remove"></i>
<%= gettext("Timed Transcript Conflict") %> <%= gettext("Timed Transcript Conflict") %>
</div> </div>
......
<div class="transcripts-message-status"><i class="icon-ok"></i><%= gettext("Timed Transcript Found") %></div> <div class="transcripts-message-status"><i class="icon fa fa-check"></i><%= gettext("Timed Transcript Found") %></div>
<p class="transcripts-message"> <p class="transcripts-message">
<%= gettext("EdX has a timed transcript for this video. If you want to edit this transcript, you can download, edit, and re-upload the existing transcript. If you want to replace this transcript, upload a new .srt transcript file.") %> <%= gettext("EdX has a timed transcript for this video. If you want to edit this transcript, you can download, edit, and re-upload the existing transcript. If you want to replace this transcript, upload a new .srt transcript file.") %>
</p> </p>
......
<div class="transcripts-message-status status-error"><i class="icon-remove"></i><%= gettext("No EdX Timed Transcript") %></div> <div class="transcripts-message-status status-error"><i class="icon fa fa-remove"></i><%= gettext("No EdX Timed Transcript") %></div>
<p class="transcripts-message"> <p class="transcripts-message">
<%= gettext("EdX doesn\'t have a timed transcript for this video in Studio, but we found a transcript on YouTube. You can import the YouTube transcript or upload your own .srt transcript file.") %> <%= gettext("EdX doesn\'t have a timed transcript for this video in Studio, but we found a transcript on YouTube. You can import the YouTube transcript or upload your own .srt transcript file.") %>
</p> </p>
......
<div class="transcripts-message-status status-error"><i class="icon-remove"></i><%= gettext("No Timed Transcript") %></div> <div class="transcripts-message-status status-error"><i class="icon fa fa-remove"></i><%= gettext("No Timed Transcript") %></div>
<p class="transcripts-message"> <p class="transcripts-message">
<%= gettext("EdX doesn\'t have a timed transcript for this video. Please upload an .srt file.") %> <%= gettext("EdX doesn\'t have a timed transcript for this video. Please upload an .srt file.") %>
</p> </p>
......
<div class="transcripts-message-status status-error"> <div class="transcripts-message-status status-error">
<i class="icon-remove"></i> <i class="icon fa fa-remove"></i>
<%= gettext("Timed Transcript Conflict") %> <%= gettext("Timed Transcript Conflict") %>
</div> </div>
......
<div class="transcripts-message-status"><i class="icon-ok"></i><%= gettext("Timed Transcript Uploaded Successfully") %></div> <div class="transcripts-message-status"><i class="icon fa fa-check"></i><%= gettext("Timed Transcript Uploaded Successfully") %></div>
<p class="transcripts-message"> <p class="transcripts-message">
<%= gettext("EdX has a timed transcript for this video. If you want to replace this transcript, upload a new .srt transcript file. If you want to edit this transcript, you can download, edit, and re-upload the existing transcript.") %> <%= gettext("EdX has a timed transcript for this video. If you want to replace this transcript, upload a new .srt transcript file. If you want to edit this transcript, you can download, edit, and re-upload the existing transcript.") %>
</p> </p>
......
<div class="transcripts-message-status status-error"> <div class="transcripts-message-status status-error">
<i class="icon-remove"></i> <i class="icon fa fa-remove"></i>
<%= gettext("Confirm Timed Transcript") %> <%= gettext("Confirm Timed Transcript") %>
</div> </div>
......
...@@ -5,7 +5,7 @@ ...@@ -5,7 +5,7 @@
<div class="tip videolist-url-tip setting-help"><%= model.get('help') %></div> <div class="tip videolist-url-tip setting-help"><%= model.get('help') %></div>
<div class="wrapper-videolist-urls"> <div class="wrapper-videolist-urls">
<a href="#" class="collapse-action collapse-setting"> <a href="#" class="collapse-action collapse-setting">
<i class="icon-plus"></i><%= gettext("Add URLs for additional versions") %> <span class="sr"><%= model.get('display_name')%></span> <i class="icon fa fa-plus"></i><%= gettext("Add URLs for additional versions") %> <span class="sr"><%= model.get('display_name')%></span>
</a> </a>
<div class="videolist-extra-videos"> <div class="videolist-extra-videos">
<span class="tip videolist-extra-videos-tip setting-help"><%= gettext('To be sure all students can access the video, we recommend providing both an .mp4 and a .webm version of your video. Click below to add a URL for another version. These URLs cannot be YouTube URLs. The first listed video that\'s compatible with the student\'s computer will play.') %></span> <span class="tip videolist-extra-videos-tip setting-help"><%= gettext('To be sure all students can access the video, we recommend providing both an .mp4 and a .webm version of your video. Click below to add a URL for another version. These URLs cannot be YouTube URLs. The first listed video that\'s compatible with the student\'s computer will play.') %></span>
......
<% if (parentInfo) { %> <% if (parentInfo) { %>
<li class="outline-item outline-item-<%= xblockType %> <%= includesChildren ? 'is-collapsible' : '' %> is-draggable <%= isCollapsed ? 'is-collapsed' : '' %>" <li class="outline-item outline-item-<%= xblockType %> <%= includesChildren ? 'is-collapsible' : '' %> is-draggable <%= isCollapsed ? 'is-collapsed' : '' %>"
data-parent="<%= parentInfo.get('id') %>" data-locator="<%= xblockInfo.get('id') %>"> data-parent="<%= parentInfo.get('id') %>" data-locator="<%= xblockInfo.get('id') %>">
<span class="draggable-drop-indicator draggable-drop-indicator-before"><i class="icon-caret-right"></i></span> <span class="draggable-drop-indicator draggable-drop-indicator-before"><i class="icon fa fa-caret-right"></i></span>
<div class="wrapper-xblock-header"> <div class="wrapper-xblock-header">
<div class="wrapper-xblock-header-primary"> <div class="wrapper-xblock-header-primary">
<% if (includesChildren) { %> <% if (includesChildren) { %>
<h3 class="xblock-title expand-collapse <%= isCollapsed ? 'expand' : 'collapse' %>" <h3 class="xblock-title expand-collapse <%= isCollapsed ? 'expand' : 'collapse' %>"
title="<%= interpolate(gettext('Collapse/Expand this %(xblock_type)s'), { xblock_type: xblockTypeDisplayName }, true) %>"> title="<%= interpolate(gettext('Collapse/Expand this %(xblock_type)s'), { xblock_type: xblockTypeDisplayName }, true) %>">
<i class="icon-caret-down ui-toggle-expansion"></i> <i class="icon fa fa-caret-down ui-toggle-expansion"></i>
<% } else { %> <% } else { %>
<h3 class="xblock-title"> <h3 class="xblock-title">
<% } %> <% } %>
...@@ -26,7 +26,7 @@ ...@@ -26,7 +26,7 @@
<ul class="actions-list"> <ul class="actions-list">
<li class="action-item action-delete"> <li class="action-item action-delete">
<a href="#" data-tooltip="<%= gettext('Delete') %>" class="delete-button action-button"> <a href="#" data-tooltip="<%= gettext('Delete') %>" class="delete-button action-button">
<i class="icon-remove"></i> <i class="icon fa fa-remove"></i>
<span class="sr"><%= gettext('Delete') %></span> <span class="sr"><%= gettext('Delete') %></span>
</a> </a>
</li> </li>
...@@ -36,7 +36,7 @@ ...@@ -36,7 +36,7 @@
<div class="wrapper-xblock-header-secondary"> <div class="wrapper-xblock-header-secondary">
<% if (xblockInfo.get('release_date')) { %> <% if (xblockInfo.get('release_date')) { %>
<div class="meta-info"> <div class="meta-info">
<i class="icon-time"></i> <i class="icon fa fa-clock-o"></i>
<%= gettext('Released:') %> <%= xblockInfo.get('release_date') %> <%= gettext('Released:') %> <%= xblockInfo.get('release_date') %>
</div> </div>
<% } %> <% } %>
...@@ -55,7 +55,7 @@ ...@@ -55,7 +55,7 @@
<a href="#" class="button button-new" data-category="<%= childCategory %>" <a href="#" class="button button-new" data-category="<%= childCategory %>"
data-parent="<%= xblockInfo.get('id') %>" data-default-name="<%= defaultNewChildName %>" data-parent="<%= xblockInfo.get('id') %>" data-default-name="<%= defaultNewChildName %>"
title="<%= interpolate(gettext('Click to add a new %(xblock_type)s'), { xblock_type: defaultNewChildName }, true) %>" > title="<%= interpolate(gettext('Click to add a new %(xblock_type)s'), { xblock_type: defaultNewChildName }, true) %>" >
<i class="icon-plus"></i><%= addChildLabel %> <i class="icon fa fa-plus"></i><%= addChildLabel %>
</a> </a>
</p> </p>
</div> </div>
...@@ -68,13 +68,13 @@ ...@@ -68,13 +68,13 @@
<a href="#" class="button button-new" data-category="<%= childCategory %>" <a href="#" class="button button-new" data-category="<%= childCategory %>"
data-parent="<%= xblockInfo.get('id') %>" data-default-name="<%= defaultNewChildName %>" data-parent="<%= xblockInfo.get('id') %>" data-default-name="<%= defaultNewChildName %>"
title="<%= interpolate(gettext('Click to add a new %(xblock_type)s'), { xblock_type: defaultNewChildName }, true) %>" > title="<%= interpolate(gettext('Click to add a new %(xblock_type)s'), { xblock_type: defaultNewChildName }, true) %>" >
<i class="icon-plus"></i><%= addChildLabel %> <i class="icon fa fa-plus"></i><%= addChildLabel %>
</a> </a>
</div> </div>
<% } %> <% } %>
<% } %> <% } %>
<% if (parentInfo) { %> <% if (parentInfo) { %>
<span class="draggable-drop-indicator draggable-drop-indicator-after"><i class="icon-caret-right"></i></span> <span class="draggable-drop-indicator draggable-drop-indicator-after"><i class="icon fa fa-caret-right"></i></span>
</li> </li>
<% } %> <% } %>
<div class="incontext-editor-action-wrapper"> <div class="incontext-editor-action-wrapper">
<a href="" class="action-edit action-inline xblock-field-value-edit incontext-editor-open-action" title="<%= gettext('Edit the name') %>"> <a href="" class="action-edit action-inline xblock-field-value-edit incontext-editor-open-action" title="<%= gettext('Edit the name') %>">
<i class="icon-pencil"></i><span class="sr"> <%= gettext("Edit") %></span> <i class="icon fa fa-pencil"></i><span class="sr"> <%= gettext("Edit") %></span>
</a> </a>
</div> </div>
......
This source diff could not be displayed because it is too large. You can view the blob instead.
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