From 60cac82b19ff65c96f224d83e0d9103de21f3417 Mon Sep 17 00:00:00 2001 From: Justin Georgi Date: Mon, 13 Nov 2023 10:01:20 -0700 Subject: [PATCH] Completed page structure and basic functionality Signed-off-by: Justin Georgi --- src/assets/icons/image.svg | 1 + src/assets/icons/videocam.svg | 1 + src/assets/icons/visibility.svg | 1 + src/assets/regions/abdpel.svg | 60 ++---------------- src/assets/regions/headneck.svg | 60 ++---------------- src/assets/regions/limb.svg | 66 +++----------------- src/assets/regions/thorax.svg | 104 ++------------------------------ src/components/app.vue | 39 +++++++----- src/css/app.css | 15 ++++- src/index.html | 2 +- src/js/app.js | 1 - src/js/routes.js | 50 +-------------- src/pages/about.vue | 19 +++--- src/pages/detect.vue | 102 ++++++++++++++++++++++--------- src/pages/home.vue | 38 ++---------- src/pages/request-and-load.vue | 25 -------- 16 files changed, 156 insertions(+), 428 deletions(-) create mode 100644 src/assets/icons/image.svg create mode 100644 src/assets/icons/videocam.svg create mode 100644 src/assets/icons/visibility.svg delete mode 100644 src/pages/request-and-load.vue diff --git a/src/assets/icons/image.svg b/src/assets/icons/image.svg new file mode 100644 index 0000000..4a1bc0b --- /dev/null +++ b/src/assets/icons/image.svg @@ -0,0 +1 @@ + \ No newline at end of file diff --git a/src/assets/icons/videocam.svg b/src/assets/icons/videocam.svg new file mode 100644 index 0000000..c6148ad --- /dev/null +++ b/src/assets/icons/videocam.svg @@ -0,0 +1 @@ + \ No newline at end of file diff --git a/src/assets/icons/visibility.svg b/src/assets/icons/visibility.svg new file mode 100644 index 0000000..85a29bf --- /dev/null +++ b/src/assets/icons/visibility.svg @@ -0,0 +1 @@ + \ No newline at end of file diff --git a/src/assets/regions/abdpel.svg b/src/assets/regions/abdpel.svg index 9cb271f..6002647 100644 --- a/src/assets/regions/abdpel.svg +++ b/src/assets/regions/abdpel.svg @@ -1,56 +1,8 @@ - + - - - - - - - - + + + + + diff --git a/src/assets/regions/headneck.svg b/src/assets/regions/headneck.svg index 2276baf..94f743e 100644 --- a/src/assets/regions/headneck.svg +++ b/src/assets/regions/headneck.svg @@ -1,56 +1,8 @@ - + - - - - - - - - + + + + + diff --git a/src/assets/regions/limb.svg b/src/assets/regions/limb.svg index bc70713..ea8752c 100644 --- a/src/assets/regions/limb.svg +++ b/src/assets/regions/limb.svg @@ -1,61 +1,9 @@ - + - - - - - - - - - + + + + + + diff --git a/src/assets/regions/thorax.svg b/src/assets/regions/thorax.svg index eb74ada..db1943c 100644 --- a/src/assets/regions/thorax.svg +++ b/src/assets/regions/thorax.svg @@ -1,100 +1,8 @@ - + - - - - - - - - - + + + + + diff --git a/src/components/app.vue b/src/components/app.vue index 1da5ca6..4a2e7ea 100644 --- a/src/components/app.vue +++ b/src/components/app.vue @@ -6,7 +6,10 @@ - Menu Settings Here + + Settings + About ALVINN + @@ -15,20 +18,22 @@ - - - - - - Close - - - -

Popup content goes here.

- - - - + + + + + + + + + + + + + + + + @@ -76,6 +81,10 @@ navbar: { mdCenterTitle: true, iosCenterTitle: true, + }, + // Dialog settings + dialog: { + title: 'ALVINN' } }; onMounted(() => { diff --git a/src/css/app.css b/src/css/app.css index fca73a9..8e73f1e 100644 --- a/src/css/app.css +++ b/src/css/app.css @@ -3,4 +3,17 @@ height: 100vh; } -/* Your app custom styles here */ \ No newline at end of file +/* Your app custom styles here */ +.view-main { + --f7-theme-color: #002F65; +} + + +.navbar { + --f7-navbar-text-color: #002F65; + --f7-navbar-link-color: #002F65; +} + +.navbar-bg { + --f7-navbar-bg-color: #BDBCAF; +} \ No newline at end of file diff --git a/src/index.html b/src/index.html index a90cf8a..f8ababe 100644 --- a/src/index.html +++ b/src/index.html @@ -10,7 +10,7 @@ * Disables use of inline scripts in order to mitigate risk of XSS vulnerabilities. To change this: * Enable inline JS: add 'unsafe-inline' to default-src --> - + diff --git a/src/js/app.js b/src/js/app.js index d989f8f..37ef7b9 100644 --- a/src/js/app.js +++ b/src/js/app.js @@ -13,7 +13,6 @@ import 'framework7/css/bundle'; // Import Icons and App Custom Styles import '../css/icons.css'; import '../css/app.css'; -import '../fonts/outlined.css'; // Import App Component import App from '../components/app.vue'; diff --git a/src/js/routes.js b/src/js/routes.js index 0a21850..4898bf6 100644 --- a/src/js/routes.js +++ b/src/js/routes.js @@ -4,7 +4,6 @@ import AboutPage from '../pages/about.vue'; import DetectPage from '../pages/detect.vue'; import DynamicRoutePage from '../pages/dynamic-route.vue'; -import RequestAndLoad from '../pages/request-and-load.vue'; import NotFoundPage from '../pages/404.vue'; var routes = [ @@ -17,7 +16,7 @@ var routes = [ component: AboutPage, }, { - path: '/detect/', + path: '/detect/:region/', component: DetectPage, }, @@ -26,53 +25,6 @@ var routes = [ path: '/dynamic-route/blog/:blogId/post/:postId/', component: DynamicRoutePage, }, - { - path: '/request-and-load/user/:userId/', - async: function ({ router, to, resolve }) { - // App instance - var app = router.app; - - // Show Preloader - app.preloader.show(); - - // User ID from request - var userId = to.params.userId; - - // Simulate Ajax Request - setTimeout(function () { - // We got user data from request - var user = { - firstName: 'Vladimir', - lastName: 'Kharlampidi', - about: 'Hello, i am creator of Framework7! Hope you like it!', - links: [ - { - title: 'Framework7 Website', - url: 'http://framework7.io', - }, - { - title: 'Framework7 Forum', - url: 'http://forum.framework7.io', - }, - ] - }; - // Hide Preloader - app.preloader.hide(); - - // Resolve route to load page - resolve( - { - component: RequestAndLoad, - }, - { - props: { - user: user, - } - } - ); - }, 1000); - }, - }, { path: '(.*)', component: NotFoundPage, diff --git a/src/pages/about.vue b/src/pages/about.vue index 4a7068d..6ecf0a1 100644 --- a/src/pages/about.vue +++ b/src/pages/about.vue @@ -1,22 +1,21 @@