Merge upstream ui with expand changes

Make layout expand to fill height of body
Merge branch 'main' into ui
2022-04-09 12:36:05 -05:00 · 2022-04-09 12:35:36 -05:00 · 2022-04-09 12:05:01 -05:00 · 2022-04-09 12:04:02 -05:00 · 2022-04-09 11:56:23 -05:00 · 2022-04-09 11:33:41 -05:00
13 changed files with 77 additions and 215 deletions
--- a/index.html
+++ b/index.html
@@ -6,7 +6,7 @@
    <meta name="viewport" content="width=device-width, initial-scale=1.0" />
    <title>Vite App</title>
  </head>
-  <body>
+  <body style="display: flex; height: 100%; min-height: 100vh; flex-direction: column">
    <div id="app"></div>
    <script type="module" src="/src/main.ts"></script>
  </body>
--- a/package.json
+++ b/package.json
@@ -17,7 +17,6 @@
  },
  "dependencies": {
    "@auth0/auth0-vue": "^1.0.0",
-    "@quasar/extras": "^1.13.5",
    "@types/katex": "^0.14.0",
    "@types/uuid": "^8.3.4",
    "@vuetify/vite-plugin": "1.0.0-alpha.10",
@@ -25,7 +24,6 @@
    "install": "^0.13.0",
    "katex": "^0.15.3",
    "mathjs": "^10.4.3",
-    "quasar": "^2.6.6",
    "uuid": "^8.3.2",
    "vue": "^3.2.25",
    "vue-router": "^4.0.14",
@@ -33,13 +31,11 @@
  },
  "devDependencies": {
    "@braks/revue-draggable": "^0.4.2",
-    "@quasar/vite-plugin": "^1.0.9",
    "@typescript-eslint/eslint-plugin": "^5.18.0",
    "@typescript-eslint/parser": "^5.18.0",
    "@vitejs/plugin-vue": "^2.3.1",
    "@volar/vue-language-service": "^0.33.9",
    "eslint": "^8.13.0",
-    "sass": "1.32.0",
    "typescript": "^4.5.4",
    "vite": "^2.9.0",
    "vue-tsc": "^0.33.9"
--- a/plugins/vuetify.ts
+++ b/plugins/vuetify.ts
@@ -0,0 +1,10 @@
+import 'vuetify/styles'
+import { createVuetify } from 'vuetify'
+
+export default createVuetify({
+    theme: {
+        defaultTheme: 'dark'
+      }
+}
+    
+)
--- a/pnpm-lock.yaml
+++ b/pnpm-lock.yaml
@@ -3,8 +3,6 @@ lockfileVersion: 5.3
 specifiers:
  '@auth0/auth0-vue': ^1.0.0
  '@braks/revue-draggable': ^0.4.2
-  '@quasar/extras': ^1.13.5
-  '@quasar/vite-plugin': ^1.0.9
  '@types/katex': ^0.14.0
  '@types/uuid': ^8.3.4
  '@typescript-eslint/eslint-plugin': ^5.18.0
@@ -17,8 +15,6 @@ specifiers:
  install: ^0.13.0
  katex: ^0.15.3
  mathjs: ^10.4.3
-  quasar: ^2.6.6
-  sass: 1.32.0
  typescript: ^4.5.4
  uuid: ^8.3.2
  vite: ^2.9.0
@@ -29,7 +25,6 @@ specifiers:

 dependencies:
  '@auth0/auth0-vue': 1.0.0_vue-router@4.0.14
-  '@quasar/extras': 1.13.5
  '@types/katex': 0.14.0
  '@types/uuid': 8.3.4
  '@vuetify/vite-plugin': 1.0.0-alpha.10_vite@2.9.1+vuetify@3.0.0-beta.0
@@ -37,7 +32,6 @@ dependencies:
  install: 0.13.0
  katex: 0.15.3
  mathjs: 10.4.3
-  quasar: 2.6.6
  uuid: 8.3.2
  vue: 3.2.31
  vue-router: 4.0.14_vue@3.2.31
@@ -45,15 +39,13 @@ dependencies:

 devDependencies:
  '@braks/revue-draggable': 0.4.2_vue@3.2.31
-  '@quasar/vite-plugin': 1.0.9_c0effa32a194597943674c123f9c6ed2
  '@typescript-eslint/eslint-plugin': 5.18.0_0dd9be2ba5ed9805045f3fec8be848f5
  '@typescript-eslint/parser': 5.18.0_eslint@8.13.0+typescript@4.6.3
  '@vitejs/plugin-vue': 2.3.1_vite@2.9.1+vue@3.2.31
  '@volar/vue-language-service': 0.33.9
  eslint: 8.13.0
-  sass: 1.32.0
  typescript: 4.6.3
-  vite: 2.9.1_sass@1.32.0
+  vite: 2.9.1
  vue-tsc: 0.33.9_typescript@4.6.3

 packages:
@@ -211,23 +203,6 @@ packages:
      fastq: 1.13.0
    dev: true

-  /@quasar/extras/1.13.5:
-    resolution: {integrity: sha512-H4X3jwqOJpDrn1Pof1mJIpoHdBrZQSR9ZpnQ7RCkJsJccpTyQzs8Q6ehVXfIZrco2kd3UPitRQqEiW7k45ckLg==}
-    dev: false
-
-  /@quasar/vite-plugin/1.0.9_c0effa32a194597943674c123f9c6ed2:
-    resolution: {integrity: sha512-i3tOXLu9SvBG/u/VH/vlPpwzU3QHVtogoSl23Y3i9Clgo6XCtm9mHB0XnQvsLQgNfUTkAKJPKnGwAPQd9uBu1A==}
-    engines: {node: '>=12'}
-    peerDependencies:
-      quasar: ^2.0.0
-      vite: ^2.0.0
-      vue: ^3.0.0
-    dependencies:
-      quasar: 2.6.6
-      vite: 2.9.1_sass@1.32.0
-      vue: 3.2.31
-    dev: true
-
  /@sindresorhus/is/0.14.0:
    resolution: {integrity: sha512-9NET910DNaIPngYnLLPeg+Ogzqsi9uM4mSboU5y6p8S5DzMTVEsJZrawi+BoDNUVBa2DhJqQYUFvMDfgU062LQ==}
    engines: {node: '>=6'}
@@ -537,7 +512,7 @@ packages:
      vite: ^2.5.10
      vue: ^3.2.25
    dependencies:
-      vite: 2.9.1_sass@1.32.0
+      vite: 2.9.1
      vue: 3.2.31
    dev: true

@@ -764,7 +739,7 @@ packages:
    dependencies:
      '@vuetify/loader-shared': 1.3.0_vuetify@3.0.0-beta.0
      debug: 4.3.4
-      vite: 2.9.1_sass@1.32.0
+      vite: 2.9.1
      vuetify: 3.0.0-beta.0_vue@3.2.31
    transitivePeerDependencies:
      - supports-color
@@ -877,14 +852,6 @@ packages:
      color-convert: 2.0.1
    dev: true

-  /anymatch/3.1.2:
-    resolution: {integrity: sha512-P43ePfOAIupkguHUycrc4qJ9kz8ZiuOUijaETwX7THt0Y/GNK7v0aa8rY816xWjZ7rJdA5XdMcpVFTKMq+RvWg==}
-    engines: {node: '>= 8'}
-    dependencies:
-      normalize-path: 3.0.0
-      picomatch: 2.3.1
-    dev: true
-
  /argparse/1.0.10:
    resolution: {integrity: sha512-o5Roy6tNG4SL/FOkCAN6RzjiakZS25RLYFrcMttJqbdd8BWrnA+fGz57iN5Pb06pvBGvl5gQ0B48dJlslXvoTg==}
    dependencies:
@@ -937,11 +904,6 @@ packages:
    resolution: {integrity: sha512-3oSeUO0TMV67hN1AmbXsK4yaqU7tjiHlbxRDZOpH0KW9+CeX4bRAaX0Anxt0tx2MrpRpWwQaPwIlISEJhYU5Pw==}
    dev: true

-  /binary-extensions/2.2.0:
-    resolution: {integrity: sha512-jDctJ/IVQbZoJykoeHbhXpOlNBqGNcwXJKJog42E5HDPUwQTSdjCHdihjj0DlnheQ7blbT6dHOafNAiS8ooQKA==}
-    engines: {node: '>=8'}
-    dev: true
-
  /boxen/3.2.0:
    resolution: {integrity: sha512-cU4J/+NodM3IHdSL2yN8bqYqnmlBTidDR4RC7nJs61ZmtGz8VZzM3HLQX0zY5mrSmPtR3xWwsq2jOUQqFZN8+A==}
    engines: {node: '>=6'}
@@ -1069,21 +1031,6 @@ packages:
      is-regex: 1.1.4
    dev: true

-  /chokidar/3.5.3:
-    resolution: {integrity: sha512-Dr3sfKRP6oTcjf2JmUmFJfeVMvXBdegxB0iVQ5eb2V10uFJUCAS8OByZdVAyVb8xXNz3GjjTgj9kLWsZTqE6kw==}
-    engines: {node: '>= 8.10.0'}
-    dependencies:
-      anymatch: 3.1.2
-      braces: 3.0.2
-      glob-parent: 5.1.2
-      is-binary-path: 2.1.0
-      is-glob: 4.0.3
-      normalize-path: 3.0.0
-      readdirp: 3.6.0
-    optionalDependencies:
-      fsevents: 2.3.2
-    dev: true
-
  /ci-info/2.0.0:
    resolution: {integrity: sha512-5tK7EtrZ0N+OLFMthtqOj4fI2Jeb88C4CAZPu25LDVUgXJ0A3Js4PMGqrn0JU1W0Mh1/Z8wZzYPxqUrXeBboCQ==}
    dev: true
@@ -2169,13 +2116,6 @@ packages:
    resolution: {integrity: sha1-d8mYQFJ6qOyxqLppe4BkWnqSap0=}
    dev: true

-  /is-binary-path/2.1.0:
-    resolution: {integrity: sha512-ZMERYes6pDydyuGidse7OsHxtbI7WVeUEozgR/g7rd0xUimYNlvZRE/K2MgZTjWy725IfelLeVcEM97mmtRGXw==}
-    engines: {node: '>=8'}
-    dependencies:
-      binary-extensions: 2.2.0
-    dev: true
-
  /is-buffer/2.0.5:
    resolution: {integrity: sha512-i2R6zNFDwgEHJyQUtJEk0XFi1i0dPFn/oqjK3/vPCcDeJvW5NQ83V8QbicfF1SupOaB0h8ntgBC2YiE7dfyctQ==}
    engines: {node: '>=4'}
@@ -2646,11 +2586,6 @@ packages:
      validate-npm-package-license: 3.0.4
    dev: true

-  /normalize-path/3.0.0:
-    resolution: {integrity: sha512-6eZs5Ls3WtCisHWp9S2GUy8dqkpGi4BVSz3GaqiE6ezub0512ESztXUwUB6C6IKbQkY2Pnb/mD4WYojCRwcwLA==}
-    engines: {node: '>=0.10.0'}
-    dev: true
-
  /normalize-url/4.5.1:
    resolution: {integrity: sha512-9UZCFRHQdNrfTpGg8+1INIg93B6zE0aXMVFkw1WFwvO4SlZywU6aLg5Of0Ap/PgcbSw4LNxvMWXMeugwMCX0AA==}
    engines: {node: '>=8'}
@@ -3001,11 +2936,6 @@ packages:
    engines: {node: '>=6'}
    dev: true

-  /quasar/2.6.6:
-    resolution: {integrity: sha512-rXoGZROOXVutQX14l/ys0te/NrgQ754krI0Vz52pBXdznyS+dTL6AgGpr3JMwffoxpxhQyedrL2jOAMpq+Jsgw==}
-    engines: {node: '>= 10.18.1', npm: '>= 6.13.4', yarn: '>= 1.21.1'}
-    dev: false
-
  /queue-microtask/1.2.3:
    resolution: {integrity: sha512-NuaNSa6flKT5JaSYQzJok04JzTL1CA6aGhv5rfLW3PgqA+M2ChpZQnAC8h8i4ZFkBS8X5RqkDBHA7r4hej3K9A==}
    dev: true
@@ -3078,13 +3008,6 @@ packages:
      util-deprecate: 1.0.2
    dev: true

-  /readdirp/3.6.0:
-    resolution: {integrity: sha512-hOS089on8RduqdbhvQ5Z37A0ESjsqz6qnRcffsMU3495FuTdqSm+7bhJ29JvIOsBDEEnan5DPu9t3To9VRlMzA==}
-    engines: {node: '>=8.10.0'}
-    dependencies:
-      picomatch: 2.3.1
-    dev: true
-
  /redent/2.0.0:
    resolution: {integrity: sha1-wbIAe0LVfrE4kHmzyDM2OdXhzKo=}
    engines: {node: '>=4'}
@@ -3208,14 +3131,6 @@ packages:
      suf-regex: 0.3.4
    dev: true

-  /sass/1.32.0:
-    resolution: {integrity: sha512-fhyqEbMIycQA4blrz/C0pYhv2o4x2y6FYYAH0CshBw3DXh5D5wyERgxw0ptdau1orc/GhNrhF7DFN2etyOCEng==}
-    engines: {node: '>=8.9.0'}
-    hasBin: true
-    dependencies:
-      chokidar: 3.5.3
-    dev: true
-
  /seedrandom/3.0.5:
    resolution: {integrity: sha512-8OwmbklUNzwezjGInmZ+2clQmExQPvomqjL7LFqOYqtmuxRgQYqOD3mHaU+MvZn5FLUeVxVfQjwLZW/n/JFuqg==}
    dev: false
@@ -3813,7 +3728,7 @@ packages:
      vfile-message: 2.0.4
    dev: true

-  /vite/2.9.1_sass@1.32.0:
+  /vite/2.9.1:
    resolution: {integrity: sha512-vSlsSdOYGcYEJfkQ/NeLXgnRv5zZfpAsdztkIrs7AZHV8RCMZQkwjo4DS5BnrYTqoWqLoUe1Cah4aVO4oNNqCQ==}
    engines: {node: '>=12.2.0'}
    hasBin: true
@@ -3833,7 +3748,6 @@ packages:
      postcss: 8.4.12
      resolve: 1.22.0
      rollup: 2.70.1
-      sass: 1.32.0
    optionalDependencies:
      fsevents: 2.3.2
    dev: true
--- a/src/App.vue
+++ b/src/App.vue
@@ -1,38 +1,25 @@
 <script setup lang="ts">
-import Home from "./pages/Login.vue";
-// This starter template is using Vue 3 <script setup> SFCs
-// Check out https://v3.vuejs.org/api/sfc-script-setup.html#sfc-script-setup
-import HelloWorld from "./components/HelloWorld.vue";
 import { MathStatement } from "./support/parse";
 import { MathPage } from "./support/page";
-import { ref } from "vue";
-
 (window as any).Stmt = MathStatement;
 (window as any).Pg = MathPage;
+
 </script>

 <template>
-  <q-layout view="hHr LpR fFf">
-    <q-header elevated class="bg-primary text-white" height-hint="98">
-      <q-toolbar>
-        <q-toolbar-title>
-          <q-avatar>
-            <img src="https://cdn.quasar.dev/logo-v2/svg/logo-mono-white.svg" />
-          </q-avatar>
-          Title
-        </q-toolbar-title>
-      </q-toolbar>
+  <v-app>
+    <v-app-bar height="30" elevation="0">
+      <div id="nav">
+        <router-link class="links" to="/">Home</router-link> |
+        <router-link class="links" to="/scratch">Scratch Testing</router-link> |
+        <router-link class="links" to="/editor">Editor</router-link>
+      </div>
+    </v-app-bar>

-      <q-tabs align="left">
-        <q-route-tab to="/Scratch" label="Scratch" />
-        <q-route-tab to="/Editor" label="Editor" />
-      </q-tabs>
-    </q-header>
-
-    <q-page-container>
+    <div style="margin-top: 30px">  <!-- Account for the navbar height -->
      <router-view/>
-    </q-page-container>
-  </q-layout>
+    </div>
+  </v-app>
 </template>

 <style>
@@ -41,7 +28,14 @@ import { ref } from "vue";
  -webkit-font-smoothing: antialiased;
  -moz-osx-font-smoothing: grayscale;
  text-align: center;
-  color: #2c3e50;
-  margin-top: 60px;
+  display: flex;
+  flex-direction: column;
+  flex: 1;
+}
+.links {
+  color: #fff;
+}
+.links:visited {
+  color: #fff;
 }
 </style>
