UI Polish + debris

editor/App.axaml

@@ -22,6 +22,7 @@
 				<ResourceInclude Source="avares://editor/Resources/EnumBox.axaml" />
 				<ResourceInclude Source="avares://editor/Resources/TagBox.axaml" />
 			</ResourceDictionary.MergedDictionaries>
+			<conv:NegateThicknessConverter x:Key="NegateThicknessConverter" />
 			<conv:PathToBitmapConverter x:Key="PathToBitmapConverter" />
 			<conv:SeverityToColorConverter x:Key="SeverityToColorConverter" />
 			<conv:SeverityBarColorConverter x:Key="SeverityBarColorConverter" />
@@ -440,6 +441,8 @@
 									<Style Selector="DocumentTabStripItem">
 										<Setter Property="IsActive"
 										        Value="{Binding $parent[DocumentTabStrip].IsActive}" />
+										<Setter Property="IsEnabled"
+										        Value="{ReflectionBinding CanActivateTab, FallbackValue=True}" />
 									</Style>
 								</DocumentTabStrip.Styles>
 							</DocumentTabStrip>
@@ -484,6 +487,7 @@
 			<Setter Property="IsVisible"
 			        Value="False" />
 		</Style>
+		<StyleInclude Source="avares://editor/Resources/CompactStyles.axaml" />
 		<StyleInclude Source="avares://Avalonia.Controls.ColorPicker/Themes/Fluent/Fluent.xaml" />
 	</Application.Styles>
 </Application>

editor/Assets/AssetBrowserView.axaml

@@ -47,6 +47,15 @@
 			        Value="{StaticResource Red}" />
 		</Style>
 
+
+        <Style Selector="TreeView.folder-tree TreeViewItem">
+            <Setter Property="MinHeight" Value="24" />
+            <Setter Property="Padding" Value="2,0" />
+        </Style>
+        <Style Selector="TreeView.folder-tree TreeViewItem /template/ Border#PART_LayoutRoot">
+            <Setter Property="MinHeight" Value="24" />
+        </Style>
+
 		<!-- TreeView -->
 		<Style Selector="TreeViewItem /template/ Border#PART_LayoutRoot:pointerover">
 			<Setter Property="Background"
@@ -118,29 +127,29 @@
 		</Style>
 	</UserControl.Styles>
 
-	<Grid ColumnDefinitions="250, 8, *"
+	<Grid ColumnDefinitions="200,4,*"
 	      Margin="8"
 	      ColumnSpacing="0">
 
 		<!-- Folder tree -->
 		<Border Grid.Column="0"
 		        Background="{StaticResource Bg3}"
 		        CornerRadius="8"
-		        Padding="8">
+		        Padding="6">
 			<DockPanel>
 				<!-- Header -->
 				<Border DockPanel.Dock="Top">
 					<Grid ColumnDefinitions="*, Auto, Auto">
 						<TextBlock Text="Folders"
 						           FontWeight="SemiBold"
-						           VerticalAlignment="Center" />
+						           VerticalAlignment="Center" Classes="compact-text" />
 						<Button Grid.Column="1"
 						        Command="{Binding ExpandAllCommand}"
 						        ToolTip.Tip="Expand All"
 						        Background="{StaticResource Bg4}"
 						        Padding="4"
 						        Margin="0,0,2,0"
-						        CornerRadius="6">
+						        CornerRadius="6" Classes="compact-control">
 							<LucideIcon Kind="ChevronsUpDown"
 							            Size="16"
 							            StrokeWidth="2.5" />
@@ -150,7 +159,7 @@
 						        ToolTip.Tip="Collapse All"
 						        Background="{StaticResource Bg4}"
 						        Padding="4"
-						        CornerRadius="6">
+						        CornerRadius="6" Classes="compact-control">
 							<LucideIcon Kind="ChevronsDownUp"
 							            Size="16"
 							            StrokeWidth="2.5" />
@@ -161,13 +170,13 @@
 				<ScrollViewer Margin="-6"
 				              Padding="6"
 				              HorizontalScrollBarVisibility="Disabled">
