diff --git a/package.json b/package.json
index 51c3709e..61594968 100644
--- a/package.json
+++ b/package.json
@@ -26,8 +26,8 @@
"dayjs": "^1.9.1",
"direct-vuex": "^0.10.4",
"lodash": "^4.17.21",
- "material-design-icons-iconfont": "^5.0.1",
"multinet": "0.21.7",
+ "multinet-components": "^0.0.1",
"papaparse": "^5.3.0",
"vue": "^2.7.0",
"vue-gtag": "^1.2.1",
diff --git a/public/index.html b/public/index.html
index 911323d5..c5dcc0b9 100644
--- a/public/index.html
+++ b/public/index.html
@@ -6,6 +6,7 @@
+
MultiNet – Visualizing Networks with Attributes
diff --git a/src/App.vue b/src/App.vue
index b35a6e45..ea3dd07b 100644
--- a/src/App.vue
+++ b/src/App.vue
@@ -31,6 +31,8 @@ import { defineComponent } from 'vue';
import Sidebar from '@/components/Sidebar.vue';
import apps from '@/assets/appregistry.json';
+import 'multinet-components/dist/style.css';
+
export default defineComponent({
name: 'App',
diff --git a/src/components/AboutDialog.vue b/src/components/AboutDialog.vue
index dc020a3e..ab021b28 100644
--- a/src/components/AboutDialog.vue
+++ b/src/components/AboutDialog.vue
@@ -12,7 +12,7 @@
v-on="on"
>
- help
+ mdi-help-circle
diff --git a/src/components/DeleteNetworkDialog.vue b/src/components/DeleteNetworkDialog.vue
index 1a0e839b..b35cc7ae 100644
--- a/src/components/DeleteNetworkDialog.vue
+++ b/src/components/DeleteNetworkDialog.vue
@@ -19,7 +19,7 @@
color="red accent-3"
size="20px"
>
- delete_sweep
+ mdi-delete-sweep
diff --git a/src/components/DeleteTableDialog.vue b/src/components/DeleteTableDialog.vue
index b1ade673..4cab93e5 100644
--- a/src/components/DeleteTableDialog.vue
+++ b/src/components/DeleteTableDialog.vue
@@ -19,7 +19,7 @@
color="red accent-3"
size="20px"
>
- delete_sweep
+ mdi-delete-sweep
diff --git a/src/components/DeleteWorkspaceDialog.vue b/src/components/DeleteWorkspaceDialog.vue
index 39a1c6a6..9ee3f7a5 100644
--- a/src/components/DeleteWorkspaceDialog.vue
+++ b/src/components/DeleteWorkspaceDialog.vue
@@ -21,7 +21,7 @@
- delete_sweep
+ mdi-delete-sweep
diff --git a/src/components/DownloadDialog.vue b/src/components/DownloadDialog.vue
index 985463f2..5919c5d2 100644
--- a/src/components/DownloadDialog.vue
+++ b/src/components/DownloadDialog.vue
@@ -18,7 +18,7 @@
color="primary"
size="20px"
>
- save_alt
+ mdi-tray-arrow-down
@@ -51,7 +51,7 @@
color="green accent-4"
size="18"
>
- check
+ mdi-check
{{ item }}
diff --git a/src/components/LoginMenu.vue b/src/components/LoginMenu.vue
deleted file mode 100644
index 6a41887e..00000000
--- a/src/components/LoginMenu.vue
+++ /dev/null
@@ -1,164 +0,0 @@
-
-
-
-
-
- {{ userInitials }}
-
- account_circle
-
-
-
-
-
-
-
-
-
-
- Log out
-
-
-
-
- 
-
-
- Sign in with Google
-
-
-
-
-
-
-
-
-
-
-
-
-
-
diff --git a/src/components/NetworkDialog.vue b/src/components/NetworkDialog.vue
index b243bc85..ef382fb2 100644
--- a/src/components/NetworkDialog.vue
+++ b/src/components/NetworkDialog.vue
@@ -12,7 +12,7 @@
v-on="on"
>
- library_add
+ mdi-plus-box-multiple
@@ -37,7 +37,7 @@
v-on="on"
>
- add_circle
+ mdi-plus-circle
diff --git a/src/components/NetworkMultiCSVUploadForm.vue b/src/components/NetworkMultiCSVUploadForm.vue
index b0bf9a61..c3640a23 100644
--- a/src/components/NetworkMultiCSVUploadForm.vue
+++ b/src/components/NetworkMultiCSVUploadForm.vue
@@ -2,7 +2,7 @@
Create from Existing Tables
- Link edge tables with node tables by clicking the link icon on
+ Link edge tables with node tables by clicking the mdi-link icon on
the desired edge table, and selecting the node table column that you'd like to link it to.
- check_box
+ mdi-checkbox-marked
- check_box_outline_blank
+ mdi-checkbox-blank-outline
@@ -151,7 +151,7 @@
:class="{'disable-events': linkDisabled(sample.table)}"
v-on="on"
>
- link
+ mdi-link
@@ -200,7 +200,7 @@
right
@click.stop="removeColumnLink(sample.table, col)"
>
- close
+ mdi-close
@@ -230,7 +230,7 @@
dark
v-on="on"
>
- call_merge
+ mdi-call-merge
@@ -256,7 +256,7 @@
right
@click.stop="removeColumnLink(sample.table, col, true)"
>
- close
+ mdi-close
diff --git a/src/components/NetworkPanel.vue b/src/components/NetworkPanel.vue
index fb14ef1c..2c30da2f 100644
--- a/src/components/NetworkPanel.vue
+++ b/src/components/NetworkPanel.vue
@@ -48,7 +48,7 @@
class="ws-detail-empty-list"
>
- info
+ mdi-information
There's nothing here yet...
@@ -70,7 +70,7 @@
v-if="!hover && !checkbox[item.name]"
class="item-icon"
>
- timeline
+ mdi-chart-timeline-variant
diff --git a/src/components/PermissionsDialog.vue b/src/components/PermissionsDialog.vue
index fee9a075..b30c37b0 100644
--- a/src/components/PermissionsDialog.vue
+++ b/src/components/PermissionsDialog.vue
@@ -10,7 +10,7 @@
v-on="on"
>
- vpn_key
+ mdi-key
Permissions
@@ -72,7 +72,7 @@
v-on="on"
@click="addSelectedUsers"
>
- add
+ mdi-plus
Add selected
@@ -101,7 +101,7 @@
hide-details
dense
placeholder="change all to"
- prepend-icon="more_horiz"
+ prepend-icon="mdi-dots-horizontal"
@input="setRoleForAllUsers(singularRoleToPlural($event))"
/>
@@ -114,7 +114,7 @@
class="px-0"
>
- account_circle
+ mdi-account-circle
@@ -129,7 +129,7 @@
dense
:value="pluralRoleToSingular(role)"
:disabled="role === 'owner'"
- prepend-icon="lock"
+ prepend-icon="mdi-lock"
@input="setRoleForUser(user, role, singularRoleToPlural($event))"
/>
@@ -139,7 +139,7 @@
:disabled="role === 'owner'"
@click="removeUserPermissions(user, role)"
>
- close
+ mdi-close
@@ -165,7 +165,7 @@
class="ml-2 mb-1"
v-on="on"
>
- help
+ mdi-help-circle
diff --git a/src/components/Sidebar.vue b/src/components/Sidebar.vue
index d149718b..73acbe24 100644
--- a/src/components/Sidebar.vue
+++ b/src/components/Sidebar.vue
@@ -35,7 +35,11 @@
-
+
@@ -83,7 +87,7 @@
v-if="!hover && !checkbox[space.name]"
class="workspace-icon"
>
- library_books
+ mdi-text-box-multiple
- add_circle
+ mdi-plus-circle
@@ -49,7 +49,7 @@
- info
+ mdi-information
There's nothing here yet...
@@ -70,7 +70,7 @@
v-if="!hover && !checkbox[item.name]"
class="item-icon"
>
- table_chart
+ mdi-table
- add_circle
+ mdi-plus-circle
diff --git a/src/components/WorkspaceOptionMenu.vue b/src/components/WorkspaceOptionMenu.vue
index 9ff66335..02f8a04c 100644
--- a/src/components/WorkspaceOptionMenu.vue
+++ b/src/components/WorkspaceOptionMenu.vue
@@ -11,7 +11,7 @@
icon
v-on="on"
>
- more_vert
+ mdi-dots-vertical
@@ -23,7 +23,7 @@
- search
+ mdi-magnify
AQL Wizard
diff --git a/src/main.ts b/src/main.ts
index e3538751..f370648b 100644
--- a/src/main.ts
+++ b/src/main.ts
@@ -1,4 +1,3 @@
-import 'material-design-icons-iconfont/dist/material-design-icons.css';
import * as Sentry from '@sentry/vue';
import Vue from 'vue';
import App from './App.vue';
diff --git a/src/views/AQLWizard.vue b/src/views/AQLWizard.vue
index 62247102..a38efbaa 100644
--- a/src/views/AQLWizard.vue
+++ b/src/views/AQLWizard.vue
@@ -34,7 +34,7 @@
>
- {{ network ? "timeline" : "table_chart" }}
+ {{ network ? "mdi-chart-timeline-variant" : "mdi-table" }}
{{ name }}
diff --git a/src/views/FrontPage.vue b/src/views/FrontPage.vue
index 3def1165..45b3ae1f 100644
--- a/src/views/FrontPage.vue
+++ b/src/views/FrontPage.vue
@@ -62,7 +62,7 @@
@click="login"
>
- file_upload
+ mdi-upload
Sign up and upload your own data
@@ -76,7 +76,7 @@
x-large
class="pr-1"
>
- videogame_asset
+ mdi-gamepad-square
Try a demo below or explore the public workspaces
@@ -98,7 +98,7 @@
v-on="on"
>
- info
+ mdi-information
diff --git a/src/views/NetworkDetail.vue b/src/views/NetworkDetail.vue
index a0c70469..47a05c95 100644
--- a/src/views/NetworkDetail.vue
+++ b/src/views/NetworkDetail.vue
@@ -16,7 +16,7 @@
class="ml-4 mr-5"
color="grey lighten-1"
>
- library_books
+ mdi-text-box-multiple
@@ -29,11 +29,11 @@
chevron_right
+ >mdi-chevron-right
timeline
+ >mdi-chart-timeline-variant
{{ network }}
@@ -96,7 +96,7 @@
>
- exit_to_app
+ mdi-exit-to-app
@@ -104,7 +104,7 @@
- chevron_right
+ mdi-chevron-right
@@ -150,7 +150,7 @@
color="grey lighten-1"
size="18"
>
- scatter_plot
+ mdi-scatter-plot
@@ -158,7 +158,7 @@
- chevron_right
+ mdi-chevron-right
@@ -205,7 +205,7 @@
color="grey lighten-1"
size="18"
>
- device_hub
+ mdi-merge
@@ -213,7 +213,7 @@
- chevron_right
+ mdi-chevron-right
@@ -245,7 +245,7 @@
:disabled="!prev"
@click="firstPage()"
>
- skip_previous
+ mdi-skip-previous
- chevron_left
+ mdi-chevron-left
- chevron_right
+ mdi-chevron-right
- skip_next
+ mdi-skip-next
@@ -375,7 +375,7 @@ export default defineComponent({
const prev = computed(() => offset.value !== 0);
const nodeColsClasses = computed(() => `d-flex flex-row node-cols${panelOpen.value ? '' : ' node-cols-closed'}`);
const networkVisClasses = computed(() => `network-vis${panelOpen.value ? '' : ' network-vis-closed'}`);
- const drawerIcon = computed(() => (panelOpen.value ? 'expand_more' : 'expand_less'));
+ const drawerIcon = computed(() => (panelOpen.value ? 'mdi-chevron-down' : 'mdi-chevron-up'));
function toggle() {
panelOpen.value = !panelOpen.value;
diff --git a/src/views/NodeDetail.vue b/src/views/NodeDetail.vue
index c6bfa623..f3576d15 100644
--- a/src/views/NodeDetail.vue
+++ b/src/views/NodeDetail.vue
@@ -10,7 +10,7 @@
class="ml-4 mr-5"
color="grey lighten-1"
>
- library_books
+ mdi-text-box-multiple
@@ -24,13 +24,13 @@
class="mx-4"
color="grey lighten-2"
>
- chevron_right
+ mdi-chevron-right
- timeline
+ mdi-chart-timeline-variant
- chevron_right
+ mdi-chevron-right
{{ type }}/{{ node }}
@@ -129,14 +129,14 @@
:disabled="!prevIncoming"
@click="firstPage('incoming')"
>
- skip_previous
+ mdi-skip-previous
- chevron_left
+ mdi-chevron-left
- chevron_right
+ mdi-chevron-right
- skip_next
+ mdi-skip-next
@@ -194,14 +194,14 @@
:disabled="!prevOutgoing"
@click="firstPage('outgoing')"
>
- skip_previous
+ mdi-skip-previous
- chevron_left
+ mdi-chevron-left
- chevron_right
+ mdi-chevron-right
- skip_next
+ mdi-skip-next
diff --git a/src/views/TableDetail.vue b/src/views/TableDetail.vue
index 2f751b2b..ea0ce9ef 100644
--- a/src/views/TableDetail.vue
+++ b/src/views/TableDetail.vue
@@ -25,7 +25,7 @@
>
- exit_to_app
+ mdi-exit-to-app
@@ -33,7 +33,7 @@
- chevron_right
+ mdi-chevron-right
@@ -58,7 +58,7 @@
>
- table_chart
+ mdi-table
@@ -81,7 +81,7 @@
class="ml-4 mr-5"
color="grey lighten-1"
>
- library_books
+ mdi-text-box-multiple
@@ -96,11 +96,11 @@
chevron_right
+ >mdi-chevron-right
table_chart
+ >mdi-table
{{ table }}
diff --git a/src/views/WorkspaceDetail.vue b/src/views/WorkspaceDetail.vue
index c5ae3456..916794de 100644
--- a/src/views/WorkspaceDetail.vue
+++ b/src/views/WorkspaceDetail.vue
@@ -12,7 +12,7 @@
class="ml-4 mr-5"
color="grey lighten-1"
>
- library_books
+ mdi-text-box-multiple
- edit
+ mdi-pencil
@@ -49,7 +49,7 @@
size="20px"
@click="cancelRename"
>
- close
+ mdi-close
diff --git a/src/vuetify.ts b/src/vuetify.ts
index ec413432..04affa7c 100644
--- a/src/vuetify.ts
+++ b/src/vuetify.ts
@@ -3,8 +3,4 @@ import Vuetify from 'vuetify/lib';
Vue.use(Vuetify);
-export default new Vuetify({
- icons: {
- iconfont: 'md',
- },
-});
+export default new Vuetify();
diff --git a/yarn.lock b/yarn.lock
index 33e205d7..37691366 100644
--- a/yarn.lock
+++ b/yarn.lock
@@ -5877,11 +5877,6 @@ matcher@^1.0.0:
dependencies:
escape-string-regexp "^1.0.4"
-material-design-icons-iconfont@^5.0.1:
- version "5.0.1"
- resolved "https://registry.yarnpkg.com/material-design-icons-iconfont/-/material-design-icons-iconfont-5.0.1.tgz#371875ed7fe9c8c520bc7123c3231feeab731c31"
- integrity sha512-Xg6rIdGrfySTqiTZ6d+nQbcFepS6R4uKbJP0oAqyeZXJY/bX6mZDnOmmUJusqLXfhIwirs0c++a6JpqVa8RFvA==
-
mdn-data@2.0.14:
version "2.0.14"
resolved "https://registry.yarnpkg.com/mdn-data/-/mdn-data-2.0.14.tgz#7113fc4281917d63ce29b43446f701e68c25ba50"
@@ -6111,6 +6106,11 @@ multimatch@^2.1.0:
arrify "^1.0.0"
minimatch "^3.0.0"
+multinet-components@^0.0.1:
+ version "0.0.1"
+ resolved "https://registry.yarnpkg.com/multinet-components/-/multinet-components-0.0.1.tgz#41c2e4c2e716ed37f9b54a6dc0ba03899c16d8e3"
+ integrity sha512-M8FSfeZetigiHbHz6bT0OTKT6aV3gzfNJODZGEBoVNp/axRk3aHTLfSJ86/KMxbl5guUvlj+z3n1lXc7yRSC4g==
+
multinet@0.21.7:
version "0.21.7"
resolved "https://registry.yarnpkg.com/multinet/-/multinet-0.21.7.tgz#657d1f42eff6b628b5472a3845b142644387f1cc"