ylqjgm
/
canvas-lms
mirror of https://github.com/instructure/canvas-lms.git
1
0
Fork 0
Code Issues Packages Projects Releases Wiki Activity

use instructure-icons for submission cell tray icon 

In the New Gradebook, the tray icon in the submission cell is now
coming from instructure-icons.

closes CNVS-38105

Test Plan:
1. Enable New Gradebook.
2. Go to the gradebook and verify there is a tray icon when clicking
   on a submission cell.

Change-Id: If7c21970cc5d02c4aea0eb3cd1313961c019957c
Reviewed-on: https://gerrit.instructure.com/118221
Tested-by: Jenkins
Reviewed-by: Jeremy Neander <jneander@instructure.com>
Reviewed-by: Shahbaz Javeed <sjaveed@instructure.com>
QA-Review: KC Naegle <knaegle@instructure.com>
Product-Review: Keith T. Garner <kgarner@instructure.com>
This commit is contained in:
Spencer Olson 2017-07-07 15:45:05 -05:00
parent ae50c974eb
commit 163cb62d80
5 changed files with 3 additions and 61 deletions
Show Stats Download Patch File Download Diff File Expand all files Collapse all files

8
app/jsx/gradezilla/default_gradebook/components/AssignmentRowCell.js
View File

@ -20,8 +20,8 @@ import React from 'react';
import { bool, func, shape, string } from 'prop-types';
import Button from 'instructure-ui/lib/components/Button';
import SubmissionCell from 'compiled/gradezilla/SubmissionCell';
import ScreenReaderContent from 'instructure-ui/lib/components/ScreenReaderContent'
import I18n from 'i18n!gradebook'
import IconExpandLeftLine from 'instructure-icons/lib/Line/IconExpandLeftLine';
import I18n from 'i18n!gradebook';
function renderSubmissionCell (options) {
const assignment = options.column.object;
@ -125,7 +125,6 @@ class AssignmentRowCell extends React.Component {
}
render () {
const arrowDirection = this.props.isSubmissionTrayOpen ? 'right' : 'left';
return (
<div className="Grid__AssignmentRowCell">
<div className="Grid__AssignmentRowCell__Notifications" />
@ -139,8 +138,7 @@ class AssignmentRowCell extends React.Component {
size="small"
variant="icon"
>
<ScreenReaderContent>{I18n.t('Open submission tray')}</ScreenReaderContent>
<span className={`SubmissionCell__IconExpand SubmissionCell__IconExpand-${arrowDirection}`} />
<IconExpandLeftLine title={I18n.t('Open submission tray')} />
</Button>
</div>
</div>

14
app/stylesheets/pages/gradezilla/_gradebook.scss
View File

@ -872,20 +872,6 @@ $gradebook_checkbox_size: 16px;
padding: 0.7rem;
}
.SubmissionCell__IconExpand {
height: 1.1rem;
width: 2rem;
background-repeat: no-repeat;
&.SubmissionCell__IconExpand-right {
background-image: url("/images/svg-icons/svg_icon_expand_right.svg");
}
&.SubmissionCell__IconExpand-left {
background-image: url("/images/svg-icons/svg_icon_expand_left.svg");
}
}
svg.rotated {
transform: rotate(90deg);
}

14
public/images/svg-icons/svg_icon_expand_left.svg
View File

@ -1,14 +0,0 @@
<?xml version="1.0" encoding="UTF-8"?>
<svg width="15px" height="17px" viewBox="0 0 15 17" version="1.1" xmlns="http://www.w3.org/2000/svg" xmlns:xlink="http://www.w3.org/1999/xlink">
<!-- Generator: Sketch 44.1 (41455) - http://www.bohemiancoding.com/sketch -->
<title>expand-right</title>
<desc>Created with Sketch.</desc>
<defs></defs>
<g id="Artboards-" stroke="none" stroke-width="1" fill="none" fill-rule="evenodd">
<g id="GB-Assignment-Tray-01" transform="translate(-783.000000, -317.000000)" fill-rule="nonzero" fill="#008EE2">
<g id="expand-right" transform="translate(783.000000, 317.000000)">
<path d="M5.20710678,8 L11,8 L11,9 L5.20710678,9 L7.35355339,11.1464466 L6.64644661,11.8535534 L3.29289322,8.5 L6.64644661,5.14644661 L7.35355339,5.85355339 L5.20710678,8 Z M12,16 L12,17 L1.5,17 C0.671589379,17 0,16.3288744 0,15.5 L0,1.5 C0,0.671125574 0.671589379,0 1.5,0 L12,0 L12,1 L1.5,1 C1.22371954,1 1,1.22356503 1,1.5 L1,15.5 C1,15.776435 1.22371954,16 1.5,16 L12,16 Z M14,0 L15,0 L15,17 L14,17 L14,0 Z"></path>
</g>
</g>
</g>
</svg>
Side by Side

Before

Width:  |  Height:  |  Size: 1.1 KiB

16
public/images/svg-icons/svg_icon_expand_right.svg
View File

@ -1,16 +0,0 @@
<?xml version="1.0" encoding="UTF-8"?>
<svg width="15px" height="17px" viewBox="0 0 15 17" version="1.1" xmlns="http://www.w3.org/2000/svg" xmlns:xlink="http://www.w3.org/1999/xlink">
<!-- Generator: Sketch 44.1 (41455) - http://www.bohemiancoding.com/sketch -->
<title>expand-left</title>
<desc>Created with Sketch.</desc>
<defs></defs>
<g id="Artboards-" stroke="none" stroke-width="1" fill="none" fill-rule="evenodd">
<g id="GB-Assignment-Tray-01" transform="translate(-783.000000, -37.000000)" fill="#008EE2">
<g id="expand-left" transform="translate(783.000000, 37.000000)">
<g>
<path d="M5.20710678,8 L11,8 L11,9 L5.20710678,9 L7.35355339,11.1464466 L6.64644661,11.8535534 L3.29289322,8.5 L6.64644661,5.14644661 L7.35355339,5.85355339 L5.20710678,8 Z M12,16 L12,17 L1.5,17 C0.671589379,17 0,16.3288744 0,15.5 L0,1.5 C0,0.671125574 0.671589379,0 1.5,0 L12,0 L12,1 L1.5,1 C1.22371954,1 1,1.22356503 1,1.5 L1,15.5 C1,15.776435 1.22371954,16 1.5,16 L12,16 Z M14,0 L15,0 L15,17 L14,17 L14,0 Z" fill-rule="nonzero" transform="translate(7.500000, 8.500000) scale(-1, 1) translate(-7.500000, -8.500000) "></path>
</g>
</g>
</g>
</g>
</svg>
Side by Side

Before

Width:  |  Height:  |  Size: 1.2 KiB

12
spec/javascripts/jsx/gradezilla/default_gradebook/components/AssignmentRowCellSpec.js
View File

@ -240,15 +240,3 @@ test('calls onToggleSubmissionTrayOpen with the student id and assignment id whe
['1101', '2301']
);
});
test('shows an arrow pointing left if the tray is not open', function () {
this.wrapper = mountComponent(this.props);
strictEqual(this.wrapper.find('.SubmissionCell__IconExpand-right').length, 0);
strictEqual(this.wrapper.find('.SubmissionCell__IconExpand-left').length, 1);
});
test('shows an arrow pointing right if the tray is not open', function () {
this.wrapper = mountComponent(this.props, { isSubmissionTrayOpen: true });
strictEqual(this.wrapper.find('.SubmissionCell__IconExpand-left').length, 0);
strictEqual(this.wrapper.find('.SubmissionCell__IconExpand-right').length, 1);
});