Introduce a shared dialog header style (.unified-dialog-header) in app.css and opt dialog components into the new chrome by updating their header markup. Headers now use unified-dialog-icon and unified-dialog-text elements (and import the matching Lucide icons where needed), which standardizes icon placement, title/eyebrow layout, close button styling and responsive behavior. The Command Palette layout was adjusted to include the new header and its grid rows. The CSS is explicitly opt-in (so page/section headers remain unchanged) and includes hover/focus styles and a theme-sensitive close color variable. This commit is a UI refactor only — no API or behavior logic changes.
58 lines
2.1 KiB
Svelte
58 lines
2.1 KiB
Svelte
<script lang="ts">
|
|
import { BarChart3, Check, ShieldCheck } from "@lucide/svelte";
|
|
|
|
interface Props {
|
|
enabled: boolean;
|
|
onContinue: (enabled: boolean) => void;
|
|
}
|
|
|
|
let { enabled = true, onContinue = () => {} }: Props = $props();
|
|
let allowAnalytics = $state(true);
|
|
|
|
$effect(() => {
|
|
allowAnalytics = enabled;
|
|
});
|
|
</script>
|
|
|
|
<div class="dialog-backdrop app-chrome-backdrop" role="presentation">
|
|
<div class="dialog analytics-notice-dialog" role="dialog" aria-modal="true" aria-label="Analytics notice" tabindex="-1">
|
|
<header class="dialog-header unified-dialog-header">
|
|
<div class="unified-dialog-text">
|
|
<span class="eyebrow">Privacy</span>
|
|
<h2 class="dialog-title">Anonymous usage analytics</h2>
|
|
</div>
|
|
<span class="unified-dialog-icon" aria-hidden="true"><ShieldCheck size={20} aria-hidden="true" /></span>
|
|
</header>
|
|
|
|
<div class="analytics-notice-body">
|
|
<div class="analytics-notice-icon">
|
|
<BarChart3 size={24} aria-hidden="true" />
|
|
</div>
|
|
<div class="analytics-notice-copy">
|
|
<p>
|
|
Gitty can send anonymous usage events and technical error logs to Aptabase and the self-hosted SigNoz service so crashes, rough edges, and commonly used workflows are easier to improve.
|
|
</p>
|
|
<p>
|
|
Telemetry does not include repository paths, remote URLs, branch names, commit messages, diffs, file names, credentials, or source code.
|
|
</p>
|
|
</div>
|
|
|
|
<label class="settings-toggle-row analytics-notice-toggle">
|
|
<input type="checkbox" bind:checked={allowAnalytics} />
|
|
<span>
|
|
<strong>Allow anonymous analytics</strong>
|
|
<small>You can change this later in Settings.</small>
|
|
</span>
|
|
</label>
|
|
</div>
|
|
|
|
<footer class="dialog-footer analytics-notice-footer">
|
|
<span class="dialog-footer-info">Privacy-friendly, optional, and limited to product usage and technical errors.</span>
|
|
<button class="btn-primary" type="button" onclick={() => onContinue(allowAnalytics)}>
|
|
<Check size={16} aria-hidden="true" />
|
|
Continue
|
|
</button>
|
|
</footer>
|
|
</div>
|
|
</div>
|