From 18c458d91ca5e7187ffb3615fca8970fc6e4ca65 Mon Sep 17 00:00:00 2001 From: ivarlovlie Date: Mon, 6 Jun 2022 15:48:53 +0200 Subject: feat: More work on portal --- apps/frontpage/package.json | 4 +- apps/frontpage/pnpm-lock.yaml | 122 ++++++++++++++++++++ apps/frontpage/src/app.html | 2 + apps/frontpage/src/hooks.ts | 7 ++ apps/frontpage/src/routes/__layout-docs.svelte | 7 ++ apps/frontpage/src/routes/__layout.svelte | 5 + apps/frontpage/src/routes/app.scss | 1 + apps/frontpage/static/pre.css | 128 +++++++++++++++++++++ apps/frontpage/svelte.config.js | 2 + apps/portal/src/app/components/user-menu.svelte | 70 +++++++++++ apps/portal/src/app/index.scss | 4 + apps/portal/src/app/index.svelte | 35 +++++- apps/portal/src/app/pages/_layout.svelte | 3 +- apps/portal/src/app/pages/_layout@loggedin.svelte | 69 +++++++++++ apps/portal/src/app/pages/home.svelte | 72 ++++++++++++ apps/portal/src/app/pages/login.svelte | 8 +- apps/portal/src/app/pages/profile/index.svelte | 16 +++ apps/portal/src/package.json | 2 + apps/portal/src/pnpm-lock.yaml | 15 +++ apps/portal/src/tsconfig.json | 3 - apps/projects/src/app/index.svelte | 3 +- apps/projects/src/app/lib/services/user-service.ts | 21 ++-- .../src/components/breadcrumb/bread.svelte | 9 ++ .../src/components/breadcrumb/crumb.svelte | 22 ++++ apps/web-shared/src/components/breadcrumb/index.ts | 7 ++ apps/web-shared/src/components/link-card.svelte | 47 ++++++++ apps/web-shared/src/components/menu/menu.svelte | 2 +- .../src/components/theme-switcher.svelte | 71 +++++++++--- apps/web-shared/src/components/user-menu.svelte | 99 ++++++++++++++++ apps/web-shared/src/lib/helpers.ts | 4 +- apps/web-shared/src/lib/session.ts | 8 +- .../src/styles/components/auto-sized-grid.scss | 56 +++++++++ .../src/styles/components/breadcrumbs.scss | 18 +++ .../src/styles/components/link-card.scss | 56 +++++++++ .../src/styles/components/user-menu.scss | 8 +- 35 files changed, 948 insertions(+), 58 deletions(-) create mode 100644 apps/frontpage/src/hooks.ts create mode 100644 apps/frontpage/static/pre.css create mode 100644 apps/portal/src/app/components/user-menu.svelte create mode 100644 apps/portal/src/app/pages/_layout@loggedin.svelte create mode 100644 apps/portal/src/app/pages/home.svelte create mode 100644 apps/portal/src/app/pages/profile/index.svelte create mode 100644 apps/web-shared/src/components/breadcrumb/bread.svelte create mode 100644 apps/web-shared/src/components/breadcrumb/crumb.svelte create mode 100644 apps/web-shared/src/components/breadcrumb/index.ts create mode 100644 apps/web-shared/src/components/link-card.svelte create mode 100644 apps/web-shared/src/components/user-menu.svelte create mode 100644 apps/web-shared/src/styles/components/auto-sized-grid.scss create mode 100644 apps/web-shared/src/styles/components/breadcrumbs.scss create mode 100644 apps/web-shared/src/styles/components/link-card.scss diff --git a/apps/frontpage/package.json b/apps/frontpage/package.json index cde11de..6943b38 100644 --- a/apps/frontpage/package.json +++ b/apps/frontpage/package.json @@ -15,7 +15,9 @@ "@sveltejs/adapter-static": "1.0.0-next.34", "@sveltejs/kit": "next", "sass": "^1.52.2", - "svelte": "^3.44.0" + "svelte": "^3.44.0", + "svelte-preprocess": "^4.10.7", + "typescript": "^4.7.3" }, "type": "module" } \ No newline at end of file diff --git a/apps/frontpage/pnpm-lock.yaml b/apps/frontpage/pnpm-lock.yaml index 5b1b562..a80546e 100644 --- a/apps/frontpage/pnpm-lock.yaml +++ b/apps/frontpage/pnpm-lock.yaml @@ -7,6 +7,8 @@ specifiers: '@sveltejs/kit': next sass: ^1.52.2 svelte: ^3.44.0 + svelte-preprocess: ^4.10.7 + typescript: ^4.7.3 devDependencies: '@playwright/test': 1.22.2 @@ -15,6 +17,8 @@ devDependencies: '@sveltejs/kit': 1.0.0-next.348_sass@1.52.2+svelte@3.48.0 sass: 1.52.2 svelte: 3.48.0 + svelte-preprocess: 4.10.7_qkexsrbgfwouorfsttztq6wl2m + typescript: 4.7.3 packages: @@ -147,6 +151,16 @@ packages: resolution: {integrity: sha512-UXdBxNGqTMtm7hCwh9HtncFVLrXoqA3oJW30j6XWp5BH/wu3mVeaxo7cq5benFdBw34HB3XDT2TRPI7rXZ+mDg==} dev: true + /@types/pug/2.0.6: + resolution: {integrity: sha512-SnHmG9wN1UVmagJOnyo/qkk0Z7gejYxOYYmaAwr5u2yFYfsupN3sg10kyzN8Hep/2zbHxCnsumxOoRIRMBwKCg==} + dev: true + + /@types/sass/1.43.1: + resolution: {integrity: sha512-BPdoIt1lfJ6B7rw35ncdwBZrAssjcwzI5LByIrYs+tpXlj/CAkuVdRsgZDdP4lq5EjyWzwxZCqAoFyHKFwp32g==} + dependencies: + '@types/node': 17.0.40 + dev: true + /@vercel/nft/0.19.1: resolution: {integrity: sha512-klR5oN7S3WJsZz0r6Xsq7o8YlFEyU3/00VmlpZzIPVFzKfbcEjXo/sVR5lQBUqNKuOzhcbxaFtzW9aOyHjmPYA==} hasBin: true @@ -256,6 +270,10 @@ packages: fill-range: 7.0.1 dev: true + /buffer-crc32/0.2.13: + resolution: {integrity: sha512-VO9Ht/+p3SN7SKWqcrgEzjGbRSJYTx+Q1pTQC0wrWqHx0vpJraQ6GtHx8tvcg1rlK1byhU5gccxgOgj7B0TDkQ==} + dev: true + /chokidar/3.5.3: resolution: {integrity: sha512-Dr3sfKRP6oTcjf2JmUmFJfeVMvXBdegxB0iVQ5eb2V10uFJUCAS8OByZdVAyVb8xXNz3GjjTgj9kLWsZTqE6kw==} engines: {node: '>= 8.10.0'} @@ -339,6 +357,11 @@ packages: resolution: {integrity: sha512-bd2L678uiWATM6m5Z1VzNCErI3jiGzt6HGY8OVICs40JQq/HALfbyNJmp0UDakEY4pMMaN0Ly5om/B1VI/+xfQ==} dev: true + /detect-indent/6.1.0: + resolution: {integrity: sha512-reYkTUJAZb9gUuZ2RvVCNhVHdg62RHnJ7WJl8ftMi4diZ6NWlciOzQN88pUhSELEwflJht4oQDv0F0BMlwaYtA==} + engines: {node: '>=8'} + dev: true + /detect-libc/1.0.3: resolution: {integrity: sha512-pGjwhsmsp4kL2RTz08wcOlGN83otlqHeD/Z5T8GXZB+/YcpQ/dgo+lbU8ZsGxV0HIvqqxo9l7mqYwyYMD9bKDg==} engines: {node: '>=0.10'} @@ -354,6 +377,10 @@ packages: resolution: {integrity: sha512-MSjYzcWNOA0ewAHpz0MxpYFvwg6yjy1NG3xteoqz644VCo/RPgnr1/GGt+ic3iJTzQ8Eu3TdM14SawnVUmGE6A==} dev: true + /es6-promise/3.3.1: + resolution: {integrity: sha512-SOp9Phqvqn7jtEUxPWdWfWoLmyt2VaJ6MpvP9Comy1MceMXqE6bxvaTu4iaxpYYPzhny28Lc+M87/c2cPK6lDg==} + dev: true + /esbuild-android-64/0.14.42: resolution: {integrity: sha512-P4Y36VUtRhK/zivqGVMqhptSrFILAGlYp0Z8r9UQqHJ3iWztRCNWnlBzD9HRx0DbueXikzOiwyOri+ojAFfW6A==} engines: {node: '>=12'} @@ -779,6 +806,12 @@ packages: yallist: 4.0.0 dev: true + /magic-string/0.25.9: + resolution: {integrity: sha512-RmF0AsMzgt25qzqqLc1+MbHmhdx0ojF2Fvs4XnOqz2ZOBXzzkEwc/dJQZCYHAn7v1jbVOjAZfK8msRn4BxO4VQ==} + dependencies: + sourcemap-codec: 1.4.8 + dev: true + /magic-string/0.26.2: resolution: {integrity: sha512-NzzlXpclt5zAbmo6h6jNc8zl2gNRGHvmsZW4IvZhTC4W7k4OlLP+S5YLussa/r3ixNT66KOQfNORlXHSOy/X4A==} engines: {node: '>=12'} @@ -801,6 +834,11 @@ packages: picomatch: 2.3.1 dev: true + /min-indent/1.0.1: + resolution: {integrity: sha512-I9jwMn07Sy/IwOj3zVkVik2JTvgpaykDZEigL6Rx6N9LbMywwUSMtxET+7lVoDLLd3O3IXwJwvuuns8UB/HeAg==} + engines: {node: '>=4'} + dev: true + /minimatch/3.1.2: resolution: {integrity: sha512-J7p63hRiAjw1NDEww1W7i37+ByIrOWO5XQQAzZ3VOcL0PNybwpfmV/N05zFAzwQ9USyEcX6t3UO+K5aqBQOIHw==} dependencies: @@ -1155,6 +1193,15 @@ packages: resolution: {integrity: sha512-YZo3K82SD7Riyi0E1EQPojLz7kpepnSQI9IyPbHHg1XXXevb5dJI7tpyN2ADxGcQbHG7vcyRHk0cbwqcQriUtg==} dev: true + /sander/0.5.1: + resolution: {integrity: sha1-dB4kXiMfB8r7b98PEzrfohalAq0=} + dependencies: + es6-promise: 3.3.1 + graceful-fs: 4.2.10 + mkdirp: 0.5.6 + rimraf: 2.7.1 + dev: true + /sass/1.52.2: resolution: {integrity: sha512-mfHB2VSeFS7sZlPv9YohB9GB7yWIgQNTGniQwfQ04EoQN0wsQEv7SwpCwy/x48Af+Z3vDeFXz+iuXM3HK/phZQ==} engines: {node: '>=12.0.0'} @@ -1199,6 +1246,16 @@ packages: resolution: {integrity: sha512-wnD2ZE+l+SPC/uoS0vXeE9L1+0wuaMqKlfz9AMUo38JsyLSBWSFcHR1Rri62LZc12vLr1gb3jl7iwQhgwpAbGQ==} dev: true + /sorcery/0.10.0: + resolution: {integrity: sha1-iukK19fLBfxZ8asMY3hF1cFaUrc=} + hasBin: true + dependencies: + buffer-crc32: 0.2.13 + minimist: 1.2.6 + sander: 0.5.1 + sourcemap-codec: 1.4.8 + dev: true + /source-map-js/1.0.2: resolution: {integrity: sha512-R0XvVJ9WusLiqTCEiGCmICCMplcCkIwwR11mOSD9CR5u+IXYdiseeEuXCVAjS54zqwkLcPNnmU4OeJ6tUrWhDw==} engines: {node: '>=0.10.0'} @@ -1252,6 +1309,13 @@ packages: ansi-regex: 5.0.1 dev: true + /strip-indent/3.0.0: + resolution: {integrity: sha512-laJTa3Jb+VQpaC6DseHhF7dXVqHTfJPCRDaEbid/drOhgitgYku/letMUqOXFoWV0zIIUbjpdH2t+tYj4bQMRQ==} + engines: {node: '>=8'} + dependencies: + min-indent: 1.0.1 + dev: true + /strip-json-comments/2.0.1: resolution: {integrity: sha1-PFMZQukIwml8DsNEhYwobHygpgo=} engines: {node: '>=0.10.0'} @@ -1271,6 +1335,58 @@ packages: svelte: 3.48.0 dev: true + /svelte-preprocess/4.10.7_qkexsrbgfwouorfsttztq6wl2m: + resolution: {integrity: sha512-sNPBnqYD6FnmdBrUmBCaqS00RyCsCpj2BG58A1JBswNF7b0OKviwxqVrOL/CKyJrLSClrSeqQv5BXNg2RUbPOw==} + engines: {node: '>= 9.11.2'} + requiresBuild: true + peerDependencies: + '@babel/core': ^7.10.2 + coffeescript: ^2.5.1 + less: ^3.11.3 || ^4.0.0 + node-sass: '*' + postcss: ^7 || ^8 + postcss-load-config: ^2.1.0 || ^3.0.0 || ^4.0.0 + pug: ^3.0.0 + sass: ^1.26.8 + stylus: ^0.55.0 + sugarss: ^2.0.0 + svelte: ^3.23.0 + typescript: ^3.9.5 || ^4.0.0 + peerDependenciesMeta: + '@babel/core': + optional: true + coffeescript: + optional: true + less: + optional: true + node-sass: + optional: true + postcss: + optional: true + postcss-load-config: + optional: true + pug: + optional: true + sass: + optional: true + stylus: + optional: true + sugarss: + optional: true + typescript: + optional: true + dependencies: + '@types/pug': 2.0.6 + '@types/sass': 1.43.1 + detect-indent: 6.1.0 + magic-string: 0.25.9 + sass: 1.52.2 + sorcery: 0.10.0 + strip-indent: 3.0.0 + svelte: 3.48.0 + typescript: 4.7.3 + dev: true + /svelte/3.48.0: resolution: {integrity: sha512-fN2YRm/bGumvjUpu6yI3BpvZnpIm9I6A7HR4oUNYd7ggYyIwSA/BX7DJ+UXXffLp6XNcUijyLvttbPVCYa/3xQ==} engines: {node: '>= 8'} @@ -1319,6 +1435,12 @@ packages: resolution: {integrity: sha1-gYT9NH2snNwYWZLzpmIuFLnZq2o=} dev: true + /typescript/4.7.3: + resolution: {integrity: sha512-WOkT3XYvrpXx4vMMqlD+8R8R37fZkjyLGlxavMc4iB8lrl8L0DeTcHbYgw/v0N/z9wAFsgBhcsF0ruoySS22mA==} + engines: {node: '>=4.2.0'} + hasBin: true + dev: true + /util-deprecate/1.0.2: resolution: {integrity: sha1-RQ1Nyfpw3nMnYvvS1KKJgUGaDM8=} dev: true diff --git a/apps/frontpage/src/app.html b/apps/frontpage/src/app.html index 5893110..e46fbe3 100644 --- a/apps/frontpage/src/app.html +++ b/apps/frontpage/src/app.html @@ -4,6 +4,8 @@ +
+
+ +
+
diff --git a/apps/frontpage/src/routes/__layout.svelte b/apps/frontpage/src/routes/__layout.svelte index f1a7eaa..ea37fe7 100644 --- a/apps/frontpage/src/routes/__layout.svelte +++ b/apps/frontpage/src/routes/__layout.svelte @@ -1,5 +1,6 @@ + + + + +
+ replace("/profile")}> + Profile + + + on_logout()}> + Logout + +
+ diff --git a/apps/portal/src/app/index.scss b/apps/portal/src/app/index.scss index dd4ddb6..8633a7d 100644 --- a/apps/portal/src/app/index.scss +++ b/apps/portal/src/app/index.scss @@ -20,3 +20,7 @@ @use '../../web-shared/src/styles/components/alert'; @use '../../web-shared/src/styles/components/details'; @use '../../web-shared/src/styles/components/light-dark-switch'; +@use '../../web-shared/src/styles/components/link-card'; +@use '../../web-shared/src/styles/components/auto-sized-grid'; +@use '../../web-shared/src/styles/components/menu'; +@use '../../web-shared/src/styles/components/user-menu'; diff --git a/apps/portal/src/app/index.svelte b/apps/portal/src/app/index.svelte index 0082aa2..fe143bc 100644 --- a/apps/portal/src/app/index.svelte +++ b/apps/portal/src/app/index.svelte @@ -2,32 +2,54 @@ - +
diff --git a/apps/portal/src/app/pages/_layout@loggedin.svelte b/apps/portal/src/app/pages/_layout@loggedin.svelte new file mode 100644 index 0000000..72515df --- /dev/null +++ b/apps/portal/src/app/pages/_layout@loggedin.svelte @@ -0,0 +1,69 @@ + + + + +
+
+ +
+ +
+ + +
+ + +
diff --git a/apps/portal/src/app/pages/home.svelte b/apps/portal/src/app/pages/home.svelte new file mode 100644 index 0000000..b9b9829 --- /dev/null +++ b/apps/portal/src/app/pages/home.svelte @@ -0,0 +1,72 @@ + + + +
+
+

