Dereku/snappymail
1
0
Fork 0
mirror of https://github.com/the-djmaze/snappymail.git synced 2026-08-25 18:19:22 +03:00
Code Issues Projects Releases Packages Wiki Activity Actions

Focused state for custom checkbox (Closes #604)

Browse source
This commit is contained in:
RainLoop Team 2015-04-25 17:50:10 +04:00
parent 48b91fb957
commit a11dcbed4b
25 changed files with 209 additions and 65 deletions
Download patch file Download diff file Expand all files Collapse all files

4
rainloop/v/0.0.0/app/templates/Themes/template.less
View file

@ -66,7 +66,7 @@
.thm-border-radius(@login-border-radius);
.thm-box-shadow(@login-box-shadow);
.legend, .checkboxSignMe, .checkboxAdditionalCodeSignMe, .g-ui-link, .social-button, .language-button {
.legend, .e-checkbox-icon, .g-ui-link, .social-button, .language-button {
color: @login-color !important;
}
}
@ -85,7 +85,7 @@
color: @languages-color;
.flag-name {
color: @languages-color;
border-bottom: 1px dashed @languages-color;
border-color: @languages-color;
}
}

13
rainloop/v/0.0.0/app/templates/Views/Admin/AdminSettingsContacts.html
View file

@ -26,9 +26,16 @@
<div class="control-group">
<label class="control-label" data-i18n="TAB_CONTACTS/LABEL_STORAGE_TYPE"></label>
<div class="controls">
<select data-bind="options: contactsTypesOptions, value: mainContactsType,
optionsText: 'name', optionsValue: 'id', optionsAfterRender: defautOptionsAfterRender, saveTrigger: contactsTypeTrigger"></select>
<div data-bind="saveTrigger: contactsTypeTrigger"></div>
<div data-bind="component: {
name: 'Select',
params: {
options: contactsTypesOptions,
value: mainContactsType,
trigger: contactsTypeTrigger,
optionsText: 'name',
optionsValue: 'id'
}
}"></div>
</div>
</div>
<br />

4
rainloop/v/0.0.0/app/templates/Views/Admin/AdminSettingsGeneral.html
View file

@ -15,7 +15,7 @@
<span class="flag-wrapper">
<span data-bind="css: 'flag flag-' + language()" style=""></span>
</span>
<span class="flag-name" data-bind="text: languageFullName, click: selectLanguage"></span>
<span class="flag-name" tabindex="0" data-bind="text: languageFullName, click: selectLanguage, keypress: selectLanguage"></span>
&nbsp;&nbsp;
<div data-bind="component: {
name: 'SaveTrigger',
@ -31,7 +31,7 @@
<span class="flag-wrapper">
<span data-bind="css: 'flag flag-' + languageAdmin()" style=""></span>
</span>
<span class="flag-name" data-bind="text: languageAdminFullName, click: selectLanguageAdmin"></span>
<span class="flag-name" tabindex="0" data-bind="text: languageAdminFullName, click: selectLanguageAdmin, keypress: selectLanguageAdmin"></span>
&nbsp;&nbsp;
<div data-bind="component: {
name: 'SaveTrigger',

8
rainloop/v/0.0.0/app/templates/Views/Components/Checkbox.html
View file

@ -1,10 +1,10 @@
<label class="e-component e-checkbox inline" data-bind="click: click, css: { 'disabled': disable() || !enable() }">
<i data-bind="css: value() ?
<span class="e-component e-checkbox inline" tabindex="0" data-bind="click: click, keypress: keypress, css: { 'disabled': disable() || !enable() }">
<i role="checkbox" class="e-checkbox-icon" data-bind="css: value() ?
(inverted ? 'icon-checkbox-unchecked' : 'icon-checkbox-checked') :
(inverted ? 'icon-checkbox-checked' : 'icon-checkbox-unchecked')
"></i>
<!-- ko if: labeled -->
&nbsp;&nbsp;
<span class="sub-label i18n" data-bind="attr: {'data-i18n': label}"></span>
<span class="sub-label i18n" data-bind="attr: {'data-i18n': label}, css: {'i18n-animation': labelAnimated}"></span>
<!-- /ko -->
</label>
</span>

2
rainloop/v/0.0.0/app/templates/Views/Components/CheckboxClassic.html
View file

@ -2,6 +2,6 @@
<input type="checkbox" data-bind="checked: value, disable: disable() || !enable()" style="margin: 0 0 1px 0;" />
<!-- ko if: labeled -->
&nbsp;&nbsp;
<span class="sub-label i18n" data-bind="attr: {'data-i18n': label}"></span>
<span class="sub-label i18n" data-bind="attr: {'data-i18n': label}, css: {'i18n-animation': labelAnimated}"></span>
<!-- /ko -->
</label>