-					<TreeView ItemsSource="{Binding Folders}"
+					<TreeView Classes="folder-tree" ItemsSource="{Binding Folders}"
 					          DragDrop.AllowDrop="True"
 					          DragDrop.DragOver="OnFolderTargetDragOver"
 					          DragDrop.Drop="OnFolderTargetDrop"
 					          SelectedItem="{Binding SelectedFolder, Mode=TwoWay}"
 					          SelectionMode="Single"
-					          Margin="8"
+					          Margin="0,4,0,0"
 					          Background="Transparent">
 						<TreeView.Styles>
 							<Style Selector="TreeViewItem">
@@ -181,7 +190,7 @@
 							<TreeDataTemplate x:DataType="vm:AssetFolder"
 							                  ItemsSource="{Binding SubFolders}">
 								<TextBlock Text="{Binding Name}"
-								           TextTrimming="CharacterEllipsis">
+								           TextTrimming="CharacterEllipsis" Classes="compact-text">
 									<TextBlock.ContextMenu>
 										<ContextMenu x:DataType="vm:AssetFolder">
 											<MenuItem Command="{Binding Owner.RenameCommand}"
@@ -242,29 +251,29 @@
 		              Width="4" />
 
 		<DockPanel Grid.Column="2"
-		           VerticalSpacing="8">
+		           VerticalSpacing="4">
 			<!-- Toolbar -->
 			<Border DockPanel.Dock="Top"
 			        Background="{StaticResource Bg3}"
 			        CornerRadius="8"
-			        Padding="8">
+			        Padding="6">
 				<Grid ColumnDefinitions="85, 85, 85, *, Auto, Auto"
-				      ColumnSpacing="8">
+				      ColumnSpacing="4">
 					<!-- New -->
 					<Button Grid.Column="0"
 					        MinWidth="85"
 					        HorizontalContentAlignment="Center"
 					        CornerRadius="6"
 					        Background="{StaticResource Red}"
 					        IsEnabled="{Binding CanWriteToSelectedFolder}"
-					        Click="OnNewButtonClick">
+					        Click="OnNewButtonClick" Classes="compact-control">
 						<StackPanel Orientation="Horizontal"
 						            Spacing="4">
 							<LucideIcon Kind="Plus"
 							            Size="16"
 							            StrokeWidth="3.5" />
 							<TextBlock Text="New"
-							           FontWeight="Bold" />
+							           FontWeight="Bold" Classes="compact-text" />
 						</StackPanel>
 					</Button>
 
@@ -274,13 +283,13 @@
 					        HorizontalContentAlignment="Center"
 					        CornerRadius="6"
 					        Command="{Binding CreateFolderCommand}"
-					        Background="{StaticResource Bg4}">
+					        Background="{StaticResource Bg4}" Classes="compact-control">
 						<StackPanel Orientation="Horizontal"
 						            Spacing="4">
 							<LucideIcon Kind="FolderPlus"
 							            Size="16"
 							            StrokeWidth="2" />
-							<TextBlock Text="Folder" />
+							<TextBlock Text="Folder" Classes="compact-text" />
 						</StackPanel>
 					</Button>
 
@@ -291,13 +300,13 @@
 					        HorizontalContentAlignment="Center"
 					        CornerRadius="6"
 					        Background="{StaticResource Bg4}"
-					        IsEnabled="{Binding CanWriteToSelectedFolder}">
+					        IsEnabled="{Binding CanWriteToSelectedFolder}" Classes="compact-control">
 						<StackPanel Orientation="Horizontal"
 						            Spacing="4">
 							<LucideIcon Kind="Download"
 							            Size="16"
 							            StrokeWidth="2" />
-							<TextBlock Text="Import" />
+							<TextBlock Text="Import" Classes="compact-text" />
 						</StackPanel>
 					</Button>
 
@@ -321,12 +330,12 @@
 									            VerticalAlignment="Center">
 										<Button Content="{Binding Label}"
 										        Command="{Binding Navigate}"
