From a49a4d9b5f9774aca745d2064b8384ab5e115cb2 Mon Sep 17 00:00:00 2001 From: ChrQR Date: Sun, 19 May 2024 22:18:25 +0200 Subject: [PATCH] finished initial iteration of project cards --- package-lock.json | 12 ++++ package.json | 1 + src/app.css | 2 +- src/lib/ProjectCard/Commit.svelte | 1 - src/lib/ProjectCard/ProjectCard.svelte | 4 +- src/lib/ProjectCard/ProjectDescription.svelte | 5 ++ src/lib/ProjectCard/ProjectHeader.svelte | 2 +- src/lib/ProjectCard/ProjectRepo.svelte | 17 ++++++ src/lib/ProjectCard/RssContainer.svelte | 4 +- src/lib/ProjectCard/VendorGallery.svelte | 14 +++++ src/lib/ProjectCard/VendorIcon.svelte | 12 ++++ src/lib/images/vendorIcons/svelteIcon.svg | 7 +-- src/lib/projects.js | 60 ++++++++++--------- src/routes/+layout.svelte | 2 +- src/routes/next.js/+page.svelte | 3 +- 15 files changed, 103 insertions(+), 43 deletions(-) create mode 100644 src/lib/ProjectCard/VendorIcon.svelte diff --git a/package-lock.json b/package-lock.json index 0396564..f8936c8 100644 --- a/package-lock.json +++ b/package-lock.json @@ -24,6 +24,7 @@ "eslint-plugin-svelte": "^2.35.1", "flowbite": "^2.3.0", "flowbite-svelte": "^0.46.1", + "flowbite-svelte-icons": "^1.6.1", "postcss": "^8.4.38", "prettier": "^3.1.1", "prettier-plugin-svelte": "^3.1.2", @@ -2265,6 +2266,17 @@ "svelte": "^3.55.1 || ^4.0.0" } }, + "node_modules/flowbite-svelte-icons": { + "version": "1.6.1", + "resolved": "https://registry.npmjs.org/flowbite-svelte-icons/-/flowbite-svelte-icons-1.6.1.tgz", + "integrity": "sha512-Kw/7BzA6fqlFq7tBNudwX0KVU4cbyyXcMcgHTraMwGBtvBQan0RKMbvWwqm4JZNvLGAvRv1BM2EF7rzo/oam1Q==", + "dev": true, + "peerDependencies": { + "svelte": "^3.54.0 || ^4.0.0 || ^5.0.0", + "tailwind-merge": "^2.0.0", + "tailwindcss": "^3.3.2" + } + }, "node_modules/foreground-child": { "version": "3.1.1", "resolved": "https://registry.npmjs.org/foreground-child/-/foreground-child-3.1.1.tgz", diff --git a/package.json b/package.json index 60c2f7f..46a93d2 100644 --- a/package.json +++ b/package.json @@ -20,6 +20,7 @@ "eslint-plugin-svelte": "^2.35.1", "flowbite": "^2.3.0", "flowbite-svelte": "^0.46.1", + "flowbite-svelte-icons": "^1.6.1", "postcss": "^8.4.38", "prettier": "^3.1.1", "prettier-plugin-svelte": "^3.1.2", diff --git a/src/app.css b/src/app.css index 4bae7d2..9366e48 100644 --- a/src/app.css +++ b/src/app.css @@ -6,5 +6,5 @@ body { transition: background-color 0.2s ease-in-out, color 0.2s ease-in-out; - @apply bg-stone-100 dark:bg-gray-900 text-slate-600 dark:text-stone-100 text-center; + @apply bg-stone-200 dark:bg-gray-900 text-gray-900 dark:text-stone-200 text-center; } diff --git a/src/lib/ProjectCard/Commit.svelte b/src/lib/ProjectCard/Commit.svelte index fd73c23..c065620 100644 --- a/src/lib/ProjectCard/Commit.svelte +++ b/src/lib/ProjectCard/Commit.svelte @@ -1,6 +1,5 @@ + +

{@html description}

diff --git a/src/lib/ProjectCard/ProjectHeader.svelte b/src/lib/ProjectCard/ProjectHeader.svelte index a3fcd19..2adb942 100644 --- a/src/lib/ProjectCard/ProjectHeader.svelte +++ b/src/lib/ProjectCard/ProjectHeader.svelte @@ -2,4 +2,4 @@ export let title; -

{title}

+

{title}

diff --git a/src/lib/ProjectCard/ProjectRepo.svelte b/src/lib/ProjectCard/ProjectRepo.svelte index 849bc2d..8f8af04 100644 --- a/src/lib/ProjectCard/ProjectRepo.svelte +++ b/src/lib/ProjectCard/ProjectRepo.svelte @@ -1,6 +1,23 @@ +
+
+ + + +

www

+
+
+ + + +

git

+
+
diff --git a/src/lib/ProjectCard/RssContainer.svelte b/src/lib/ProjectCard/RssContainer.svelte index 84c28d3..e0d60e4 100644 --- a/src/lib/ProjectCard/RssContainer.svelte +++ b/src/lib/ProjectCard/RssContainer.svelte @@ -1,9 +1,9 @@
-

Here are the 5 most recent commits

+

recent commits

diff --git a/src/lib/ProjectCard/VendorGallery.svelte b/src/lib/ProjectCard/VendorGallery.svelte index e69de29..ef63a75 100644 --- a/src/lib/ProjectCard/VendorGallery.svelte +++ b/src/lib/ProjectCard/VendorGallery.svelte @@ -0,0 +1,14 @@ + + +
+

built with

+
+ {#each vendors as vendor} + + {/each} +
+
diff --git a/src/lib/ProjectCard/VendorIcon.svelte b/src/lib/ProjectCard/VendorIcon.svelte new file mode 100644 index 0000000..4611020 --- /dev/null +++ b/src/lib/ProjectCard/VendorIcon.svelte @@ -0,0 +1,12 @@ + + + +
+ {name} +

{name}

+
+ diff --git a/src/lib/images/vendorIcons/svelteIcon.svg b/src/lib/images/vendorIcons/svelteIcon.svg index ab91ce8..7cee5e1 100644 --- a/src/lib/images/vendorIcons/svelteIcon.svg +++ b/src/lib/images/vendorIcons/svelteIcon.svg @@ -1,7 +1,2 @@ - \ No newline at end of file +file_type_svelte \ No newline at end of file diff --git a/src/lib/projects.js b/src/lib/projects.js index 22bcc77..adfda50 100644 --- a/src/lib/projects.js +++ b/src/lib/projects.js @@ -4,30 +4,36 @@ import vercelIcon from '$lib/images/vendorIcons/vercelIcon.svg'; import flowbiteLight from '$lib/images/vendorIcons/flowbiteLight.svg'; export const projects = [ - { - category: "svelte", - title: "portfolio", - url: "https://rannes.dev", - description: "A project to get familiar with Svelte and showcase my future projects.", - repo: "https://gitea.rannes.dev/rannes.dev/my-portfolio", - rss: "https://gitea.rannes.dev/rannes.dev/my-portfolio.rss", - image: "", - vendors: [ - { - name: "Svelte", - img: svelteIcon - }, - { - name: "Tailwind CSS", - img: tailwindIcon - }, - { - name: "Flowbite-svelte", - img: flowbiteLight - }, - { - name: "Vercel", - img: vercelIcon - },] - } -] \ No newline at end of file + { + category: 'svelte', + title: 'portfolio', + url: 'https://rannes.dev', + description: + 'This project was initially to get familiar with Svelte and showcase my future projects. I find myself that I keep coming back to expand on it whenever I need a break from React.', + repo: 'https://gitea.rannes.dev/rannes.dev/my-portfolio', + rss: 'https://gitea.rannes.dev/rannes.dev/my-portfolio.rss', + image: '', + vendors: [ + { + name: 'Svelte', + img: svelteIcon, + url: 'https://svelte.dev/' + }, + { + name: 'Tailwind', + img: tailwindIcon, + url: 'https://tailwindcss.com/' + }, + { + name: 'Flowbite', + img: flowbiteLight, + url: 'https://flowbite-svelte.com//' + }, + { + name: 'Vercel', + img: vercelIcon, + url: 'https://vercel.com/' + } + ] + } +]; diff --git a/src/routes/+layout.svelte b/src/routes/+layout.svelte index c040d14..411f4b6 100644 --- a/src/routes/+layout.svelte +++ b/src/routes/+layout.svelte @@ -76,7 +76,7 @@ -
+