convert old tables to new within assignments
Fixes: CNVS-23959 Notes: - includes assignment dates as well as the quiz attempts tables Test Plan: - as a teacher using the old or new UI - navigate to a course with an assignment or create a new assignment - upon saving if new or below an existing course is a table that contains "Due" "For" "Available For" and "Until" - - upon inspection the table class should now be "ic-Table" (which is the new styleguide version) - there is a quiz attempt history that will display a table under the assignment dates Notes: - a new component has also been created in order to allow action items (in this case the + Rubric button) to fall directly under the table giving them breathing room top and bottom Change-Id: Ice3db093f36dd13d00382c549a6f5215ed67e855 Reviewed-on: https://gerrit.instructure.com/65040 Tested-by: Jenkins Reviewed-by: Chris Hart <chart@instructure.com> Product-Review: Chris Hart <chart@instructure.com> QA-Review: Myller de Araujo <myller@instructure.com>
This commit is contained in:
Pam Hiett
parent
21a266565e
commit
ad93b6094c
|
|
@ -34,3 +34,4 @@
|
|||
@import "components/ic-expand-link";
|
||||
@import "vendor/mediaelementplayer";
|
||||
@import "base/custom_mediaelementplayer";
|
||||
|
||||
|
|
|
|||
|
|
@ -247,14 +247,18 @@ $sp-table: 14px; // Will replace this with global spacing variable, when it hits
|
|||
&.ic-Table__row--bg-alert { background-color: $ic-bg-light-alert; }
|
||||
&.ic-Table__row--bg-danger { background-color: $ic-bg-light-danger; }
|
||||
}
|
||||
|
||||
|
||||
th {
|
||||
border-bottom-color: $ic-border-dark;
|
||||
padding-bottom: $sp-table/2;
|
||||
font-weight: bold;
|
||||
// If you need to use headers for the row in order to kick in the bold font for the first cell of the row
|
||||
&.ic-Table--header-row {
|
||||
border-bottom-color: $ic-border-light;
|
||||
}
|
||||
}
|
||||
|
||||
td {
|
||||
|
||||
td {
|
||||
border-bottom-color: $ic-border-light;
|
||||
// If you need to add admin links to the far-right cell, enclose them in .ic-Table--actions
|
||||
.ic-Table__actions {
|
||||
|
|
@ -262,18 +266,18 @@ $sp-table: 14px; // Will replace this with global spacing variable, when it hits
|
|||
text-align: right;
|
||||
}
|
||||
}
|
||||
|
||||
|
||||
&.ic-Table--condensed {
|
||||
th, td { padding: $sp-table/2; }
|
||||
th { padding-bottom: $sp-table/4; }
|
||||
}
|
||||
|
||||
|
||||
&.ic-Table--striped {
|
||||
tbody {
|
||||
tr:nth-child(odd) { background-color: $ic-bg-light-neutral; }
|
||||
}
|
||||
}
|
||||
|
||||
|
||||
&.ic-Table--hover-row {
|
||||
tbody {
|
||||
// High contrast UI uses left and right borders to show row hover state
|
||||
|
|
@ -285,7 +289,7 @@ $sp-table: 14px; // Will replace this with global spacing variable, when it hits
|
|||
&:hover { border-color: $ic-brand-primary; }
|
||||
}
|
||||
}
|
||||
|
||||
|
||||
// Regular UI uses zebra stripes
|
||||
@else {
|
||||
tr { transition: background-color 0.3s; }
|
||||
|
|
@ -297,7 +301,7 @@ $sp-table: 14px; // Will replace this with global spacing variable, when it hits
|
|||
&:hover { background-color: $ic-bg-light-primary; }
|
||||
}
|
||||
}
|
||||
|
||||
}
|
||||
|
||||
}
|
||||
}
|
||||
}
|
||||
}
|
||||
|
|
|
|||
|
|
@ -111,22 +111,24 @@
|
|||
margin-bottom: 0;
|
||||
}
|
||||
.assignment_dates {
|
||||
border-collapse: collapse;
|
||||
width: 100%;
|
||||
margin-bottom: 1em;
|
||||
thead{
|
||||
background-color: transparent;
|
||||
}
|
||||
tr {
|
||||
th {
|
||||
font-weight: bold;
|
||||
font-size: 14px;
|
||||
padding: 0.5em;
|
||||
@if $use_new_styles == false {
|
||||
border-collapse: collapse;
|
||||
width: 100%;
|
||||
margin-bottom: 1em;
|
||||
thead {
|
||||
background-color: transparent;
|
||||
}
|
||||
td {
|
||||
border-top: 1px solid #BBB;
|
||||
border-bottom: 1px solid #BBB;
|
||||
padding: 0.5em;
|
||||
tr {
|
||||
th {
|
||||
font-weight: bold;
|
||||
font-size: 14px;
|
||||
padding: 0.5em;
|
||||
}
|
||||
td {
|
||||
border-top: 1px solid #BBB;
|
||||
border-bottom: 1px solid #BBB;
|
||||
padding: 0.5em;
|
||||
}
|
||||
}
|
||||
}
|
||||
}
|
||||
|
|
|
|||
|
|
@ -118,22 +118,24 @@ li.quiz {
|
|||
}
|
||||
}
|
||||
.assignment_dates {
|
||||
border-collapse: collapse;
|
||||
width: 100%;
|
||||
margin-bottom: 1em;
|
||||
thead{
|
||||
background-color: transparent;
|
||||
}
|
||||
tr {
|
||||
th {
|
||||
font-weight: bold;
|
||||
font-size: 14px;
|
||||
padding: 0.5em;
|
||||
@if $use_new_styles == false {
|
||||
border-collapse: collapse;
|
||||
width: 100%;
|
||||
margin-bottom: 1em;
|
||||
thead{
|
||||
background-color: transparent;
|
||||
}
|
||||
td {
|
||||
border-top: 1px solid #BBB;
|
||||
border-bottom: 1px solid #BBB;
|
||||
padding: 0.5em;
|
||||
tr {
|
||||
th {
|
||||
font-weight: bold;
|
||||
font-size: 14px;
|
||||
padding: 0.5em;
|
||||
}
|
||||
td {
|
||||
border-top: 1px solid #BBB;
|
||||
border-bottom: 1px solid #BBB;
|
||||
padding: 0.5em;
|
||||
}
|
||||
}
|
||||
}
|
||||
}
|
||||
|
|
@ -2102,34 +2104,7 @@ ul#quiz_versions {
|
|||
#quiz-submission-version-table {
|
||||
margin: 30px 0 20px 0;
|
||||
@include clearfix;
|
||||
.desc {
|
||||
width: 22%;
|
||||
float: left;
|
||||
margin-right: 2%;
|
||||
text-align: right;
|
||||
font-size: 110%;
|
||||
color: #555;
|
||||
}
|
||||
table {
|
||||
width: 65%;
|
||||
float: left;
|
||||
margin-bottom: 10px;
|
||||
border-color: #a7acb3;
|
||||
}
|
||||
td {
|
||||
padding: 4px 8px;
|
||||
border-color: #a7acb3;
|
||||
}
|
||||
thead td.regraded {
|
||||
color: white;
|
||||
background-color: #f89508;
|
||||
text-shadow: 0 -1px 0 #cf9b47;
|
||||
border-top: none;
|
||||
}
|
||||
td.regraded {
|
||||
border-top: 1px solid #C4AE90;
|
||||
background-color: $warningBackground;
|
||||
}
|
||||
|
||||
.submission-pending-review {
|
||||
width: 65%;
|
||||
float: left;
|
||||
|
|
|
|||
|
|
@ -160,7 +160,7 @@
|
|||
</fieldset>
|
||||
</form>
|
||||
|
||||
<table class="table assignment_dates">
|
||||
<table class="ic-Table assignment_dates">
|
||||
<thead>
|
||||
<tr>
|
||||
<th scope="col"><%= t(:due, 'Due') %></th>
|
||||
|
|
@ -176,12 +176,14 @@
|
|||
</table>
|
||||
|
||||
<% if can_do(@assignment, @current_user, :update) %>
|
||||
<a
|
||||
href="<%= context_url(@context, :context_rubrics_url) %>"
|
||||
class="add_rubric_link btn button-sidebar-wide icon-add"
|
||||
style="<%= hidden if @assignment.rubric_association %>"
|
||||
role="button"
|
||||
><%= t 'links.add_rubric', "Add Rubric" %></a>
|
||||
<div class="content-box">
|
||||
<a
|
||||
href="<%= context_url(@context, :context_rubrics_url) %>"
|
||||
class="add_rubric_link btn button-sidebar-wide icon-add"
|
||||
style="<%= hidden if @assignment.rubric_association %>"
|
||||
role="button"
|
||||
><%= t 'links.add_rubric', "Add Rubric" %></a>
|
||||
</div>
|
||||
<% end %>
|
||||
|
||||
<div class="course_id" style="display: none;"><%= @context.id if @context && @context.is_a?(Course) %></div>
|
||||
|
|
|
|||
|
|
@ -217,7 +217,7 @@
|
|||
</fieldset>
|
||||
</form>
|
||||
|
||||
<table class="table assignment_dates">
|
||||
<table class="ic-Table assignment_dates">
|
||||
<thead>
|
||||
<tr>
|
||||
<th scope="col"><%= t(:due, 'Due') %></th>
|
||||
|
|
|
|||
|
|
@ -1,5 +1,5 @@
|
|||
<tr class="<%= 'kept' if kept %>">
|
||||
<th scope="row">
|
||||
<th scope="row" class="ic-Table--header-row">
|
||||
<% if kept %>
|
||||
<%= t 'kept', 'KEPT' %>
|
||||
<% elsif version.version_number == @submission.version_number %>
|
||||
|
|
|
|||
|
|
@ -1,10 +1,10 @@
|
|||
<div class="desc">
|
||||
<%= t 'attempt_history', 'Attempt History' %>
|
||||
<h3><%= t 'attempt_history', 'Attempt History' %></h3>
|
||||
</div>
|
||||
<table class="table table-bordered" summary="<%= t('quiz_attempt_history_description', 'A table that shows your quiz attempt history. Each attempt is on the left side. The attempt, time, and score are across the top.')%>">
|
||||
<table class="ic-Table ic-Table--condensed" summary="<%= t('quiz_attempt_history_description', 'A table that shows your quiz attempt history. Each attempt is on the left side. The attempt, time, and score are across the top.')%>">
|
||||
<thead>
|
||||
<tr>
|
||||
<td> </td>
|
||||
<th> </th>
|
||||
<th scope="col"><%= t 'attempt', 'Attempt' %></th>
|
||||
<th scope="col"><%= t 'time', 'Time' %></th>
|
||||
<th scope="col"><%= t 'score', 'Score' %></th>
|
||||
|
|
|
|||
Loading…
Reference in New Issue