-										        Classes="breadcrumb" />
-										<TextBlock Text=" /"
+										       Classes="breadcrumb compact-control" />
+										<TextBlock Text="/"
 										           IsVisible="{Binding !IsLast}"
 										           VerticalAlignment="Center"
 										           Opacity="0.4"
-										           Margin="0,0,2,0" />
+										           Margin="2,-2,2,0" Classes="compact-text" />
 									</StackPanel>
 								</DataTemplate>
 							</ItemsControl.ItemTemplate>
@@ -342,19 +351,19 @@
 					         CornerRadius="6"
 					         BorderThickness="0"
 					         VerticalContentAlignment="Center"
-					         Background="{StaticResource Bg1}" />
+					         Background="{StaticResource Bg1}" Classes="compact-control" />
 
 					<!-- Filters -->
 					<Button Grid.Column="5"
 					        CornerRadius="6"
-					        Padding="8"
-					        Background="{StaticResource Bg4}">
+					        Padding="6,4"
+					        Background="{StaticResource Bg4}" Classes="compact-control">
 						<StackPanel Orientation="Horizontal"
 						            Spacing="4">
 							<LucideIcon Kind="Funnel"
 							            Size="16"
 							            StrokeWidth="2.5" />
-							<TextBlock Text="Filter" />
+							<TextBlock Text="Filter" Classes="compact-text" />
 						</StackPanel>
 						<Button.Flyout>
 							<Flyout Placement="BottomEdgeAlignedRight">
@@ -412,7 +421,7 @@
 										           Foreground="{StaticResource TextMuted}"
 										           FontSize="12" />
 										<Button Command="{Binding ManageTagsCommand}"
-										        Classes="breadcrumb"
+										       Classes="breadcrumb"
 										        FontSize="12"
 										        Padding="0,2"
 										        Foreground="{StaticResource Blue}"
@@ -499,7 +508,7 @@
 					</ContextMenu>
 				</Border.ContextMenu>
 
-				<DockPanel VerticalSpacing="8">
+				<DockPanel VerticalSpacing="4">
 					<!-- Item counter -->
 					<TextBlock DockPanel.Dock="Bottom"
 					           Text="{Binding ItemCount}"

editor/Components/Elements/AnimatedReveal.cs

@@ -0,0 +1,60 @@
+using System;
+using System.Diagnostics;
+using Avalonia;
+using Avalonia.Controls;
+using Avalonia.Threading;
+
+namespace editor.Components.Elements;
+
+public sealed class AnimatedReveal : Decorator {
+	public static readonly StyledProperty<bool> IsExpandedProperty =
+		AvaloniaProperty.Register<AnimatedReveal, bool>(nameof(IsExpanded), true);
+	private DispatcherTimer? m_timer;
+	private double? m_height;
+	public bool IsExpanded { get => GetValue(IsExpandedProperty); set => SetValue(IsExpandedProperty, value); }
+	public AnimatedReveal() { ClipToBounds = true; }
+
+	protected override void OnPropertyChanged(AvaloniaPropertyChangedEventArgs change) {
+		base.OnPropertyChanged(change);
+		if (change.Property != IsExpandedProperty) return;
+		m_timer?.Stop();
+		var child = Child;
+		if (child is null || TopLevel.GetTopLevel(this) is null) { m_height = null; InvalidateMeasure(); return; }
+		var from = Bounds.Height;
+		child.IsVisible = true;
+		child.Measure(new Size(Bounds.Width, double.PositiveInfinity));
+		var to = IsExpanded ? child.DesiredSize.Height : 0;
+		m_height = from;
+		var clock = Stopwatch.StartNew();
+		var timer = new DispatcherTimer { Interval = TimeSpan.FromMilliseconds(8) };
+		m_timer = timer;
+		timer.Tick += (_, _) => {
+			var t = Math.Min(clock.Elapsed.TotalMilliseconds / 180, 1);
+			m_height = from + (to - from) * (1 - Math.Pow(1 - t, 3));
+			if (t >= 1) {
+				timer.Stop(); m_timer = null; m_height = null;
+				if (Child is not null) Child.IsVisible = IsExpanded;
+			}
+			InvalidateMeasure();
+		};
+		timer.Start();
+		InvalidateMeasure();
+	}
+
+	protected override Size MeasureOverride(Size availableSize) {
+		if (Child is null) return default;
+		if (m_timer is null) Child.IsVisible = IsExpanded;
+		Child.Measure(new Size(availableSize.Width, double.PositiveInfinity));
+		return new Size(Child.DesiredSize.Width, m_height ?? (IsExpanded ? Child.DesiredSize.Height : 0));
+	}
+
+	protected override Size ArrangeOverride(Size finalSize) {
+		Child?.Arrange(new Rect(0, 0, finalSize.Width, Math.Max(finalSize.Height, Child.DesiredSize.Height)));
+		return finalSize;
+	}
+
+	protected override void OnDetachedFromVisualTree(VisualTreeAttachmentEventArgs e) {
+		m_timer?.Stop(); m_timer = null; m_height = null;
+		base.OnDetachedFromVisualTree(e);
+	}
+}

