From 4fc784e5c8ffc94a56129a6b3d41d190d397109e Mon Sep 17 00:00:00 2001 From: Omer Sabic Date: Thu, 20 Jun 2024 23:21:22 +0200 Subject: [PATCH] helpful stuff --- package-lock.json | 8 +- package.json | 18 +- .../ui/collapsible/collapsible-content.svelte | 12 + src/lib/components/ui/collapsible/index.js | 13 + .../(app)/articles/createArticleDialog.svelte | 12 +- src/routes/(app)/website/+page.svelte | 437 ++++++++++-------- 6 files changed, 300 insertions(+), 200 deletions(-) create mode 100644 src/lib/components/ui/collapsible/collapsible-content.svelte create mode 100644 src/lib/components/ui/collapsible/index.js diff --git a/package-lock.json b/package-lock.json index c65881b..08c8963 100644 --- a/package-lock.json +++ b/package-lock.json @@ -9,7 +9,7 @@ "version": "0.0.1", "dependencies": { "aws-sdk": "^2.1628.0", - "bits-ui": "^0.21.7", + "bits-ui": "^0.21.10", "clsx": "^2.1.1", "dotenv": "^16.4.5", "tailwind-merge": "^2.3.0", @@ -1468,9 +1468,9 @@ } }, "node_modules/bits-ui": { - "version": "0.21.7", - "resolved": "https://registry.npmjs.org/bits-ui/-/bits-ui-0.21.7.tgz", - "integrity": "sha512-1PKp90ly1R6jexIiAUj1Dk4u2pln7ok+L8Vc0rHMY7pi7YZvadFNZvkp1G5BtmL8qh2xsn4MVNgKjPAQMCxW0A==", + "version": "0.21.10", + "resolved": "https://registry.npmjs.org/bits-ui/-/bits-ui-0.21.10.tgz", + "integrity": "sha512-KuweEOKO0Rr8XX87dQh46G9mG0bZSmTqNxj5qBazz4OTQC+oPKui04/wP/ISsCOSGFomaRydTULqh4p+nsyc2g==", "dependencies": { "@internationalized/date": "^3.5.1", "@melt-ui/svelte": "0.76.2", diff --git a/package.json b/package.json index 625db86..927736b 100644 --- a/package.json +++ b/package.json @@ -18,6 +18,9 @@ "@sveltejs/vite-plugin-svelte": "^3.0.0", "@tabler/icons-svelte": "^3.3.0", "autoprefixer": "^10.4.16", + "formsnap": "^1.0.0", + "lucide-svelte": "^0.373.0", + "mode-watcher": "^0.3.0", "postcss": "^8.4.32", "postcss-load-config": "^5.0.2", "prettier": "^3.1.1", @@ -27,23 +30,20 @@ "svelte-awesome-color-picker": "^3.0.6", "svelte-check": "^3.6.0", "svelte-legos": "^0.2.2", - "tailwindcss": "^3.3.6", - "timeago.js": "^4.0.2", - "typescript": "^5.0.0", - "vite": "^5.0.3", - "formsnap": "^1.0.0", - "lucide-svelte": "^0.373.0", - "mode-watcher": "^0.3.0", "svelte-markdown": "^0.4.1", "svelte-motion": "^0.12.2", "svelte-radix": "^1.1.0", "svelte-sonner": "^0.3.22", - "sveltekit-superforms": "^2.12.6" + "sveltekit-superforms": "^2.12.6", + "tailwindcss": "^3.3.6", + "timeago.js": "^4.0.2", + "typescript": "^5.0.0", + "vite": "^5.0.3" }, "type": "module", "dependencies": { "aws-sdk": "^2.1628.0", - "bits-ui": "^0.21.7", + "bits-ui": "^0.21.10", "clsx": "^2.1.1", "dotenv": "^16.4.5", "tailwind-merge": "^2.3.0", diff --git a/src/lib/components/ui/collapsible/collapsible-content.svelte b/src/lib/components/ui/collapsible/collapsible-content.svelte new file mode 100644 index 0000000..c79a367 --- /dev/null +++ b/src/lib/components/ui/collapsible/collapsible-content.svelte @@ -0,0 +1,12 @@ + + + + + diff --git a/src/lib/components/ui/collapsible/index.js b/src/lib/components/ui/collapsible/index.js new file mode 100644 index 0000000..97a1a03 --- /dev/null +++ b/src/lib/components/ui/collapsible/index.js @@ -0,0 +1,13 @@ +import { Collapsible as CollapsiblePrimitive } from "bits-ui"; +import Content from "./collapsible-content.svelte"; +const Root = CollapsiblePrimitive.Root; +const Trigger = CollapsiblePrimitive.Trigger; +export { + Root, + Content, + Trigger, + // + Root as Collapsible, + Content as CollapsibleContent, + Trigger as CollapsibleTrigger, +}; diff --git a/src/routes/(app)/articles/createArticleDialog.svelte b/src/routes/(app)/articles/createArticleDialog.svelte index c68baaa..8b5db38 100644 --- a/src/routes/(app)/articles/createArticleDialog.svelte +++ b/src/routes/(app)/articles/createArticleDialog.svelte @@ -141,16 +141,16 @@ - Short (~700 words)Short - Medium (~1500 words) + Medium - Long (~2500 words) + Long diff --git a/src/routes/(app)/website/+page.svelte b/src/routes/(app)/website/+page.svelte index 735dd7d..5d39b05 100644 --- a/src/routes/(app)/website/+page.svelte +++ b/src/routes/(app)/website/+page.svelte @@ -11,6 +11,10 @@ import { Textarea } from '$lib/components/ui/textarea'; import * as Tooltip from '$lib/components/ui/tooltip'; import { config } from '$lib'; + import { QuestionMarkCircled } from 'svelte-radix'; + import ChevronsUpDown from 'lucide-svelte/icons/chevrons-up-down'; + import * as Collapsible from '$lib/components/ui/collapsible/index.js'; + import { Button } from '$lib/components/ui/button/index.js'; /** @type {import("./$types").PageServerData} */ export let data; @@ -71,200 +75,271 @@ } let disable_freebies = !$formData.use_freebie; + let disable_autopublish = !$formData.auto_publish; $: disable_freebies = !$formData.use_freebie; + $: disable_autopublish = !$formData.auto_publish;
+
-

Basics

- - - Blog name - - - - - - - - Blog title - - - - - - - - Blog subtitle - - - - - - - - - Primary color - { - if (e.detail.hex) $formData.primary_color_hex = e.detail.hex; - }} - hex={data.blog_info.primary_color_hex} - {...attrs} - /> - - - - - - - Secondary color - { - if (e.detail.hex) $formData.secondary_color_hex = e.detail.hex; - }} - hex={data.blog_info.secondary_color_hex} - {...attrs} - /> - - - - - - - Text color - { - if (e.detail.hex) $formData.text_color_hex = e.detail.hex; - }} - hex={data.blog_info.text_color_hex} - {...attrs} - /> - - - - - - - Custom domain - - - {#if data.blog_info.subdomain_slug} - You can also access your website at {data.blog_info.subdomain_slug}.{config.sites_url} - {/if} - - - - - - - Auto Publish - - -

Automatically creates a blog post for you when you upload a video

- - - - - - + +
+

Basics

+ + + +
+ + + + Blog name + + + + + + + + Blog title + + + + + + + + Blog subtitle + + + + + + + + Primary color + { + if (e.detail.hex) $formData.primary_color_hex = e.detail.hex; + }} + hex={data.blog_info.primary_color_hex} + {...attrs} + /> + + + + + + + Secondary color + { + if (e.detail.hex) $formData.secondary_color_hex = e.detail.hex; + }} + hex={data.blog_info.secondary_color_hex} + {...attrs} + /> + + + + + + + Text color + { + if (e.detail.hex) $formData.text_color_hex = e.detail.hex; + }} + hex={data.blog_info.text_color_hex} + {...attrs} + /> + + + + + + + Custom domain + + + {#if data.blog_info.subdomain_slug} + You can also access your website at {data.blog_info.subdomain_slug}.{config.sites_url} + {/if} + + + +
-

Freebies

- - - Send freebie -
- - - + +
+

Freebies

+ + + +
+ + + + Send freebie +
+ + + +
+ Whether to send a freebie when a new person enters their email on your website. + + + + + Freebie Name +
+ +
+ + + + + + Freebie file +
+ + handleFileChange(e, $formData.freebie_url).then((x) => { + $formData.freebie_url = x; + })} + bind:disabled={disable_freebies} + /> + +
+ + Maximum size of 5MB (TEMPORARY) + + + - Whether to send a freebie when a new person enters their email on your website. - - - - - Freebie Name -
- -
- - - - - - Freebie file -
- - handleFileChange(e, $formData.freebie_url).then((x) => { - $formData.freebie_url = x; - })} - bind:disabled={disable_freebies} - /> - -
- - Maximum size of 5MB (TEMPORARY) - - - - - - Freebie text -
-