1
0
mirror of https://github.com/ascribe/onion.git synced 2024-06-23 01:36:28 +02:00

Add thin cross icon to FileDragAndDropError

This commit is contained in:
Brett Sun 2015-12-08 20:48:39 +01:00
parent 511abc6a33
commit 17a3ecbd44
3 changed files with 13 additions and 6 deletions

View File

@ -57,7 +57,7 @@ let FileDragAndDropErrorDialog = React.createClass({
{this.getRetryButton('Retry')}
</div>
<span className={classNames('file-drag-and-drop-error-icon-container', { 'file-drag-and-drop-error-icon-container-multiple-files': multipleFiles })}>
<span className='file-drag-and-drop-error-icon'></span>
<span className='ascribe-icon icon-ascribe-thin-cross'></span>
</span>
<div className='file-drag-and-drop-error-file-names'>
<ul>

View File

@ -61,7 +61,7 @@ export default function UploadButton({ className = 'btn btn-default btn-sm' } =
},
getUploadedFile() {
return this.props.filesToUpload.filter((file) => file.status === FileStatus.UPLOAD_SUCESSFUL)[0];
return this.props.filesToUpload.filter((file) => file.status === FileStatus.UPLOAD_SUCCESSFUL)[0];
},
clearSelection() {

View File

@ -170,6 +170,7 @@
}
.file-drag-and-drop-error {
color: #333333;
margin-bottom: 25px;
overflow: hidden;
text-align: center;
@ -270,20 +271,23 @@
.file-drag-and-drop-error-icon-container {
background-color: #eeeeee;
display: inline-block;
display: table;
float: left;
height: 104px;
position: relative;
width: 104px;
vertical-align: top;
.file-drag-and-drop-error-icon {
position: absolute;
.icon-ascribe-thin-cross {
display: table-cell;
font-size: 5.5em;
vertical-align: middle;
}
&.file-drag-and-drop-error-icon-container-multiple-files {
background-color: #d7d7d7;
left: -15px;
margin-bottom: 24px;
z-index: 1;
&::before {
@ -310,7 +314,10 @@
z-index: 3;
}
.file-drag-and-drop-error-icon {
.icon-ascribe-thin-cross {
left: 44px;
position: absolute;
top: 38px;
z-index: 4;
}
}