--- a/src/components/Editor.vue
+++ b/src/components/Editor.vue
@@ -0,0 +1,15 @@
+<script setup>
+</script>
+
+<template>
+ <v-navigation-drawer width="100" permanent>
+
+ </v-navigation-drawer>
+
+           <Draggable>
+            <div class="box">I use a wrapper</div>
+            </Draggable>
+</template>
+
+<style>
+</style>
--- a/src/components/Home.vue
+++ b/src/components/Home.vue
--- a/src/components/Scratch.vue
+++ b/src/components/Scratch.vue
@@ -1,7 +1,7 @@
 <script setup lang="ts">
  import {MathPage} from '../support/page'
  import {v4 as uuidv4} from 'uuid'
-  import Statement from '../components/Statement.vue'
+  import Statement from './Statement.vue'
  import {MathStatement} from '../support/parse'

  const page = new MathPage(uuidv4())
--- a/src/main.ts
+++ b/src/main.ts
@@ -1,54 +1,27 @@
-/*
--------------------------------------------------
-                    Vue Helpers
--------------------------------------------------
-*/
 import { createApp } from 'vue'
-
-import router from './router'
-
-/*
--------------------------------------------------
-                    App UI
--------------------------------------------------
-*/
-import { Quasar } from 'quasar'
-
-// Import icon libraries
-import '@quasar/extras/roboto-font-latin-ext/roboto-font-latin-ext.css'
-import '@quasar/extras/material-icons/material-icons.css'
-import '@quasar/extras/fontawesome-v6/fontawesome-v6.css'
-
-// A few examples for animations from Animate.css:
-// import @quasar/extras/animate/fadeIn.css
-// import @quasar/extras/animate/fadeOut.css
-
-// Import Quasar css
-import 'quasar/src/css/index.sass'
-
-/*
--------------------------------------------------
-                    Plugins
--------------------------------------------------
-*/
+import App from './App.vue'
 import { DraggablePlugin } from '@braks/revue-draggable'
 import { createAuth0 } from '@auth0/auth0-vue'
