Make imported/linked CSS always a full theme replacement (ticket 020)
Removes the "Use as theme" checkbox/is_theme distinction from NavMenu.tsx's CSS import and link forms — every imported/linked stylesheet is now always validated against the canonical --c-* variable set and becomes a selectable theme, same as today's is_theme:true path. Drops is_theme entirely from the backend (CssEntry, ImportCssRequest, LinkCssRequest, CssEntryDto) and from the frontend CssEntry type; an existing settings.json with a stored is_theme:false entry still deserializes fine (the field is simply unknown/ignored) and that entry becomes selectable like any other, so no migration step is needed. Also drops the now-dead always-on-overlay CSS injection path from useSettingsPanel.ts, and changes the CSS filename placeholder from "name.css" to "enter name". Implemented directly against main rather than merging the dispatched worktree branch for this ticket, since that branch's base predated ticket 012 (the custom-themes/imported-CSS consolidation) and its NavMenu structure no longer matched current main. Co-Authored-By: Claude Sonnet 5 <noreply@anthropic.com> Claude-Session: https://claude.ai/code/session_01XFUNZwCvz3kcod3352ZR2o
This commit is contained in:
Hugh Kaznowski
co-authored by
Claude Sonnet 5
Claude Sonnet 5
parent
f20359e655
commit
d6b7f7dfb6
+2
-8
@@ -392,13 +392,7 @@ async fn import_css(
|
||||
) -> impl IntoResponse {
|
||||
let css_dir = state.css_dir();
|
||||
let mut settings = state.settings.lock().unwrap();
|
||||
match settings.import_css(
|
||||
&state.settings_path,
|
||||
&css_dir,
|
||||
body.filename,
|
||||
&body.content,
|
||||
body.is_theme,
|
||||
) {
|
||||
match settings.import_css(&state.settings_path, &css_dir, body.filename, &body.content) {
|
||||
Ok(id) => {
|
||||
let entry = settings
|
||||
.css_entries
|
||||
@@ -417,7 +411,7 @@ async fn link_css(
|
||||
Json(body): Json<LinkCssRequest>,
|
||||
) -> impl IntoResponse {
|
||||
let mut settings = state.settings.lock().unwrap();
|
||||
match settings.link_css(&state.settings_path, body.path_or_url.clone(), body.is_theme) {
|
||||
match settings.link_css(&state.settings_path, body.path_or_url.clone()) {
|
||||
Ok(()) => {
|
||||
let entry = settings
|
||||
.css_entries
|
||||
|
||||
+4
-10
@@ -122,21 +122,18 @@ pub struct ErrorDto {
|
||||
pub error: String,
|
||||
}
|
||||
|
||||
/// `is_theme` marks this as a selectable colour-scheme theme rather than arbitrary CSS; defaults to false.
|
||||
/// Every imported CSS entry is a selectable theme (ticket 020) — there's no separate
|
||||
/// always-on-overlay mode to opt into.
|
||||
#[derive(Debug, Deserialize)]
|
||||
pub struct ImportCssRequest {
|
||||
pub filename: String,
|
||||
pub content: String,
|
||||
#[serde(default)]
|
||||
pub is_theme: bool,
|
||||
}
|
||||
|
||||
/// A reference to an external CSS path/URL that ottyl doesn't copy or own.
|
||||
#[derive(Debug, Deserialize)]
|
||||
pub struct LinkCssRequest {
|
||||
pub path_or_url: String,
|
||||
#[serde(default)]
|
||||
pub is_theme: bool,
|
||||
}
|
||||
|
||||
/// `id` is the real id for `Imported` entries or a stable id derived from the path/URL for `Linked` ones, so the frontend can key both kinds uniformly (only `Imported` entries are deletable/content-fetchable).
|
||||
@@ -146,7 +143,6 @@ pub struct CssEntryDto {
|
||||
pub kind: CssEntryKind,
|
||||
pub filename: Option<String>,
|
||||
pub path_or_url: Option<String>,
|
||||
pub is_theme: bool,
|
||||
}
|
||||
|
||||
#[derive(Debug, Clone, Copy, Serialize)]
|
||||
@@ -159,19 +155,17 @@ pub enum CssEntryKind {
|
||||
impl From<&CssEntry> for CssEntryDto {
|
||||
fn from(entry: &CssEntry) -> Self {
|
||||
match entry {
|
||||
CssEntry::Imported { id, filename, is_theme } => CssEntryDto {
|
||||
CssEntry::Imported { id, filename } => CssEntryDto {
|
||||
id: id.clone(),
|
||||
kind: CssEntryKind::Imported,
|
||||
filename: Some(filename.clone()),
|
||||
path_or_url: None,
|
||||
is_theme: *is_theme,
|
||||
},
|
||||
CssEntry::Linked { path_or_url, is_theme } => CssEntryDto {
|
||||
CssEntry::Linked { path_or_url } => CssEntryDto {
|
||||
id: crate::settings::css_entry_id(entry),
|
||||
kind: CssEntryKind::Linked,
|
||||
filename: None,
|
||||
path_or_url: Some(path_or_url.clone()),
|
||||
is_theme: *is_theme,
|
||||
},
|
||||
}
|
||||
}
|
||||
|
||||
+12
-30
@@ -39,21 +39,16 @@ pub enum ColorScheme {
|
||||
System,
|
||||
}
|
||||
|
||||
/// A single CSS entry: content ottyl stores itself ("imported") or a reference to an external path/URL ("linked", not deletable via the API). `is_theme` marks it as a selectable colour-scheme theme rather than always-injected CSS.
|
||||
/// A single CSS entry: content ottyl stores itself ("imported") or a reference to an external
|
||||
/// path/URL ("linked", not deletable via the API). Every entry is always a selectable
|
||||
/// colour-scheme theme (ticket 020 removed the "use as theme"/always-on-overlay distinction);
|
||||
/// an entry persisted before that change with a stored `is_theme: false` still loads fine (the
|
||||
/// field is simply ignored) and becomes selectable like any other entry.
|
||||
#[derive(Debug, Clone, PartialEq, Eq, Serialize, Deserialize)]
|
||||
#[serde(tag = "kind", rename_all = "lowercase")]
|
||||
pub enum CssEntry {
|
||||
Imported {
|
||||
id: String,
|
||||
filename: String,
|
||||
#[serde(default)]
|
||||
is_theme: bool,
|
||||
},
|
||||
Linked {
|
||||
path_or_url: String,
|
||||
#[serde(default)]
|
||||
is_theme: bool,
|
||||
},
|
||||
Imported { id: String, filename: String },
|
||||
Linked { path_or_url: String },
|
||||
}
|
||||
|
||||
/// Tracks known profile names and which one is active; the profile files themselves live elsewhere.
|
||||
@@ -228,7 +223,6 @@ impl Settings {
|
||||
css_dir: &Path,
|
||||
filename: String,
|
||||
content: &str,
|
||||
is_theme: bool,
|
||||
) -> Result<String, CssError> {
|
||||
fs::create_dir_all(css_dir)?;
|
||||
let id = generate_imported_css_id(&filename, content);
|
||||
@@ -236,23 +230,14 @@ impl Settings {
|
||||
self.css_entries.push(CssEntry::Imported {
|
||||
id: id.clone(),
|
||||
filename,
|
||||
is_theme,
|
||||
});
|
||||
self.save(settings_path)?;
|
||||
Ok(id)
|
||||
}
|
||||
|
||||
/// Registers a reference to an external CSS path/URL without copying its content, and persists settings.
|
||||
pub fn link_css(
|
||||
&mut self,
|
||||
settings_path: &Path,
|
||||
path_or_url: String,
|
||||
is_theme: bool,
|
||||
) -> Result<(), CssError> {
|
||||
self.css_entries.push(CssEntry::Linked {
|
||||
path_or_url,
|
||||
is_theme,
|
||||
});
|
||||
pub fn link_css(&mut self, settings_path: &Path, path_or_url: String) -> Result<(), CssError> {
|
||||
self.css_entries.push(CssEntry::Linked { path_or_url });
|
||||
self.save(settings_path)?;
|
||||
Ok(())
|
||||
}
|
||||
@@ -340,11 +325,9 @@ mod tests {
|
||||
settings.css_entries.push(CssEntry::Imported {
|
||||
id: "abc123".to_string(),
|
||||
filename: "theme.css".to_string(),
|
||||
is_theme: false,
|
||||
});
|
||||
settings.css_entries.push(CssEntry::Linked {
|
||||
path_or_url: "https://example.com/style.css".to_string(),
|
||||
is_theme: false,
|
||||
});
|
||||
settings.profiles.names.push("default".to_string());
|
||||
settings.profiles.active_profile = Some("default".to_string());
|
||||
@@ -388,7 +371,6 @@ mod tests {
|
||||
&css_dir,
|
||||
"theme.css".to_string(),
|
||||
"body { color: red; }",
|
||||
false,
|
||||
)
|
||||
.unwrap();
|
||||
|
||||
@@ -418,7 +400,7 @@ mod tests {
|
||||
|
||||
let mut settings = Settings::load(&settings_path);
|
||||
let id = settings
|
||||
.import_css(&settings_path, &css_dir, "a.css".to_string(), "a{}", false)
|
||||
.import_css(&settings_path, &css_dir, "a.css".to_string(), "a{}")
|
||||
.unwrap();
|
||||
let css_file = css_dir.join(format!("{id}.css"));
|
||||
assert!(css_file.exists());
|
||||
@@ -440,7 +422,7 @@ mod tests {
|
||||
|
||||
let mut settings = Settings::load(&settings_path);
|
||||
settings
|
||||
.link_css(&settings_path, "https://example.com/style.css".to_string(), false)
|
||||
.link_css(&settings_path, "https://example.com/style.css".to_string())
|
||||
.unwrap();
|
||||
let linked_id = css_entry_id(&settings.css_entries[0]);
|
||||
|
||||
@@ -469,7 +451,7 @@ mod tests {
|
||||
|
||||
let mut settings = Settings::load(&settings_path);
|
||||
settings
|
||||
.link_css(&settings_path, "https://example.com/style.css".to_string(), false)
|
||||
.link_css(&settings_path, "https://example.com/style.css".to_string())
|
||||
.unwrap();
|
||||
let linked_id = css_entry_id(&settings.css_entries[0]);
|
||||
|
||||
|
||||
@@ -1,13 +0,0 @@
|
||||
# Make imported/linked CSS always a full theme replacement
|
||||
|
||||
From WISHLIST.md: colour schemes should be full CSS replacements — there should be no "use as theme" tickbox distinguishing a selectable alternative theme from an always-on overlay. Every imported/linked stylesheet should just work the same way as the built-in colour schemes: a selectable, full replacement.
|
||||
|
||||
Currently `NavMenu.tsx`'s CSS section has an `is_theme`/"Use as theme" checkbox (`cssIsTheme`/`cssLinkIsTheme` state, `panel.importCssEntry(filename, content, isTheme)` / `panel.linkCssEntry(url, isTheme)`) that decides whether an entry becomes a selectable theme (validated against the canonical `--c-*` variable set, toggled via `panel.setCustomTheme`) or an always-on CSS overlay applied on top of the active colour scheme. This ticket removes that distinction: every imported/linked stylesheet is validated as a theme and becomes a selectable alternative to the built-in colour schemes, same as today's `is_theme: true` path.
|
||||
|
||||
## Acceptance criteria
|
||||
- The "Use as theme" checkboxes are removed from both the CSS import form and the CSS link form in `NavMenu.tsx`.
|
||||
- Imported/linked CSS is always validated against the canonical `--c-*` theme variable set (`parseThemeCss`) and always becomes a selectable theme entry (today's `is_theme: true` behavior) — the "always-on overlay" mode is removed.
|
||||
- The explanatory text "imported/linked stylesheets — check 'Use as theme' to make one a selectable alternative to the built-in colour schemes above instead of an always-on overlay" is deleted/rewritten to reflect the simpler model (every entry is a selectable theme).
|
||||
- The CSS filename input's placeholder changes from `"name.css"` to `"enter name"`.
|
||||
- Backend/`CssEntry`/`is_theme` plumbing (`src/settings.rs`, `src/api.rs`, `src/dto.rs`, `webapp/src/lib/api.ts`) is simplified accordingly if `is_theme` becomes always-true and dead as a variable — remove it if no longer meaningful, or confirm it's still needed for backward compatibility with existing saved entries.
|
||||
- Existing saved CSS entries (including any persisted with `is_theme: false`) keep working — decide and document how they're treated (e.g. migrated to always selectable) rather than silently breaking.
|
||||
@@ -187,10 +187,8 @@ function SettingsPanel({ panel }: { panel: ReturnType<typeof useSettingsPanel> }
|
||||
const [maxLogsInput, setMaxLogsInput] = useState('')
|
||||
const [cssFilename, setCssFilename] = useState('')
|
||||
const [cssContent, setCssContent] = useState('')
|
||||
const [cssIsTheme, setCssIsTheme] = useState(false)
|
||||
const [cssUploadError, setCssUploadError] = useState<string | null>(null)
|
||||
const [cssLinkUrl, setCssLinkUrl] = useState('')
|
||||
const [cssLinkIsTheme, setCssLinkIsTheme] = useState(false)
|
||||
const [ntfyTopicInput, setNtfyTopicInput] = useState('')
|
||||
const [ntfyServerInput, setNtfyServerInput] = useState('')
|
||||
const [ntfyTestError, setNtfyTestError] = useState<string | null>(null)
|
||||
@@ -254,33 +252,27 @@ function SettingsPanel({ panel }: { panel: ReturnType<typeof useSettingsPanel> }
|
||||
setCssUploadError(null)
|
||||
}
|
||||
|
||||
// Single import path for both "configured/imported CSS" and "custom
|
||||
// themes" (ticket 012) — `cssIsTheme` is the only thing that distinguishes
|
||||
// them, so a theme upload is only additionally validated against the
|
||||
// canonical `--c-*` variable set before it's sent.
|
||||
// Every imported/linked stylesheet is always a selectable theme (ticket 020), so it's always
|
||||
// validated against the canonical `--c-*` variable set before it's sent.
|
||||
async function handleCssImport(e: React.FormEvent) {
|
||||
e.preventDefault()
|
||||
setCssUploadError(null)
|
||||
if (!cssFilename.trim() || !cssContent.trim()) return
|
||||
if (cssIsTheme) {
|
||||
const { missing } = parseThemeCss(cssContent)
|
||||
if (missing.length > 0) {
|
||||
setCssUploadError(`Missing variable${missing.length > 1 ? 's' : ''}: ${missing.join(', ')}`)
|
||||
return
|
||||
}
|
||||
const { missing } = parseThemeCss(cssContent)
|
||||
if (missing.length > 0) {
|
||||
setCssUploadError(`Missing variable${missing.length > 1 ? 's' : ''}: ${missing.join(', ')}`)
|
||||
return
|
||||
}
|
||||
await panel.importCssEntry(cssFilename.trim(), cssContent, cssIsTheme)
|
||||
await panel.importCssEntry(cssFilename.trim(), cssContent)
|
||||
setCssFilename('')
|
||||
setCssContent('')
|
||||
setCssIsTheme(false)
|
||||
}
|
||||
|
||||
async function handleCssLink(e: React.FormEvent) {
|
||||
e.preventDefault()
|
||||
if (!cssLinkUrl.trim()) return
|
||||
await panel.linkCssEntry(cssLinkUrl.trim(), cssLinkIsTheme)
|
||||
await panel.linkCssEntry(cssLinkUrl.trim())
|
||||
setCssLinkUrl('')
|
||||
setCssLinkIsTheme(false)
|
||||
}
|
||||
|
||||
function downloadBuiltinTheme(name: string) {
|
||||
@@ -391,8 +383,8 @@ function SettingsPanel({ panel }: { panel: ReturnType<typeof useSettingsPanel> }
|
||||
<div className="mb-2 flex items-center gap-1.5">
|
||||
<h3 className="text-xs font-semibold uppercase tracking-wide text-text-subtle">CSS</h3>
|
||||
<span className="text-[11px] text-text-faint">
|
||||
imported/linked stylesheets — check "Use as theme" to make one a selectable alternative to the built-in
|
||||
colour schemes above instead of an always-on overlay
|
||||
imported/linked stylesheets — each one becomes a selectable alternative to the built-in colour schemes
|
||||
above
|
||||
</span>
|
||||
</div>
|
||||
{panel.cssEntries.length === 0 ? (
|
||||
@@ -405,23 +397,16 @@ function SettingsPanel({ panel }: { panel: ReturnType<typeof useSettingsPanel> }
|
||||
className="flex items-center justify-between rounded border border-border px-2 py-1 text-xs"
|
||||
>
|
||||
<div className="min-w-0 flex-1">
|
||||
{entry.is_theme ? (
|
||||
<button
|
||||
type="button"
|
||||
onClick={() => panel.setCustomTheme(entry.id)}
|
||||
className={`block w-full truncate text-left capitalize ${
|
||||
panel.activeCustomTheme?.id === entry.id ? 'text-text' : 'text-text-muted hover:text-text'
|
||||
}`}
|
||||
>
|
||||
{entry.filename ?? entry.path_or_url}
|
||||
</button>
|
||||
) : (
|
||||
<div className="truncate text-text">{entry.filename ?? entry.path_or_url}</div>
|
||||
)}
|
||||
<div className="text-[10px] uppercase text-text-faint">
|
||||
{entry.kind}
|
||||
{entry.is_theme ? ' · theme' : ''}
|
||||
</div>
|
||||
<button
|
||||
type="button"
|
||||
onClick={() => panel.setCustomTheme(entry.id)}
|
||||
className={`block w-full truncate text-left capitalize ${
|
||||
panel.activeCustomTheme?.id === entry.id ? 'text-text' : 'text-text-muted hover:text-text'
|
||||
}`}
|
||||
>
|
||||
{entry.filename ?? entry.path_or_url}
|
||||
</button>
|
||||
<div className="text-[10px] uppercase text-text-faint">{entry.kind}</div>
|
||||
</div>
|
||||
<div className="ml-2 flex shrink-0 items-center gap-1">
|
||||
<button
|
||||
@@ -462,7 +447,7 @@ function SettingsPanel({ panel }: { panel: ReturnType<typeof useSettingsPanel> }
|
||||
/>
|
||||
<input
|
||||
type="text"
|
||||
placeholder="name.css"
|
||||
placeholder="enter name"
|
||||
value={cssFilename}
|
||||
onChange={(e) => setCssFilename(e.target.value)}
|
||||
className="rounded border border-border-soft bg-surface-1 px-2 py-1 text-xs text-text placeholder:text-text-subtle focus:border-border-strong focus:outline-none"
|
||||
@@ -474,10 +459,6 @@ function SettingsPanel({ panel }: { panel: ReturnType<typeof useSettingsPanel> }
|
||||
rows={4}
|
||||
className="resize-y rounded border border-border-soft bg-surface-1 px-2 py-1 font-mono text-xs text-text placeholder:text-text-subtle focus:border-border-strong focus:outline-none"
|
||||
/>
|
||||
<label className="flex items-center gap-1.5 text-xs text-text-muted">
|
||||
<input type="checkbox" checked={cssIsTheme} onChange={(e) => setCssIsTheme(e.target.checked)} />
|
||||
Use as theme
|
||||
</label>
|
||||
{cssUploadError && <div className="text-xs text-danger-text-strong">{cssUploadError}</div>}
|
||||
<button
|
||||
type="submit"
|
||||
@@ -496,14 +477,6 @@ function SettingsPanel({ panel }: { panel: ReturnType<typeof useSettingsPanel> }
|
||||
className="min-w-0 flex-1 rounded border border-border-soft bg-surface-1 px-2 py-1 text-xs text-text placeholder:text-text-subtle focus:border-border-strong focus:outline-none"
|
||||
/>
|
||||
<div className="flex items-center gap-2">
|
||||
<label className="flex items-center gap-1.5 text-xs text-text-muted">
|
||||
<input
|
||||
type="checkbox"
|
||||
checked={cssLinkIsTheme}
|
||||
onChange={(e) => setCssLinkIsTheme(e.target.checked)}
|
||||
/>
|
||||
Use as theme
|
||||
</label>
|
||||
<button
|
||||
type="submit"
|
||||
className="shrink-0 rounded border border-border-soft px-2 py-1 text-xs text-text hover:bg-surface-2"
|
||||
|
||||
@@ -118,8 +118,6 @@ export interface CssEntry {
|
||||
kind: CssEntryKind
|
||||
filename: string | null
|
||||
path_or_url: string | null
|
||||
/** Whether this entry is a selectable colour-scheme theme rather than arbitrary CSS. */
|
||||
is_theme: boolean
|
||||
}
|
||||
|
||||
export interface ProfileSummary {
|
||||
@@ -348,12 +346,12 @@ export function fetchCssEntries(): Promise<CssEntry[]> {
|
||||
return getJson('/api/settings/css')
|
||||
}
|
||||
|
||||
export function importCss(filename: string, content: string, isTheme = false): Promise<CssEntry> {
|
||||
return sendJson('/api/settings/css', 'POST', { filename, content, is_theme: isTheme })
|
||||
export function importCss(filename: string, content: string): Promise<CssEntry> {
|
||||
return sendJson('/api/settings/css', 'POST', { filename, content })
|
||||
}
|
||||
|
||||
export function linkCss(pathOrUrl: string, isTheme = false): Promise<CssEntry> {
|
||||
return sendJson('/api/settings/css/link', 'POST', { path_or_url: pathOrUrl, is_theme: isTheme })
|
||||
export function linkCss(pathOrUrl: string): Promise<CssEntry> {
|
||||
return sendJson('/api/settings/css/link', 'POST', { path_or_url: pathOrUrl })
|
||||
}
|
||||
|
||||
export function deleteCssEntry(id: string): Promise<void> {
|
||||
|
||||
@@ -17,9 +17,6 @@ import {
|
||||
type Settings,
|
||||
} from './api'
|
||||
|
||||
// `data-*` marker used to find/remove previously-injected CSS tags on re-apply.
|
||||
const INJECTED_CSS_ATTR = 'data-ottyl-css-id'
|
||||
|
||||
// `data-*` marker for the single injected `<link>` for the active custom theme, if any.
|
||||
const INJECTED_THEME_ATTR = 'data-ottyl-theme-css-id'
|
||||
|
||||
@@ -40,21 +37,9 @@ function applyColorScheme(colorScheme: ColorScheme, customThemeActive: boolean)
|
||||
root.dataset.colorScheme = colorScheme
|
||||
}
|
||||
|
||||
// Injects a `<link>` per CSS entry, replacing any this hook previously injected. Only non-theme entries are applied unconditionally; theme entries are applied separately, only while selected — see `applyCustomThemeCss`.
|
||||
function applyCssEntries(entries: CssEntry[]) {
|
||||
document.querySelectorAll(`link[${INJECTED_CSS_ATTR}]`).forEach((el) => el.remove())
|
||||
for (const entry of entries) {
|
||||
const href = entry.kind === 'imported' ? cssContentUrl(entry.id) : entry.path_or_url
|
||||
if (!href) continue
|
||||
const link = document.createElement('link')
|
||||
link.rel = 'stylesheet'
|
||||
link.href = href
|
||||
link.setAttribute(INJECTED_CSS_ATTR, entry.id)
|
||||
document.head.appendChild(link)
|
||||
}
|
||||
}
|
||||
|
||||
// Same injection mechanism as `applyCssEntries`, kept separate since this one is conditional on `settings.custom_theme_id`; `entry` null just removes any previously-injected tag.
|
||||
// Injects a `<link>` for the active custom theme entry, if any (ticket 020: every CSS entry is
|
||||
// always a selectable theme now, so this is the only injection path — there's no more
|
||||
// always-on-overlay mode). `entry` null just removes any previously-injected tag.
|
||||
function applyCustomThemeCss(entry: CssEntry | null) {
|
||||
document.querySelectorAll(`link[${INJECTED_THEME_ATTR}]`).forEach((el) => el.remove())
|
||||
if (!entry) return
|
||||
@@ -99,17 +84,13 @@ export function useSettingsPanel() {
|
||||
}, [refreshSettings, refreshCss, refreshProfiles])
|
||||
|
||||
const activeCustomTheme = settings?.custom_theme_id
|
||||
? cssEntries.find((entry) => entry.is_theme && entry.id === settings.custom_theme_id) ?? null
|
||||
? cssEntries.find((entry) => entry.id === settings.custom_theme_id) ?? null
|
||||
: null
|
||||
|
||||
useEffect(() => {
|
||||
if (settings) applyColorScheme(settings.color_scheme, activeCustomTheme !== null)
|
||||
}, [settings, activeCustomTheme])
|
||||
|
||||
useEffect(() => {
|
||||
applyCssEntries(cssEntries.filter((entry) => !entry.is_theme))
|
||||
}, [cssEntries])
|
||||
|
||||
useEffect(() => {
|
||||
applyCustomThemeCss(activeCustomTheme)
|
||||
}, [activeCustomTheme])
|
||||
@@ -162,22 +143,20 @@ export function useSettingsPanel() {
|
||||
[guarded],
|
||||
)
|
||||
|
||||
// One entry point for both "configured/imported CSS" and "custom themes" —
|
||||
// `isTheme` is the only thing distinguishing them (ticket 012), so there's
|
||||
// no separate theme-only import path.
|
||||
// Every entry is always a selectable theme (ticket 020), so there's a single import path.
|
||||
const importCssEntry = useCallback(
|
||||
(filename: string, content: string, isTheme = false) =>
|
||||
(filename: string, content: string) =>
|
||||
guarded(async () => {
|
||||
await importCss(filename, content, isTheme)
|
||||
await importCss(filename, content)
|
||||
await refreshCss()
|
||||
})(),
|
||||
[guarded, refreshCss],
|
||||
)
|
||||
|
||||
const linkCssEntry = useCallback(
|
||||
(pathOrUrl: string, isTheme = false) =>
|
||||
(pathOrUrl: string) =>
|
||||
guarded(async () => {
|
||||
await linkCss(pathOrUrl, isTheme)
|
||||
await linkCss(pathOrUrl)
|
||||
await refreshCss()
|
||||
})(),
|
||||
[guarded, refreshCss],
|
||||
|
||||
Reference in New Issue
Block a user