Hello {session.profile?.username}

+

This is your portal to Greatoffice, here you will find all your great apps and management options.

+
+
+

Apps

+
+ +
+
+ +
+
+ +
+
+
+

Manage

+
+ push("/profile")}> +
+
+ +
+
+ + {#if showUsers} + +
+
+ +
+
+ + {/if} +
+
+
+ diff --git a/apps/portal/src/app/pages/login.svelte b/apps/portal/src/app/pages/login.svelte index 2822be0..db010d2 100644 --- a/apps/portal/src/app/pages/login.svelte +++ b/apps/portal/src/app/pages/login.svelte @@ -1,7 +1,7 @@ + Go to {frontpage_base()}
diff --git a/apps/portal/src/app/pages/profile/index.svelte b/apps/portal/src/app/pages/profile/index.svelte new file mode 100644 index 0000000..0929c3c --- /dev/null +++ b/apps/portal/src/app/pages/profile/index.svelte @@ -0,0 +1,16 @@ + + + + + push("/")}/> + + +

Profile

+ diff --git a/apps/portal/src/package.json b/apps/portal/src/package.json index e969c4e..64af86e 100644 --- a/apps/portal/src/package.json +++ b/apps/portal/src/package.json @@ -8,8 +8,10 @@ }, "devDependencies": { "@sveltejs/vite-plugin-svelte": "1.0.0-next.43", + "install": "^0.13.0", "sass": "^1.51.0", "svelte": "^3.48.0", + "svelte-feather-icons": "^4.0.0", "svelte-preprocess": "^4.10.6", "svelte-spa-router": "^3.2.0", "typescript": "4.6.4", diff --git a/apps/portal/src/pnpm-lock.yaml b/apps/portal/src/pnpm-lock.yaml index 3b56115..0c6d187 100644 --- a/apps/portal/src/pnpm-lock.yaml +++ b/apps/portal/src/pnpm-lock.yaml @@ -4,8 +4,10 @@ specifiers: '@js-temporal/polyfill': ^0.4.1 '@sveltejs/vite-plugin-svelte': 1.0.0-next.43 fuzzysort: ^1.9.0 + install: ^0.13.0 sass: ^1.51.0 svelte: ^3.48.0 + svelte-feather-icons: ^4.0.0 svelte-preprocess: ^4.10.6 svelte-spa-router: ^3.2.0 typescript: 4.6.4 @@ -17,8 +19,10 @@ dependencies: devDependencies: '@sveltejs/vite-plugin-svelte': 1.0.0-next.43_svelte@3.48.0+vite@2.9.8 + install: 0.13.0 sass: 1.51.0 svelte: 3.48.0 + svelte-feather-icons: 4.0.0 svelte-preprocess: 4.10.6_24ezlekk4ocevlsjgs2qnqmjum svelte-spa-router: 3.2.0 typescript: 4.6.4 @@ -442,6 +446,11 @@ packages: resolution: {integrity: sha512-k/vGaX4/Yla3WzyMCvTQOXYeIHvqOKtnqBduzTHpzpQZzAskKMhZ2K+EnBiSM9zGSoIFeMpXKxa4dYeZIQqewQ==} dev: true + /install/0.13.0: + resolution: {integrity: sha512-zDml/jzr2PKU9I8J/xyZBQn8rPCAY//UOYNmR01XwNwyfhEWObo2SWfSl1+0tm1u6PhxLwDnfsT/6jB7OUxqFA==} + engines: {node: '>= 0.10'} + dev: true + /is-binary-path/2.1.0: resolution: {integrity: sha512-ZMERYes6pDydyuGidse7OsHxtbI7WVeUEozgR/g7rd0xUimYNlvZRE/K2MgZTjWy725IfelLeVcEM97mmtRGXw==} engines: {node: '>=8'} @@ -650,6 +659,12 @@ packages: engines: {node: '>= 0.4'} dev: true + /svelte-feather-icons/4.0.0: + resolution: {integrity: sha512-4ieUsjp+VYa1r6y80jDt9zRiRUZyJNbESpRdHdJJhiBubyuXX96A7f1UZSK4olxzP6Qsg5ZAuyZlnmvD+/swAA==} + dependencies: + svelte: 3.48.0 + dev: true + /svelte-hmr/0.14.11_svelte@3.48.0: resolution: {integrity: sha512-R9CVfX6DXxW1Kn45Jtmx+yUe+sPhrbYSUp7TkzbW0jI5fVPn6lsNG9NEs5dFg5qRhFNAoVdRw5qQDLALNKhwbQ==} engines: {node: ^12.20 || ^14.13.1 || >= 16} diff --git a/apps/portal/src/tsconfig.json b/apps/portal/src/tsconfig.json index e00d638..c60fce6 100644 --- a/apps/portal/src/tsconfig.json +++ b/apps/portal/src/tsconfig.json @@ -16,9 +16,6 @@ "allowJs": true, "checkJs": false, "paths": { - "$app/*": [ - "./_public/*" - ], "$app/*": [ "./app/*" ], diff --git a/apps/projects/src/app/index.svelte b/apps/projects/src/app/index.svelte index c217797..77d290d 100644 --- a/apps/projects/src/app/index.svelte +++ b/apps/projects/src/app/index.svelte @@ -24,7 +24,6 @@ } const queryClient = new QueryClient(); - const routes = { "/home": wrap({ @@ -47,7 +46,9 @@ "*": NotFound, }; + You seem to be offline, please check your internet connection. + { + clear_categories(); + clear_labels(); + clear_entries(); + location.replace(portal_base("#/login" + (reason ? "?" + reason : ""))); + }); } diff --git a/apps/web-shared/src/components/breadcrumb/bread.svelte b/apps/web-shared/src/components/breadcrumb/bread.svelte new file mode 100644 index 0000000..4cf0698 --- /dev/null +++ b/apps/web-shared/src/components/breadcrumb/bread.svelte @@ -0,0 +1,9 @@ + + diff --git a/apps/web-shared/src/components/breadcrumb/crumb.svelte b/apps/web-shared/src/components/breadcrumb/crumb.svelte new file mode 100644 index 0000000..7621de6 --- /dev/null +++ b/apps/web-shared/src/components/breadcrumb/crumb.svelte @@ -0,0 +1,22 @@ + +
  • + {name} + {#if withArrow} + + {/if} +
    • diff --git a/apps/web-shared/src/components/breadcrumb/index.ts b/apps/web-shared/src/components/breadcrumb/index.ts new file mode 100644 index 0000000..485ed7b --- /dev/null +++ b/apps/web-shared/src/components/breadcrumb/index.ts @@ -0,0 +1,7 @@ +import Bread from "./bread.svelte"; +import Crumb from "./crumb.svelte"; + +export { + Bread, + Crumb +}; diff --git a/apps/web-shared/src/components/link-card.svelte b/apps/web-shared/src/components/link-card.svelte new file mode 100644 index 0000000..0c15a53 --- /dev/null +++ b/apps/web-shared/src/components/link-card.svelte @@ -0,0 +1,47 @@ + + + +
    +
    + +
    +

    {name}

    + {#if description} +

    {description}

    + {/if} +
    +
    +
    +
    +

    {text}

    +
    + + + + + + +
    +
    +     + diff --git a/apps/web-shared/src/components/menu/menu.svelte b/apps/web-shared/src/components/menu/menu.svelte index 33b1160..33517ab 100644 --- a/apps/web-shared/src/components/menu/menu.svelte +++ b/apps/web-shared/src/components/menu/menu.svelte @@ -1,7 +1,7 @@ -
    +
    + + +
    + + + Profile + + + + + + Settings + + + + + Team + + + + + logout_user()}> + Logout + +
    +     diff --git a/apps/web-shared/src/lib/helpers.ts b/apps/web-shared/src/lib/helpers.ts index f2d0cca..4da8254 100644 --- a/apps/web-shared/src/lib/helpers.ts +++ b/apps/web-shared/src/lib/helpers.ts @@ -51,9 +51,7 @@ export function get_cookie(name) { } export function set_cookie(name, value, baseDomain = window.location.host) { - let asdf = name + "=" + encodeURIComponent(value) + (baseDomain ? ";domain=" + baseDomain : ""); - console.log(asdf); - document.cookie = asdf; + document.cookie = name + "=" + encodeURIComponent(value) + (baseDomain ? ";domain=" + baseDomain : ""); } export function unwrap_date_time_from_entry(entry: TimeEntryDto): UnwrappedEntryDateTime { diff --git a/apps/web-shared/src/lib/session.ts b/apps/web-shared/src/lib/session.ts index 4f40a17..f729687 100644 --- a/apps/web-shared/src/lib/session.ts +++ b/apps/web-shared/src/lib/session.ts @@ -1,5 +1,5 @@ import {Temporal} from "@js-temporal/polyfill"; -import {get_profile_for_active_check} from "./api/user"; +import {get_profile_for_active_check, logout} from "./api/user"; import {is_guid, session_storage_get_json, session_storage_set_json} from "./helpers"; import {SECONDS_BETWEEN_SESSION_CHECK, StorageKeys} from "./configuration"; import type {ISession} from "$shared/lib/models/ISession"; @@ -21,6 +21,12 @@ export async function is_active(forceRefresh: boolean = false): Promise } } +export async function end_session(cb: Function): Promise { + await logout(); + clear_session_data(); + cb(); +} + async function call_api(): Promise { console.log("Getting profile data while checking session state"); try { diff --git a/apps/web-shared/src/styles/components/auto-sized-grid.scss b/apps/web-shared/src/styles/components/auto-sized-grid.scss new file mode 100644 index 0000000..a3b1be5 --- /dev/null +++ b/apps/web-shared/src/styles/components/auto-sized-grid.scss @@ -0,0 +1,56 @@ +@use '../base' as *; + +/* -------------------------------- + +File#: _1_auto-sized-grid +Title: Auto Sized Grid +Descr: A grid layout based on CSS Grid where the columns are automatically created according to a min-width value +Usage: codyhouse.co/license + +-------------------------------- */ + +.grid-auto-xs, .grid-auto-sm, .grid-auto-md, .grid-auto-lg, .grid-auto-xl { + display: grid; + gap: var(--gap-y, 0px) var(--gap-x, 0px); + grid-template-columns: repeat(auto-fit, minmax(var(--col-min-width), 1fr)); // auto add new cols +} + +.grid-auto-xs { + --col-min-width: 8rem; +} + +.grid-auto-sm { + --col-min-width: 10rem; +} + +.grid-auto-md { + --col-min-width: 15rem; +} + +.grid-auto-lg { + --col-min-width: 20rem; +} + +.grid-auto-xl { + --col-min-width: 25rem; +} + +@each $breakpoint, $value in $breakpoints { + @include breakpoint(#{$breakpoint}) { + .grid-auto-xs\@#{$breakpoint} { + --col-min-width: 8rem; + } + .grid-auto-sm\@#{$breakpoint} { + --col-min-width: 10rem; + } + .grid-auto-md\@#{$breakpoint} { + --col-min-width: 15rem; + } + .grid-auto-lg\@#{$breakpoint} { + --col-min-width: 20rem; + } + .grid-auto-xl\@#{$breakpoint} { + --col-min-width: 25rem; + } + } +} diff --git a/apps/web-shared/src/styles/components/breadcrumbs.scss b/apps/web-shared/src/styles/components/breadcrumbs.scss new file mode 100644 index 0000000..45bf7c6 --- /dev/null +++ b/apps/web-shared/src/styles/components/breadcrumbs.scss @@ -0,0 +1,18 @@ +@use '../base' as *; + +/* -------------------------------- + +File#: _1_breadcrumbs +Title: Breadcrumbs +Descr: List of links to help the user move within website structure +Usage: codyhouse.co/license + +-------------------------------- */ + +.breadcrumbs {} + +.breadcrumbs__item { + display: inline-block; // flex fallback + display: inline-flex; + align-items: center; +} diff --git a/apps/web-shared/src/styles/components/link-card.scss b/apps/web-shared/src/styles/components/link-card.scss new file mode 100644 index 0000000..dad4f98 --- /dev/null +++ b/apps/web-shared/src/styles/components/link-card.scss @@ -0,0 +1,56 @@ +@use '../base' as *; + +/* -------------------------------- + +File#: _1_link-card +Title: Link Card +Descr: Link card for app UI +Usage: codyhouse.co/license + +-------------------------------- */ + +.link-card { + text-decoration: none; + color: inherit; + box-shadow: var(--inner-glow), var(--shadow-xs); + + &:hover { + box-shadow: var(--inner-glow), var(--shadow-sm); + } +} + +.link-card__footer { + position: relative; + overflow: hidden; + height: 60px; + + > * { + position: absolute; + top: 0; + left: 0; + width: 100%; + height: 100%; + display: flex; + justify-content: center; + align-items: center; + } + + > *:last-child { + transform: translateY(100%); + opacity: 0; + } +} + +.link-card:hover { + .link-card__footer { + > *:first-child { + transform: translateY(-100%); + opacity: 0; + } + + > *:last-child { + transform: translateY(0); + opacity: 1; + } + } +} diff --git a/apps/web-shared/src/styles/components/user-menu.scss b/apps/web-shared/src/styles/components/user-menu.scss index 1b5c1d5..416655f 100644 --- a/apps/web-shared/src/styles/components/user-menu.scss +++ b/apps/web-shared/src/styles/components/user-menu.scss @@ -42,7 +42,7 @@ Usage: codyhouse.co/license width: var(--profile-figure-size); height: var(--profile-figure-size); position: relative; - transition: opacity 0.2s; + //transition: opacity 0.2s; &::after { content: ''; @@ -61,7 +61,7 @@ Usage: codyhouse.co/license opacity: 0; transform: scale(0.8); - transition: all 0.2s; + //transition: all 0.2s; } } @@ -73,9 +73,9 @@ Usage: codyhouse.co/license } .user-menu__meta { - max-width: 100px; + //max-width: 100px; } .user-menu__meta-title { - transition: color 0.2s; + //transition: color 0.2s; } -- cgit v1.3