use label:before instead of label

This commit is contained in:
Hendrik Leppelsack 2015-09-15 20:26:24 +02:00 committed by Jan-Christoph Borchardt
parent 7ccd02ec95
commit 88bc478055
2 changed files with 24 additions and 20 deletions

View File

@ -166,33 +166,34 @@ input[type="checkbox"] {
display: none; display: none;
} }
input[type="checkbox"] + label { input[type="checkbox"] + label:before {
background: url('../img/actions/checkbox.svg') no-repeat; content: "";
opacity: 0.7; display: inline-block;
}
input[type="checkbox"] + label.white { height: 20px;
background: url('../img/actions/checkbox-white.svg') no-repeat; width: 20px;
} vertical-align: middle;
input[type="checkbox"]:checked + label { background: url('../img/actions/checkbox.svg') left center no-repeat;
background: url('../img/actions/checkbox-checked.svg') no-repeat;
opacity: 0.7; opacity: 0.7;
} }
input[type="checkbox"]:checked + label.white { input[type="checkbox"].white + label:before {
background: url('../img/actions/checkbox-checked-white.svg') no-repeat; background-image: url('../img/actions/checkbox-white.svg');
} }
input[type="checkbox"] + label, input[type="checkbox"]:checked + label:before {
input[type="checkbox"] + label.white, background-image: url('../img/actions/checkbox-checked.svg');
input[type="checkbox"]:checked + label, }
input[type="checkbox"]:checked + label.white {
background-position: left; input[type="checkbox"].white:checked + label:before {
padding-left: 20px; 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="checkbox"]:hover+label, input[type="checkbox"]:focus+label { color:#111 !important; }
input[type="time"] { input[type="time"] {
width: initial; width: initial;
height: 31px; height: 31px;
@ -705,6 +706,9 @@ label.infield {
-ms-filter: "progid:DXImageTransform.Microsoft.Alpha(Opacity=30)"; -ms-filter: "progid:DXImageTransform.Microsoft.Alpha(Opacity=30)";
opacity: .3; opacity: .3;
} }
#show + label:before, #dbpassword + label:before, #personal-show + label:before {
display: none;
}
#pass2, input[name="personal-password-clone"] { #pass2, input[name="personal-password-clone"] {
padding: .6em 2.5em .4em .4em; padding: .6em 2.5em .4em .4em;
width: 8em; width: 8em;

View File

@ -66,8 +66,8 @@ script('core', [
<?php endif; ?> <?php endif; ?>
<?php if ($_['rememberLoginAllowed'] === true) : ?> <?php if ($_['rememberLoginAllowed'] === true) : ?>
<div class="remember-login-container"> <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" class="white"><?php p($l->t('remember')); ?></label> <label for="remember_login"><?php p($l->t('remember')); ?></label>
</div> </div>
<?php endif; ?> <?php endif; ?>
<input type="hidden" name="timezone-offset" id="timezone-offset"/> <input type="hidden" name="timezone-offset" id="timezone-offset"/>