Merge remote-tracking branch 'origin/develop' into endpoints
# Conflicts: # backend/strapi/src/api/note/content-types/note/schema.json
This commit is contained in:
j-weissen
commit
5bffe1cefd
18 changed files with 683 additions and 18 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"
|
||||
}
|
||||
}
|
||||
}
|
||||
|
|
|
|||
|
|
@ -7,3 +7,7 @@
|
|||
## Run the docker container
|
||||
|
||||
``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``
|
||||
112
frontend/svelte/package-lock.json
generated
112
frontend/svelte/package-lock.json
generated
|
|
@ -1,16 +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",
|
||||
|
|
@ -171,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",
|
||||
|
|
@ -286,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",
|
||||
|
|
@ -335,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",
|
||||
|
|
@ -436,6 +468,11 @@
|
|||
"file-uri-to-path": "1.0.0"
|
||||
}
|
||||
},
|
||||
"node_modules/bootstrap-icons": {
|
||||
"version": "1.9.1",
|
||||
"resolved": "https://registry.npmjs.org/bootstrap-icons/-/bootstrap-icons-1.9.1.tgz",
|
||||
"integrity": "sha512-d4ZkO30MIkAhQ2nNRJqKXJVEQorALGbLWTuRxyCTJF96lRIV6imcgMehWGJUiJMJhglN0o2tqLIeDnMdiQEE9g=="
|
||||
},
|
||||
"node_modules/brace-expansion": {
|
||||
"version": "1.1.11",
|
||||
"resolved": "https://registry.npmjs.org/brace-expansion/-/brace-expansion-1.1.11.tgz",
|
||||
|
|
@ -1558,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",
|
||||
|
|
@ -1920,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",
|
||||
|
|
@ -2037,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"
|
||||
}
|
||||
|
|
@ -2463,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",
|
||||
|
|
@ -2551,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",
|
||||
|
|
@ -2597,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",
|
||||
|
|
@ -2677,6 +2752,11 @@
|
|||
"file-uri-to-path": "1.0.0"
|
||||
}
|
||||
},
|
||||
"bootstrap-icons": {
|
||||
"version": "1.9.1",
|
||||
"resolved": "https://registry.npmjs.org/bootstrap-icons/-/bootstrap-icons-1.9.1.tgz",
|
||||
"integrity": "sha512-d4ZkO30MIkAhQ2nNRJqKXJVEQorALGbLWTuRxyCTJF96lRIV6imcgMehWGJUiJMJhglN0o2tqLIeDnMdiQEE9g=="
|
||||
},
|
||||
"brace-expansion": {
|
||||
"version": "1.1.11",
|
||||
"resolved": "https://registry.npmjs.org/brace-expansion/-/brace-expansion-1.1.11.tgz",
|
||||
|
|
@ -3402,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",
|
||||
|
|
@ -3643,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",
|
||||
|
|
@ -3735,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,12 +12,16 @@
|
|||
"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",
|
||||
"typescript": "^4.7.4",
|
||||
"vite": "^3.1.0"
|
||||
},
|
||||
"type": "module"
|
||||
"type": "module",
|
||||
"dependencies": {
|
||||
"nookies": "^2.5.2"
|
||||
}
|
||||
}
|
||||
|
|
|
|||
|
|
@ -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 |
1
frontend/svelte/src/routes/+layout.js
Normal file
1
frontend/svelte/src/routes/+layout.js
Normal file
|
|
@ -0,0 +1 @@
|
|||
export const ssr = false;
|
||||
|
|
@ -1,2 +1,231 @@
|
|||
<h1>AAAAAAAAAAAAAAa to SvelteKit</h1>
|
||||
<p>Visit <a href="https://kit.svelte.dev">kit.svelte.dev</a> to read the documentation</p>
|
||||
<script lang="ts">
|
||||
import type {Note} from "../types";
|
||||
|
||||
//TODO: TEMP!!!
|
||||
const tempJson = "[{\"id\":0,\"title\":\"samc\",\"content\":\"SAAAAAAAAAAMC\",\"lastOpened\":\"2022-09-25T10:45:49.903Z\"},{\"id\":1,\"title\":\"Push\",\"content\":\"Kollege Pusch\",\"lastOpened\":\"2022-09-25T10:50:49.903Z\"},{\"id\":2,\"title\":\"Mike\",\"content\":\"C Meister\",\"lastOpened\":\"2022-09-25T10:09:13.903Z\"},{\"id\":3,\"title\":\"kekw\",\"content\":\"OMEGALUL\",\"lastOpened\":\"2022-09-25T12:03:49.903Z\"}]";
|
||||
//TODO: TEMP!!!
|
||||
|
||||
let notes: Note[] = JSON.parse(tempJson);
|
||||
sortNotesByDate();
|
||||
window.localStorage.setItem("notes", JSON.stringify(notes));
|
||||
|
||||
/**
|
||||
* Reloads the Notes Listing
|
||||
* (by doing something very intelligent)
|
||||
*/
|
||||
function reloadNotesListing() {
|
||||
notes = notes.filter(i => i === i);
|
||||
}
|
||||
|
||||
/**
|
||||
* Sorts the "notes" Array by the lastOpened Property of a Note
|
||||
*/
|
||||
function sortNotesByDate() {
|
||||
notes.sort(function (x, y) {
|
||||
if (x.lastOpened > y.lastOpened) {
|
||||
return 1;
|
||||
}
|
||||
|
||||
if (x.lastOpened < y.lastOpened) {
|
||||
return -1;
|
||||
}
|
||||
|
||||
return 0;
|
||||
});
|
||||
}
|
||||
|
||||
/**
|
||||
* Gives the user a prompt to input the new title of the note and creates it if the title is valid
|
||||
*/
|
||||
function addNotePrompt() {
|
||||
let newTitle = prompt('Name of the new Note');
|
||||
console.log(notes)
|
||||
if (newTitle != null && newTitle != '') {
|
||||
addNote(newTitle);
|
||||
console.log(notes)
|
||||
sortNotesByDate();
|
||||
reloadNotesListing();
|
||||
window.localStorage.setItem("notes", JSON.stringify(notes));
|
||||
}
|
||||
}
|
||||
|
||||
/**
|
||||
* Adds a new note to the "notes" Array with:
|
||||
* * the latest id + 1 (or 0 if no notes exist)
|
||||
* * no content
|
||||
* @param title The title of the new Note
|
||||
*/
|
||||
function addNote(title: string) {
|
||||
let date = new Date();
|
||||
let newNoteId = (notes.length == 0) ? 0 : notes[notes.length - 1].id + 1
|
||||
let note: Note = {
|
||||
id: newNoteId,
|
||||
title: title,
|
||||
content: "",
|
||||
lastOpened: date.toISOString()
|
||||
};
|
||||
notes.push(note);
|
||||
}
|
||||
|
||||
/**
|
||||
* Gives the user a prompt if they are sure to delete this note and deletes it if they confirm
|
||||
* @param note The note to be removed
|
||||
*/
|
||||
function removeNotePrompt(note) {
|
||||
const reallyDelete = confirm("Do you really want to delete this Note?");
|
||||
if (reallyDelete) {
|
||||
removeNote(note);
|
||||
}
|
||||
}
|
||||
|
||||
/**
|
||||
* Removes the note from the "notes" Array
|
||||
* @param note The note to be removed
|
||||
*/
|
||||
function removeNote(note) {
|
||||
notes = notes.filter(i => i !== note);
|
||||
}
|
||||
|
||||
/**
|
||||
* Handle when the mouse hovers over a Note List Element
|
||||
* @param noteId The ID of the note that is hovered over
|
||||
*/
|
||||
function handleMouseOverLi(noteId: number) {
|
||||
document.getElementById("noteButton" + noteId).style.display = "block";
|
||||
}
|
||||
|
||||
/**
|
||||
* Handle when the mouse exits hovering over a Note List Element
|
||||
* @param noteId The ID of the note that is hovered over
|
||||
*/
|
||||
function handleMouseOutLi(noteId: number) {
|
||||
document.getElementById("noteButton" + noteId).style.display = "none";
|
||||
}
|
||||
|
||||
/**
|
||||
* Handles a click on a note list element
|
||||
* @param note The note the user clicked on
|
||||
*/
|
||||
function onNoteLiClick(note) {
|
||||
window.localStorage.setItem("clickedNoteId", note.id);
|
||||
window.location = "/editor";
|
||||
}
|
||||
</script>
|
||||
|
||||
|
||||
<html lang="en">
|
||||
<head>
|
||||
<meta charset="utf-8">
|
||||
<meta name="viewport" content="width=device-width, initial-scale=1">
|
||||
<title>PomeloNote | Home</title>
|
||||
<link href="https://cdn.jsdelivr.net/npm/bootstrap-icons@1.3.0/font/bootstrap-icons.css" rel="stylesheet">
|
||||
<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>
|
||||
<div class="row">
|
||||
<!-- Add Note Button -->
|
||||
<div class="offset-md-7 col-md-1">
|
||||
<button class="btn btn-primary" on:click={() => addNotePrompt()}>Add Note</button>
|
||||
</div>
|
||||
|
||||
<div class="offset-md-4 col-md-4">
|
||||
<!-- Notes listing -->
|
||||
<ul>
|
||||
{#each notes as note}
|
||||
<li on:mouseover={() => handleMouseOverLi(note.id)}
|
||||
on:mouseout={() => handleMouseOutLi(note.id)}>
|
||||
<div class="row">
|
||||
<div class="col-md-10" on:click={() => onNoteLiClick(note)}>
|
||||
<span>
|
||||
{note.title} <br/>
|
||||
{note.lastOpened}
|
||||
</span>
|
||||
</div>
|
||||
<div class="col-md-1">
|
||||
<button style="display: none" id={"noteButton" + note.id}
|
||||
on:click={() => removeNotePrompt(note)}>
|
||||
<i class="bi bi-x"></i>
|
||||
</button>
|
||||
</div>
|
||||
</div>
|
||||
</li>
|
||||
{/each}
|
||||
</ul>
|
||||
</div>
|
||||
</div>
|
||||
</body>
|
||||
</html>
|
||||
|
||||
<style>
|
||||
html,
|
||||
:root {
|
||||
--main-txt-color: black;
|
||||
--cross-txt-color: red;
|
||||
|
||||
--color-primary: #fff494;
|
||||
--color-primary-600: #fff17a;
|
||||
--color-primary-700: #ffec47;
|
||||
--color-primary-800: #ffe714;
|
||||
--color-primary-900: #e0c900;
|
||||
}
|
||||
|
||||
body {
|
||||
height: 100%;
|
||||
padding-top: 40px;
|
||||
padding-bottom: 40px;
|
||||
background-color: #ffffff;
|
||||
}
|
||||
|
||||
a {
|
||||
color: var(--main-txt-color);
|
||||
text-decoration: none;
|
||||
}
|
||||
|
||||
li {
|
||||
list-style: none;
|
||||
padding: 6px 10px;
|
||||
border-bottom: 1px solid #ddd;
|
||||
border-bottom-color: var(--color-primary-900);
|
||||
background-color: var(--color-primary-600);
|
||||
}
|
||||
|
||||
li button {
|
||||
float: right;
|
||||
border: none;
|
||||
background: transparent;
|
||||
padding: 0;
|
||||
margin: 0;
|
||||
font-size: 18px;
|
||||
cursor: pointer;
|
||||
}
|
||||
|
||||
li button:hover {
|
||||
transform: scale(1.7);
|
||||
}
|
||||
|
||||
li:last-child {
|
||||
border-bottom: none;
|
||||
}
|
||||
|
||||
ul {
|
||||
padding-left: 0;
|
||||
}
|
||||
|
||||
.bi-x {
|
||||
color: var(--cross-txt-color);
|
||||
}
|
||||
|
||||
.btn-primary {
|
||||
background-color: var(--color-primary-800);
|
||||
border: var(--color-primary-800);
|
||||
color: var(--main-txt-color);
|
||||
}
|
||||
|
||||
.btn-primary:hover {
|
||||
background-color: var(--color-primary-900);
|
||||
border: var(--color-primary-900);
|
||||
color: var(--main-txt-color);
|
||||
}
|
||||
</style>
|
||||
24
frontend/svelte/src/routes/editor/+page.svelte
Normal file
24
frontend/svelte/src/routes/editor/+page.svelte
Normal file
|
|
@ -0,0 +1,24 @@
|
|||
<script lang="ts">
|
||||
import type {Note} from "../../types";
|
||||
|
||||
let notes: Note[] = JSON.parse(window.localStorage.getItem("notes"));
|
||||
const clickedNoteId = window.localStorage.getItem("clickedNoteId");
|
||||
|
||||
const currNote = notes.find((note)=>{
|
||||
return note.id === parseInt(clickedNoteId);
|
||||
});
|
||||
</script>
|
||||
|
||||
<head>
|
||||
<meta charset="utf-8">
|
||||
<meta name="viewport" content="width=device-width, initial-scale=1">
|
||||
<title>{"Pomelonote | Edit " + currNote.title}</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>
|
||||
|
||||
<html lang="en">
|
||||
<div class="offset-3 col-6">
|
||||
{currNote.content}
|
||||
</div>
|
||||
</html>
|
||||
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;
|
||||
}
|
||||
6
frontend/svelte/src/types.ts
Normal file
6
frontend/svelte/src/types.ts
Normal file
|
|
@ -0,0 +1,6 @@
|
|||
export interface Note {
|
||||
id: number;
|
||||
title: string;
|
||||
content: string;
|
||||
lastOpened: string;
|
||||
}
|
||||
|
|
@ -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