* Made dispay of last edit smaller on note title display card

* Made note menu buttons look better on mobile
* Moved around some note menu buttons
* Added a color picker with a rip off of google colors
* Added a remove formatting button
* Hide pin and archive icons, they appear green on hover, in the buttons
* Further simplified display card logic, now it just adds an end tag and returns the data
* Changed highlight text color to show colors (works on chrome...)
This commit is contained in:
Max G
2020-04-15 06:28:58 +00:00
parent a44bca204c
commit 71f909fb76
8 changed files with 176 additions and 37 deletions

View File

@@ -21,20 +21,22 @@
<nm-button tip="Close" bottom-tip="true" v-on:click.native="close" icon="close" />
<nm-button tip="Numbered List" bottom-tip="true" v-on:click.native="toggleList('ol')" icon="list ol" />
<nm-button tip="Task List" bottom-tip="true" v-on:click.native="toggleList('ul')" icon="tasks" />
<nm-button tip="Text Color" bottom-tip="true" icon="palette icon" v-on:click.native="colorpicker = true" />
<nm-button tip="Bold" bottom-tip="true" v-on:click.native="toggleBold()" icon="bold" />
<nm-button tip="Quote" bottom-tip="true" v-on:click.native="toggleItalic()" icon="quote left" />
<nm-button tip="Title" bottom-tip="true" v-on:click.native="modifyFont('1.4em')" icon="text height" />
<nm-button tip="Big Text" bottom-tip="true" v-on:click.native="modifyFont('1.4em')" icon="text height" />
<nm-button tip="Indent" bottom-tip="true" v-on:click.native="editor.increaseQuoteLevel()" icon="indent" />
<nm-button tip="Outdent" bottom-tip="true" v-on:click.native="editor.decreaseQuoteLevel()" icon="outdent" />
<nm-button tip="Remove Formatting" bottom-tip="true" v-on:click.native="removeFormatting()" icon="remove format icon" />
<nm-button v-on:click.native="undoCustom()" icon="undo" bottom-tip="true" tip="Undo" text="Undo" />
<nm-button tip="Users on Note" bottom-tip="true" v-if="usersOnNote > 1" icon="green user circle" />
</div>
@@ -149,13 +151,9 @@
<div class="note-menu shrink-icons-on-mobile">
<!-- Tags -->
<nm-button
v-on:click.native="$router.push(`/notes/open/${noteid}/menu/tags`)"
icon="tags"
text="Tags"
tip="Tags"
></nm-button>
<nm-button tip="Task List" v-on:click.native="toggleList('ul')" icon="tasks" />
<nm-button tip="Numbered List" v-on:click.native="toggleList('ol')" icon="list ol" />
<!-- colors button -->
<nm-button
@@ -165,6 +163,14 @@
tip="Note Color"
></nm-button>
<!-- Tags -->
<nm-button
v-on:click.native="$router.push(`/notes/open/${noteid}/menu/tags`)"
icon="tags"
text="Tags"
tip="Tags"
></nm-button>
<!-- add images panel -->
<nm-button
v-on:click.native="$router.push(`/notes/open/${noteid}/menu/images`)"
@@ -178,8 +184,6 @@
class="nm-button"
:noteId="noteid" />
<nm-button v-on:click.native="undoCustom()" icon="undo" tip="Undo" text="Undo" />
<nm-button
icon="ellipsis horizontal"
text="Options"
@@ -191,6 +195,13 @@
</div>
<!-- color picker -->
<color-tooltip
v-if="colorpicker"
v-on:color="color => modifyColor(color)"
v-on:close="colorpicker = false"
/>
<!-- Side slide menus for colors, tags, images and other options -->
<side-slide-menu v-show="colors" v-on:close="colors = false" name="colors">
@@ -331,6 +342,7 @@
'simple-attachment-note': () => import('@/components/SimpleAttachmentNoteComponent.vue'),
'share-note-component': () => import('@/components/ShareNoteComponent.vue'),
'color-tooltip':require('@/components/TextColorTooltipComponent.vue').default,
'nm-button':require('@/components/NoteMenuButtonComponent.vue').default
},
data(){
@@ -377,6 +389,7 @@
colors: false,
images: false,
options: false,
colorpicker: false,
//Encryption options
passwordHint: '',
@@ -565,6 +578,10 @@
this.editor.setSelection(squireRange)
}
},
removeFormatting(){
this.selectLineIfNoSelect()
this.editor.removeAllFormatting()
},
modifyFont(inSize){
this.selectLineIfNoSelect()
@@ -577,6 +594,12 @@
this.editor.setFontSize(inSize)
}
},
modifyColor(color){
this.selectLineIfNoSelect()
//Set color of font
this.editor.setTextColour(color)
},
toggleList(type){
//Undo list if its already a lits