jpmschweitzer/clide
1
0
Fork 0
Code Issues Pull Requests Packages Projects Releases Wiki Activity

center welcome content, bump font sizes, hide debug banner

Browse Source 
Welcome content block is now centered in the viewport with a
720px max-width constraint. Status line pinned to the bottom.
Font sizes bumped across the board: title 52px, subtitle 16px,
section headers 12px, action labels 15px, recent project names
15px. Debug banner disabled via debugShowCheckedModeBanner.

Co-Authored-By: Claude Opus 4.6 (1M context) <noreply@anthropic.com>
This commit is contained in:
jpmschweitzer
2026-04-22 23:38:44 +02:00
co-authored by Claude Opus 4.6
parent 16ecf51091
commit b581ed3fe8
2 changed files with 46 additions and 37 deletions
Download Patch File Download Diff File Expand all files Collapse all files
app/lib/app.dart
+1
View File
@@ -29,6 +29,7 @@ class _AppRoot extends StatelessWidget {
@override @override
Widget build(BuildContext context) { Widget build(BuildContext context) {
return WidgetsApp( return WidgetsApp(
debugShowCheckedModeBanner: false,
title: 'clide', title: 'clide',
color: const Color(0xFF000000), color: const Color(0xFF000000),
pageRouteBuilder: <T>(RouteSettings settings, WidgetBuilder builder) => PageRouteBuilder<T>( pageRouteBuilder: <T>(RouteSettings settings, WidgetBuilder builder) => PageRouteBuilder<T>(
app/lib/builtin/welcome/src/welcome_view.dart
+45 -37
View File
@@ -11,28 +11,36 @@ class WelcomeView extends StatelessWidget {
Widget build(BuildContext context) { Widget build(BuildContext context) {
final kernel = ClideKernel.of(context); final kernel = ClideKernel.of(context);
final tokens = ClideTheme.of(context).surface; final tokens = ClideTheme.of(context).surface;
return Padding( return Stack(
padding: const EdgeInsets.symmetric(horizontal: 64, vertical: 48), children: [
child: Column( Center(
crossAxisAlignment: CrossAxisAlignment.start, child: ConstrainedBox(
children: [ constraints: const BoxConstraints(maxWidth: 720),
const Spacer(flex: 1), child: Column(
_Header(tokens: tokens), mainAxisSize: MainAxisSize.min,
const SizedBox(height: 48),
Expanded(
flex: 3,
child: Row(
crossAxisAlignment: CrossAxisAlignment.start, crossAxisAlignment: CrossAxisAlignment.start,
children: [ children: [
SizedBox(width: 340, child: _StartColumn(tokens: tokens, kernel: kernel)), _Header(tokens: tokens),
const SizedBox(width: 48), const SizedBox(height: 56),
Expanded(child: _RecentColumn(tokens: tokens, kernel: kernel)), Row(
crossAxisAlignment: CrossAxisAlignment.start,
children: [
Expanded(child: _StartColumn(tokens: tokens, kernel: kernel)),
const SizedBox(width: 56),
Expanded(child: _RecentColumn(tokens: tokens, kernel: kernel)),
],
),
], ],
), ),
), ),
_StatusLine(tokens: tokens, kernel: kernel), ),
], Positioned(
), left: 64,
right: 64,
bottom: 24,
child: _StatusLine(tokens: tokens, kernel: kernel),
),
],
); );
} }
} }
@@ -46,13 +54,13 @@ class _Header extends StatelessWidget {
return Row( return Row(
crossAxisAlignment: CrossAxisAlignment.center, crossAxisAlignment: CrossAxisAlignment.center,
children: [ children: [
Image.asset('assets/logo/clide-logo-192.png', width: 64, height: 64), Image.asset('assets/logo/clide-logo-192.png', width: 72, height: 72),
const SizedBox(width: 20), const SizedBox(width: 24),
Column( Column(
crossAxisAlignment: CrossAxisAlignment.start, crossAxisAlignment: CrossAxisAlignment.start,
children: [ children: [
ClideText('clide', fontSize: 42, fontWeight: FontWeight.w300, color: tokens.globalForeground), ClideText('clide', fontSize: 52, fontWeight: FontWeight.w300, color: tokens.globalForeground),
ClideText('Flutter desktop IDE for Claude Code', muted: true, fontSize: 14), ClideText('Flutter desktop IDE for Claude Code', muted: true, fontSize: 16),
], ],
), ),
], ],
@@ -70,8 +78,8 @@ class _StartColumn extends StatelessWidget {
return Column( return Column(
crossAxisAlignment: CrossAxisAlignment.start, crossAxisAlignment: CrossAxisAlignment.start,
children: [ children: [
ClideText('START', fontSize: 11, color: tokens.sidebarSectionHeader, fontFamily: clideMonoFamily), ClideText('START', fontSize: 12, color: tokens.sidebarSectionHeader, fontFamily: clideMonoFamily),
const SizedBox(height: 16), const SizedBox(height: 20),
_ActionRow( _ActionRow(
icon: PhosphorIcons.folder, icon: PhosphorIcons.folder,
label: 'Open folder…', label: 'Open folder…',
@@ -144,11 +152,11 @@ class _ActionRowState extends State<_ActionRow> {
), ),
child: Row( child: Row(
children: [ children: [
ClideIcon(widget.icon, size: 16, color: widget.tokens.globalTextMuted), ClideIcon(widget.icon, size: 18, color: widget.tokens.globalTextMuted),
const SizedBox(width: 12), const SizedBox(width: 14),
Expanded(child: ClideText(widget.label, fontSize: 14, color: widget.tokens.globalForeground)), Expanded(child: ClideText(widget.label, fontSize: 15, color: widget.tokens.globalForeground)),
if (widget.shortcut != null) if (widget.shortcut != null)
ClideText(widget.shortcut!, fontSize: 12, color: widget.tokens.globalTextMuted, fontFamily: clideMonoFamily), ClideText(widget.shortcut!, fontSize: 13, color: widget.tokens.globalTextMuted, fontFamily: clideMonoFamily),
], ],
), ),
), ),
@@ -171,10 +179,10 @@ class _RecentColumn extends StatelessWidget {
return Column( return Column(
crossAxisAlignment: CrossAxisAlignment.start, crossAxisAlignment: CrossAxisAlignment.start,
children: [ children: [
ClideText('RECENT', fontSize: 11, color: tokens.sidebarSectionHeader, fontFamily: clideMonoFamily), ClideText('RECENT', fontSize: 12, color: tokens.sidebarSectionHeader, fontFamily: clideMonoFamily),
const SizedBox(height: 16), const SizedBox(height: 20),
if (recents.isEmpty) if (recents.isEmpty)
const ClideText('No recent projects.', muted: true, fontSize: 13) const ClideText('No recent projects.', muted: true, fontSize: 14)
else else
for (final r in recents) for (final r in recents)
_RecentRow(project: r, tokens: tokens, onTap: () => _openRecent(r.path)), _RecentRow(project: r, tokens: tokens, onTap: () => _openRecent(r.path)),
@@ -224,23 +232,23 @@ class _RecentRowState extends State<_RecentRow> {
child: Column( child: Column(
crossAxisAlignment: CrossAxisAlignment.start, crossAxisAlignment: CrossAxisAlignment.start,
children: [ children: [
ClideText(widget.project.name, fontSize: 14, fontWeight: FontWeight.w500), ClideText(widget.project.name, fontSize: 15, fontWeight: FontWeight.w500),
const SizedBox(height: 2), const SizedBox(height: 3),
Row( Row(
children: [ children: [
ClideText(widget.project.relativePath, muted: true, fontSize: 12, fontFamily: clideMonoFamily), ClideText(widget.project.relativePath, muted: true, fontSize: 13, fontFamily: clideMonoFamily),
if (widget.project.branch != null) ...[ if (widget.project.branch != null) ...[
ClideText(' · ', muted: true, fontSize: 12), ClideText(' · ', muted: true, fontSize: 13),
ClideIcon(PhosphorIcons.gitBranch, size: 10, color: widget.tokens.globalTextMuted), ClideIcon(PhosphorIcons.gitBranch, size: 11, color: widget.tokens.globalTextMuted),
const SizedBox(width: 3), const SizedBox(width: 3),
ClideText(widget.project.branch!, muted: true, fontSize: 12, fontFamily: clideMonoFamily), ClideText(widget.project.branch!, muted: true, fontSize: 13, fontFamily: clideMonoFamily),
], ],
], ],
), ),
], ],
), ),
), ),
ClideText(widget.project.timeAgo, muted: true, fontSize: 12), ClideText(widget.project.timeAgo, muted: true, fontSize: 13),
], ],
), ),
), ),