Skip to content

fix(windows): polish settings and tray UI #123

New issue

Have a question about this project? Sign up for a free GitHub account to open an issue and contact its maintainers and the community.

Sign up for GitHub

By clicking “Sign up for GitHub”, you agree to our terms of service and privacy statement. We’ll occasionally send you account related emails.

Already on GitHub? Sign in to your account

Open
SantanuDatta wants to merge 4 commits into
base: main
Choose a base branch
from
Open

fix(windows): polish settings and tray UI #123

Show file tree
Hide file tree
Changes from all commits
Commits
Show all changes
4 commits
Select commit Hold shift + click to select a range
93d538f
fix(windows): polish settings and tray UI
SantanuDatta Nov 7, 2026
7dee143
Merge branch 'main' of github.com:SantanuDatta/flock into fix/windows…
SantanuDatta Nov 8, 2026
aa7e444
fix(windows): keep Cancel out of destructive dialog styling
SantanuDatta Nov 8, 2026
371d6e0
fix(windows): use neutral styling for Cancel in destructive dialogs
SantanuDatta Nov 8, 2026
File filter

Filter by extension

Filter by extension
Conversations
Failed to load comments.
Loading
Jump to
Jump to file
Failed to load files.
Loading
Diff view
Diff view
27 changes: 27 additions & 0 deletions windows/Flock.Screenshots/ScreenshotSession.cs
View file
Open in desktop
Original file line number Diff line number Diff line change
Expand Up @@ -2,6 +2,7 @@
using Flock.Tray.ViewModels;
using Microsoft.UI.Xaml;
using Microsoft.UI.Xaml.Controls;
using Microsoft.UI.Xaml.Input;
using Microsoft.UI.Xaml.Media;
namespace Flock.Tray;

Expand Down Expand Up @@ -79,6 +80,32 @@ internal async Task<Window> ShowAddDomain(string site, string domain)
return window;
}

/// <summary>A destructive confirmation, without changing the demo project folders.</summary>
internal async Task<Window> ShowRemoveProjectFolder()
{
var window = (SettingsWindow)await ShowSettings(SettingsPane.General);
await Settled();
_ = window.Confirm("Remove C:\\Projects from project folders?",
"Its folders stop being served as sites. Nothing is deleted from disk.", "Remove", true);
await Settled();
var dialog = VisualTreeHelper.GetOpenPopupsForXamlRoot(window.XamlRoot)
.Select(popup => popup.Child is { } child ? Find<ContentDialog>(child, _ => true) : null)
.FirstOrDefault(found => found is not null)
?? throw new InvalidOperationException("The confirmation dialog did not open.");
var remove = Find<Button>(dialog, button => button.Name == "PrimaryButton");
var cancel = Find<Button>(dialog, button => button.Name == "CloseButton");
if (remove?.Background is not SolidColorBrush { Color: { R: 196, G: 43, B: 28 } or { R: 178, G: 38, B: 25 } or { R: 160, G: 34, B: 22 } }
|| cancel?.Background is not SolidColorBrush cancelBackground
|| cancelBackground.Color == ((SolidColorBrush)remove.Background).Color
|| !ReferenceEquals(cancel.Style, Ui.Resource<Style>("DefaultButtonStyle"))
|| dialog.DefaultButton != ContentDialogButton.None
|| !ReferenceEquals(FocusManager.GetFocusedElement(window.XamlRoot), cancel))
{
throw new InvalidOperationException($"Unexpected button colors: Remove={(remove?.Background as SolidColorBrush)?.Color}, Cancel={(cancel?.Background as SolidColorBrush)?.Color}, Default={dialog.DefaultButton}.");
}
return window;
}