8
rainloop/v/0.0.0/app/templates/Views/Components/CheckboxMaterialDesign.html
View file

@ -1,10 +1,10 @@
<label class="e-component e-checkbox material-design inline" data-bind="click: click, css: { 'disabled': disable() || !enable() }">
<div class="sub-checkbox-container">
<span class="e-component e-checkbox material-design inline" tabindex="0" data-bind="click: click, keypress: keypress, css: { 'disabled': disable() || !enable() }">
<div class="sub-checkbox-container" role="checkbox">
<div class="sub-checkbox" data-bind="css: {'checked': (value() && !inverted) || (!value() && inverted),
'unchecked': (!value() && !inverted) || (value() && inverted),
'box': animationBox, 'checkmark': animationCheckmark}"></div>
</div>
<!-- ko if: labeled -->
<span class="sub-label i18n" data-bind="attr: {'data-i18n': label}"></span>
<span class="sub-label i18n" data-bind="attr: {'data-i18n': label}, css: {'i18n-animation': labelAnimated}"></span>
<!-- /ko -->
</label>
</span>

4
rainloop/v/0.0.0/app/templates/Views/Components/Radio.html
View file

@ -1,6 +1,6 @@
<div class="e-component e-radio" data-bind="foreach: values">
<label data-bind="click: $parent.click, css: {'inline': $parent.inline}">
<i data-bind="css: $parent.value() === value ? 'icon-radio-checked' : 'icon-radio-unchecked'"></i>
<label tabindex="0" data-bind="click: $parent.click, css: {'inline': $parent.inline}">
<i role="radio" data-bind="css: $parent.value() === value ? 'icon-radio-checked' : 'icon-radio-unchecked'"></i>
&nbsp;&nbsp;
<span class="sub-label i18n" data-bind="attr: {'data-i18n': label}"></span>
</label>

38
rainloop/v/0.0.0/app/templates/Views/Components/Select.html
View file

@ -1,18 +1,20 @@
<!-- ko if: preLabeled -->
<span class="i18n" data-bind="attr: {'data-i18n': preLabel}"></span>
&nbsp;&nbsp;
<!-- /ko -->
<select data-bind="options: options, value: value, enable: enable, optionsText: optionsText, optionsValue: optionsValue,
css: className, optionsAfterRender: defautOptionsAfterRender"></select>
<!-- ko if: labeled -->
&nbsp;
<span class="i18n" data-bind="attr: {'data-i18n': label}"></span>
&nbsp;
<!-- /ko -->
<!-- ko if: triggered -->
&nbsp;
<div data-bind="component: {
name: 'SaveTrigger',
params: { value: trigger }
}"></div>
<!-- /ko -->
<div class="e-component e-select inline">
<!-- ko if: preLabeled -->
<span class="i18n" data-bind="attr: {'data-i18n': preLabel}"></span>
&nbsp;&nbsp;
<!-- /ko -->
<select data-bind="options: options, value: value, enable: enable, optionsText: optionsText, optionsValue: optionsValue,
css: className, optionsAfterRender: defautOptionsAfterRender"></select>
<!-- ko if: labeled -->
&nbsp;
<span class="i18n" data-bind="attr: {'data-i18n': label}"></span>
&nbsp;
<!-- /ko -->
<!-- ko if: triggered -->
&nbsp;
<div data-bind="component: {
name: 'SaveTrigger',
params: { value: trigger }
}"></div>
<!-- /ko -->
</div>

29
rainloop/v/0.0.0/app/templates/Views/User/Login.html
View file

