seahi/blogflare
1
0 Fork 0
Code Issues Pull Requests Actions Packages Projects Releases Wiki Activity

refactor: 在文章编辑页面中使用自定义 SelectDropdown 组件替换原生 select
生产环境部署 - BlogFlare 至 Cloudflare Pages / 构建与自动化上线 (push) Successful in 2m22s
Details

Browse Source
This commit is contained in:
seahi committed 2026-08-06 12:31:00 +08:00
1 parent bbbc5c07a2
commit 9e33fabdbe
2 files changed
+26 -36
Download Patch File Download Diff File Expand all files Collapse all files

No files matched your search

src/routes/admin/posts/[id]/+page.svelte
+13 -18
View File
@@ -4,6 +4,7 @@
import { deserialize } from '$app/forms';
import MarkdownRenderer from '$lib/components/MarkdownRenderer.svelte';
import FeaturedImagePicker from '$lib/components/admin/FeaturedImagePicker.svelte';
import SelectDropdown from '$lib/components/admin/SelectDropdown.svelte';
import { parseHugoMarkdown } from '$lib/hugoParser';
let { data, form }: { data: PageData; form: ActionData } = $props();
@@ -355,22 +356,22 @@
<div class="sidebar-box">
<h3>分类</h3>
<select name="category_id" class="select-input" bind:value={selectedCategoryId}>
<option value="">-- 无 --</option>
{#each data.categories as category}
<option value={category.id}>{category.name}</option>
{/each}
</select>
<SelectDropdown
name="category_id"
label="分类"
options={data.categories.map((category) => ({ value: category.id, label: category.name }))}
bind:value={selectedCategoryId}
/>
</div>
<div class="sidebar-box">
<h3>{$page.data.aliases?.series || '系列'}</h3>
<select name="series_id" class="select-input" bind:value={selectedSeriesId}>
<option value="">-- 无 --</option>
{#each seriesList as series}
<option value={series.id}>{series.name}</option>
{/each}
</select>
<SelectDropdown
name="series_id"
label={$page.data.aliases?.series || '系列'}
options={seriesList.map((series) => ({ value: series.id, label: series.name }))}
bind:value={selectedSeriesId}
/>
<input
type="number"
name="series_weight"
@@ -615,13 +616,11 @@
box-shadow: 0 0 0 3px rgba(65, 155, 56, 0.08);
}
.select-input:focus,
.sidebar-input:focus {
outline: none;
border-bottom-color: var(--accent-color, #419b38);
}
.select-input,
.sidebar-input {
width: 100%;
padding: 10px 0;
@@ -635,10 +634,6 @@
transition: border-bottom-color 0.3s ease;
}
.select-input {
cursor: pointer;
}
.form-group textarea:focus {
outline: none;
border-color: var(--accent-color, #419b38);
src/routes/admin/posts/new/+page.svelte
+13 -18
View File
@@ -4,6 +4,7 @@
import { deserialize } from '$app/forms';
import MarkdownRenderer from '$lib/components/MarkdownRenderer.svelte';
import FeaturedImagePicker from '$lib/components/admin/FeaturedImagePicker.svelte';
import SelectDropdown from '$lib/components/admin/SelectDropdown.svelte';
import { parseHugoMarkdown } from '$lib/hugoParser';
let { data, form }: { data: PageData; form: ActionData } = $props();
@@ -361,22 +362,22 @@
<div class="sidebar-box">
<h3>分类</h3>
<select name="category_id" class="select-input" bind:value={selectedCategoryId}>
<option value="">-- 无 --</option>
{#each data.categories as category}
<option value={category.id}>{category.name}</option>
{/each}
</select>
<SelectDropdown
name="category_id"
label="分类"
options={data.categories.map((category) => ({ value: category.id, label: category.name }))}
bind:value={selectedCategoryId}
/>
</div>
<div class="sidebar-box">
<h3>{$page.data.aliases?.series || '系列'}</h3>
<select name="series_id" class="select-input" bind:value={selectedSeriesId}>
<option value="">-- 无 --</option>
{#each seriesList as series}
<option value={series.id}>{series.name}</option>
{/each}
</select>
<SelectDropdown
name="series_id"
label={$page.data.aliases?.series || '系列'}
options={seriesList.map((series) => ({ value: series.id, label: series.name }))}
bind:value={selectedSeriesId}
/>
<input
type="number"
name="series_weight"
@@ -620,13 +621,11 @@
box-shadow: 0 0 0 3px rgba(65, 155, 56, 0.08);
}
.select-input:focus,
.sidebar-input:focus {
outline: none;
border-bottom-color: var(--accent-color, #419b38);
}
.select-input,
.sidebar-input {
width: 100%;
padding: 10px 0;
@@ -640,10 +639,6 @@
transition: border-bottom-color 0.3s ease;
}
.select-input {
cursor: pointer;
}
.form-group textarea:focus {
outline: none;
border-color: var(--accent-color, #419b38);