Minz/quicknotes
1
0
Fork 0
mirror of https://github.com/JanGross/quicknotes.git synced 2025-11-30 23:37:16 +01:00
Code Issues Packages Projects Releases Wiki Activity

Use ColorPick libary to select color. This just to avoid overflow between the buttons

Browse Source
This commit is contained in:
Matias De lellis
2020-06-17 14:48:20 -03:00
parent 457de941fe
commit 217e3d868f
5 changed files with 39 additions and 32 deletions
Download Patch File Download Diff File Expand all files Collapse all files

24
js/script.js
View File

@@ -500,13 +500,6 @@ View.prototype = {
self._editablePinned(false);
});
// Handle colors.
$('#modal-note-div .circle-toolbar').click(function (event) {
event.stopPropagation();
var color = self._colorToHex($(this).css("background-color"));
self._editableColor(color);
});
// Handle tags on modal
$('#modal-note-div').on('click', '.slim-tag', function (event) {
event.stopPropagation();
@@ -837,17 +830,16 @@ View.prototype = {
if (color === undefined)
return this._colorToHex($("#modal-note-div .quicknote").css("background-color"));
else {
var self = this;
var colors = $("#modal-note-div .quicknote")[0].getElementsByClassName("circle-toolbar");
$.each(colors, function(i, c) {
$(c).removeClass('icon-checkmark');
});
$.each(colors, function(i, c) {
if (color === self._colorToHex(c.style.backgroundColor)) {
c.className += " icon-checkmark";
$("#color-button").colorPick({
'initialColor': color,
'paletteLabel': t('quicknotes', 'Colors'),
'palette': ['#F7EB96', '#88B7E3', '#C1ECB0', '#BFA6E9', '#DAF188', '#FF96AC', '#FCF66F', '#F2F1EF', '#C1D756', '#CECECE'],
'allowRecent': false,
'allowCustomColor': false,
'onColorSelected': function() {
$("#modal-note-div .quicknote").css("background-color", this.color);
}
});
$("#modal-note-div .quicknote").css("background-color", color);
}
},
_editableShares: function(shared_with, shared_by) {

23
js/templates/notes.handlebars
View File

@@ -69,27 +69,20 @@
<select class="note-share-select" name="users[]" multiple="multiple"></select>
-->
<div class="colors-toolbar">
<a href="#" class="circle-toolbar" style="background-color: #F7EB96"></a>
<a href="#" class="circle-toolbar" style="background-color: #88B7E3"></a>
<a href="#" class="circle-toolbar" style="background-color: #C1ECB0"></a>
<a href="#" class="circle-toolbar" style="background-color: #BFA6E9"></a>
<a href="#" class="circle-toolbar" style="background-color: #DAF188"></a>
<a href="#" class="circle-toolbar" style="background-color: #FF96AC"></a>
<a href="#" class="circle-toolbar" style="background-color: #FCF66F"></a>
<a href="#" class="circle-toolbar" style="background-color: #F2F1EF"></a>
<a href="#" class="circle-toolbar" style="background-color: #C1D756"></a>
<a href="#" class="circle-toolbar" style="background-color: #CECECE"></a>
</div>
<div class="buttons-toolbar">
<button id='color-button' class='round-tool-button'>
<div class="icon-toggle-background" title="{{t "quicknotes" "Colors"}}"></div>
</button>
<button id='share-button' class='round-tool-button'>
<div class="icon-shared" title="{{t "quicknotes" "Share note"}}"></div>
</button>
<button id='attach-button' class='round-tool-button'>
<div class="icon-picture" title="{{t "quicknotes" "Attach file"}}"></div>
</button>
<button id='tag-button' class='round-tool-button'>
<div class="icon-tag" title="{{t "quicknotes" "Tags"}}"></div>
</button>
<button id='attach-button' class='round-tool-button'>
<div class="icon-picture" title="{{t "quicknotes" "Attach file"}}"></div>
</button>
</div>
<div class="buttons-toolbar">
<button id='cancel-button'>
{{ cancelTxt }}
</button>