fabio286
/
antares
mirror of https://github.com/Fabio286/antares.git
1
1
Fork 0
Code Issues Releases Wiki Activity

feat(UI): new settimgbar tooltips

This commit is contained in:
Fabio Di Stasio 2022-11-28 15:11:29 +01:00
parent b06bafe06c
commit 672896414e
6 changed files with 104 additions and 6 deletions
Show Stats Download Patch File Download Diff File Expand all files Collapse all files

62
package-lock.json generated
View File

@ -22,6 +22,7 @@
"electron-updater": "~4.6.5",
"electron-window-state": "~5.0.3",
"encoding": "~0.1.13",
"floating-vue": "~2.0.0-beta.20",
"leaflet": "~1.7.1",
"marked": "~4.0.19",
"moment": "~2.29.4",
@ -2011,6 +2012,19 @@
"npm": ">=6.0.0"
}
},
"node_modules/@floating-ui/core": {
"version": "0.3.1",
"resolved": "https://registry.npmjs.org/@floating-ui/core/-/core-0.3.1.tgz",
"integrity": "sha512-ensKY7Ub59u16qsVIFEo2hwTCqZ/r9oZZFh51ivcLGHfUwTn8l1Xzng8RJUe91H/UP8PeqeBronAGx0qmzwk2g=="
},
"node_modules/@floating-ui/dom": {
"version": "0.1.10",
"resolved": "https://registry.npmjs.org/@floating-ui/dom/-/dom-0.1.10.tgz",
"integrity": "sha512-4kAVoogvQm2N0XE0G6APQJuCNuErjOfPW8Ux7DFxh8+AfugWflwVJ5LDlHOwrwut7z/30NUvdtHzQ3zSip4EzQ==",
"dependencies": {
"@floating-ui/core": "^0.3.0"
}
},
"node_modules/@heroku/socksv5": {
"version": "0.0.9",
"resolved": "https://registry.npmjs.org/@heroku/socksv5/-/socksv5-0.0.9.tgz",
@ -8105,6 +8119,18 @@
"integrity": "sha512-5nqDSxl8nn5BSNxyR3n4I6eDmbolI6WT+QqR547RwxQapgjQBmtktdP+HTBb/a/zLsbzERTONyUB5pefh5TtjQ==",
"dev": true
},
"node_modules/floating-vue": {
"version": "2.0.0-beta.20",
"resolved": "https://registry.npmjs.org/floating-vue/-/floating-vue-2.0.0-beta.20.tgz",
"integrity": "sha512-N68otcpp6WwcYC7zP8GeJqNZVdfvS7tEY88lwmuAHeqRgnfWx1Un8enzLxROyVnBDZ3TwUoUdj5IFg+bUT7JeA==",
"dependencies": {
"@floating-ui/dom": "^0.1.10",
"vue-resize": "^2.0.0-alpha.1"
},
"peerDependencies": {
"vue": "^3.2.0"
}
},
"node_modules/follow-redirects": {
"version": "1.15.2",
"resolved": "https://registry.npmjs.org/follow-redirects/-/follow-redirects-1.15.2.tgz",
@ -16127,6 +16153,14 @@
"webpack": "^4.1.0 || ^5.0.0-0"
}
},
"node_modules/vue-resize": {
"version": "2.0.0-alpha.1",
"resolved": "https://registry.npmjs.org/vue-resize/-/vue-resize-2.0.0-alpha.1.tgz",
"integrity": "sha512-7+iqOueLU7uc9NrMfrzbG8hwMqchfVfSzpVlCMeJQe4pyibqyoifDNbKTZvwxZKDvGkB+PdFeKvnGZMoEb8esg==",
"peerDependencies": {
"vue": "^3.0.0"
}
},
"node_modules/vuedraggable": {
"version": "4.1.0",
"resolved": "https://registry.npmjs.org/vuedraggable/-/vuedraggable-4.1.0.tgz",
@ -18274,6 +18308,19 @@
"resolved": "https://registry.npmjs.org/@faker-js/faker/-/faker-6.1.2.tgz",
"integrity": "sha512-QSvmexHCxeRUk1/yKmoEDaWB5Hohjvtim5g2JJwy8S/l0L4b3y/GxSpE6vN4SBoVGGahEQW21uqyRr7EofI35A=="
},
"@floating-ui/core": {
"version": "0.3.1",
"resolved": "https://registry.npmjs.org/@floating-ui/core/-/core-0.3.1.tgz",
"integrity": "sha512-ensKY7Ub59u16qsVIFEo2hwTCqZ/r9oZZFh51ivcLGHfUwTn8l1Xzng8RJUe91H/UP8PeqeBronAGx0qmzwk2g=="
},
"@floating-ui/dom": {
"version": "0.1.10",
"resolved": "https://registry.npmjs.org/@floating-ui/dom/-/dom-0.1.10.tgz",
"integrity": "sha512-4kAVoogvQm2N0XE0G6APQJuCNuErjOfPW8Ux7DFxh8+AfugWflwVJ5LDlHOwrwut7z/30NUvdtHzQ3zSip4EzQ==",
"requires": {
"@floating-ui/core": "^0.3.0"
}
},
"@heroku/socksv5": {
"version": "0.0.9",
"resolved": "https://registry.npmjs.org/@heroku/socksv5/-/socksv5-0.0.9.tgz",
@ -22979,6 +23026,15 @@
"integrity": "sha512-5nqDSxl8nn5BSNxyR3n4I6eDmbolI6WT+QqR547RwxQapgjQBmtktdP+HTBb/a/zLsbzERTONyUB5pefh5TtjQ==",
"dev": true
},
"floating-vue": {
"version": "2.0.0-beta.20",
"resolved": "https://registry.npmjs.org/floating-vue/-/floating-vue-2.0.0-beta.20.tgz",
"integrity": "sha512-N68otcpp6WwcYC7zP8GeJqNZVdfvS7tEY88lwmuAHeqRgnfWx1Un8enzLxROyVnBDZ3TwUoUdj5IFg+bUT7JeA==",
"requires": {
"@floating-ui/dom": "^0.1.10",
"vue-resize": "^2.0.0-alpha.1"
}
},
"follow-redirects": {
"version": "1.15.2",
"resolved": "https://registry.npmjs.org/follow-redirects/-/follow-redirects-1.15.2.tgz",
@ -28960,6 +29016,12 @@
"loader-utils": "^2.0.0"
}
},
"vue-resize": {
"version": "2.0.0-alpha.1",
"resolved": "https://registry.npmjs.org/vue-resize/-/vue-resize-2.0.0-alpha.1.tgz",
"integrity": "sha512-7+iqOueLU7uc9NrMfrzbG8hwMqchfVfSzpVlCMeJQe4pyibqyoifDNbKTZvwxZKDvGkB+PdFeKvnGZMoEb8esg==",
"requires": {}
},
"vuedraggable": {
"version": "4.1.0",
"resolved": "https://registry.npmjs.org/vuedraggable/-/vuedraggable-4.1.0.tgz",

1
package.json
View File

@ -131,6 +131,7 @@
"electron-updater": "~4.6.5",
"electron-window-state": "~5.0.3",
"encoding": "~0.1.13",
"floating-vue": "~2.0.0-beta.20",
"leaflet": "~1.7.1",
"marked": "~4.0.19",
"moment": "~2.29.4",

8
src/renderer/components/SettingBarConnections.vue
View File

@ -20,9 +20,15 @@
>
<div
v-if="!element.isFolder && !folderedConnections.includes(element.uid)"
v-tooltip="{
strategy: 'fixed',
placement: 'right',
content: getConnectionName(element.uid)
}"
class="settingbar-element btn btn-link"
:class="{ 'selected': element.uid === selectedWorkspace }"
:title="getConnectionName(element.uid)"
placement="right"
strategy="fixed"
@click.stop="selectWorkspace(element.uid)"
>
<!-- Creates a new folder -->