@ -57,11 +57,13 @@
</div>
</div>
<div class="controls" data-bind="visible: additionalCode.visibility()">
<label class="additionalCodeSignMeLabel" data-bind="click: function () { additionalCodeSignMe(!additionalCodeSignMe()); }">
<i data-bind="css: additionalCodeSignMe() ? 'checkboxAdditionalCodeSignMe icon-checkbox-checked' : 'checkboxAdditionalCodeSignMe icon-checkbox-unchecked'"></i>
&nbsp;&nbsp;
<span class="i18n" data-i18n="LOGIN/LABEL_DONT_ASK_VERIFICATION_CODE"></span>
</label>
<div class="additionalCodeSignMeLabel" data-bind="component: {
name: 'CheckboxSimple',
params: {
label: 'LOGIN/LABEL_DONT_ASK_VERIFICATION_CODE',
value: additionalCodeSignMe
}
}"></div>
</div>
{{INCLUDE/BottomControlGroup/PLACE}}
<div class="controls">
@ -85,11 +87,21 @@
<i data-bind="css: langRequest() ? 'icon-spinner animated' : 'icon-world'"></i>
</a>
</div>
<label class="signMeLabel inline" data-bind="click: function () { signMe(!signMe()); }, visible: signMeVisibility">
<div class="signMeLabel" data-bind="component: {
name: 'CheckboxSimple',
params: {
label: 'LOGIN/LABEL_SIGN_ME',
labelAnimated: true,
value: signMe
}
}"></div>
<!-- <label class="signMeLabel inline" data-bind="click: function () { signMe(!signMe()); }, visible: signMeVisibility">
<i data-bind="css: signMe() ? 'checkboxSignMe icon-checkbox-checked' : 'checkboxSignMe icon-checkbox-unchecked'"></i>
&nbsp;&nbsp;
<span class="i18n i18n-animation" data-i18n="LOGIN/LABEL_SIGN_ME"></span>
</label>
</label>-->
</div>
<div class="controls clearfix" data-bind="visible: '' !== forgotPasswordLinkUrl || '' !== registrationLinkUrl">
<div class="forgot-link thm-forgot pull-left" data-bind="visible: '' !== forgotPasswordLinkUrl" style="text-align: center">
@ -110,11 +122,12 @@
<label class="flag-selector">
<i data-bind="css: langRequest() ? 'icon-spinner animated' : 'icon-world'"></i>
&nbsp;&nbsp;
<span class="flag-name" data-bind="text: languageFullName, click: selectLanguage"></span>
<span class="flag-name" tabindex="0" data-bind="text: languageFullName, click: selectLanguage, keypress: selectLanguage, onTab: selectLanguageOnTab"></span>
</label>
</div>
{{INCLUDE/BottomFooter/PLACE}}
</center>
</div>
<a href="#" onclick="return false;"></a>
<div class="loginAfter"></div>
</div>

18
rainloop/v/0.0.0/app/templates/Views/User/PopupsAdvancedSearch.html
View file

@ -54,15 +54,15 @@
<span class="i18n" data-i18n="SEARCH/LABEL_ADV_DATE"></span>
</label>
<div class="controls">
<select data-bind="value: selectedDateValue">
<option value="-1" class="i18n" data-i18n="SEARCH/LABEL_ADV_DATE_ALL"></option>
<option value="3" class="i18n" data-i18n="SEARCH/LABEL_ADV_DATE_3_DAYS"></option>
<option value="7" class="i18n" data-i18n="SEARCH/LABEL_ADV_DATE_7_DAYS"></option>
<option value="30" class="i18n" data-i18n="SEARCH/LABEL_ADV_DATE_MONTH"></option>
<option value="90" class="i18n" data-i18n="SEARCH/LABEL_ADV_DATE_3_MONTHS"></option>
<option value="180" class="i18n" data-i18n="SEARCH/LABEL_ADV_DATE_6_MONTHS"></option>
<option value="365" class="i18n" data-i18n="SEARCH/LABEL_ADV_DATE_YEAR"></option>
</select>
<div data-bind="component: {
name: 'Select',
params: {
options: selectedDates,
value: selectedDateValue,
optionsText: 'name',
optionsValue: 'id'
}
}"></div>
</div>
</div>
<div class="control-group">

2
rainloop/v/0.0.0/app/templates/Views/User/SettingsGeneral.html
View file

@ -12,7 +12,7 @@
<span class="flag-wrapper">
<span data-bind="css: 'flag flag-' + language()" style=""></span>
</span>
<span class="flag-name" data-bind="text: languageFullName, click: selectLanguage"></span>
<span class="flag-name" tabindex="0" data-bind="text: languageFullName, click: selectLanguage, keypress: selectLanguage"></span>
&nbsp;&nbsp;
<div data-bind="component: {
name: 'SaveTrigger',

4
rainloop/v/0.0.0/app/templates/Views/User/SettingsSecurity.html
View file

@ -26,8 +26,8 @@
<label class="control-label"></label>
<div class="controls">
<i class="icon-lock" />
&nbsp;&nbsp;
<span class="i18n g-ui-link" data-i18n="SETTINGS_SECURITY/LABEL_CONFIGURATE_TWO_FACTOR" data-bind="click:configureTwoFactor"></span>
&nbsp;
<span class="i18n g-ui-link" tabindex="0" data-i18n="SETTINGS_SECURITY/LABEL_CONFIGURATE_TWO_FACTOR" data-bind="click: configureTwoFactor, keypress: configureTwoFactor"></span>
</div>
</div>
</div>