forked from bai/curriculum-project-hub
白
325b4fc137
第一版迁移只把 uiTheme.ts 的 @theme 颜色令牌搬了过来,155 行里约 90 行的组件类(.btn/.panel/.input/.select/table.list/.tag/.switch/ .link-danger/.quiet 等)被丢掉,于是每个组件各自内联重述按钮、输入框、 面板的样式 —— 正是旧代码的重复问题被原样复刻,后台观感明显退化。 现在 app.css 是设计系统的唯一去处:@theme 管令牌,@layer components 管组件类。组件只带布局工具类,不重述组件样式。 图标集同样是丢的:旧面板有 13 个内联 SVG,新版一个不剩,只有纯文字的 「+」「删除」—— 这是"简陋"最直接的来源。提成 Icon.svelte 共享。 Group 节点沿用两人剪影而非文件夹图标:MemberGroup 与文件库的 FOLDER/PROJECT 是两套无关层级,图标不应混淆(ADR-0028/0021)。 顺手修 FilesPanel 的 uploadInput:bind:this 的目标要用 $state, 否则 Svelte 5 下不保证更新。
32 lines
797 B
Svelte
32 lines
797 B
Svelte
<script lang="ts">
|
|
/** 头像:有 avatarUrl 用图,否则显示首字母色块。 */
|
|
let {
|
|
displayName,
|
|
userId,
|
|
avatarUrl = null,
|
|
size = 28,
|
|
}: {
|
|
displayName?: string | null;
|
|
userId?: string | null;
|
|
avatarUrl?: string | null;
|
|
size?: number;
|
|
} = $props();
|
|
|
|
const initial = $derived((displayName || userId || "?").slice(0, 1).toUpperCase());
|
|
</script>
|
|
|
|
{#if avatarUrl}
|
|
<img
|
|
src={avatarUrl}
|
|
alt=""
|
|
class="shrink-0 rounded-full object-cover"
|
|
style="width:{size}px;height:{size}px"
|
|
/>
|
|
{:else}
|
|
<span
|
|
class="inline-flex shrink-0 items-center justify-center rounded-full bg-accent font-semibold text-white"
|
|
style="width:{size}px;height:{size}px;font-size:{Math.round(size * 0.42)}px"
|
|
aria-hidden="true">{initial}</span
|
|
>
|
|
{/if}
|