Merge pull request #19329 from owncloud/checkbox-class

Add .checkbox class for new checkbox style
This commit is contained in:
Raghu Nayyar 2015-09-25 14:02:39 +05:30
commit bf73665a35
7 changed files with 21 additions and 21 deletions

View File

@ -925,7 +925,7 @@
if (this._allowSelection) {
td.append(
'<input id="select-' + this.id + '-' + fileData.id +
'" type="checkbox" class="selectCheckBox"/><label for="select-' + this.id + '-' + fileData.id + '">' +
'" type="checkbox" class="selectCheckBox checkbox"/><label for="select-' + this.id + '-' + fileData.id + '">' +
'<div class="thumbnail" style="background-image:url(' + icon + '); background-size: 32px;"></div>' +
'<span class="hidden-visually">' + t('files', 'Select') + '</span>' +
'</label>'

View File

@ -3,14 +3,14 @@
<span class="what">{what}<!-- If you select both versions, the copied file will have a number added to its name. --></span><br/>
<br/>
<table>
<th><input id="checkbox-allnewfiles" class="allnewfiles" type="checkbox" /><label for="checkbox-allnewfiles">{allnewfiles}<span class="count"></span></label></th>
<th><input id="checkbox-allexistingfiles" class="allexistingfiles" type="checkbox" /><label for="checkbox-allexistingfiles">{allexistingfiles}<span class="count"></span></label></th>
<th><input id="checkbox-allnewfiles" class="allnewfiles checkbox" type="checkbox" /><label for="checkbox-allnewfiles">{allnewfiles}<span class="count"></span></label></th>
<th><input id="checkbox-allexistingfiles" class="allexistingfiles checkbox" type="checkbox" /><label for="checkbox-allexistingfiles">{allexistingfiles}<span class="count"></span></label></th>
</table>
<div class="conflicts">
<div class="template">
<div class="filename"></div>
<div class="replacement">
<input type="checkbox" class="u-left"/>
<input type="checkbox" class="checkbox u-left"/>
<label>
<span class="svg icon"></span>
<div class="mtime"></div>
@ -18,7 +18,7 @@
</label>
</div>
<div class="original">
<input type="checkbox" class="u-left" />
<input type="checkbox" class="checkbox u-left" />
<label>
<span class="svg icon"></span>
<div class="mtime"></div>

View File

@ -56,7 +56,7 @@
<tr>
<th id='headerName' class="hidden column-name">
<div id="headerName-container">
<input type="checkbox" id="select_all_files" class="select-all"/>
<input type="checkbox" id="select_all_files" class="select-all checkbox"/>
<label for="select_all_files">
<span class="hidden-visually"><?php p($l->t('Select all'))?></span>
</label>

View File

@ -115,8 +115,3 @@ select {
line-height: 38px;
}
.lte8 input[type="checkbox"] + label:before { background-image: url('../img/actions/checkbox.png'); }
.lte8 input[type="checkbox"].white + label:before { background-image: url('../img/actions/checkbox-white.png'); }
.lte8 input[type="checkbox"]:checked + label:before { background-image: url('../img/actions/checkbox-checked.png'); }
.lte8 input[type="checkbox"].white:checked + label:before { background-image: url('../img/actions/checkbox-checked-white.png'); }

View File

@ -158,7 +158,9 @@ textarea:hover, textarea:focus, textarea:active {
-ms-filter: "progid:DXImageTransform.Microsoft.Alpha(Opacity=100)";
opacity: 1;
}
input[type="checkbox"] {
/* ie8 doesn't support :checked */
html:not(.ie8) input[type="checkbox"].checkbox {
margin:0;
padding:0;
height:auto;
@ -166,7 +168,7 @@ input[type="checkbox"] {
display: none;
}
input[type="checkbox"] + label:before {
html:not(.ie8) input[type="checkbox"].checkbox + label:before {
content: "";
display: inline-block;
@ -174,27 +176,27 @@ input[type="checkbox"] + label:before {
width: 20px;
vertical-align: middle;
background: url('../img/actions/checkbox.svg') left center no-repeat;
background: url('../img/actions/checkbox.svg') left top no-repeat;
opacity: 0.7;
}
input[type="checkbox"]:disabled +label:before { opacity: .6; }
html:not(.ie8) input[type="checkbox"].checkbox:disabled +label:before { opacity: .6; }
input[type="checkbox"].u-left +label:before { float: left; }
html:not(.ie8) input[type="checkbox"].checkbox.u-left +label:before { float: left; }
input[type="checkbox"].white + label:before {
html:not(.ie8) input[type="checkbox"].checkbox--white + label:before {
background-image: url('../img/actions/checkbox-white.svg');
}
input[type="checkbox"]:checked + label:before {
html:not(.ie8) input[type="checkbox"].checkbox:checked + label:before {
background-image: url('../img/actions/checkbox-checked.svg');
}
input[type="checkbox"].white:checked + label:before {
html:not(.ie8) input[type="checkbox"].checkbox--white:checked + label:before {
background-image: url('../img/actions/checkbox-checked-white.svg');
}
input[type="checkbox"]:hover+label:before, input[type="checkbox"]:focus+label:before {
html:not(.ie8) input[type="checkbox"].checkbox:hover+label:before, input[type="checkbox"]:focus+label:before {
color:#111 !important;
}

View File

@ -109,6 +109,9 @@
var id='ms'+multiSelectId+'-option-'+item;
var input=$('<input type="' + inputType + '"/>');
input.attr('id',id);
if(inputType === 'checkbox') {
input.addClass('checkbox');
}
if(settings.singleSelect) {
input.attr('name', 'ms'+multiSelectId+'-option');
}

View File

@ -65,7 +65,7 @@ script('core', [
<?php endif; ?>
<?php if ($_['rememberLoginAllowed'] === true) : ?>
<div class="remember-login-container">
<input type="checkbox" name="remember_login" value="1" id="remember_login" class="white">
<input type="checkbox" name="remember_login" value="1" id="remember_login" class="checkbox checkbox--white">
<label for="remember_login"><?php p($l->t('remember')); ?></label>
</div>
<?php endif; ?>