style password checkbox
This commit is contained in:
parent
acbf9fc32f
commit
1e4d6646c6
@ -4,11 +4,11 @@ module.exports = function(state, emit) {
|
|||||||
const file = state.storage.getFileById(state.params.id);
|
const file = state.storage.getFileById(state.params.id);
|
||||||
const div = html`
|
const div = html`
|
||||||
<div class="selectPassword">
|
<div class="selectPassword">
|
||||||
<div>
|
<div id="addPasswordWrapper">
|
||||||
<input id="addPassword" type="checkbox" onchange=${togglePasswordInput}/>
|
<input id="addPassword" type="checkbox" onchange=${togglePasswordInput}/>
|
||||||
<label for="addPassword">${state.translate(
|
<label for="addPassword">
|
||||||
'requirePasswordCheckbox'
|
<img src="/assets/check-16-blue.svg"/>
|
||||||
)}</label>
|
${state.translate('requirePasswordCheckbox')}</label>
|
||||||
</div>
|
</div>
|
||||||
<form class="setPassword hidden" onsubmit=${setPassword}>
|
<form class="setPassword hidden" onsubmit=${setPassword}>
|
||||||
<input id="unlock-input"
|
<input id="unlock-input"
|
||||||
|
1
assets/check-16-blue.svg
Normal file
1
assets/check-16-blue.svg
Normal file
@ -0,0 +1 @@
|
|||||||
|
<svg xmlns="http://www.w3.org/2000/svg" viewBox="0 0 20 20"><path fill="#0A84FF " d="M6 14a1 1 0 0 1-.707-.293l-3-3a1 1 0 0 1 1.414-1.414l2.157 2.157 6.316-9.023a1 1 0 0 1 1.639 1.146l-7 10a1 1 0 0 1-.732.427A.863.863 0 0 1 6 14z"/></svg>
|
After Width: | Height: | Size: 238 B |
@ -896,6 +896,50 @@ tbody {
|
|||||||
margin-bottom: -5px;
|
margin-bottom: -5px;
|
||||||
}
|
}
|
||||||
|
|
||||||
|
#addPasswordWrapper {
|
||||||
|
height: 24px;
|
||||||
|
}
|
||||||
|
|
||||||
|
#addPassword {
|
||||||
|
position: absolute;
|
||||||
|
visibility: collapse;
|
||||||
|
}
|
||||||
|
|
||||||
|
#addPasswordWrapper label {
|
||||||
|
line-height: 20px;
|
||||||
|
cursor: pointer;
|
||||||
|
position: relative;
|
||||||
|
opacity: 0.6;
|
||||||
|
}
|
||||||
|
|
||||||
|
#addPassword:checked + label {
|
||||||
|
opacity: 1;
|
||||||
|
}
|
||||||
|
|
||||||
|
#addPasswordWrapper label::after {
|
||||||
|
content: '';
|
||||||
|
height: 20px;
|
||||||
|
width: 20px;
|
||||||
|
margin-right: 10px;
|
||||||
|
margin-left: 5px;
|
||||||
|
float: left;
|
||||||
|
border: 1px solid rgba(12, 12, 13, 0.3);
|
||||||
|
border-radius: 2px;
|
||||||
|
}
|
||||||
|
|
||||||
|
#addPassword:not(:checked) + label > img {
|
||||||
|
height: 0;
|
||||||
|
width: 0;
|
||||||
|
}
|
||||||
|
|
||||||
|
#addPassword:checked + label > img {
|
||||||
|
height: 20px;
|
||||||
|
width: 20px;
|
||||||
|
position: absolute;
|
||||||
|
left: -29px;
|
||||||
|
top: 2px;
|
||||||
|
}
|
||||||
|
|
||||||
@media (max-device-width: 992px), (max-width: 992px) {
|
@media (max-device-width: 992px), (max-width: 992px) {
|
||||||
.popup .popuptext {
|
.popup .popuptext {
|
||||||
left: auto;
|
left: auto;
|
||||||
|
@ -85,5 +85,5 @@ footerLinkPrivacy = Privacy
|
|||||||
footerLinkTerms = Terms
|
footerLinkTerms = Terms
|
||||||
footerLinkCookies = Cookies
|
footerLinkCookies = Cookies
|
||||||
requirePasswordCheckbox = Require a password to download this file
|
requirePasswordCheckbox = Require a password to download this file
|
||||||
addPasswordButton = Add Password
|
addPasswordButton = Add password
|
||||||
incorrectPassword = Incorrect password. Try again?
|
passwordTryAgain = Incorrect password. Try again.
|
||||||
|
Loading…
Reference in New Issue
Block a user