diff --git a/package.json b/package.json index d3f0ec21..b0738495 100644 --- a/package.json +++ b/package.json @@ -38,8 +38,8 @@ "postcss-nested": "^5.0.6", "postcss-preset-env": "^7.4.2", "postcss-strip-inline-comments": "^0.1.5", - "prettier": "^2.5.1", - "prettier-plugin-svelte": "^2.5.0", + "prism-svelte": "^0.5.0", + "prismjs": "^1.27.0", "svelte": "^3.44.0", "svelte-check": "^2.2.6", "svelte-preprocess": "^4.10.1", @@ -65,5 +65,8 @@ "bugs": { "url": "https://github.com/modrinth/omorphia/issues" }, - "homepage": "https://omorphia.modrinth.com" + "homepage": "https://omorphia.modrinth.com", + "dependencies": { + "sanitize.css": "^13.0.0" + } } diff --git a/pnpm-lock.yaml b/pnpm-lock.yaml index 619a84a4..a4c29d03 100644 --- a/pnpm-lock.yaml +++ b/pnpm-lock.yaml @@ -23,8 +23,9 @@ specifiers: postcss-nested: ^5.0.6 postcss-preset-env: ^7.4.2 postcss-strip-inline-comments: ^0.1.5 - prettier: ^2.5.1 - prettier-plugin-svelte: ^2.5.0 + prism-svelte: ^0.5.0 + prismjs: ^1.27.0 + sanitize.css: ^13.0.0 svelte: ^3.44.0 svelte-check: ^2.2.6 svelte-preprocess: ^4.10.1 @@ -34,13 +35,16 @@ specifiers: typescript: ~4.6.2 unplugin-icons: ^0.13.3 +dependencies: + sanitize.css: 13.0.0 + devDependencies: '@iconify-json/carbon': 1.1.1 '@iconify-json/heroicons-outline': 1.1.1 '@iconify-json/lucide': 1.1.7 '@poppanator/sveltekit-svg': 0.3.1_svelte@3.46.4 '@sveltejs/adapter-auto': 1.0.0-next.33 - '@sveltejs/kit': 1.0.0-next.299_svelte@3.46.4 + '@sveltejs/kit': 1.0.0-next.301_svelte@3.46.4 '@typescript-eslint/eslint-plugin': 5.14.0_e3f5f4efe2bd492e36eb6c1c619dfc98 '@typescript-eslint/parser': 5.14.0_eslint@7.32.0+typescript@4.6.2 autoprefixer: 10.4.2_postcss@8.4.8 @@ -57,8 +61,8 @@ devDependencies: postcss-nested: 5.0.6_postcss@8.4.8 postcss-preset-env: 7.4.2_postcss@8.4.8 postcss-strip-inline-comments: 0.1.5 - prettier: 2.5.1 - prettier-plugin-svelte: 2.6.0_prettier@2.5.1+svelte@3.46.4 + prism-svelte: 0.5.0 + prismjs: 1.27.0 svelte: 3.46.4 svelte-check: 2.4.5_33233005e4be8b4492b63cc9de0a2fd4 svelte-preprocess: 4.10.4_8c88c4f1b7a55bcfafd385f58ef1abcd @@ -360,8 +364,8 @@ packages: esbuild: 0.14.25 dev: true - /@sveltejs/kit/1.0.0-next.299_svelte@3.46.4: - resolution: {integrity: sha512-m8VBccfX3ozgHjjz193pZbfTK02P47bqdhj07cveUEhVLwbujOVWbgblPCrNh0rkTER7z1k5hRZnWrFYaDjQJA==} + /@sveltejs/kit/1.0.0-next.301_svelte@3.46.4: + resolution: {integrity: sha512-F/XP1VEu+fpvgY04JekNxAFupccNMKOyXtbox0LwNJvBulL15/Tzy6tf4g+9t2Jy7mprwI3h0ZC9G/nVujRFnQ==} engines: {node: '>=14.13'} hasBin: true peerDependencies: @@ -3114,26 +3118,14 @@ packages: engines: {node: '>=4'} dev: true - /prettier-plugin-svelte/2.6.0_prettier@2.5.1+svelte@3.46.4: - resolution: {integrity: sha512-NPSRf6Y5rufRlBleok/pqg4+1FyGsL0zYhkYP6hnueeL1J/uCm3OfOZPsLX4zqD9VAdcXfyEL2PYqGv8ZoOSfA==} - peerDependencies: - prettier: ^1.16.4 || ^2.0.0 - svelte: ^3.2.0 - dependencies: - prettier: 2.5.1 - svelte: 3.46.4 - dev: true - - /prettier/2.5.1: - resolution: {integrity: sha512-vBZcPRUR5MZJwoyi3ZoyQlc1rXeEck8KgeC9AwwOn+exuxLxq5toTRDTSaVrXHxelDMHy9zlicw8u66yxoSUFg==} - engines: {node: '>=10.13.0'} - hasBin: true - dev: true - /prism-svelte/0.4.7: resolution: {integrity: sha512-yABh19CYbM24V7aS7TuPYRNMqthxwbvx6FF/Rw920YbyBWO3tnyPIqRMgHuSVsLmuHkkBS1Akyof463FVdkeDQ==} dev: true + /prism-svelte/0.5.0: + resolution: {integrity: sha512-db91Bf3pRGKDPz1lAqLFSJXeW13mulUJxhycysFpfXV5MIK7RgWWK2E5aPAa71s8TCzQUXxF5JOV42/iOs6QkA==} + dev: true + /prismjs/1.27.0: resolution: {integrity: sha512-t13BGPUlFDR7wRB5kQDG4jjl7XeuH6jbJGt11JHPL96qwsEHNX2+68tFXqc1/k+/jALsbSWJKUOT/hcYAZ5LkA==} engines: {node: '>=6'} @@ -3287,6 +3279,10 @@ packages: rimraf: 2.7.1 dev: true + /sanitize.css/13.0.0: + resolution: {integrity: sha512-ZRwKbh/eQ6w9vmTjkuG0Ioi3HBwPFce0O+v//ve+aOq1oeCy7jMV2qzzAlpsNuqpqCBjjriM1lbtZbF/Q8jVyA==} + dev: false + /semver-diff/3.1.1: resolution: {integrity: sha512-GX0Ix/CJcHyB8c4ykpHGIAvLyOwOobtM/8d+TQkAd81/bEjgPHrfba41Vpesr7jX/t8Uh+R3EX9eAS5be+jQYg==} engines: {node: '>=8'} diff --git a/postcss.config.cjs b/postcss.config.cjs index 12f4da34..2690b963 100644 --- a/postcss.config.cjs +++ b/postcss.config.cjs @@ -2,10 +2,10 @@ const config = { plugins: [ require('postcss-import'), require('postcss-strip-inline-comments'), + require('postcss-extend-rule'), require('postcss-nested'), require('postcss-preset-env'), require('autoprefixer'), - require('postcss-extend-rule'), process.env.NODE_ENV === 'development' && require('cssnano')({ preset: 'default', }) diff --git a/src/lib/components/Avatar.svelte b/src/lib/components/Avatar.svelte new file mode 100644 index 00000000..ba726340 --- /dev/null +++ b/src/lib/components/Avatar.svelte @@ -0,0 +1,94 @@ + + +{#if src} + +{:else} + + + + +{/if} + + diff --git a/src/lib/components/Badge.svelte b/src/lib/components/Badge.svelte new file mode 100644 index 00000000..9f85757f --- /dev/null +++ b/src/lib/components/Badge.svelte @@ -0,0 +1,51 @@ + + +
+ {label} +
+ + diff --git a/src/lib/components/Button.svelte b/src/lib/components/Button.svelte index f8b5b08a..5f222eba 100644 --- a/src/lib/components/Button.svelte +++ b/src/lib/components/Button.svelte @@ -1,323 +1,145 @@ {#if as === 'button'} - {:else if as === 'a'} - - + + {:else if as === 'summary'} - - + + {:else if as === 'input'} - + {/if} diff --git a/src/lib/components/Link.svelte b/src/lib/components/Link.svelte index 3387830c..c8f51631 100644 --- a/src/lib/components/Link.svelte +++ b/src/lib/components/Link.svelte @@ -6,6 +6,10 @@ \ No newline at end of file diff --git a/src/lib/components/NavRow.svelte b/src/lib/components/NavRow.svelte new file mode 100644 index 00000000..a6d15c9f --- /dev/null +++ b/src/lib/components/NavRow.svelte @@ -0,0 +1,81 @@ + + + + + diff --git a/src/lib/components/Pagination.svelte b/src/lib/components/Pagination.svelte index 37b5cbd4..e88ef31e 100644 --- a/src/lib/components/Pagination.svelte +++ b/src/lib/components/Pagination.svelte @@ -1,5 +1,5 @@ + +
+
+ +
+
{@html highlighted}
+
+ + diff --git a/src/routes/_internal/components/Sidebar.svelte b/src/routes/_internal/components/Sidebar.svelte index 52ee4378..93e4cc1f 100644 --- a/src/routes/_internal/components/Sidebar.svelte +++ b/src/routes/_internal/components/Sidebar.svelte @@ -1,5 +1,5 @@