/// <summary>A site's "…" menu, open.</summary>
internal async Task<Window> ShowSiteMenu(string site)
{
Expand Down
4 changes: 4 additions & 0 deletions windows/Flock.Screenshots/Screenshots.cs
View file
Open in desktop
Original file line number Diff line number Diff line change
Expand Up @@ -13,6 +13,8 @@ internal sealed class Screenshots(Screenshots.Options options)
private static readonly Shot[] All =
[
new("settings-general-project-folders", app => app.ShowSettings(SettingsPane.General, "Updates")),
new("settings-remove-project-folder", app => app.ShowRemoveProjectFolder()),
new("settings-general-daemon", app => app.ShowSettings(SettingsPane.General)),
new("settings-sites", app => app.ShowSite("shop")),
new("settings-sites-https", app => app.ShowSite("acme")),
new("settings-sites-add-domain", app => app.ShowAddDomain("acme", "admin")),
Expand All @@ -24,6 +26,8 @@ internal sealed class Screenshots(Screenshots.Options options)
new("settings-services-postgres", app => app.ShowService("postgres")),
new("settings-services-install", app => app.ShowService("mariadb")),
new("settings-debugger", app => app.ShowSettings(SettingsPane.Debugger)),
new("settings-mail", app => app.ShowSettings(SettingsPane.Mail)),
new("settings-about", app => app.ShowSettings(SettingsPane.About)),
new("logs-window", app => app.ShowLog("acme")),
new("mail-window", app => app.ShowMail()),
new("dumps-window", app => app.ShowWindow(WindowKind.Dumps)),
Expand Down
18 changes: 18 additions & 0 deletions windows/Flock.Tray/FlockWindow.xaml.cs
View file
Open in desktop
Original file line number Diff line number Diff line change
Expand Up @@ -67,6 +67,24 @@ protected void InitializeChrome(Grid root, Grid titleBar, TextBlock caption, Ima
ExtendsContentIntoTitleBar = true;
AppWindow.TitleBar.PreferredHeightOption = TitleBarHeightOption.Tall;
SetTitleBar(titleBar);
root.Loaded += (_, _) => UpdateTitleBarTheme(root);
root.ActualThemeChanged += (sender, _) => UpdateTitleBarTheme(sender);
UpdateTitleBarTheme(root);
}

private void UpdateTitleBarTheme(FrameworkElement root)
{
var light = root.ActualTheme == ElementTheme.Light;
var titleBar = AppWindow.TitleBar;
var foreground = light ? Colors.Black : Colors.White;
titleBar.ButtonForegroundColor = foreground;
titleBar.ButtonHoverForegroundColor = foreground;
titleBar.ButtonPressedForegroundColor = foreground;
titleBar.ButtonInactiveForegroundColor = Colors.Gray;
titleBar.ButtonBackgroundColor = Colors.Transparent;
titleBar.ButtonInactiveBackgroundColor = Colors.Transparent;
titleBar.ButtonHoverBackgroundColor = light ? Microsoft.UI.ColorHelper.FromArgb(255, 230, 230, 230) : Microsoft.UI.ColorHelper.FromArgb(255, 55, 55, 55);
titleBar.ButtonPressedBackgroundColor = light ? Microsoft.UI.ColorHelper.FromArgb(255, 240, 240, 240) : Microsoft.UI.ColorHelper.FromArgb(255, 45, 45, 45);
}

private static string DisplayTitle(string title) => App.Current.Options.Identity.IsDevelopment ? title + " [Dev]" : title;
Expand Down
12 changes: 6 additions & 6 deletions windows/Flock.Tray/PanelWindow.xaml
View file
Open in desktop
Original file line number Diff line number Diff line change
Expand Up @@ -272,22 +272,22 @@
<ColumnDefinition Width="*" />
<ColumnDefinition Width="Auto" />
</Grid.ColumnDefinitions>
<StackPanel Orientation="Horizontal" Spacing="8">
<StackPanel Orientation="Horizontal" Spacing="8" VerticalAlignment="Center">
<FontIcon Glyph="{StaticResource GlyphBug}" FontFamily="{StaticResource SymbolsFont}" FontSize="14" />
<TextBlock Text="Xdebug" />
<TextBlock Text="Xdebug" VerticalAlignment="Center" />
</StackPanel>
<ToggleSwitch Grid.Column="1" IsOn="{Binding Xdebug, Mode=TwoWay}" OnContent="" OffContent="" MinWidth="0" />
<ToggleSwitch Grid.Column="1" IsOn="{Binding Xdebug, Mode=TwoWay}" OnContent="" OffContent="" MinWidth="0" VerticalAlignment="Center" />
</Grid>
<Grid>
<Grid.ColumnDefinitions>
<ColumnDefinition Width="*" />
<ColumnDefinition Width="Auto" />
</Grid.ColumnDefinitions>
<StackPanel Orientation="Horizontal" Spacing="8">
<StackPanel Orientation="Horizontal" Spacing="8" VerticalAlignment="Center">
<FontIcon Glyph="{StaticResource GlyphDownload}" FontFamily="{StaticResource SymbolsFont}" FontSize="14" />
<TextBlock Text="Capture dumps" />
<TextBlock Text="Capture dumps" VerticalAlignment="Center" />
</StackPanel>
<ToggleSwitch Grid.Column="1" IsOn="{Binding Dumps, Mode=TwoWay}" IsEnabled="{Binding CaptureEnabled}" OnContent="" OffContent="" MinWidth="0" />
<ToggleSwitch Grid.Column="1" IsOn="{Binding Dumps, Mode=TwoWay}" IsEnabled="{Binding CaptureEnabled}" OnContent="" OffContent="" MinWidth="0" VerticalAlignment="Center" />
</Grid>
</StackPanel>

Expand Down
26 changes: 13 additions & 13 deletions windows/Flock.Tray/Settings/AboutPane.xaml
View file
Open in desktop
Original file line number Diff line number Diff line change
Expand Up @@ -4,7 +4,7 @@
xmlns:x="http://schemas.microsoft.com/winfx/2006/xaml">
<StackPanel Spacing="0">
<StackPanel Orientation="Horizontal" Spacing="20" Margin="0,0,0,24">
<Image Source="Assets/AppIcon.png" Width="72" Height="72" />
<Image x:Name="AppIcon" Width="72" Height="72" />
<StackPanel Spacing="2" VerticalAlignment="Center">
<TextBlock Text="Flock" Style="{StaticResource TitleLargeTextBlockStyle}" />
<TextBlock Text="A native local development environment for Laravel." Style="{StaticResource CaptionTextBlockStyle}"
Expand All @@ -17,61 +17,61 @@
<Grid.ColumnDefinitions>
<ColumnDefinition Width="*" /><ColumnDefinition Width="Auto" />
</Grid.ColumnDefinitions>
<TextBlock Text="App" /><TextBlock x:Name="AppVersion" Grid.Column="1" Foreground="{ThemeResource TextFillColorSecondaryBrush}" />
<TextBlock Text="App" VerticalAlignment="Center" /><TextBlock x:Name="AppVersion" Grid.Column="1" Foreground="{ThemeResource TextFillColorSecondaryBrush}" VerticalAlignment="Center" />
</Grid>
</Border>
<Border Style="{StaticResource CardStyle}">
<Grid Style="{StaticResource SettingRowStyle}">
<Grid.ColumnDefinitions>
<ColumnDefinition Width="*" /><ColumnDefinition Width="Auto" />
</Grid.ColumnDefinitions>
<TextBlock Text="Daemon" /><TextBlock Text="{Binding DaemonVersion}" Grid.Column="1" Foreground="{ThemeResource TextFillColorSecondaryBrush}" />
<TextBlock Text="Daemon" VerticalAlignment="Center" /><TextBlock Text="{Binding DaemonVersion}" Grid.Column="1" Foreground="{ThemeResource TextFillColorSecondaryBrush}" VerticalAlignment="Center" />
</Grid>
</Border>
<Border Style="{StaticResource CardStyle}">
<Grid Style="{StaticResource SettingRowStyle}">
<Grid.ColumnDefinitions>
<ColumnDefinition Width="*" /><ColumnDefinition Width="Auto" />
</Grid.ColumnDefinitions>
<StackPanel Spacing="1">
<StackPanel Spacing="1" VerticalAlignment="Center">
<TextBlock Text="Data folder" />
<TextBlock Text="{Binding DataFolder}" Foreground="{ThemeResource TextFillColorSecondaryBrush}" TextTrimming="CharacterEllipsis" />
</StackPanel>
<Button Grid.Column="1" Content="Show in Explorer" Click="ShowDataFolder" />
<Button Grid.Column="1" Content="Show in Explorer" Click="ShowDataFolder" VerticalAlignment="Center" />
</Grid>
</Border>
<Border Style="{StaticResource CardStyle}">
<Grid Style="{StaticResource SettingRowStyle}">
<Grid.ColumnDefinitions>
<ColumnDefinition Width="*" /><ColumnDefinition Width="Auto" />
</Grid.ColumnDefinitions>
<TextBlock Text="Flock documentation" /><Button Grid.Column="1" Content="Open" Click="OpenDocumentation" />
<TextBlock Text="Flock documentation" VerticalAlignment="Center" /><Button Grid.Column="1" Content="Open" Click="OpenDocumentation" VerticalAlignment="Center" />
</Grid>
</Border>
<Border Style="{StaticResource CardStyle}">
<Grid Style="{StaticResource SettingRowStyle}">
<Grid.ColumnDefinitions>
<ColumnDefinition Width="*" /><ColumnDefinition Width="Auto" />
</Grid.ColumnDefinitions>
<StackPanel Spacing="1">
<StackPanel Spacing="1" VerticalAlignment="Center">
<TextBlock Text="Found a bug?" />
<TextBlock Text="Opens a new GitHub issue with your versions filled in." Style="{StaticResource CaptionTextBlockStyle}"
Foreground="{ThemeResource TextFillColorSecondaryBrush}" TextWrapping="Wrap" />
</StackPanel>
<Button Grid.Column="1" Content="Report an issue" Click="ReportIssue" />
<Button Grid.Column="1" Content="Report an issue" Click="ReportIssue" VerticalAlignment="Center" />
</Grid>
</Border>
<Border Style="{StaticResource CardStyle}">
<Grid Style="{StaticResource SettingRowStyle}">
<Grid.ColumnDefinitions>
<ColumnDefinition Width="*" /><ColumnDefinition Width="Auto" />
</Grid.ColumnDefinitions>
<StackPanel Spacing="1">
<StackPanel Spacing="1" VerticalAlignment="Center">
<TextBlock Text="License" />
<TextBlock Text="Copyright © Guava s.r.o. Licensed under the AGPL-3.0." Style="{StaticResource CaptionTextBlockStyle}"
Foreground="{ThemeResource TextFillColorSecondaryBrush}" TextWrapping="Wrap" />
</StackPanel>
<Button Grid.Column="1" Content="View" Click="OpenLicense" />
<Button Grid.Column="1" Content="View" Click="OpenLicense" VerticalAlignment="Center" />
</Grid>
</Border>
</StackPanel>
Expand All @@ -82,14 +82,14 @@
<Grid.ColumnDefinitions>
<ColumnDefinition Width="*" /><ColumnDefinition Width="Auto" />
</Grid.ColumnDefinitions>
<StackPanel Spacing="1">
<StackPanel Spacing="1" VerticalAlignment="Center">
<TextBlock Text="Uninstall Flock" />
<TextBlock Text="Stops Flock and removes it from this PC. Your sites, databases and settings are kept."
Style="{StaticResource CaptionTextBlockStyle}" Foreground="{ThemeResource TextFillColorSecondaryBrush}" TextWrapping="Wrap" />
</StackPanel>
<Button Grid.Column="1" Content="Uninstall Flock…" Click="ConfirmUninstallClicked" />
<Button Grid.Column="1" Content="Uninstall Flock…" Click="ConfirmUninstallClicked" VerticalAlignment="Center" />
</Grid>
</Border>
</StackPanel>
</StackPanel>
</UserControl>
</UserControl>
4 changes: 3 additions & 1 deletion windows/Flock.Tray/Settings/AboutPane.xaml.cs
View file
Open in desktop
Original file line number Diff line number Diff line change
Expand Up @@ -5,6 +5,7 @@
using Flock.Tray.Infrastructure;
using Microsoft.UI.Xaml;
using Microsoft.UI.Xaml.Controls;
using Microsoft.UI.Xaml.Media.Imaging;
namespace Flock.Tray.Settings;

internal sealed partial class AboutPane : UserControl, ISettingsPane
Expand All @@ -17,6 +18,7 @@ public AboutPane(SettingsWindow window, RuntimeService model)
{
this.model = model;
InitializeComponent();
AppIcon.Source = new BitmapImage(new Uri(Path.Combine(AppContext.BaseDirectory, "Assets", "AppIcon.png")));
version = Assembly.GetExecutingAssembly().GetCustomAttribute<AssemblyInformationalVersionAttribute>()?.InformationalVersion ?? "dev";
viewModel = new AboutViewModel(model);
DataContext = viewModel;
Expand Down Expand Up @@ -110,4 +112,4 @@ private void Changed()
PropertyChanged?.Invoke(this, new PropertyChangedEventArgs(nameof(DaemonVersion)));
}
}
}
}
4 changes: 2 additions & 2 deletions windows/Flock.Tray/Settings/AiPane.xaml
View file
Open in desktop
Original file line number Diff line number Diff line change
Expand Up @@ -18,12 +18,12 @@
<Grid.ColumnDefinitions>
<ColumnDefinition Width="*" /><ColumnDefinition Width="Auto" />
</Grid.ColumnDefinitions>
<StackPanel Spacing="1">
<StackPanel Spacing="1" VerticalAlignment="Center">
<TextBlock Text="{Binding Name}" />
<TextBlock Text="{Binding Description}" Style="{StaticResource CaptionTextBlockStyle}"
Foreground="{ThemeResource TextFillColorSecondaryBrush}" TextWrapping="Wrap" />
</StackPanel>
<StackPanel Grid.Column="1" Orientation="Horizontal" Spacing="8">
<StackPanel Grid.Column="1" Orientation="Horizontal" Spacing="8" VerticalAlignment="Center">
<Button Content="Add" Command="{Binding RegisterCommand}"
Visibility="{Binding IsAvailable, Converter={StaticResource BooleanVisibilityConverter}}" />
<Button Content="Remove" Command="{Binding UnregisterCommand}"
Expand Down
Loading
Loading