diff --git a/src/app.css b/src/app.css
index fa642ab..dd09314 100644
--- a/src/app.css
+++ b/src/app.css
@@ -6,6 +6,8 @@
@plugin 'tailwindcss-animate';
@source '../node_modules/@foxui';
+@import '@foxui/core/theme.css';
+
@custom-variant dark (&:where(.dark, .dark *):not(:where(.light, .light *)));
@custom-variant accent (&:where(.accent, .accent *));
@@ -58,364 +60,3 @@ body::-webkit-scrollbar-thumb:hover {
.dark body::-webkit-scrollbar-thumb:hover {
background-color: var(--color-base-700);
}
-
-@theme inline {
- --color-base-50: var(--base-50);
- --color-base-100: var(--base-100);
- --color-base-200: var(--base-200);
- --color-base-300: var(--base-300);
- --color-base-400: var(--base-400);
- --color-base-500: var(--base-500);
- --color-base-600: var(--base-600);
- --color-base-700: var(--base-700);
- --color-base-800: var(--base-800);
- --color-base-900: var(--base-900);
- --color-base-950: var(--base-950);
-
- --color-accent-50: var(--accent-50);
- --color-accent-100: var(--accent-100);
- --color-accent-200: var(--accent-200);
- --color-accent-300: var(--accent-300);
- --color-accent-400: var(--accent-400);
- --color-accent-500: var(--accent-500);
- --color-accent-600: var(--accent-600);
- --color-accent-700: var(--accent-700);
- --color-accent-800: var(--accent-800);
- --color-accent-900: var(--accent-900);
- --color-accent-950: var(--accent-950);
-}
-
-@layer base {
- :root {
- --accent-50: var(--color-pink-50);
- --accent-100: var(--color-pink-100);
- --accent-200: var(--color-pink-200);
- --accent-300: var(--color-pink-300);
- --accent-400: var(--color-pink-400);
- --accent-500: var(--color-pink-500);
- --accent-600: var(--color-pink-600);
- --accent-700: var(--color-pink-700);
- --accent-800: var(--color-pink-800);
- --accent-900: var(--color-pink-900);
- --accent-950: var(--color-pink-950);
-
- --base-50: var(--color-neutral-50);
- --base-100: var(--color-neutral-100);
- --base-200: var(--color-neutral-200);
- --base-300: var(--color-neutral-300);
- --base-400: var(--color-neutral-400);
- --base-500: var(--color-neutral-500);
- --base-600: var(--color-neutral-600);
- --base-700: var(--color-neutral-700);
- --base-800: var(--color-neutral-800);
- --base-900: var(--color-neutral-900);
- --base-950: var(--color-neutral-950);
- }
-
- .red {
- --accent-50: var(--color-red-50);
- --accent-100: var(--color-red-100);
- --accent-200: var(--color-red-200);
- --accent-300: var(--color-red-300);
- --accent-400: var(--color-red-400);
- --accent-500: var(--color-red-500);
- --accent-600: var(--color-red-600);
- --accent-700: var(--color-red-700);
- --accent-800: var(--color-red-800);
- --accent-900: var(--color-red-900);
- --accent-950: var(--color-red-950);
- }
-
- .orange {
- --accent-50: var(--color-orange-50);
- --accent-100: var(--color-orange-100);
- --accent-200: var(--color-orange-200);
- --accent-300: var(--color-orange-300);
- --accent-400: var(--color-orange-400);
- --accent-500: var(--color-orange-500);
- --accent-600: var(--color-orange-600);
- --accent-700: var(--color-orange-700);
- --accent-800: var(--color-orange-800);
- --accent-900: var(--color-orange-900);
- --accent-950: var(--color-orange-950);
- }
-
- .amber {
- --accent-50: var(--color-amber-50);
- --accent-100: var(--color-amber-100);
- --accent-200: var(--color-amber-200);
- --accent-300: var(--color-amber-300);
- --accent-400: var(--color-amber-400);
- --accent-500: var(--color-amber-500);
- --accent-600: var(--color-amber-600);
- --accent-700: var(--color-amber-700);
- --accent-800: var(--color-amber-800);
- --accent-900: var(--color-amber-900);
- --accent-950: var(--color-amber-950);
- }
-
- .yellow {
- --accent-50: var(--color-yellow-50);
- --accent-100: var(--color-yellow-100);
- --accent-200: var(--color-yellow-200);
- --accent-300: var(--color-yellow-300);
- --accent-400: var(--color-yellow-400);
- --accent-500: var(--color-yellow-500);
- --accent-600: var(--color-yellow-600);
- --accent-700: var(--color-yellow-700);
- --accent-800: var(--color-yellow-800);
- --accent-900: var(--color-yellow-900);
- --accent-950: var(--color-yellow-950);
- }
-
- .lime {
- --accent-50: var(--color-lime-50);
- --accent-100: var(--color-lime-100);
- --accent-200: var(--color-lime-200);
- --accent-300: var(--color-lime-300);
- --accent-400: var(--color-lime-400);
- --accent-500: var(--color-lime-500);
- --accent-600: var(--color-lime-600);
- --accent-700: var(--color-lime-700);
- --accent-800: var(--color-lime-800);
- --accent-900: var(--color-lime-900);
- --accent-950: var(--color-lime-950);
- }
-
- .green {
- --accent-50: var(--color-green-50);
- --accent-100: var(--color-green-100);
- --accent-200: var(--color-green-200);
- --accent-300: var(--color-green-300);
- --accent-400: var(--color-green-400);
- --accent-500: var(--color-green-500);
- --accent-600: var(--color-green-600);
- --accent-700: var(--color-green-700);
- --accent-800: var(--color-green-800);
- --accent-900: var(--color-green-900);
- --accent-950: var(--color-green-950);
- }
-
- .emerald {
- --accent-50: var(--color-emerald-50);
- --accent-100: var(--color-emerald-100);
- --accent-200: var(--color-emerald-200);
- --accent-300: var(--color-emerald-300);
- --accent-400: var(--color-emerald-400);
- --accent-500: var(--color-emerald-500);
- --accent-600: var(--color-emerald-600);
- --accent-700: var(--color-emerald-700);
- --accent-800: var(--color-emerald-800);
- --accent-900: var(--color-emerald-900);
- --accent-950: var(--color-emerald-950);
- }
-
- .teal {
- --accent-50: var(--color-teal-50);
- --accent-100: var(--color-teal-100);
- --accent-200: var(--color-teal-200);
- --accent-300: var(--color-teal-300);
- --accent-400: var(--color-teal-400);
- --accent-500: var(--color-teal-500);
- --accent-600: var(--color-teal-600);
- --accent-700: var(--color-teal-700);
- --accent-800: var(--color-teal-800);
- --accent-900: var(--color-teal-900);
- --accent-950: var(--color-teal-950);
- }
-
- .cyan {
- --accent-50: var(--color-cyan-50);
- --accent-100: var(--color-cyan-100);
- --accent-200: var(--color-cyan-200);
- --accent-300: var(--color-cyan-300);
- --accent-400: var(--color-cyan-400);
- --accent-500: var(--color-cyan-500);
- --accent-600: var(--color-cyan-600);
- --accent-700: var(--color-cyan-700);
- --accent-800: var(--color-cyan-800);
- --accent-900: var(--color-cyan-900);
- --accent-950: var(--color-cyan-950);
- }
-
- .sky {
- --accent-50: var(--color-sky-50);
- --accent-100: var(--color-sky-100);
- --accent-200: var(--color-sky-200);
- --accent-300: var(--color-sky-300);
- --accent-400: var(--color-sky-400);
- --accent-500: var(--color-sky-500);
- --accent-600: var(--color-sky-600);
- --accent-700: var(--color-sky-700);
- --accent-800: var(--color-sky-800);
- --accent-900: var(--color-sky-900);
- --accent-950: var(--color-sky-950);
- }
- .blue {
- --accent-50: var(--color-blue-50);
- --accent-100: var(--color-blue-100);
- --accent-200: var(--color-blue-200);
- --accent-300: var(--color-blue-300);
- --accent-400: var(--color-blue-400);
- --accent-500: var(--color-blue-500);
- --accent-600: var(--color-blue-600);
- --accent-700: var(--color-blue-700);
- --accent-800: var(--color-blue-800);
- --accent-900: var(--color-blue-900);
- --accent-950: var(--color-blue-950);
- }
-
- .indigo {
- --accent-50: var(--color-indigo-50);
- --accent-100: var(--color-indigo-100);
- --accent-200: var(--color-indigo-200);
- --accent-300: var(--color-indigo-300);
- --accent-400: var(--color-indigo-400);
- --accent-500: var(--color-indigo-500);
- --accent-600: var(--color-indigo-600);
- --accent-700: var(--color-indigo-700);
- --accent-800: var(--color-indigo-800);
- --accent-900: var(--color-indigo-900);
- --accent-950: var(--color-indigo-950);
- }
-
- .violet {
- --accent-50: var(--color-violet-50);
- --accent-100: var(--color-violet-100);
- --accent-200: var(--color-violet-200);
- --accent-300: var(--color-violet-300);
- --accent-400: var(--color-violet-400);
- --accent-500: var(--color-violet-500);
- --accent-600: var(--color-violet-600);
- --accent-700: var(--color-violet-700);
- --accent-800: var(--color-violet-800);
- --accent-900: var(--color-violet-900);
- --accent-950: var(--color-violet-950);
- }
-
- .purple {
- --accent-50: var(--color-purple-50);
- --accent-100: var(--color-purple-100);
- --accent-200: var(--color-purple-200);
- --accent-300: var(--color-purple-300);
- --accent-400: var(--color-purple-400);
- --accent-500: var(--color-purple-500);
- --accent-600: var(--color-purple-600);
- --accent-700: var(--color-purple-700);
- --accent-800: var(--color-purple-800);
- --accent-900: var(--color-purple-900);
- --accent-950: var(--color-purple-950);
- }
-
- .fuchsia {
- --accent-50: var(--color-fuchsia-50);
- --accent-100: var(--color-fuchsia-100);
- --accent-200: var(--color-fuchsia-200);
- --accent-300: var(--color-fuchsia-300);
- --accent-400: var(--color-fuchsia-400);
- --accent-500: var(--color-fuchsia-500);
- --accent-600: var(--color-fuchsia-600);
- --accent-700: var(--color-fuchsia-700);
- --accent-800: var(--color-fuchsia-800);
- --accent-900: var(--color-fuchsia-900);
- --accent-950: var(--color-fuchsia-950);
- }
-
- .pink {
- --accent-50: var(--color-pink-50);
- --accent-100: var(--color-pink-100);
- --accent-200: var(--color-pink-200);
- --accent-300: var(--color-pink-300);
- --accent-400: var(--color-pink-400);
- --accent-500: var(--color-pink-500);
- --accent-600: var(--color-pink-600);
- --accent-700: var(--color-pink-700);
- --accent-800: var(--color-pink-800);
- --accent-900: var(--color-pink-900);
- --accent-950: var(--color-pink-950);
- }
-
- .rose {
- --accent-50: var(--color-rose-50);
- --accent-100: var(--color-rose-100);
- --accent-200: var(--color-rose-200);
- --accent-300: var(--color-rose-300);
- --accent-400: var(--color-rose-400);
- --accent-500: var(--color-rose-500);
- --accent-600: var(--color-rose-600);
- --accent-700: var(--color-rose-700);
- --accent-800: var(--color-rose-800);
- --accent-900: var(--color-rose-900);
- --accent-950: var(--color-rose-950);
- }
-
- .gray {
- --base-50: var(--color-gray-50);
- --base-100: var(--color-gray-100);
- --base-200: var(--color-gray-200);
- --base-300: var(--color-gray-300);
- --base-400: var(--color-gray-400);
- --base-500: var(--color-gray-500);
- --base-600: var(--color-gray-600);
- --base-700: var(--color-gray-700);
- --base-800: var(--color-gray-800);
- --base-900: var(--color-gray-900);
- --base-950: var(--color-gray-950);
- }
-
- .zinc {
- --base-50: var(--color-zinc-50);
- --base-100: var(--color-zinc-100);
- --base-200: var(--color-zinc-200);
- --base-300: var(--color-zinc-300);
- --base-400: var(--color-zinc-400);
- --base-500: var(--color-zinc-500);
- --base-600: var(--color-zinc-600);
- --base-700: var(--color-zinc-700);
- --base-800: var(--color-zinc-800);
- --base-900: var(--color-zinc-900);
- --base-950: var(--color-zinc-950);
- }
-
- .neutral {
- --base-50: var(--color-neutral-50);
- --base-100: var(--color-neutral-100);
- --base-200: var(--color-neutral-200);
- --base-300: var(--color-neutral-300);
- --base-400: var(--color-neutral-400);
- --base-500: var(--color-neutral-500);
- --base-600: var(--color-neutral-600);
- --base-700: var(--color-neutral-700);
- --base-800: var(--color-neutral-800);
- --base-900: var(--color-neutral-900);
- --base-950: var(--color-neutral-950);
- }
-
- .stone {
- --base-50: var(--color-stone-50);
- --base-100: var(--color-stone-100);
- --base-200: var(--color-stone-200);
- --base-300: var(--color-stone-300);
- --base-400: var(--color-stone-400);
- --base-500: var(--color-stone-500);
- --base-600: var(--color-stone-600);
- --base-700: var(--color-stone-700);
- --base-800: var(--color-stone-800);
- --base-900: var(--color-stone-900);
- --base-950: var(--color-stone-950);
- }
-
- .slate {
- --base-50: var(--color-slate-50);
- --base-100: var(--color-slate-100);
- --base-200: var(--color-slate-200);
- --base-300: var(--color-slate-300);
- --base-400: var(--color-slate-400);
- --base-500: var(--color-slate-500);
- --base-600: var(--color-slate-600);
- --base-700: var(--color-slate-700);
- --base-800: var(--color-slate-800);
- --base-900: var(--color-slate-900);
- --base-950: var(--color-slate-950);
- }
-}
diff --git a/src/lib/atproto/LoginModal.svelte b/src/lib/atproto/LoginModal.svelte
new file mode 100644
index 0000000..4a8d6c3
--- /dev/null
+++ b/src/lib/atproto/LoginModal.svelte
@@ -0,0 +1,29 @@
+
+
+
+
+ {
+ await login(handle as ActorIdentifier);
+ return true;
+ }}
+ signup={async () => {
+ await signup();
+ return true;
+ }}
+/>
diff --git a/src/lib/atproto/server/repo.remote.ts b/src/lib/atproto/server/repo.remote.ts
index 35aaf76..459626c 100644
--- a/src/lib/atproto/server/repo.remote.ts
+++ b/src/lib/atproto/server/repo.remote.ts
@@ -1,7 +1,7 @@
import { error } from '@sveltejs/kit';
import { command, getRequestEvent } from '$app/server';
import * as v from 'valibot';
-import { collections } from '../settings';
+import { writableCollections } from '../settings';
import { contrail, ensureInit } from '$lib/contrail';
// Validate collection format and check against allowed list
@@ -9,7 +9,7 @@ const collectionSchema = v.pipe(
v.string(),
v.regex(/^[a-zA-Z][a-zA-Z0-9-]*(\.[a-zA-Z][a-zA-Z0-9-]*){2,}$/),
v.check(
- (c) => collections.includes(c as (typeof collections)[number]),
+ (c) => writableCollections.includes(c as (typeof writableCollections)[number]),
'Collection not in allowed list'
)
);
diff --git a/src/lib/atproto/settings.ts b/src/lib/atproto/settings.ts
index 5c10bfd..eef6f7b 100644
--- a/src/lib/atproto/settings.ts
+++ b/src/lib/atproto/settings.ts
@@ -20,6 +20,12 @@ export const collections = [
export type AllowedCollection = (typeof collections)[number];
+// Collections the server will accept in putRecord/createRecord/deleteRecord.
+// Superset of `collections` — includes collections we can write via the OAuth
+// scope granted by the PDS but don't need to list explicitly in our scope
+// request (e.g. app.bsky.feed.post for cross-posting).
+export const writableCollections = [...collections, 'app.bsky.feed.post'] as const;
+
// which PDS to use for signup
const devPDS = 'https://pds.rip/';
const prodPDS = 'https://selfhosted.social/';
diff --git a/src/lib/cards/sections/HeroCard/HeroCard.svelte b/src/lib/cards/sections/HeroCard/HeroCard.svelte
index 7008db2..be95b86 100644
--- a/src/lib/cards/sections/HeroCard/HeroCard.svelte
+++ b/src/lib/cards/sections/HeroCard/HeroCard.svelte
@@ -2,11 +2,11 @@
import { goto } from '$app/navigation';
import { user } from '$lib/atproto';
import { getHandleOrDid } from '$lib/atproto/methods';
- import { atProtoLoginModalState } from '@foxui/social';
import { Badge, cn } from '@foxui/core';
import type { ContentComponentProps } from '../../types';
import { getHeroDecorations, heroAlignClasses, heroVerticalAlignClasses } from '.';
import Decoration from './Decoration.svelte';
+ import { atProtoLoginModalState } from '$lib/atproto/LoginModal.svelte';
let { item }: ContentComponentProps = $props();
diff --git a/src/lib/cards/utilities/ButtonCard/ButtonCard.svelte b/src/lib/cards/utilities/ButtonCard/ButtonCard.svelte
index 571b707..959131b 100644
--- a/src/lib/cards/utilities/ButtonCard/ButtonCard.svelte
+++ b/src/lib/cards/utilities/ButtonCard/ButtonCard.svelte
@@ -2,9 +2,9 @@
import { goto } from '$app/navigation';
import { user } from '$lib/atproto';
import { getHandleOrDid } from '$lib/atproto/methods';
- import { atProtoLoginModalState } from '@foxui/social';
import { cn } from '@foxui/core';
import type { ContentComponentProps } from '../../types';
+ import { atProtoLoginModalState } from '$lib/atproto/LoginModal.svelte';
let { item }: ContentComponentProps = $props();
diff --git a/src/lib/components/select-theme/SelectTheme.svelte b/src/lib/components/select-theme/SelectTheme.svelte
index a5c3847..eb52d62 100644
--- a/src/lib/components/select-theme/SelectTheme.svelte
+++ b/src/lib/components/select-theme/SelectTheme.svelte
@@ -27,7 +27,11 @@
{ class: 'text-stone-500', label: 'stone' },
{ class: 'text-zinc-500', label: 'zinc' },
{ class: 'text-neutral-500', label: 'neutral' },
- { class: 'text-slate-500', label: 'slate' }
+ { class: 'text-slate-500', label: 'slate' },
+ { class: 'text-olive-500', label: 'olive' },
+ { class: 'text-mauve-500', label: 'mauve' },
+ { class: 'text-mist-500', label: 'mist' },
+ { class: 'text-taupe-500', label: 'taupe' }
];
let {
@@ -97,5 +101,6 @@
onchanged?.(accentColor, baseColor);
}}
+ class="w-64"
/>
{/if}
diff --git a/src/lib/sections/HeroSection/HeroSection.svelte b/src/lib/sections/HeroSection/HeroSection.svelte
index 594115f..6715cf6 100644
--- a/src/lib/sections/HeroSection/HeroSection.svelte
+++ b/src/lib/sections/HeroSection/HeroSection.svelte
@@ -2,7 +2,6 @@
import { goto } from '$app/navigation';
import { user } from '$lib/atproto';
import { getHandleOrDid } from '$lib/atproto/methods';
- import { atProtoLoginModalState } from '@foxui/social';
import { Badge, cn } from '@foxui/core';
import type { SectionContentProps } from '../types';
import {
@@ -13,6 +12,7 @@
heroVerticalAlignClasses
} from './shared';
import Decoration from './Decoration.svelte';
+ import { atProtoLoginModalState } from '$lib/atproto/LoginModal.svelte';
let { section, items }: SectionContentProps = $props();
diff --git a/src/lib/website/FloatingEditButton.svelte b/src/lib/website/FloatingEditButton.svelte
index 1e15c3a..6c7fbbd 100644
--- a/src/lib/website/FloatingEditButton.svelte
+++ b/src/lib/website/FloatingEditButton.svelte
@@ -5,8 +5,8 @@
import type { WebsiteData } from '$lib/types';
import { page } from '$app/state';
import type { ActorIdentifier } from '@atcute/lexicons';
- import { atProtoLoginModalState } from '@foxui/social';
import { getHandleOrDid } from '$lib/atproto/methods';
+ import { atProtoLoginModalState } from '$lib/atproto/LoginModal.svelte';
let { data }: { data: WebsiteData } = $props();
diff --git a/src/routes/+layout.svelte b/src/routes/+layout.svelte
index 4e76940..1cf3f04 100644
--- a/src/routes/+layout.svelte
+++ b/src/routes/+layout.svelte
@@ -9,6 +9,7 @@
import { AtprotoLoginModal } from '@foxui/social';
import { login, signup } from '$lib/atproto';
import type { ActorIdentifier } from '@atcute/lexicons';
+ import LoginModal from '$lib/atproto/LoginModal.svelte';
let { children, data } = $props();
let showThemeToggle = $derived(
@@ -34,13 +35,4 @@
{/if}
- {
- await login(handle as ActorIdentifier);
- return true;
- }}
- signup={async () => {
- await signup();
- return true;
- }}
-/>
+
diff --git a/src/routes/[[actor=actor]]/(pages)/p/[[page]]/copy/+page.svelte b/src/routes/[[actor=actor]]/(pages)/p/[[page]]/copy/+page.svelte
index dba05d3..4d90eb3 100644
--- a/src/routes/[[actor=actor]]/(pages)/p/[[page]]/copy/+page.svelte
+++ b/src/routes/[[actor=actor]]/(pages)/p/[[page]]/copy/+page.svelte
@@ -10,7 +10,7 @@
import { goto } from '$app/navigation';
import * as TID from '@atcute/tid';
import { Button } from '@foxui/core';
- import { atProtoLoginModalState } from '@foxui/social';
+ import { atProtoLoginModalState } from '$lib/atproto/LoginModal.svelte';
let { data } = $props();
diff --git a/src/routes/[[actor=actor]]/blog/new/+page.svelte b/src/routes/[[actor=actor]]/blog/new/+page.svelte
index 701a9af..89dee43 100644
--- a/src/routes/[[actor=actor]]/blog/new/+page.svelte
+++ b/src/routes/[[actor=actor]]/blog/new/+page.svelte
@@ -1,6 +1,5 @@