editor/Components/Elements/ArrayBox.cs

@@ -370,7 +370,7 @@ private Control BuildStructRow(object item, IList keys) {
 		var card = new Border {
 			Background = Brush("Bg3"),
 			CornerRadius = new CornerRadius(6),
-			Padding = new Thickness(8),
+			Padding = new Thickness(Classes.Contains("compact-array") ? 6 : 8),
 			Child = grid
 		};
 		// Container RowBackground is null

editor/Components/Elements/ColorBoxBase.cs

@@ -23,9 +23,6 @@ namespace editor.Components.Elements;
 public abstract class ColorBoxBase : TemplatedControl {
 	private const double DragThreshold = 3.0;
 
-	private const double RootPadding = 16;
-	private const double SwatchSize = 20;
-	private const double Spacing = 8;
 	private const double BoxBreath = 6;
 
 	// Picker
@@ -279,7 +276,7 @@ private void UpdateDisplay(double availableWidth) {
 			decimals = maxDecimals;
 			visible = true;
 		} else {
-			var valueWidth = availableWidth - RootPadding - SwatchSize - Spacing;
+			var valueWidth = availableWidth - 32 - Padding.Left - Padding.Right;
 			var floor = maxDecimals == 0 ? 0 : 1; // keep at least one decimal, else hide
 			decimals = -1;
 			for (var d = maxDecimals; d >= floor; d--)
@@ -508,7 +505,7 @@ private void BuildEditor() {
 		var box = new TextBox {
 			MinWidth = 96,
 			FontFamily = FontFamily ?? Font,
-			FontSize = FontSize
+			FontSize = 15
 		};
 		m_editBox = box;
 		box.KeyDown += (_, e) => {

editor/Components/Elements/DragVectorBoxBase.cs

@@ -18,11 +18,12 @@ namespace editor.Components.Elements;
 
 public abstract class DragVectorBoxBase : Decorator {
 	private const double Radius = 6;
-	private const double Spacing = 8;
-	private const double LabelWidth = 24;
+	private bool IsCompact => Classes.Contains("compact-vector");
+	private double Spacing => IsCompact ? 4 : 8;
+	private double LabelWidth => IsCompact ? 20 : 24;
 	private const double ThinLabelWidth = 4;
-	private const double FontSize = 15;
-	private const double BoxPadding = 16;
+	private double FontSize => IsCompact ? 13 : 15;
+	private double BoxPadding => IsCompact ? 12 : 16;
 	private const double SignWidth = 8;
 	private const double BoxBreath = 4;
 
@@ -241,6 +242,7 @@ private Control BuildCell(AxisSpec spec, int index, int count, Compaction level)
 			[!DragFloatBox.CoarseStepProperty] = this[!CoarseStepProperty],
 			[!DragFloatBox.FineStepProperty] = this[!FineStepProperty]
 		};
+		if (IsCompact) box.Classes.Add("compact-field");
 		if (showUnit) box[!DragNumberBoxBase.UnitProperty] = this[!UnitProperty];
 		box.Decimals = decimals;