cleanup css, allow adding blocks / mutes via handle
6 unmodified lines7891011121314159 unmodified lines252627282930313233343534363738394041424344454647484950515253544 unmodified lines59606162636465666768697030 unmodified lines1011021031041051061071081091101111121131142 unmodified lines1171181191201211221231241253 unmodified lines12913013113213313413513613720 unmodified lines1581591601611431626 unmodified lines 0% { opacity: 0; transform: scale(0.95); }
100% { opacity: 1; transform: scale(1); }9 unmodified lines}
@utility single-line-input { @apply w-full rounded-sm border-2 border-(--nucleus-accent)/40 bg-(--nucleus-accent)/3 px-3 py-2 font-medium transition-all;
&:focus { @apply scale-[1.02] border-(--nucleus-accent)/80 bg-(--nucleus-accent)/10 [box-shadow:none] outline-none; }}
@utility action-button { @apply rounded-sm border-2 border-(--nucleus-accent) px-3 py-2 font-semibold text-(--nucleus-accent) transition-all hover:scale-105 hover:bg-(--nucleus-accent)/20; @apply rounded-sm border-2 border-(--nucleus-accent) px-3 py-2 font-semibold text-(--nucleus-accent) transition-all;
&:enabled { @apply hover:scale-105 hover:bg-(--nucleus-accent)/20; }
&:disabled { @apply opacity-60 hover:scale-100; }}
@utility error-disclaimer { @apply rounded-sm border-2 border-red-500 p-2; background-color: color-mix(in srgb, var(--color-red-500) 15%, var(--nucleus-bg));
p { @apply text-base text-wrap wrap-break-word text-red-500; }}4 unmodified lines}
button { @apply hover:cursor-pointer;
&:disabled { @apply cursor-not-allowed; }}
a { &:hover {30 unmodified lines animation: pulse-highlight 0.6s ease-in-out 3;}
@keyframes pulse-highlight {
0%, 100% { box-shadow: 0 0 0 0 var(--nucleus-selected-post); }
50% { box-shadow: 0 0 20px 5px var(--nucleus-selected-post); }}2 unmodified lines from { transform: translateX(144px); opacity: 0; }
to { transform: translateX(0); opacity: 1; }3 unmodified lines from { transform: translateX(-144px); opacity: 0; }
to { transform: translateX(0); opacity: 1; }20 unmodified lines}
.settings-desc { @apply mb-2 text-sm text-(--nucleus-fg)/80;}}No newline at end of file12345456789101111121314151617171819202122222324252425262728293013 unmodified lines4445464747484849505152535411 unmodified lines66676869687071727173747576777879808122 unmodified lines10410510610710210810911010511111211311411511611711811919 unmodified lines<script lang="ts"> import MutedAccountItem from './MutedAccountItem.svelte'; import VirtualList from '@tutorlatin/svelte-tiny-virtual-list'; import type { Did } from '@atcute/lexicons'; import type { Preferences } from '$lib/at/pocket'; import type { ActorIdentifier, Did } from '@atcute/lexicons'; import { allBacklinks, createBlock, deleteBlock, clients } from '$lib/state.svelte'; import { blockSource } from '$lib'; import { isActorIdentifier } from '@atcute/lexicons/syntax'; import { resolveHandle } from '$lib/at/client.svelte';
interface Props { mutes: Did[]; currentPrefs: Preferences | null; onAddMute: (did: Did) => void; onRemoveMute: (did: Did) => void; selectedAccount: Did | null; }
let { mutes, currentPrefs, onAddMute, onRemoveMute, selectedAccount }: Props = $props(); let { mutes, onAddMute, onRemoveMute, selectedAccount }: Props = $props();
let newMuteInput = $state(''); let newBlockInput = $state('');
const handleAddMute = () => { const handleAddMute = async () => { if (!newMuteInput.trim()) return; const did = newMuteInput.trim() as Did; onAddMute(did); const did = await resolveHandle(newMuteInput.trim() as ActorIdentifier); if (!did.ok) return; onAddMute(did.value); newMuteInput = ''; };
const blocks = $derived.by(() => {13 unmodified lines const handleAddBlock = async () => { if (!newBlockInput.trim() || !selectedAccount) return; const client = clients.get(selectedAccount); if (!client) return; const did = newBlockInput.trim() as Did; await createBlock(client, did); const did = await resolveHandle(newBlockInput.trim() as ActorIdentifier); if (!did.ok) return; await createBlock(client, did.value); newBlockInput = ''; };
const handleRemoveBlock = async (did: Did) => {11 unmodified lines <div class="flex gap-2"> <input type="text" bind:value={newMuteInput} placeholder="did:plc:..." placeholder="enter identifier" class="single-line-input flex-1" /> <button onclick={handleAddMute} class="action-button">add</button> <button disabled={!isActorIdentifier(newMuteInput)} onclick={handleAddMute} class="action-button">add</button > </div> {#if mutes.length > 0} <div class="h-fit"> <VirtualList22 unmodified lines <div class="flex gap-2"> <input type="text" bind:value={newBlockInput} placeholder="did:plc:..." placeholder="enter identifier" class="single-line-input flex-1" /> <button onclick={handleAddBlock} class="action-button">add</button> <button disabled={!isActorIdentifier(newBlockInput)} onclick={handleAddBlock} class="action-button">add</button > </div> {#if blocks.length > 0} <div class="h-fit"> <VirtualList19 unmodified lines158 unmodified linesExpand all15916016116216316316416516614 unmodified lines158 unmodified linesExpand all <SettingsAdvancedTab bind:localSettings onReset={handleReset} /> {:else if tab === 'moderation'} <SettingsModerationTab {mutes} {currentPrefs} onAddMute={handleAddMute} onRemoveMute={handleRemoveMute} {selectedAccount} />14 unmodified lines