Max/SolidScribe
1
0
Fork 0
Code Issues 24 Pull Requests Releases Wiki Activity

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

Browse Source 
* 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
Download Patch File Download Diff File Expand all files Collapse all files

39
client/src/components/NoteTitleDisplayCard.vue
View File

@@ -68,22 +68,23 @@
<div class="tool-bar" @click.self="cardClicked">
<div class="icon-bar">
<span v-if="note.pinned == 1" data-position="top left" data-tooltip="Pinned" data-inverted>
<!-- <span v-if="note.pinned == 1" data-position="top left" data-tooltip="Pinned" data-inverted>
<i class="green pin icon"></i>
</span>
<span v-if="note.archived == 1" data-position="top left" data-tooltip="Archived" data-inverted>
<i class="green archive icon"></i>
</span>
</span> -->
<span v-if="note.tags">
<span class="tags" v-if="note.tags">
<span v-for="tag in (note.tags.split(','))" class="little-tag">{{ tag }}</span>
<br>
</span>
<span class="time-ago-display" :class="{ 'hover-hide':(!$store.getters.getIsUserOnMobile) }">
Last Edit {{$helpers.timeAgo(note.updated)}}
<span data-tooltip="Edited" class="time-ago-display" :class="{ 'hover-hide':(!$store.getters.getIsUserOnMobile) }">
{{$helpers.timeAgo(note.updated)}}
</span>
<span class="float-right" :class="{ 'hover-hide':(!$store.getters.getIsUserOnMobile) }">
<span class="teeny-buttons" :class="{ 'hover-hide':(!$store.getters.getIsUserOnMobile) }">
<i class="teeny-button" data-tooltip="Tags" data-inverted v-on:click="toggleTags(true)">
<i class="tags icon"></i>
@@ -93,13 +94,13 @@
data-tooltip="Archive"
:data-tooltip="note.archived ? 'Un-Archive':'Archive' "
data-inverted v-on:click="archiveNote">
<i class="archive icon"></i>
<i class="archive icon" :class="{'green':note.archived}"></i>
</i>
<i class="teeny-button"
:data-tooltip="note.pinned ? 'Un-Pin':'Pin' "
data-inverted v-on:click="pinNote">
<i class="pin icon"></i>
<i class="pin icon" :class="{'green':note.pinned}"></i>
</i>
<delete-button class="teeny-button" :note-id="note.id" />
@@ -289,6 +290,21 @@
</script>
<style type="text/css">
.teeny-buttons {
float: right;
width: 65%;
text-align: right;
}
.time-ago-display {
width: 35%;
float: left;
text-align: center;
}
.tags {
width: 100%;
display: inline-block;
}
.teeny-button {
border: 1px solid var(--border_color);
border-radius: 5px;
@@ -381,7 +397,7 @@
}
.icon-bar {
display: inline-block;
padding: 0 10px 0;
padding: 5px 10px 0;
opacity: 1;
width: 100%;
}
@@ -442,11 +458,6 @@
align-self: flex-end;
flex-grow: 0;
}
.time-ago-display {
display: inline-block;
width: 100%;
text-align: right;
}
.one-column .note-title-display-card {