zit-studio-code index From: Oliver Lin <oli...@liuxiaozhen.dev> To: zit-studio-code@googlegroups.com Subject: [GitTune][PATCH 1/2] feat(ui): align main window layout with website mock Date: Tue, 06 Oct 2026 07:10:40 +0000 Message-ID: <e53mG1GhAQAJ.NUITClLYXwc@googlegroups.com>
---
src/main.rs | 5 +
ui/main.slint | 301 ++++++++++++++++++++++++++++++++------------------
2 files changed, 198 insertions(+), 108 deletions(-)
diff --git a/src/main.rs b/src/main.rs
index 1c0d352..a34c9dd 100644
--- a/src/main.rs
+++ b/src/main.rs
@@ -39,6 +39,11 @@ fn main() -> Result<(), slint::PlatformError> {
};
window.set_encryption_selected_value(encryption_selected);
+ // CLI preview shown in the terminal-style card.
+ window.set_cli_preview(
+ "$ git config --global user.name\n$ git config --global user.email".into(),
+ );
+
// Load local GPG secret keys.
let gpg_keys = gpg::list_keys().unwrap_or_default();
let mut gpg_display_to_fpr: Vec<(slint::SharedString, String)> = Vec::new();
diff --git a/ui/main.slint b/ui/main.slint
index 00dcc63..13e6ddb 100644
--- a/ui/main.slint
+++ b/ui/main.slint
@@ -1,9 +1,25 @@
-import { Button, LineEdit, VerticalBox, HorizontalBox, ComboBox, CheckBox, ScrollView } from "std-widgets.slint";
+import { Button, LineEdit, VerticalBox, HorizontalBox, ComboBox, Switch, ScrollView, Palette } from "std-widgets.slint";
+
+component Card inherits Rectangle {
+ background: Palette.alternate-background;
+ border-radius: 10px;
+ border-width: 1px;
+ border-color: Palette.alternate-background.darker(8%);
+
+ @children
+}
+
+component SectionTitle inherits Text {
+ font-size: 13px;
+ font-weight: 700;
+ opacity: 0.55;
+ letter-spacing: 0.6px;
+}
export component MainWindow inherits Window {
title: "GitTune";
- min-width: 600px;
- min-height: 580px;
+ min-width: 680px;
+ min-height: 640px;
in-out property <string> user-name;
in-out property <string> user-email;
@@ -28,6 +44,7 @@ export component MainWindow inherits Window {
in-out property <string> encryption-selected-value;
in property <string> status-text;
+ in property <string> cli-preview;
callback save-clicked();
property <bool> gpg-is-custom: root.gpg-selected-value == "Custom...";
@@ -35,153 +52,221 @@ export component MainWindow inherits Window {
ScrollView {
VerticalBox {
- padding: 24px;
- spacing: 12px;
+ padding: 28px;
+ spacing: 20px;
- Text {
- text: "Git identity (global)";
- font-size: 18px;
- font-weight: 700;
- }
+ // ── Identity ──
+ Card {
+ VerticalBox {
+ padding: 20px;
+ spacing: 10px;
- Text {
- text: "Name";
- }
+ SectionTitle {
+ text: "Git identity (global)";
+ }
- LineEdit {
- placeholder-text: "user.name";
- text <=> root.user-name;
- }
+ Text {
+ text: "Name";
+ font-size: 13px;
+ }
- Text {
- text: "Email";
- }
+ LineEdit {
+ placeholder-text: "user.name";
+ text <=> root.user-name;
+ }
- LineEdit {
- placeholder-text: "user.email";
- text <=> root.user-email;
- }
+ Text {
+ text: "Email";
+ font-size: 13px;
+ }
- Text {
- text: "GPG signing key";
- font-size: 16px;
- font-weight: 700;
+ LineEdit {
+ placeholder-text: "user.email";
+ text <=> root.user-email;
+ }
+ }
}
- ComboBox {
- model: root.gpg-options;
- current-value <=> root.gpg-selected-value;
- }
+ // ── GPG & Branch ──
+ Card {
+ VerticalBox {
+ padding: 20px;
+ spacing: 10px;
- LineEdit {
- visible: root.gpg-is-custom;
- placeholder-text: "Key fingerprint or ID";
- text <=> root.gpg-custom-value;
- }
+ SectionTitle {
+ text: "Signing & defaults";
+ }
- Text {
- text: "Default branch";
- font-size: 16px;
- font-weight: 700;
- }
+ Text {
+ text: "GPG signing key";
+ font-size: 13px;
+ }
- ComboBox {
- model: root.branch-options;
- current-value <=> root.branch-selected-value;
- }
+ ComboBox {
+ model: root.gpg-options;
+ current-value <=> root.gpg-selected-value;
+ }
- LineEdit {
- visible: root.branch-is-custom;
- placeholder-text: "branch name";
- text <=> root.branch-custom-value;
- }
+ LineEdit {
+ visible: root.gpg-is-custom;
+ placeholder-text: "Key fingerprint or ID";
+ text <=> root.gpg-custom-value;
+ }
- CheckBox {
- text: "Sign commits with GPG";
- checked <=> root.commit-gpgsign;
- }
+ Text {
+ text: "Default branch";
+ font-size: 13px;
+ }
- CheckBox {
- text: "Sign tags with GPG";
- checked <=> root.tag-gpgsign;
- }
+ ComboBox {
+ model: root.branch-options;
+ current-value <=> root.branch-selected-value;
+ }
- Text {
- text: "Email sending (sendemail)";
- font-size: 16px;
- font-weight: 700;
- }
+ LineEdit {
+ visible: root.branch-is-custom;
+ placeholder-text: "branch name";
+ text <=> root.branch-custom-value;
+ }
- Text {
- text: "From";
- }
+ Rectangle {
+ height: 1px;
+ background: Palette.alternate-background.darker(8%);
+ }
- LineEdit {
- placeholder-text: "Name <y...@example.com>";
- text <=> root.sendemail-from;
- }
+ Switch {
+ text: "Sign commits with GPG";
+ checked <=> root.commit-gpgsign;
+ }
- Text {
- text: "SMTP username";
+ Switch {
+ text: "Sign tags with GPG";
+ checked <=> root.tag-gpgsign;
+ }
+ }
}
- LineEdit {
- placeholder-text: "sendemail.smtpuser";
- text <=> root.sendemail-smtpuser;
- }
+ // ── Email sending ──
+ Card {
+ VerticalBox {
+ padding: 20px;
+ spacing: 10px;
- HorizontalBox {
- spacing: 12px;
+ SectionTitle {
+ text: "Email sending (sendemail)";
+ }
- VerticalBox {
- spacing: 4px;
+ Text {
+ text: "From";
+ font-size: 13px;
+ }
+
+ LineEdit {
+ placeholder-text: "Name <y...@example.com>";
+ text <=> root.sendemail-from;
+ }
Text {
- text: "SMTP server";
+ text: "SMTP username";
+ font-size: 13px;
}
LineEdit {
- placeholder-text: "smtp.example.com";
- text <=> root.sendemail-smtpserver;
+ placeholder-text: "sendemail.smtpuser";
+ text <=> root.sendemail-smtpuser;
}
- }
- VerticalBox {
- spacing: 4px;
+ HorizontalBox {
+ spacing: 12px;
+
+ VerticalBox {
+ spacing: 4px;
+
+ Text {
+ text: "SMTP server";
+ font-size: 13px;
+ }
+
+ LineEdit {
+ placeholder-text: "smtp.example.com";
+ text <=> root.sendemail-smtpserver;
+ }
+ }
+
+ VerticalBox {
+ spacing: 4px;
+
+ Text {
+ text: "Port";
+ font-size: 13px;
+ }
+
+ LineEdit {
+ width: 96px;
+ input-type: number;
+ placeholder-text: "465";
+ text <=> root.sendemail-smtpserverport;
+ }
+ }
+ }
Text {
- text: "Port";
+ text: "Encryption";
+ font-size: 13px;
}
- LineEdit {
- width: 100px;
- input-type: number;
- placeholder-text: "465";
- text <=> root.sendemail-smtpserverport;
+ ComboBox {
+ model: root.encryption-options;
+ current-value <=> root.encryption-selected-value;
}
}
}
- Text {
- text: "Encryption";
- }
+ // ── CLI preview ──
+ Card {
+ VerticalBox {
+ padding: 16px;
+ spacing: 6px;
- ComboBox {
- model: root.encryption-options;
- current-value <=> root.encryption-selected-value;
- }
+ SectionTitle {
+ text: "git config --global";
+ }
- Button {
- text: "Save";
- primary: true;
- clicked => {
- root.save-clicked();
+ Text {
+ text: root.cli-preview;
+ font-family: "monospace";
+ font-size: 12px;
+ wrap: no-wrap;
+ overflow: elide;
+ }
+
+ Text {
+ text: "✓ written via git CLI";
+ font-family: "monospace";
+ font-size: 12px;
+ color: #66bb6a;
+ }
}
}
- Text {
- text: root.status-text;
- wrap: word-wrap;
+ // ── Save row ──
+ HorizontalBox {
+ spacing: 16px;
+
+ Text {
+ text: root.status-text;
+ wrap: word-wrap;
+ vertical-alignment: center;
+ horizontal-stretch: 1;
+ }
+
+ Button {
+ text: "Save";
+ primary: true;
+ clicked => {
+ root.save-clicked();
+ }
+ }
}
}
}
--
2.53.0
[next | thread overview | mbox]
archive of zit-studio-code@googlegroups.com