+import router from './router'

+import 'vuetify/styles' // Global CSS has to be imported
+import { createVuetify } from 'vuetify'
+import * as components from 'vuetify/components'
+import * as directives from 'vuetify/directives'
 import 'katex/dist/katex.min.css'
 import 'katex/dist/contrib/auto-render.min'

-/*
--------------------------------------------------
-                    Components
--------------------------------------------------
-*/
-import App from './App.vue'
+

 const app = createApp(App)
-
-app.use(Quasar, {
-    plugins: {}, // import Quasar plugins and add here
-})
+const vuetify = createVuetify({
+    components,
+    directives,
+    theme: {
+        defaultTheme: 'dark',
+    },
+}) // Replaces new Vuetify(...)
+app.use(vuetify)

 app.use(
    createAuth0({
@@ -60,5 +33,5 @@ app.use(

 app.use(router)

-app.use(DraggablePlugin)
+app.use(DraggablePlugin);
 app.mount('#app')
--- a/src/pages/Editor.vue
+++ b/src/pages/Editor.vue
@@ -1,19 +0,0 @@
-<script setup lang="ts">
-  
-</script>
-
-<template>
-
-    <Draggable>
-    <div class="box">
-
-    <q-btn
-        @click="showNotification"
-        color="primary"
-        label="Show another notification"
-        />
-    </div>
-  </Draggable>
-</template>
-
-<style></style>
--- a/src/quasar-variables.sass
+++ b/src/quasar-variables.sass
@@ -1,10 +0,0 @@
-$primary   : #1976D2
-$secondary : #26A69A
-$accent    : #9C27B0
-
-$dark      : #1D1D1D
-
-$positive  : #21BA45
-$negative  : #C10015
-$info      : #31CCEC
-$warning   : #F2C037
--- a/src/router.ts
+++ b/src/router.ts
@@ -1,5 +1,5 @@
 import { createRouter, createWebHistory } from 'vue-router'
-import Home from './pages/Login.vue'
+import Home from './components/Home.vue'

 const routes = [
    {
@@ -10,12 +10,13 @@ const routes = [
    {
        path: '/scratch',
        name: 'Scratch',
-        component: () => import(/* webpackChunkName: "scratch" */ './pages/Scratch.vue'),
+        component: () => import(/* webpackChunkName: "scratch" */ './components/Scratch.vue'),
    },
+
    {
        path: '/editor',
        name: 'Editor',
-        component: () => import('./pages/Editor.vue'),
+        component: () => import(/* webpackChunkName: "scratch" */ './components/Editor.vue'),
    },
 ]

--- a/vite.config.ts
+++ b/vite.config.ts
@@ -1,22 +1,10 @@
 import { defineConfig } from 'vite'
 import vue from '@vitejs/plugin-vue'
-import { quasar, transformAssetUrls } from '@quasar/vite-plugin'
+import vuetify from '@vuetify/vite-plugin'

 // https://vitejs.dev/config/
 export default defineConfig({
-    server: {
-        proxy: {
-            '/api': {
-                target: 'http://localhost:8000/',
-            },
-        },
-    },
-    plugins: [
-      vue({
-          template: { transformAssetUrls },
-      }),
-
-      quasar({
-          sassVariables: 'src/quasar-variables.sass',
-      }),]
+    plugins: [vue(),
+        vuetify({ autoImport: true }), // Enabled by default
+    ],
 })
Author	SHA1	Message	Date
garrettmills	4f433e7bf9	Merge upstream ui with expand changes	2022-04-09 12:36:05 -05:00
garrettmills	2fd0107197	Make layout expand to fill height of body	2022-04-09 12:35:36 -05:00
Thomas	35d7cd817f	Merge branch 'main' into ui	2022-04-09 12:05:01 -05:00
Thomas	af3d940cec	inital dragable working	2022-04-09 12:04:02 -05:00
Thomas	2c059a655e	begain working on themeing	2022-04-09 11:56:23 -05:00
Thomas	59ce598023	added app bar	2022-04-09 11:33:41 -05:00
Thomas	43e067d5f0	Merge branch 'main' into ui	2022-04-09 11:02:05 -05:00
Thomas	fc31598dbb	working on vueify	2022-04-09 11:00:05 -05:00