mbk-lab
/
nextcloud
2
0
Fork 0
Code Issues Pull Requests Projects Releases Wiki Activity

Merge pull request #18735 from owncloud/checkbox-style 

custom checkbox style
This commit is contained in:
Thomas Müller 2015-09-16 09:34:46 +02:00
parent fad963970c d2d4cbc23e
commit af517103b1
15 changed files with 80 additions and 20 deletions
Show Stats Download Patch File Download Diff File Expand all files Collapse all files

28
apps/files/css/files.css
View File

@ -416,25 +416,20 @@ table td.filename .uploadtext {
}
/* File checkboxes */
#fileList tr td.filename>.selectCheckBox {
-ms-filter: "progid:DXImageTransform.Microsoft.Alpha(Opacity=0)";
filter: alpha(opacity=0);
#fileList tr td.filename>.selectCheckBox + label:before {
opacity: 0;
float: left;
top: 0;
margin: 32px 0 4px 32px; /* bigger clickable area doesn’t work in FF width:2.8em; height:2.4em;*/
position: absolute;
bottom: 4px;
right: 0;
z-index: 10;
}
/* Show checkbox when hovering, checked, or selected */
#fileList tr:hover td.filename>.selectCheckBox,
#fileList tr:focus td.filename>.selectCheckBox,
#fileList tr td.filename>.selectCheckBox:checked,
#fileList tr.selected td.filename>.selectCheckBox {
#fileList tr:hover td.filename>.selectCheckBox + label:before,
#fileList tr:focus td.filename>.selectCheckBox + label:before,
#fileList tr td.filename>.selectCheckBox:checked + label:before,
#fileList tr.selected td.filename>.selectCheckBox + label:before {
opacity: 1;
}
.lte9 #fileList tr:hover td.filename>.selectCheckBox,
.lte9 #fileList tr:focus td.filename>.selectCheckBox,
.lte9 #fileList tr td.filename>.selectCheckBox[checked=checked],
.lte9 #fileList tr.selected td.filename>.selectCheckBox {
-ms-filter: "progid:DXImageTransform.Microsoft.Alpha(Opacity=100)";
filter: alpha(opacity=100);
}
@ -442,6 +437,7 @@ table td.filename .uploadtext {
/* Use label to have bigger clickable size for checkbox */
#fileList tr td.filename>.selectCheckBox + label,
.select-all + label {
background-position: 30px 30px;
height: 50px;
position: absolute;
width: 50px;
@ -456,7 +452,7 @@ table td.filename .uploadtext {
.select-all + label {
top: 0;
}
.select-all {
.select-all + label:before {
position: absolute;
top: 18px;
left: 18px;

43
core/css/styles.css
View File

@ -158,8 +158,42 @@ textarea:hover, textarea:focus, textarea:active {
-ms-filter: "progid:DXImageTransform.Microsoft.Alpha(Opacity=100)";
opacity: 1;
}
input[type="checkbox"] { margin:0; padding:0; height:auto; width:auto; }
input[type="checkbox"]:hover+label, input[type="checkbox"]:focus+label { color:#111 !important; }
input[type="checkbox"] {
margin:0;
padding:0;
height:auto;
width:auto;
display: none;
}
input[type="checkbox"] + label:before {
content: "";
display: inline-block;
height: 20px;
width: 20px;
vertical-align: middle;
background: url('../img/actions/checkbox.svg') left center no-repeat;
opacity: 0.7;
}
input[type="checkbox"].white + label:before {
background-image: url('../img/actions/checkbox-white.svg');
}
input[type="checkbox"]:checked + label:before {
background-image: url('../img/actions/checkbox-checked.svg');
}
input[type="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 {
color:#111 !important;
}
input[type="time"] {
width: initial;
height: 31px;
@ -614,7 +648,6 @@ label.infield {
margin: 0;
padding: 14px;
padding-left: 28px;
margin-left: -28px;
vertical-align: middle;
}
#body-login form .errors { background:#fed7d7; border:1px solid #f00; list-style-indent:inside; margin:0 0 2em; padding:1em; }
@ -673,6 +706,9 @@ label.infield {
-ms-filter: "progid:DXImageTransform.Microsoft.Alpha(Opacity=30)";
opacity: .3;
}
#show + label:before, #dbpassword + label:before, #personal-show + label:before {
display: none;
}
#pass2, input[name="personal-password-clone"] {
padding: .6em 2.5em .4em .4em;
width: 8em;
@ -814,6 +850,7 @@ label.infield {
opacity: .7;
}
#body-login .remember-login-container {
margin-top: 10px;
text-align: center;
}

BIN
core/img/actions/checkbox-checked-white.png Normal file
View File

Binary file not shown.
Side by Side

After

Width:  |  Height:  |  Size: 267 B

4
core/img/actions/checkbox-checked-white.svg Normal file
View File

@ -0,0 +1,4 @@
<?xml version="1.0" encoding="UTF-8" standalone="no"?>
<svg xmlns:rdf="http://www.w3.org/1999/02/22-rdf-syntax-ns#" xmlns="http://www.w3.org/2000/svg" height="16px" width="16px" version="1.1" xmlns:cc="http://creativecommons.org/ns#" xmlns:dc="http://purl.org/dc/elements/1.1/">
<path d="m3 2c-0.554 0-1 0.446-1 1v10c0 0.554 0.446 1 1 1h10c0.554 0 1-0.446 1-1v-10c0-0.554-0.446-1-1-1h-10zm8.924 2.0664l1.433 1.4316-6.3648 6.365-4.2422-4.2439 1.4141-1.414 2.8281 2.8301 4.9318-4.9688z" fill="#fff"/>
</svg>
Side by Side

After

Width:  |  Height:  |  Size: 507 B

BIN
core/img/actions/checkbox-checked.png Normal file
View File

Binary file not shown.
Side by Side

After

Width:  |  Height:  |  Size: 254 B

5
core/img/actions/checkbox-checked.svg Normal file
View File

@ -0,0 +1,5 @@
<?xml version="1.0" encoding="UTF-8" standalone="no"?>
<svg xmlns:rdf="http://www.w3.org/1999/02/22-rdf-syntax-ns#" xmlns="http://www.w3.org/2000/svg" height="16px" width="16px" version="1.1" xmlns:cc="http://creativecommons.org/ns#" xmlns:dc="http://purl.org/dc/elements/1.1/">
<path d="m2.5 2.5h11v11h-11z" fill="#fff"/>
<path fill="#55739a" d="m3 2c-0.554 0-1 0.446-1 1v10c0 0.554 0.446 1 1 1h10c0.554 0 1-0.446 1-1v-10c0-0.554-0.446-1-1-1h-10zm8.924 2.0664l1.433 1.4316-6.3648 6.365-4.2422-4.2439 1.4141-1.414 2.8281 2.8301 4.9318-4.9688z"/>
</svg>
Side by Side

After

Width:  |  Height:  |  Size: 555 B

BIN
core/img/actions/checkbox-mixed-white.png Normal file
View File

Binary file not shown.
Side by Side

After

Width:  |  Height:  |  Size: 135 B

4
core/img/actions/checkbox-mixed-white.svg Normal file
View File

@ -0,0 +1,4 @@
<?xml version="1.0" encoding="UTF-8" standalone="no"?>
<svg xmlns:rdf="http://www.w3.org/1999/02/22-rdf-syntax-ns#" xmlns="http://www.w3.org/2000/svg" height="16px" width="16px" version="1.1" xmlns:cc="http://creativecommons.org/ns#" xmlns:dc="http://purl.org/dc/elements/1.1/">
<path d="m3 2c-0.554 0-1 0.446-1 1v10c0 0.554 0.446 1 1 1h10c0.554 0 1-0.446 1-1v-10c0-0.554-0.446-1-1-1h-10zm1 5h8v2h-8v-2z" fill="#fff"/>
</svg>
Side by Side

After

Width:  |  Height:  |  Size: 427 B

BIN
core/img/actions/checkbox-mixed.png Normal file
View File

Binary file not shown.
Side by Side

After

Width:  |  Height:  |  Size: 138 B

5
core/img/actions/checkbox-mixed.svg Normal file
View File

@ -0,0 +1,5 @@
<?xml version="1.0" encoding="UTF-8" standalone="no"?>
<svg xmlns:rdf="http://www.w3.org/1999/02/22-rdf-syntax-ns#" xmlns="http://www.w3.org/2000/svg" height="16px" width="16px" version="1.1" xmlns:cc="http://creativecommons.org/ns#" xmlns:dc="http://purl.org/dc/elements/1.1/">
<path d="m2.5 2.5h11v11h-11z" fill="#fff"/>
<path fill="#969696" d="m3 2c-0.554 0-1 0.446-1 1v10c0 0.554 0.446 1 1 1h10c0.554 0 1-0.446 1-1v-10c0-0.554-0.446-1-1-1h-10zm1 5h8v2h-8v-2z"/>
</svg>
Side by Side

After

Width:  |  Height:  |  Size: 475 B

BIN
core/img/actions/checkbox-white.png Normal file
View File

Binary file not shown.
Side by Side

After

Width:  |  Height:  |  Size: 130 B

4
core/img/actions/checkbox-white.svg Normal file
View File

@ -0,0 +1,4 @@
<?xml version="1.0" encoding="UTF-8" standalone="no"?>
<svg xmlns:rdf="http://www.w3.org/1999/02/22-rdf-syntax-ns#" xmlns="http://www.w3.org/2000/svg" height="16px" width="16px" version="1.1" xmlns:cc="http://creativecommons.org/ns#" xmlns:dc="http://purl.org/dc/elements/1.1/">
<path d="m3 2c-0.554 0-1 0.446-1 1v10c0 0.554 0.446 1 1 1h10c0.554 0 1-0.446 1-1v-10c0-0.554-0.446-1-1-1h-10zm0 1h10v10h-10v-10z" fill="#fff"/>
</svg>
Side by Side

After

Width:  |  Height:  |  Size: 431 B

BIN
core/img/actions/checkbox.png Normal file
View File

Binary file not shown.
Side by Side

After

Width:  |  Height:  |  Size: 134 B

5
core/img/actions/checkbox.svg Normal file
View File

@ -0,0 +1,5 @@
<?xml version="1.0" encoding="UTF-8" standalone="no"?>
<svg xmlns:rdf="http://www.w3.org/1999/02/22-rdf-syntax-ns#" xmlns="http://www.w3.org/2000/svg" height="16px" width="16px" version="1.1" xmlns:cc="http://creativecommons.org/ns#" xmlns:dc="http://purl.org/dc/elements/1.1/">
<path d="m2.5 2.5h11v11h-11z" fill="#fff"/>
<path fill="#969696" d="m3 2c-0.554 0-1 0.446-1 1v10c0 0.554 0.446 1 1 1h10c0.554 0 1-0.446 1-1v-10c0-0.554-0.446-1-1-1h-10zm0 1h10v10h-10v-10z"/>
</svg>
Side by Side

After

Width:  |  Height:  |  Size: 479 B

2
core/templates/login.php
View File

@ -66,7 +66,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">
<input type="checkbox" name="remember_login" value="1" id="remember_login" class="white">
<label for="remember_login"><?php p($l->t('remember')); ?></label>
</div>
<?php endif; ?>