12
src/renderer/components/SettingBarConnectionsFolder.vue
View File

@ -1,9 +1,14 @@
<template>
<div
v-tooltip="{
strategy: 'fixed',
placement: 'right',
content: folder.name,
disabled: isOpen || !folder.name
}"
class="settingbar-element folder btn btn-link p-1"
:class="[{ 'selected-inside': hasSelectedInside && !isOpen }]"
:style="isOpen ? `height: auto; opacity: 1;` : null"
:title="folder.name"
>
<Draggable
class="folder-container"
@ -40,6 +45,11 @@
<template #item="{ element }">
<div
:key="element"
v-tooltip="{
strategy: 'fixed',
placement: 'right',
content: getConnectionName(element)
}"
class="folder-element"
:class="{ 'selected': element === selectedWorkspace }"
@click="emit('select-workspace', element)"

24
src/renderer/components/TheSettingBar.vue
View File

@ -19,8 +19,12 @@
<ul class="settingbar-elements">
<li
v-if="isScrollable"
v-tooltip="{
strategy: 'fixed',
placement: 'right',
content: t('message.allConnections')
}"
class="settingbar-element btn btn-link"
:title="t('message.allConnections')"
@click="emit('show-connections-modal')"
>
<div class="settingbar-element-icon-wrapper">
@ -28,9 +32,13 @@
</div>
</li>
<li
v-tooltip="{
strategy: 'fixed',
placement: 'right',
content: t('message.addConnection')
}"
class="settingbar-element btn btn-link"
:class="{ 'selected': 'NEW' === selectedWorkspace }"
:title="t('message.addConnection')"
@click="selectWorkspace('NEW')"
>
<div class="settingbar-element-icon-wrapper">
@ -44,15 +52,23 @@
<ul class="settingbar-elements">
<li
v-if="!disableScratchpad"
v-tooltip="{
strategy: 'fixed',
placement: 'right',
content: t('word.scratchpad')
}"
class="settingbar-element btn btn-link"
:title="t('word.scratchpad')"
@click="showScratchpad"
>
<i class="settingbar-element-icon mdi mdi-24px mdi-notebook-edit-outline text-light" />
</li>
<li
v-tooltip="{
strategy: 'fixed',
placement: 'right',
content: t('word.settings')
}"
class="settingbar-element btn btn-link"
:title="t('word.settings')"
@click="showSettingModal('general')"
>
<i

3
src/renderer/index.ts
View File

@ -3,7 +3,9 @@ import { ipcRenderer } from 'electron';
import { createApp } from 'vue';
import { createPinia } from 'pinia';
import { VueMaskDirective } from 'v-mask';
import * as FloatingVue from 'floating-vue';
import '@mdi/font/css/materialdesignicons.css';
import 'floating-vue/dist/style.css';
import 'leaflet/dist/leaflet.css';
import '@/scss/main.scss';
@ -27,6 +29,7 @@ createApp(App)
.directive('mask', vMaskV3)
.use(createPinia())
.use(i18n)
.use(FloatingVue)
.mount('#app');
const { locale } = useSettingsStore();