diff options
| author | Julius Haertl <jus@bitgrid.net> | 2016-07-25 17:32:11 +0200 |
|---|---|---|
| committer | Julius Haertl <jus@bitgrid.net> | 2016-07-27 20:00:23 +0200 |
| commit | cc457cd6650c1fd3c1cc6f85c961f65de38615d8 (patch) | |
| tree | 20a782397d7a381ab3f23e3ecee2316e75e9cd5c /apps/theming/js | |
| parent | 7ff19e342e8c44def7fe9aeb3a209e91c3ff107e (diff) | |
| download | nextcloud-server-cc457cd6650c1fd3c1cc6f85c961f65de38615d8.tar.gz nextcloud-server-cc457cd6650c1fd3c1cc6f85c961f65de38615d8.zip | |
Theming: Generate colorized radio buttons dynamically
Diffstat (limited to 'apps/theming/js')
| -rw-r--r-- | apps/theming/js/settings-admin.js | 15 |
1 files changed, 9 insertions, 6 deletions
diff --git a/apps/theming/js/settings-admin.js b/apps/theming/js/settings-admin.js index a45694b9aa6..8b0df5f4bf0 100644 --- a/apps/theming/js/settings-admin.js +++ b/apps/theming/js/settings-admin.js @@ -46,6 +46,12 @@ function calculateLuminance(rgb) { return (0.299*r + 0.587*g + 0.114*b)/255; } +function generateRadioButton(color) { + var radioButton = '<svg xmlns="http://www.w3.org/2000/svg" height="16" width="16">' + + '<path d="M8 1a7 7 0 0 0-7 7 7 7 0 0 0 7 7 7 7 0 0 0 7-7 7 7 0 0 0-7-7zm0 1a6 6 0 0 1 6 6 6 6 0 0 1-6 6 6 6 0 0 1-6-6 6 6 0 0 1 6-6zm0 2a4 4 0 1 0 0 8 4 4 0 0 0 0-8z" fill="' + color + '"/></svg>'; + return btoa(radioButton); +} + function preview(setting, value) { if (setting === 'color') { var headerClass = document.getElementById('header'); @@ -74,15 +80,12 @@ function preview(setting, value) { $('#previewStyles').html( '#header .icon-caret { background-image: url(\'' + OC.getRootPath() + '/core/img/actions/' + icon + '.svg\') }' + - 'html:not(.ie):not(.edge) input[type="checkbox"].checkbox:checked:enabled:not(.checkbox--white) + label:before {' + + 'input[type="checkbox"].checkbox:checked:enabled:not(.checkbox--white) + label:before {' + 'background-image:url(\'' + OC.getRootPath() + '/core/img/actions/checkmark-white.svg\');' + 'background-color: ' + elementColor + '; background-position: center center; background-size:contain;' + 'width:12px; height:12px; padding:0; margin:2px 6px 6px 2px; border-radius:1px;}' + - 'html:not(.ie):not(.edge) input[type="radio"].radio:checked:not(.radio--white):not(:disabled) + label:before {' + - '-webkit-mask-image: url(\'' + OC.getRootPath() + '/core/img/actions/radio-checked-white.svg\');' + - '-webkit-mask-repeat: no-repeat;' + - 'background-color: ' + elementColor+ ';' + - 'background-image: none; }' + 'input[type="radio"].radio:checked:not(.radio--white):not(:disabled) + label:before {' + + 'background-image: url(\'data:image/svg+xml;base64,' + generateRadioButton(elementColor) + '\'); }' ); } if (setting === 'logoMime') { |