Merge branch 'develop' into listing
# Conflicts: # frontend/svelte/package.json
This commit is contained in:
dhain
commit
92bf70831e
15 changed files with 408 additions and 17 deletions
14
frontend/package-lock.json
generated
14
frontend/package-lock.json
generated
|
|
@ -1,6 +1,14 @@
|
|||
{
|
||||
"name": "frontend",
|
||||
"lockfileVersion": 2,
|
||||
"requires": true,
|
||||
"packages": {}
|
||||
"lockfileVersion": 1,
|
||||
"dependencies": {
|
||||
"@popperjs/core": {
|
||||
"version": "2.11.6",
|
||||
"resolved": "https://registry.npmjs.org/@popperjs/core/-/core-2.11.6.tgz",
|
||||
"integrity": "sha512-50/17A98tWUfQ176raKiOGXuYpLyyVMkxxG6oylzL3BPOlA6ADGdK7EYunSa4I064xerltq9TGXs8HmOk5E+vw=="
|
||||
},
|
||||
"svelte_pages": {
|
||||
"version": "file:svelte"
|
||||
}
|
||||
}
|
||||
}
|
||||
|
|
|
|||
|
|
@ -6,4 +6,8 @@
|
|||
|
||||
## Run the docker container
|
||||
|
||||
``docker run --name svelte -dp 5173:5173 svelte``
|
||||
``docker run --name svelte -dp 5173:5173 svelte``
|
||||
|
||||
## Mastercommand for rebuild run etc.
|
||||
|
||||
``docker build -t svelte .;docker stop svelte;docker rm svelte; docker run --name svelte -dp 5173:5173 svelte``
|
||||
99
frontend/svelte/package-lock.json
generated
99
frontend/svelte/package-lock.json
generated
|
|
@ -1,19 +1,23 @@
|
|||
{
|
||||
"name": "svelte",
|
||||
"name": "svelte_pages",
|
||||
"version": "0.0.1",
|
||||
"lockfileVersion": 2,
|
||||
"requires": true,
|
||||
"packages": {
|
||||
"": {
|
||||
"name": "svelte",
|
||||
"name": "svelte_pages",
|
||||
"version": "0.0.1",
|
||||
"dependencies": {
|
||||
"bootstrap-icons": "^1.9.1"
|
||||
},
|
||||
"dependencies": {
|
||||
"nookies": "^2.5.2"
|
||||
},
|
||||
"devDependencies": {
|
||||
"@sveltejs/adapter-auto": "next",
|
||||
"@sveltejs/kit": "next",
|
||||
"svelte": "^3.44.0",
|
||||
"@types/bootstrap": "^5.2.4",
|
||||
"@zerodevx/svelte-toast": "^0.7.2",
|
||||
"svelte-check": "^2.7.1",
|
||||
"svelte-preprocess": "^4.10.6",
|
||||
"tslib": "^2.3.1",
|
||||
|
|
@ -174,6 +178,16 @@
|
|||
"integrity": "sha512-a5Sab1C4/icpTZVzZc5Ghpz88yQtGOyNqYXcZgOssB2uuAr+wF/MvN6bgtW32q7HHrvBki+BsZ0OuNv6EV3K9g==",
|
||||
"dev": true
|
||||
},
|
||||
"node_modules/@popperjs/core": {
|
||||
"version": "2.11.6",
|
||||
"resolved": "https://registry.npmjs.org/@popperjs/core/-/core-2.11.6.tgz",
|
||||
"integrity": "sha512-50/17A98tWUfQ176raKiOGXuYpLyyVMkxxG6oylzL3BPOlA6ADGdK7EYunSa4I064xerltq9TGXs8HmOk5E+vw==",
|
||||
"dev": true,
|
||||
"funding": {
|
||||
"type": "opencollective",
|
||||
"url": "https://opencollective.com/popperjs"
|
||||
}
|
||||
},
|
||||
"node_modules/@rollup/pluginutils": {
|
||||
"version": "4.2.1",
|
||||
"resolved": "https://registry.npmjs.org/@rollup/pluginutils/-/pluginutils-4.2.1.tgz",
|
||||
|
|
@ -289,6 +303,15 @@
|
|||
}
|
||||
}
|
||||
},
|
||||
"node_modules/@types/bootstrap": {
|
||||
"version": "5.2.4",
|
||||
"resolved": "https://registry.npmjs.org/@types/bootstrap/-/bootstrap-5.2.4.tgz",
|
||||
"integrity": "sha512-jGNB81zuDHu1DPvBV7Ox3Z3eyzdWPNguYwrt0j7X90VExA8H7c6qxJh0cz5j3xp0XvSy1TYaP2pkyXCHeo8CaA==",
|
||||
"dev": true,
|
||||
"dependencies": {
|
||||
"@popperjs/core": "^2.9.2"
|
||||
}
|
||||
},
|
||||
"node_modules/@types/cookie": {
|
||||
"version": "0.5.1",
|
||||
"resolved": "https://registry.npmjs.org/@types/cookie/-/cookie-0.5.1.tgz",
|
||||
|
|
@ -338,6 +361,12 @@
|
|||
"nft": "out/cli.js"
|
||||
}
|
||||
},
|
||||
"node_modules/@zerodevx/svelte-toast": {
|
||||
"version": "0.7.2",
|
||||
"resolved": "https://registry.npmjs.org/@zerodevx/svelte-toast/-/svelte-toast-0.7.2.tgz",
|
||||
"integrity": "sha512-vWiY6IqsstcOoQ8PFBuFuxgPkj1JFAGhUF9gC7wLx7c5A9SSfdtxWs/39ekGSIeyJK0yqWhTcmzGrCEWSELzDw==",
|
||||
"dev": true
|
||||
},
|
||||
"node_modules/abbrev": {
|
||||
"version": "1.1.1",
|
||||
"resolved": "https://registry.npmjs.org/abbrev/-/abbrev-1.1.1.tgz",
|
||||
|
|
@ -1566,6 +1595,23 @@
|
|||
"node-gyp-build-test": "build-test.js"
|
||||
}
|
||||
},
|
||||
"node_modules/nookies": {
|
||||
"version": "2.5.2",
|
||||
"resolved": "https://registry.npmjs.org/nookies/-/nookies-2.5.2.tgz",
|
||||
"integrity": "sha512-x0TRSaosAEonNKyCrShoUaJ5rrT5KHRNZ5DwPCuizjgrnkpE5DRf3VL7AyyQin4htict92X1EQ7ejDbaHDVdYA==",
|
||||
"dependencies": {
|
||||
"cookie": "^0.4.1",
|
||||
"set-cookie-parser": "^2.4.6"
|
||||
}
|
||||
},
|
||||
"node_modules/nookies/node_modules/cookie": {
|
||||
"version": "0.4.2",
|
||||
"resolved": "https://registry.npmjs.org/cookie/-/cookie-0.4.2.tgz",
|
||||
"integrity": "sha512-aSWTXFzaKWkvHO1Ny/s+ePFpvKsPnjc551iI41v3ny/ow6tBG5Vd+FuqGNhh1LxOmVzOlGUriIlOaokOvhaStA==",
|
||||
"engines": {
|
||||
"node": ">= 0.6"
|
||||
}
|
||||
},
|
||||
"node_modules/nopt": {
|
||||
"version": "5.0.0",
|
||||
"resolved": "https://registry.npmjs.org/nopt/-/nopt-5.0.0.tgz",
|
||||
|
|
@ -1928,8 +1974,7 @@
|
|||
"node_modules/set-cookie-parser": {
|
||||
"version": "2.5.1",
|
||||
"resolved": "https://registry.npmjs.org/set-cookie-parser/-/set-cookie-parser-2.5.1.tgz",
|
||||
"integrity": "sha512-1jeBGaKNGdEq4FgIrORu/N570dwoPYio8lSoYLWmX7sQ//0JY08Xh9o5pBcgmHQ/MbsYp/aZnOe1s1lIsbLprQ==",
|
||||
"dev": true
|
||||
"integrity": "sha512-1jeBGaKNGdEq4FgIrORu/N570dwoPYio8lSoYLWmX7sQ//0JY08Xh9o5pBcgmHQ/MbsYp/aZnOe1s1lIsbLprQ=="
|
||||
},
|
||||
"node_modules/signal-exit": {
|
||||
"version": "3.0.7",
|
||||
|
|
@ -2045,6 +2090,7 @@
|
|||
"resolved": "https://registry.npmjs.org/svelte/-/svelte-3.50.1.tgz",
|
||||
"integrity": "sha512-bS4odcsdj5D5jEg6riZuMg5NKelzPtmsCbD9RG+8umU03TeNkdWnP6pqbCm0s8UQNBkqk29w/Bdubn3C+HWSwA==",
|
||||
"dev": true,
|
||||
"peer": true,
|
||||
"engines": {
|
||||
"node": ">= 8"
|
||||
}
|
||||
|
|
@ -2471,6 +2517,12 @@
|
|||
"integrity": "sha512-a5Sab1C4/icpTZVzZc5Ghpz88yQtGOyNqYXcZgOssB2uuAr+wF/MvN6bgtW32q7HHrvBki+BsZ0OuNv6EV3K9g==",
|
||||
"dev": true
|
||||
},
|
||||
"@popperjs/core": {
|
||||
"version": "2.11.6",
|
||||
"resolved": "https://registry.npmjs.org/@popperjs/core/-/core-2.11.6.tgz",
|
||||
"integrity": "sha512-50/17A98tWUfQ176raKiOGXuYpLyyVMkxxG6oylzL3BPOlA6ADGdK7EYunSa4I064xerltq9TGXs8HmOk5E+vw==",
|
||||
"dev": true
|
||||
},
|
||||
"@rollup/pluginutils": {
|
||||
"version": "4.2.1",
|
||||
"resolved": "https://registry.npmjs.org/@rollup/pluginutils/-/pluginutils-4.2.1.tgz",
|
||||
|
|
@ -2559,6 +2611,15 @@
|
|||
"svelte-hmr": "^0.15.0"
|
||||
}
|
||||
},
|
||||
"@types/bootstrap": {
|
||||
"version": "5.2.4",
|
||||
"resolved": "https://registry.npmjs.org/@types/bootstrap/-/bootstrap-5.2.4.tgz",
|
||||
"integrity": "sha512-jGNB81zuDHu1DPvBV7Ox3Z3eyzdWPNguYwrt0j7X90VExA8H7c6qxJh0cz5j3xp0XvSy1TYaP2pkyXCHeo8CaA==",
|
||||
"dev": true,
|
||||
"requires": {
|
||||
"@popperjs/core": "^2.9.2"
|
||||
}
|
||||
},
|
||||
"@types/cookie": {
|
||||
"version": "0.5.1",
|
||||
"resolved": "https://registry.npmjs.org/@types/cookie/-/cookie-0.5.1.tgz",
|
||||
|
|
@ -2605,6 +2666,12 @@
|
|||
"rollup-pluginutils": "^2.8.2"
|
||||
}
|
||||
},
|
||||
"@zerodevx/svelte-toast": {
|
||||
"version": "0.7.2",
|
||||
"resolved": "https://registry.npmjs.org/@zerodevx/svelte-toast/-/svelte-toast-0.7.2.tgz",
|
||||
"integrity": "sha512-vWiY6IqsstcOoQ8PFBuFuxgPkj1JFAGhUF9gC7wLx7c5A9SSfdtxWs/39ekGSIeyJK0yqWhTcmzGrCEWSELzDw==",
|
||||
"dev": true
|
||||
},
|
||||
"abbrev": {
|
||||
"version": "1.1.1",
|
||||
"resolved": "https://registry.npmjs.org/abbrev/-/abbrev-1.1.1.tgz",
|
||||
|
|
@ -3415,6 +3482,22 @@
|
|||
"integrity": "sha512-2iGbaQBV+ITgCz76ZEjmhUKAKVf7xfY1sRl4UiKQspfZMH2h06SyhNsnSVy50cwkFQDGLyif6m/6uFXHkOZ6rg==",
|
||||
"dev": true
|
||||
},
|
||||
"nookies": {
|
||||
"version": "2.5.2",
|
||||
"resolved": "https://registry.npmjs.org/nookies/-/nookies-2.5.2.tgz",
|
||||
"integrity": "sha512-x0TRSaosAEonNKyCrShoUaJ5rrT5KHRNZ5DwPCuizjgrnkpE5DRf3VL7AyyQin4htict92X1EQ7ejDbaHDVdYA==",
|
||||
"requires": {
|
||||
"cookie": "^0.4.1",
|
||||
"set-cookie-parser": "^2.4.6"
|
||||
},
|
||||
"dependencies": {
|
||||
"cookie": {
|
||||
"version": "0.4.2",
|
||||
"resolved": "https://registry.npmjs.org/cookie/-/cookie-0.4.2.tgz",
|
||||
"integrity": "sha512-aSWTXFzaKWkvHO1Ny/s+ePFpvKsPnjc551iI41v3ny/ow6tBG5Vd+FuqGNhh1LxOmVzOlGUriIlOaokOvhaStA=="
|
||||
}
|
||||
}
|
||||
},
|
||||
"nopt": {
|
||||
"version": "5.0.0",
|
||||
"resolved": "https://registry.npmjs.org/nopt/-/nopt-5.0.0.tgz",
|
||||
|
|
@ -3656,8 +3739,7 @@
|
|||
"set-cookie-parser": {
|
||||
"version": "2.5.1",
|
||||
"resolved": "https://registry.npmjs.org/set-cookie-parser/-/set-cookie-parser-2.5.1.tgz",
|
||||
"integrity": "sha512-1jeBGaKNGdEq4FgIrORu/N570dwoPYio8lSoYLWmX7sQ//0JY08Xh9o5pBcgmHQ/MbsYp/aZnOe1s1lIsbLprQ==",
|
||||
"dev": true
|
||||
"integrity": "sha512-1jeBGaKNGdEq4FgIrORu/N570dwoPYio8lSoYLWmX7sQ//0JY08Xh9o5pBcgmHQ/MbsYp/aZnOe1s1lIsbLprQ=="
|
||||
},
|
||||
"signal-exit": {
|
||||
"version": "3.0.7",
|
||||
|
|
@ -3748,7 +3830,8 @@
|
|||
"version": "3.50.1",
|
||||
"resolved": "https://registry.npmjs.org/svelte/-/svelte-3.50.1.tgz",
|
||||
"integrity": "sha512-bS4odcsdj5D5jEg6riZuMg5NKelzPtmsCbD9RG+8umU03TeNkdWnP6pqbCm0s8UQNBkqk29w/Bdubn3C+HWSwA==",
|
||||
"dev": true
|
||||
"dev": true,
|
||||
"peer": true
|
||||
},
|
||||
"svelte-check": {
|
||||
"version": "2.9.0",
|
||||
|
|
|
|||
|
|
@ -1,5 +1,5 @@
|
|||
{
|
||||
"name": "svelte",
|
||||
"name": "svelte_pages",
|
||||
"version": "0.0.1",
|
||||
"private": true,
|
||||
"scripts": {
|
||||
|
|
@ -12,7 +12,8 @@
|
|||
"devDependencies": {
|
||||
"@sveltejs/adapter-auto": "next",
|
||||
"@sveltejs/kit": "next",
|
||||
"svelte": "^3.44.0",
|
||||
"@types/bootstrap": "^5.2.4",
|
||||
"@zerodevx/svelte-toast": "^0.7.2",
|
||||
"svelte-check": "^2.7.1",
|
||||
"svelte-preprocess": "^4.10.6",
|
||||
"tslib": "^2.3.1",
|
||||
|
|
@ -21,6 +22,7 @@
|
|||
},
|
||||
"type": "module",
|
||||
"dependencies": {
|
||||
"nookies": "^2.5.2",
|
||||
"bootstrap-icons": "^1.9.1"
|
||||
}
|
||||
}
|
||||
|
|
|
|||
|
|
@ -2,7 +2,7 @@
|
|||
<html lang="en">
|
||||
<head>
|
||||
<meta charset="utf-8" />
|
||||
<link rel="icon" href="%sveltekit.assets%/favicon.png" />
|
||||
<link rel="icon" href="../src/resources/images/logo2.svg" />
|
||||
<meta name="viewport" content="width=device-width" />
|
||||
%sveltekit.head%
|
||||
</head>
|
||||
|
|
|
|||
3
frontend/svelte/src/models/PomeloUtils.ts
Normal file
3
frontend/svelte/src/models/PomeloUtils.ts
Normal file
|
|
@ -0,0 +1,3 @@
|
|||
export function capitalizeFirstLetter(str: string) {
|
||||
return str.charAt(0).toUpperCase() + str.slice(1);
|
||||
}
|
||||
10
frontend/svelte/src/models/customToasts.ts
Normal file
10
frontend/svelte/src/models/customToasts.ts
Normal file
|
|
@ -0,0 +1,10 @@
|
|||
import {toast} from "@zerodevx/svelte-toast";
|
||||
import {capitalizeFirstLetter} from "./PomeloUtils";
|
||||
|
||||
export const createErrorToast = (m: string) => {
|
||||
toast.push("Error: " + capitalizeFirstLetter(m), {
|
||||
theme: {
|
||||
'--toastBackground': 'red'
|
||||
}
|
||||
})
|
||||
}
|
||||
22
frontend/svelte/src/models/user.ts
Normal file
22
frontend/svelte/src/models/user.ts
Normal file
|
|
@ -0,0 +1,22 @@
|
|||
export class User {
|
||||
id: number;
|
||||
email: string;
|
||||
username: string;
|
||||
|
||||
// Can be extended by these
|
||||
// blocked: boolean;
|
||||
// provider: string;
|
||||
// confirmed: boolean;
|
||||
// createdAt: Date;
|
||||
// updatedAt: Date;
|
||||
|
||||
/**
|
||||
* Creates the user.
|
||||
* @param params Fetch data.
|
||||
*/
|
||||
constructor(params: any) {
|
||||
this.id = params?.id;
|
||||
this.email = params?.email;
|
||||
this.username = params?.username;
|
||||
}
|
||||
}
|
||||
39
frontend/svelte/src/resources/images/logo1.svg
Normal file
39
frontend/svelte/src/resources/images/logo1.svg
Normal file
|
|
@ -0,0 +1,39 @@
|
|||
<?xml version="1.0" encoding="UTF-8" standalone="no" ?>
|
||||
<!DOCTYPE svg PUBLIC "-//W3C//DTD SVG 1.1//EN" "http://www.w3.org/Graphics/SVG/1.1/DTD/svg11.dtd">
|
||||
<svg xmlns="http://www.w3.org/2000/svg" xmlns:xlink="http://www.w3.org/1999/xlink" version="1.1" width="1080" height="1080" viewBox="0 0 1080 1080" xml:space="preserve">
|
||||
<desc>Created with Fabric.js 4.2.0</desc>
|
||||
<defs>
|
||||
</defs>
|
||||
<g transform="matrix(1 0 0 1 540 540)" id="d061657c-7ba9-4cd0-aa75-59a301826e56" >
|
||||
<rect style="stroke: none; stroke-width: 1; stroke-dasharray: none; stroke-linecap: butt; stroke-dashoffset: 0; stroke-linejoin: miter; stroke-miterlimit: 4; fill: rgb(255,255,255); fill-rule: nonzero; opacity: 1;" vector-effect="non-scaling-stroke" x="-540" y="-540" rx="0" ry="0" width="1080" height="1080" />
|
||||
</g>
|
||||
<g transform="matrix(1 0 0 1 540 540)" id="2b1d2205-5cf6-4a0b-ac8a-105a15017f71" >
|
||||
</g>
|
||||
<g transform="matrix(12.3 0 0 12.3 540.07 540.07)" >
|
||||
<path style="stroke: rgb(255,244,148); stroke-width: 0; stroke-dasharray: none; stroke-linecap: butt; stroke-dashoffset: 0; stroke-linejoin: miter; stroke-miterlimit: 4; fill: rgb(255,244,148); fill-rule: nonzero; opacity: 1;" vector-effect="non-scaling-stroke" transform=" translate(-50, -50)" d="M 50 92.875 C 26.358 92.875 7.125 73.642 7.125 50 C 7.125 26.358000000000004 26.358 7.125 50 7.125 C 73.642 7.125 92.875 26.358 92.875 50 C 92.875 73.642 73.642 92.875 50 92.875 z M 50 9.125 C 27.461 9.125 9.125 27.461 9.125 50 C 9.125 72.538 27.461 90.875 50 90.875 C 72.538 90.875 90.875 72.538 90.875 50 C 90.875 27.461 72.538 9.125 50 9.125 z" stroke-linecap="round" />
|
||||
</g>
|
||||
<g transform="matrix(0 4.56 -6.24 0 293.81 540)" >
|
||||
<polygon style="stroke: rgb(0,0,0); stroke-width: 0; stroke-dasharray: none; stroke-linecap: butt; stroke-dashoffset: 0; stroke-linejoin: miter; stroke-miterlimit: 4; fill: rgb(255,236,71); fill-rule: nonzero; opacity: 1;" vector-effect="non-scaling-stroke" points="-37.43,32.41 0,-32.41 37.43,32.41 " />
|
||||
</g>
|
||||
<g transform="matrix(0 -4.56 6.24 0 776.88 540)" >
|
||||
<polygon style="stroke: rgb(0,0,0); stroke-width: 0; stroke-dasharray: none; stroke-linecap: butt; stroke-dashoffset: 0; stroke-linejoin: miter; stroke-miterlimit: 4; fill: rgb(255,236,71); fill-rule: nonzero; opacity: 1;" vector-effect="non-scaling-stroke" points="-37.43,32.41 0,-32.41 37.43,32.41 " />
|
||||
</g>
|
||||
<g transform="matrix(4.56 0 0 6.24 540 784.7)" >
|
||||
<polygon style="stroke: rgb(0,0,0); stroke-width: 0; stroke-dasharray: none; stroke-linecap: butt; stroke-dashoffset: 0; stroke-linejoin: miter; stroke-miterlimit: 4; fill: rgb(255,244,148); fill-rule: nonzero; opacity: 1;" vector-effect="non-scaling-stroke" points="-37.43,32.41 0,-32.41 37.43,32.41 " />
|
||||
</g>
|
||||
<g transform="matrix(-4.56 0 0 -6.24 540 292.29)" >
|
||||
<polygon style="stroke: rgb(0,0,0); stroke-width: 0; stroke-dasharray: none; stroke-linecap: butt; stroke-dashoffset: 0; stroke-linejoin: miter; stroke-miterlimit: 4; fill: rgb(255,244,148); fill-rule: nonzero; opacity: 1;" vector-effect="non-scaling-stroke" points="-37.43,32.41 0,-32.41 37.43,32.41 " />
|
||||
</g>
|
||||
<g transform="matrix(-3.22 -3.22 4.41 -4.41 707.69 368.3)" >
|
||||
<polygon style="stroke: rgb(0,0,0); stroke-width: 0; stroke-dasharray: none; stroke-linecap: butt; stroke-dashoffset: 0; stroke-linejoin: miter; stroke-miterlimit: 4; fill: rgb(255,241,122); fill-rule: nonzero; opacity: 1;" vector-effect="non-scaling-stroke" points="-37.43,32.41 0,-32.41 37.43,32.41 " />
|
||||
</g>
|
||||
<g transform="matrix(3.22 -3.22 4.41 4.41 701.19 704.69)" >
|
||||
<polygon style="stroke: rgb(0,0,0); stroke-width: 0; stroke-dasharray: none; stroke-linecap: butt; stroke-dashoffset: 0; stroke-linejoin: miter; stroke-miterlimit: 4; fill: rgb(224,201,0); fill-rule: nonzero; opacity: 1;" vector-effect="non-scaling-stroke" points="-37.43,32.41 0,-32.41 37.43,32.41 " />
|
||||
</g>
|
||||
<g transform="matrix(3.22 3.22 -4.41 4.41 368.3 705.52)" >
|
||||
<polygon style="stroke: rgb(0,0,0); stroke-width: 0; stroke-dasharray: none; stroke-linecap: butt; stroke-dashoffset: 0; stroke-linejoin: miter; stroke-miterlimit: 4; fill: rgb(255,241,122); fill-rule: nonzero; opacity: 1;" vector-effect="non-scaling-stroke" points="-37.43,32.41 0,-32.41 37.43,32.41 " />
|
||||
</g>
|
||||
<g transform="matrix(-3.22 3.22 -4.41 -4.41 369.14 367.13)" >
|
||||
<polygon style="stroke: rgb(0,0,0); stroke-width: 0; stroke-dasharray: none; stroke-linecap: butt; stroke-dashoffset: 0; stroke-linejoin: miter; stroke-miterlimit: 4; fill: rgb(224,201,0); fill-rule: nonzero; opacity: 1;" vector-effect="non-scaling-stroke" points="-37.43,32.41 0,-32.41 37.43,32.41 " />
|
||||
</g>
|
||||
</svg>
|
||||
|
After Width: | Height: | Size: 4.4 KiB |
40
frontend/svelte/src/resources/images/logo2.svg
Normal file
40
frontend/svelte/src/resources/images/logo2.svg
Normal file
|
|
@ -0,0 +1,40 @@
|
|||
<?xml version="1.0" encoding="UTF-8" standalone="no" ?>
|
||||
<!DOCTYPE svg PUBLIC "-//W3C//DTD SVG 1.1//EN" "http://www.w3.org/Graphics/SVG/1.1/DTD/svg11.dtd">
|
||||
<svg xmlns="http://www.w3.org/2000/svg" xmlns:xlink="http://www.w3.org/1999/xlink" version="1.1" width="1080" height="1080" viewBox="0 0 1080 1080" xml:space="preserve">
|
||||
<desc>Created with Fabric.js 4.2.0</desc>
|
||||
<defs>
|
||||
</defs>
|
||||
<rect x="0" y="0" width="100%" height="100%" fill="transparent"></rect>
|
||||
<g transform="matrix(1 0 0 1 540 540)" id="2b1d2205-5cf6-4a0b-ac8a-105a15017f71" >
|
||||
</g>
|
||||
<g transform="matrix(1 0 0 1 540 540)" id="d061657c-7ba9-4cd0-aa75-59a301826e56" >
|
||||
<rect style="stroke: none; stroke-width: 1; stroke-dasharray: none; stroke-linecap: butt; stroke-dashoffset: 0; stroke-linejoin: miter; stroke-miterlimit: 4; fill: rgb(255,255,255); fill-opacity: 0; fill-rule: nonzero; opacity: 1;" vector-effect="non-scaling-stroke" x="-540" y="-540" rx="0" ry="0" width="1080" height="1080" />
|
||||
</g>
|
||||
<g transform="matrix(12.3 0 0 12.3 540.07 540.07)" >
|
||||
<path style="stroke: rgb(255,244,148); stroke-width: 0; stroke-dasharray: none; stroke-linecap: butt; stroke-dashoffset: 0; stroke-linejoin: miter; stroke-miterlimit: 4; fill: rgb(224,201,0); fill-rule: nonzero; opacity: 1;" vector-effect="non-scaling-stroke" transform=" translate(-50, -50)" d="M 50 92.875 C 26.358 92.875 7.125 73.642 7.125 50 C 7.125 26.358000000000004 26.358 7.125 50 7.125 C 73.642 7.125 92.875 26.358 92.875 50 C 92.875 73.642 73.642 92.875 50 92.875 z M 50 9.125 C 27.461 9.125 9.125 27.461 9.125 50 C 9.125 72.538 27.461 90.875 50 90.875 C 72.538 90.875 90.875 72.538 90.875 50 C 90.875 27.461 72.538 9.125 50 9.125 z" stroke-linecap="round" />
|
||||
</g>
|
||||
<g transform="matrix(0 4.56 -6.24 0 293.81 540)" >
|
||||
<polygon style="stroke: rgb(0,0,0); stroke-width: 0; stroke-dasharray: none; stroke-linecap: butt; stroke-dashoffset: 0; stroke-linejoin: miter; stroke-miterlimit: 4; fill: rgb(255,244,148); fill-rule: nonzero; opacity: 1;" vector-effect="non-scaling-stroke" points="-37.43,32.41 0,-32.41 37.43,32.41 " />
|
||||
</g>
|
||||
<g transform="matrix(0 -4.56 6.24 0 776.88 540)" >
|
||||
<polygon style="stroke: rgb(0,0,0); stroke-width: 0; stroke-dasharray: none; stroke-linecap: butt; stroke-dashoffset: 0; stroke-linejoin: miter; stroke-miterlimit: 4; fill: rgb(255,244,148); fill-rule: nonzero; opacity: 1;" vector-effect="non-scaling-stroke" points="-37.43,32.41 0,-32.41 37.43,32.41 " />
|
||||
</g>
|
||||
<g transform="matrix(4.56 0 0 6.24 540 784.7)" >
|
||||
<polygon style="stroke: rgb(0,0,0); stroke-width: 0; stroke-dasharray: none; stroke-linecap: butt; stroke-dashoffset: 0; stroke-linejoin: miter; stroke-miterlimit: 4; fill: rgb(255,244,148); fill-rule: nonzero; opacity: 1;" vector-effect="non-scaling-stroke" points="-37.43,32.41 0,-32.41 37.43,32.41 " />
|
||||
</g>
|
||||
<g transform="matrix(-4.56 0 0 -6.24 540 292.29)" >
|
||||
<polygon style="stroke: rgb(0,0,0); stroke-width: 0; stroke-dasharray: none; stroke-linecap: butt; stroke-dashoffset: 0; stroke-linejoin: miter; stroke-miterlimit: 4; fill: rgb(255,244,148); fill-rule: nonzero; opacity: 1;" vector-effect="non-scaling-stroke" points="-37.43,32.41 0,-32.41 37.43,32.41 " />
|
||||
</g>
|
||||
<g transform="matrix(-3.22 -3.22 4.41 -4.41 707.69 368.3)" >
|
||||
<polygon style="stroke: rgb(0,0,0); stroke-width: 0; stroke-dasharray: none; stroke-linecap: butt; stroke-dashoffset: 0; stroke-linejoin: miter; stroke-miterlimit: 4; fill: rgb(255,241,122); fill-rule: nonzero; opacity: 1;" vector-effect="non-scaling-stroke" points="-37.43,32.41 0,-32.41 37.43,32.41 " />
|
||||
</g>
|
||||
<g transform="matrix(3.22 -3.22 4.41 4.41 701.19 704.69)" >
|
||||
<polygon style="stroke: rgb(0,0,0); stroke-width: 0; stroke-dasharray: none; stroke-linecap: butt; stroke-dashoffset: 0; stroke-linejoin: miter; stroke-miterlimit: 4; fill: rgb(255,241,122); fill-rule: nonzero; opacity: 1;" vector-effect="non-scaling-stroke" points="-37.43,32.41 0,-32.41 37.43,32.41 " />
|
||||
</g>
|
||||
<g transform="matrix(3.22 3.22 -4.41 4.41 368.3 705.52)" >
|
||||
<polygon style="stroke: rgb(0,0,0); stroke-width: 0; stroke-dasharray: none; stroke-linecap: butt; stroke-dashoffset: 0; stroke-linejoin: miter; stroke-miterlimit: 4; fill: rgb(255,241,122); fill-rule: nonzero; opacity: 1;" vector-effect="non-scaling-stroke" points="-37.43,32.41 0,-32.41 37.43,32.41 " />
|
||||
</g>
|
||||
<g transform="matrix(-3.22 3.22 -4.41 -4.41 370.97 368.97)" >
|
||||
<polygon style="stroke: rgb(0,0,0); stroke-width: 0; stroke-dasharray: none; stroke-linecap: butt; stroke-dashoffset: 0; stroke-linejoin: miter; stroke-miterlimit: 4; fill: rgb(255,241,122); fill-rule: nonzero; opacity: 1;" vector-effect="non-scaling-stroke" points="-37.43,32.41 0,-32.41 37.43,32.41 " />
|
||||
</g>
|
||||
</svg>
|
||||
|
After Width: | Height: | Size: 4.5 KiB |
43
frontend/svelte/src/resources/images/logo3.svg
Normal file
43
frontend/svelte/src/resources/images/logo3.svg
Normal file
|
|
@ -0,0 +1,43 @@
|
|||
<?xml version="1.0" encoding="UTF-8" standalone="no" ?>
|
||||
<!DOCTYPE svg PUBLIC "-//W3C//DTD SVG 1.1//EN" "http://www.w3.org/Graphics/SVG/1.1/DTD/svg11.dtd">
|
||||
<svg xmlns="http://www.w3.org/2000/svg" xmlns:xlink="http://www.w3.org/1999/xlink" version="1.1" width="1080" height="1080" viewBox="0 0 1080 1080" xml:space="preserve">
|
||||
<desc>Created with Fabric.js 4.2.0</desc>
|
||||
<defs>
|
||||
</defs>
|
||||
<rect x="0" y="0" width="100%" height="100%" fill="transparent"></rect>
|
||||
<g transform="matrix(1 0 0 1 540 540)" id="2b1d2205-5cf6-4a0b-ac8a-105a15017f71" >
|
||||
</g>
|
||||
<g transform="matrix(1 0 0 1 540 540)" id="d061657c-7ba9-4cd0-aa75-59a301826e56" >
|
||||
<rect style="stroke: none; stroke-width: 1; stroke-dasharray: none; stroke-linecap: butt; stroke-dashoffset: 0; stroke-linejoin: miter; stroke-miterlimit: 4; fill: rgb(255,255,255); fill-opacity: 0; fill-rule: nonzero; opacity: 1;" vector-effect="non-scaling-stroke" x="-540" y="-540" rx="0" ry="0" width="1080" height="1080" />
|
||||
</g>
|
||||
<g transform="matrix(12.3 0 0 12.3 540.07 540.07)" >
|
||||
<path style="stroke: rgb(255,244,148); stroke-width: 0; stroke-dasharray: none; stroke-linecap: butt; stroke-dashoffset: 0; stroke-linejoin: miter; stroke-miterlimit: 4; fill: rgb(224,201,0); fill-rule: nonzero; opacity: 1;" vector-effect="non-scaling-stroke" transform=" translate(-50, -50)" d="M 50 92.875 C 26.358 92.875 7.125 73.642 7.125 50 C 7.125 26.358000000000004 26.358 7.125 50 7.125 C 73.642 7.125 92.875 26.358 92.875 50 C 92.875 73.642 73.642 92.875 50 92.875 z M 50 9.125 C 27.461 9.125 9.125 27.461 9.125 50 C 9.125 72.538 27.461 90.875 50 90.875 C 72.538 90.875 90.875 72.538 90.875 50 C 90.875 27.461 72.538 9.125 50 9.125 z" stroke-linecap="round" />
|
||||
</g>
|
||||
<g transform="matrix(0 4.56 -6.24 0 293.81 540)" >
|
||||
<polygon style="stroke: rgb(0,0,0); stroke-width: 0; stroke-dasharray: none; stroke-linecap: butt; stroke-dashoffset: 0; stroke-linejoin: miter; stroke-miterlimit: 4; fill: rgb(255,244,148); fill-rule: nonzero; opacity: 1;" vector-effect="non-scaling-stroke" points="-37.43,32.41 0,-32.41 37.43,32.41 " />
|
||||
</g>
|
||||
<g transform="matrix(0 -4.56 6.24 0 776.88 540)" >
|
||||
<polygon style="stroke: rgb(0,0,0); stroke-width: 0; stroke-dasharray: none; stroke-linecap: butt; stroke-dashoffset: 0; stroke-linejoin: miter; stroke-miterlimit: 4; fill: rgb(255,244,148); fill-rule: nonzero; opacity: 1;" vector-effect="non-scaling-stroke" points="-37.43,32.41 0,-32.41 37.43,32.41 " />
|
||||
</g>
|
||||
<g transform="matrix(4.56 0 0 6.24 540 784.7)" >
|
||||
<polygon style="stroke: rgb(0,0,0); stroke-width: 0; stroke-dasharray: none; stroke-linecap: butt; stroke-dashoffset: 0; stroke-linejoin: miter; stroke-miterlimit: 4; fill: rgb(255,244,148); fill-rule: nonzero; opacity: 1;" vector-effect="non-scaling-stroke" points="-37.43,32.41 0,-32.41 37.43,32.41 " />
|
||||
</g>
|
||||
<g transform="matrix(-4.56 0 0 -6.24 540 292.29)" >
|
||||
<polygon style="stroke: rgb(0,0,0); stroke-width: 0; stroke-dasharray: none; stroke-linecap: butt; stroke-dashoffset: 0; stroke-linejoin: miter; stroke-miterlimit: 4; fill: rgb(255,244,148); fill-rule: nonzero; opacity: 1;" vector-effect="non-scaling-stroke" points="-37.43,32.41 0,-32.41 37.43,32.41 " />
|
||||
</g>
|
||||
<g transform="matrix(-3.22 -3.22 4.41 -4.41 707.69 368.3)" >
|
||||
<polygon style="stroke: rgb(0,0,0); stroke-width: 0; stroke-dasharray: none; stroke-linecap: butt; stroke-dashoffset: 0; stroke-linejoin: miter; stroke-miterlimit: 4; fill: rgb(255,241,122); fill-rule: nonzero; opacity: 1;" vector-effect="non-scaling-stroke" points="-37.43,32.41 0,-32.41 37.43,32.41 " />
|
||||
</g>
|
||||
<g transform="matrix(3.22 -3.22 4.41 4.41 701.19 704.69)" >
|
||||
<polygon style="stroke: rgb(0,0,0); stroke-width: 0; stroke-dasharray: none; stroke-linecap: butt; stroke-dashoffset: 0; stroke-linejoin: miter; stroke-miterlimit: 4; fill: rgb(255,241,122); fill-rule: nonzero; opacity: 1;" vector-effect="non-scaling-stroke" points="-37.43,32.41 0,-32.41 37.43,32.41 " />
|
||||
</g>
|
||||
<g transform="matrix(3.22 3.22 -4.41 4.41 368.3 705.52)" >
|
||||
<polygon style="stroke: rgb(0,0,0); stroke-width: 0; stroke-dasharray: none; stroke-linecap: butt; stroke-dashoffset: 0; stroke-linejoin: miter; stroke-miterlimit: 4; fill: rgb(255,241,122); fill-rule: nonzero; opacity: 1;" vector-effect="non-scaling-stroke" points="-37.43,32.41 0,-32.41 37.43,32.41 " />
|
||||
</g>
|
||||
<g transform="matrix(-3.22 3.22 -4.41 -4.41 370.97 368.97)" >
|
||||
<polygon style="stroke: rgb(0,0,0); stroke-width: 0; stroke-dasharray: none; stroke-linecap: butt; stroke-dashoffset: 0; stroke-linejoin: miter; stroke-miterlimit: 4; fill: rgb(255,241,122); fill-rule: nonzero; opacity: 1;" vector-effect="non-scaling-stroke" points="-37.43,32.41 0,-32.41 37.43,32.41 " />
|
||||
</g>
|
||||
<g transform="matrix(1 0 0 1.18 540 540)" style="" id="47c30f3e-c048-41dd-9960-934f860eb3c0" >
|
||||
<text xml:space="preserve" font-family="Raleway" font-size="99" font-style="normal" font-weight="400" style="stroke: none; stroke-width: 1; stroke-dasharray: none; stroke-linecap: butt; stroke-dashoffset: 0; stroke-linejoin: miter; stroke-miterlimit: 4; fill: rgb(0,0,0); fill-rule: nonzero; opacity: 1; white-space: pre;" ><tspan x="-278.98" y="-24.84" >P</tspan><tspan x="-188.59" y="-24.84" >o</tspan><tspan x="-99.99" y="-24.84" >m</tspan><tspan x="20.69" y="-24.84" >e</tspan><tspan x="108.5" y="-24.84" >l</tspan><tspan x="165.13" y="-24.84" >o</tspan><tspan x="253.74" y="-24.84" style="white-space: pre; "> </tspan><tspan x="-156.52" y="87.03" >N</tspan><tspan x="-51.08" y="87.03" >o</tspan><tspan x="36.83" y="87.03" >t</tspan><tspan x="98.41" y="87.03" >e</tspan></text>
|
||||
</g>
|
||||
</svg>
|
||||
|
After Width: | Height: | Size: 5.4 KiB |
128
frontend/svelte/src/routes/login/+page.svelte
Normal file
128
frontend/svelte/src/routes/login/+page.svelte
Normal file
|
|
@ -0,0 +1,128 @@
|
|||
<script lang="ts">
|
||||
import {setCookie} from "nookies";
|
||||
import type {Authentication} from "./models/authentication";
|
||||
import { SvelteToast } from '@zerodevx/svelte-toast'
|
||||
import {createErrorToast} from "../../models/customToasts";
|
||||
import logo from "../../resources/images/logo2.svg";
|
||||
|
||||
let user: string;
|
||||
let password: string;
|
||||
let rememberMe: boolean = true;
|
||||
|
||||
|
||||
async function handleSubmit() {
|
||||
const endpoint = "http://localhost:1337/api/auth/local";
|
||||
const payload = {
|
||||
identifier: user,
|
||||
password: password
|
||||
};
|
||||
|
||||
const login = await fetch(endpoint, {
|
||||
method: 'post',
|
||||
headers: {
|
||||
'Accept': 'application/json',
|
||||
'Content-Type': 'application/json'
|
||||
},
|
||||
body: JSON.stringify(payload)
|
||||
})
|
||||
|
||||
const response: Authentication = await login.json();
|
||||
|
||||
if (response.error != null){
|
||||
if (response.error.details.errors){
|
||||
for (const error of response.error.details.errors) {
|
||||
createErrorToast(error.message);
|
||||
}
|
||||
} else{
|
||||
createErrorToast(response.error.message);
|
||||
}
|
||||
} else {
|
||||
if (rememberMe) {
|
||||
setCookie(null, 'jwt', response.jwt, {
|
||||
maxAge: 30 * 24 * 60 * 60,
|
||||
path: '/'
|
||||
})
|
||||
window.location = "/";
|
||||
}
|
||||
}
|
||||
}
|
||||
|
||||
|
||||
</script>
|
||||
|
||||
<html>
|
||||
<head>
|
||||
<meta charset="utf-8">
|
||||
<meta name="viewport" content="width=device-width, initial-scale=1">
|
||||
<title>PomeloNote | Login</title>
|
||||
<link href="https://cdn.jsdelivr.net/npm/bootstrap@5.2.1/dist/css/bootstrap.min.css" rel="stylesheet"
|
||||
integrity="sha384-iYQeCzEYFbKjA/T2uDLTpkwGzCiq6soy8tYaI1GyVh/UjpbCx/TYkiZhlZB6+fzT" crossorigin="anonymous">
|
||||
</head>
|
||||
|
||||
<body>
|
||||
<main class="form-signin w-100 m-auto">
|
||||
|
||||
<img class="img-fluid" src="{logo}" alt="Logo">
|
||||
<h1 class="h3 mb-3 fw-normal">Please sign in</h1>
|
||||
|
||||
<div class="form-floating">
|
||||
<input type="email" class="form-control" id="floatingInput" placeholder="name@example.com" bind:value={user}>
|
||||
<label for="floatingInput">Email address</label>
|
||||
</div>
|
||||
<div class="form-floating">
|
||||
<input type="password" class="form-control" id="floatingPassword" placeholder="Password" bind:value={password}>
|
||||
<label for="floatingPassword">Password</label>
|
||||
</div>
|
||||
|
||||
<div class="checkbox mb-3">
|
||||
<label>
|
||||
<input type="checkbox" value="rememberMe" bind:checked={rememberMe}> Remember me
|
||||
</label>
|
||||
</div>
|
||||
<button class="w-100 btn btn-lg btn-primary" on:click={handleSubmit}>Sign in</button>
|
||||
<p class="mt-5 mb-3 text-muted">©2022</p>
|
||||
|
||||
</main>
|
||||
<SvelteToast></SvelteToast>
|
||||
</body>
|
||||
</html>
|
||||
|
||||
|
||||
<style>
|
||||
html,
|
||||
body {
|
||||
height: 100%;
|
||||
}
|
||||
|
||||
body {
|
||||
align-items: center;
|
||||
padding-top: 40px;
|
||||
padding-bottom: 40px;
|
||||
background-color: #f5f5f5;
|
||||
}
|
||||
|
||||
.form-signin {
|
||||
max-width: 330px;
|
||||
padding: 15px;
|
||||
}
|
||||
|
||||
.form-signin .form-floating:focus-within {
|
||||
z-index: 2;
|
||||
}
|
||||
|
||||
.form-signin input[type="email"] {
|
||||
margin-bottom: -1px;
|
||||
border-bottom-right-radius: 0;
|
||||
border-bottom-left-radius: 0;
|
||||
}
|
||||
|
||||
.form-signin input[type="password"] {
|
||||
margin-bottom: 10px;
|
||||
border-top-left-radius: 0;
|
||||
border-top-right-radius: 0;
|
||||
}
|
||||
|
||||
.img-fluid{
|
||||
margin-bottom: 15px;
|
||||
}
|
||||
</style>
|
||||
|
|
@ -0,0 +1,7 @@
|
|||
import type {User} from "../../../models/user";
|
||||
|
||||
export interface Authentication {
|
||||
jwt: string;
|
||||
user: User;
|
||||
error: any;
|
||||
}
|
||||
|
|
@ -4,6 +4,7 @@
|
|||
"allowJs": true,
|
||||
"checkJs": true,
|
||||
"esModuleInterop": true,
|
||||
"moduleResolution": "node",
|
||||
"forceConsistentCasingInFileNames": true,
|
||||
"resolveJsonModule": true,
|
||||
"skipLibCheck": true,
|
||||
|
|
|
|||
Loading…
Add table
Add a link
Reference in a new issue