diff options
author | korelstar <korelstar@users.noreply.github.com> | 2022-10-02 16:31:12 +0300 |
---|---|---|
committer | korelstar <korelstar@users.noreply.github.com> | 2022-10-03 09:46:37 +0300 |
commit | 172f96866de68758607444ccd262e46d8e38957e (patch) | |
tree | 92613631d066307f60655f6c3ded96bf41324811 | |
parent | 34d9fbffa7c1fd343edf1f2a6cbff6d4e6581ecf (diff) |
remove SCSS
-rw-r--r-- | css/global.css | 10 | ||||
-rw-r--r-- | css/global.scss | 2 | ||||
-rw-r--r-- | css/notes.css (renamed from css/app-navigation.scss) | 48 | ||||
-rw-r--r-- | css/notes.scss | 8 | ||||
-rw-r--r-- | css/print.scss | 23 | ||||
-rw-r--r-- | img/folder-empty.svg | 1 | ||||
-rw-r--r-- | img/folder.svg | 1 | ||||
-rw-r--r-- | img/notes-dark.svg | 1 | ||||
-rw-r--r-- | img/notes-trans.svg | 2 | ||||
-rw-r--r-- | img/recent.svg | 1 | ||||
-rw-r--r-- | src/components/Dashboard.vue | 2 | ||||
-rw-r--r-- | src/components/NavigationCategoriesItem.vue | 22 | ||||
-rw-r--r-- | src/components/NavigationList.vue | 1 | ||||
-rw-r--r-- | src/components/Note.vue | 28 | ||||
-rw-r--r-- | src/components/Sidebar.vue | 15 |
15 files changed, 99 insertions, 66 deletions
diff --git a/css/global.css b/css/global.css new file mode 100644 index 00000000..80a846b2 --- /dev/null +++ b/css/global.css @@ -0,0 +1,10 @@ +.icon-notes { + background-image: url(../img/notes-dark.svg); + filter: var(--background-invert-if-dark); +} + +.icon-notes-trans { + background-image: url(../img/notes-trans.svg); + filter: var(--background-invert-if-dark); +} + diff --git a/css/global.scss b/css/global.scss deleted file mode 100644 index 0dcd63a4..00000000 --- a/css/global.scss +++ /dev/null @@ -1,2 +0,0 @@ -@include icon-black-white('notes', 'notes', 1); -@include icon-black-white('notes-trans', 'notes', 1); diff --git a/css/app-navigation.scss b/css/notes.css index 8a0595d1..520192ff 100644 --- a/css/app-navigation.scss +++ b/css/notes.css @@ -1,3 +1,10 @@ +/* workaround for https://github.com/nextcloud/nextcloud-vue/issues/1384 */ +body { + min-height: 100%; + height: auto; +} + +/* App Navigation fixes */ .app-navigation-entry.category-header:not(.app-navigation-entry--opened) .app-navigation-entry__title { font-weight: bold; } @@ -7,23 +14,6 @@ pointer-events: inherit; } -#app-navigation > ul > li.app-navigation-caption.timeslot { - color: var(--color-text-maxcontrast); -} - -/* icons for sidebar */ -.icon-files { - @include icon-color('folder', 'notes', $color-black); -} - -.icon-emptyfolder { - @include icon-color('folder-empty', 'notes', $color-black); -} - -.icon-recent { - @include icon-color('recent', 'notes', $color-black); -} - .app-navigation-entry__utils .action-item { visibility: hidden; } @@ -36,3 +26,27 @@ li:focus .app-navigation-entry__utils .action-item { visibility: visible; } +@media print { + #header, + .app-navigation, + #note-container .action-buttons, + #note-container .upload-button { + display: none !important; + } + + .content { + display: block; + padding: 0; + color: #000; + } + + #note-container .note-editor, + #note-container .note-preview { + padding: 0 !important; + font-size: 10pt !important; + } + + .app-content { + margin-left: 0 !important; + } +} diff --git a/css/notes.scss b/css/notes.scss deleted file mode 100644 index 02f6f1db..00000000 --- a/css/notes.scss +++ /dev/null @@ -1,8 +0,0 @@ -@import 'app-navigation'; -@import 'print'; - -// workaround for https://github.com/nextcloud/nextcloud-vue/issues/1384 -body { - min-height: 100%; - height: auto; -} diff --git a/css/print.scss b/css/print.scss deleted file mode 100644 index 2a473ec6..00000000 --- a/css/print.scss +++ /dev/null @@ -1,23 +0,0 @@ -@media print { - #header, - .app-navigation, - #note-container .action-buttons { - display: none !important; - } - - .content { - display: block; - padding: 0; - color: #000; - } - - #note-container .note-editor, - #note-container .note-preview { - padding: 0 !important; - font-size: 10pt !important; - } - - .app-content { - margin-left: 0 !important; - } -} diff --git a/img/folder-empty.svg b/img/folder-empty.svg deleted file mode 100644 index 6fefe1d2..00000000 --- a/img/folder-empty.svg +++ /dev/null @@ -1 +0,0 @@ -<svg xmlns="http://www.w3.org/2000/svg" viewBox="0 0 16 16" width="16" version="1.1" height="16"><path d="M1.46 2c-.25 0-.46.21-.46.46v11.08c0 .258.202.46.46.46h13.08c.258 0 .46-.202.46-.46V4.462c0-.25-.21-.463-.46-.463H8L6 2H1.46zM2 5h12v8H2V5z" fill="#0082c9"/></svg> diff --git a/img/folder.svg b/img/folder.svg deleted file mode 100644 index b58c3e23..00000000 --- a/img/folder.svg +++ /dev/null @@ -1 +0,0 @@ -<svg xmlns="http://www.w3.org/2000/svg" height="16" width="16" version="1"><path d="M1.457 1.997c-.25 0-.46.21-.46.46v11.08c0 .26.202.46.46.46h13.08c.258 0 .46-.2.46-.46V4.46c0-.25-.21-.463-.46-.463h-6.54l-2-2z" /></svg> diff --git a/img/notes-dark.svg b/img/notes-dark.svg new file mode 100644 index 00000000..beaba9e4 --- /dev/null +++ b/img/notes-dark.svg @@ -0,0 +1 @@ +<svg width="32" height="32" version="1.0" viewBox="0 0 32 32" xmlns="http://www.w3.org/2000/svg"><path d="m24.484 3.5156c-1.0237 0-2.0471 0.38887-2.8281 1.1699l5.6582 5.6582c1.5621-1.5621 1.5621-4.0961 0-5.6582-0.78105-0.78105-1.8064-1.1699-2.8301-1.1699zm-4.2422 2.584-12.02 12.021 5.6562 5.6562 12.021-12.02-5.6582-5.6582zm-13.436 13.436-2.1211 7.7793 7.7793-2.1211-5.6582-5.6582z" fill="#000"/></svg> diff --git a/img/notes-trans.svg b/img/notes-trans.svg index 1850accb..1163eb6e 100644 --- a/img/notes-trans.svg +++ b/img/notes-trans.svg @@ -1 +1 @@ -<svg width="32" height="32" version="1.0" viewBox="0 0 32 32" xmlns="http://www.w3.org/2000/svg"><path d="m24.484 3.5156c-1.0237 0-2.0471 0.38887-2.8281 1.1699l5.6582 5.6582c1.5621-1.5621 1.5621-4.0961 0-5.6582-0.78105-0.78105-1.8064-1.1699-2.8301-1.1699zm-4.2422 2.584-12.02 12.021 5.6562 5.6562 12.021-12.02-5.6582-5.6582zm-13.436 13.436-2.1211 7.7793 7.7793-2.1211-5.6582-5.6582z" fill="#fff" style="fill-opacity:0.5" /></svg> +<svg width="32" height="32" version="1.0" viewBox="0 0 32 32" xmlns="http://www.w3.org/2000/svg"><path d="m24.484 3.5156c-1.0237 0-2.0471 0.38887-2.8281 1.1699l5.6582 5.6582c1.5621-1.5621 1.5621-4.0961 0-5.6582-0.78105-0.78105-1.8064-1.1699-2.8301-1.1699zm-4.2422 2.584-12.02 12.021 5.6562 5.6562 12.021-12.02-5.6582-5.6582zm-13.436 13.436-2.1211 7.7793 7.7793-2.1211-5.6582-5.6582z" fill="#000" style="fill-opacity:0.5" /></svg> diff --git a/img/recent.svg b/img/recent.svg deleted file mode 100644 index cb681fb7..00000000 --- a/img/recent.svg +++ /dev/null @@ -1 +0,0 @@ -<svg xmlns="http://www.w3.org/2000/svg" height="16" width="16" version="1"><path color="#000" fill="none" d="M-62.897-32.993h163.31v97.986h-163.31z"/><path style="text-decoration-color:#000;isolation:auto;mix-blend-mode:normal;block-progression:tb;text-decoration-line:none;text-decoration-style:solid;text-indent:0;text-transform:none" d="M8 0C3.594 0 0 3.594 0 8c0 4.406 3.594 8 8 8 4.406 0 8-3.594 8-8 0-4.406-3.594-8-8-8zm0 2c3.326 0 6 2.674 6 6s-2.674 6-6 6-6-2.674-6-6 2.674-6 6-6zm-.44.932a.617.617 0 0 0-.605.613l-.852 4.44V8C5.92 8.755 6.44 9 7.02 9.352h.005l2.998 1.58c.653.502 1.407-.476.754-.98L9 8.01V8l-.81-4.45a.617.617 0 0 0-.63-.618z" color="#000" white-space="normal"/></svg>
\ No newline at end of file diff --git a/src/components/Dashboard.vue b/src/components/Dashboard.vue index 71cd4dc7..39ff0c06 100644 --- a/src/components/Dashboard.vue +++ b/src/components/Dashboard.vue @@ -104,7 +104,7 @@ export default { } .note-item-favorite { - background: var(--icon-star-dark-FC0, var(--icon-star-dark-fc0)); + background: var(--icon-starred-yellow, var(--icon-star-dark-FC0, var(--icon-star-dark-fc0))); } .note-item { diff --git a/src/components/NavigationCategoriesItem.vue b/src/components/NavigationCategoriesItem.vue index 28c0f396..67e134a6 100644 --- a/src/components/NavigationCategoriesItem.vue +++ b/src/components/NavigationCategoriesItem.vue @@ -1,18 +1,18 @@ <template> <AppNavigationItem :title="title" - icon="icon-files" class="app-navigation-noclose separator-below" :class="{ 'category-header': selectedCategory !== null }" :open.sync="open" :allow-collapse="true" @click.prevent.stop="onToggleCategories" > + <FolderIcon slot="icon" :size="20" fill-color="var(--color-main-text)" /> <AppNavigationItem :title="t('notes', 'All notes')" - icon="icon-recent" @click.prevent.stop="onSelectCategory(null)" > + <HistoryIcon slot="icon" :size="20" fill-color="var(--color-main-text)" /> <AppNavigationCounter slot="counter"> {{ numNotes }} </AppNavigationCounter> @@ -21,9 +21,18 @@ <AppNavigationItem v-for="category in categories" :key="category.name" :title="categoryTitle(category.name)" - :icon="category.name === '' ? 'icon-emptyfolder' : 'icon-files'" @click.prevent.stop="onSelectCategory(category.name)" > + <FolderOutlineIcon v-if="category.name === ''" + slot="icon" + :size="20" + fill-color="var(--color-main-text)" + /> + <FolderIcon v-else + slot="icon" + :size="20" + fill-color="var(--color-main-text)" + /> <AppNavigationCounter slot="counter"> {{ category.count }} </AppNavigationCounter> @@ -37,6 +46,10 @@ import { AppNavigationCounter, } from '@nextcloud/vue' +import FolderIcon from 'vue-material-design-icons/Folder.vue' +import FolderOutlineIcon from 'vue-material-design-icons/FolderOutline.vue' +import HistoryIcon from 'vue-material-design-icons/History.vue' + import { getCategories } from '../NotesService.js' import { categoryLabel } from '../Util.js' import store from '../store.js' @@ -47,6 +60,9 @@ export default { components: { AppNavigationItem, AppNavigationCounter, + FolderIcon, + FolderOutlineIcon, + HistoryIcon, }, props: { diff --git a/src/components/NavigationList.vue b/src/components/NavigationList.vue index e7e5e03c..2ee9383b 100644 --- a/src/components/NavigationList.vue +++ b/src/components/NavigationList.vue @@ -11,7 +11,6 @@ <template v-for="item in noteItems"> <AppNavigationCaption v-if="category!==null && category!==item.category" :key="item.category" - icon="icon-files" class="app-navigation-noclose" :title="categoryToLabel(item.category)" @click.native="$emit('category-selected', item.category)" diff --git a/src/components/Note.vue b/src/components/Note.vue index 2bdefe56..34bfdeba 100644 --- a/src/components/Note.vue +++ b/src/components/Note.vue @@ -51,26 +51,36 @@ icon="icon-details" @click="onToggleSidebar" > + <SidebarIcon slot="icon" :size="20" fill-color="var(--color-main-text)" /> {{ t('notes', 'Details') }} </ActionButton> <ActionButton v-tooltip.left="t('notes', 'CTRL + /')" - :icon="preview ? 'icon-rename' : 'icon-toggle'" @click="onTogglePreview" > + <EditIcon v-if="preview" + slot="icon" + :size="20" + fill-color="var(--color-main-text)" + /> + <EyeIcon v-else + slot="icon" + :size="20" + fill-color="var(--color-main-text)" + /> {{ preview ? t('notes', 'Edit') : t('notes', 'Preview') }} </ActionButton> <ActionButton - icon="icon-fullscreen" :class="{ active: fullscreen }" @click="onToggleDistractionFree" > + <FullscreenIcon slot="icon" :size="20" fill-color="var(--color-main-text)" /> {{ fullscreen ? t('notes', 'Exit full screen') : t('notes', 'Full screen') }} </ActionButton> </Actions> <Actions v-if="note.readonly"> <ActionButton> - <PencilOffIcon slot="icon" :size="20" fill-color="var(--color-main-text)" /> + <NoEditIcon slot="icon" :size="20" fill-color="var(--color-main-text)" /> {{ t('notes', 'Note is read-only. You cannot change it.') }} </ActionButton> </Actions> @@ -103,8 +113,12 @@ import { import { showError } from '@nextcloud/dialogs' import { emit } from '@nextcloud/event-bus' +import EditIcon from 'vue-material-design-icons/LeadPencil.vue' +import EyeIcon from 'vue-material-design-icons/Eye.vue' +import FullscreenIcon from 'vue-material-design-icons/Fullscreen.vue' +import NoEditIcon from 'vue-material-design-icons/PencilOff.vue' +import SidebarIcon from 'vue-material-design-icons/PageLayoutSidebarRight.vue' import SyncAlertIcon from 'vue-material-design-icons/SyncAlert.vue' -import PencilOffIcon from 'vue-material-design-icons/PencilOff.vue' import { config } from '../config.js' import { fetchNote, refreshNote, saveNoteManually, queueCommand, conflictSolutionLocal, conflictSolutionRemote } from '../NotesService.js' @@ -122,8 +136,12 @@ export default { ActionButton, AppContent, ConflictSolution, + EditIcon, + EyeIcon, + FullscreenIcon, Modal, - PencilOffIcon, + NoEditIcon, + SidebarIcon, SyncAlertIcon, TheEditor, ThePreview, diff --git a/src/components/Sidebar.vue b/src/components/Sidebar.vue index f3f16b6f..df3ffe53 100644 --- a/src/components/Sidebar.vue +++ b/src/components/Sidebar.vue @@ -8,8 +8,15 @@ @close="onCloseSidebar" > <div class="sidebar-content-wrapper"> - <div v-if="!note.readonly" class="note-category" :title="t('notes', 'Set category')"> - <h4>{{ t('notes', 'Category') }} <span v-tooltip="categoriesInfo" class="icon-info svg" /></h4> + <div v-if="!note.readonly" class="note-category"> + <h4> + {{ t('notes', 'Category') }} + <InfoIcon v-tooltip="categoriesInfo" + :size="20" + fill-color="var(--color-main-text)" + style="display: inline-block; margin-left: 1ex;" + /> + </h4> <form class="category" @submit.prevent.stop=""> <Multiselect id="category" :value="category" @@ -20,6 +27,7 @@ :show-no-results="false" :taggable="true" :preserve-search="true" + :title="t('notes', 'Set category')" @input="onSaveCategory" @close="onFinishEditCategory" @search-change="onEditCategory" @@ -61,6 +69,8 @@ import { } from '@nextcloud/vue' import moment from '@nextcloud/moment' +import InfoIcon from 'vue-material-design-icons/Information.vue' + import { getCategories, setFavorite, setCategory, saveNoteManually } from '../NotesService.js' import { categoryLabel } from '../Util.js' import store from '../store.js' @@ -70,6 +80,7 @@ export default { components: { AppSidebar, + InfoIcon, Multiselect, }, |