conjure-os-overlay/Views/MainOverlayWindow.xaml
2025-10-10 18:26:49 -04:00

114 lines
4.7 KiB
XML

<local:OverlayWindow x:Class="Conjure.Arcade.Overlay.Views.MainOverlayWindow"
xmlns="http://schemas.microsoft.com/winfx/2006/xaml/presentation"
xmlns:x="http://schemas.microsoft.com/winfx/2006/xaml"
xmlns:local="clr-namespace:Conjure.Arcade.Overlay"
Title="Overlay" Height="450" Width="800">
<Window.Resources>
<!-- Pixel art glow effect -->
<DropShadowEffect x:Key="GlowEffect"
Color="#4d97f8"
BlurRadius="15"
ShadowDepth="0"/>
<!-- Game UI button style -->
<Style x:Key="GameButton" TargetType="Button">
<Setter Property="Background" Value="#4d97f8"/>
<Setter Property="Foreground" Value="White"/>
<Setter Property="FontFamily" Value="Segoe UI"/>
<Setter Property="FontSize" Value="20"/>
<Setter Property="FontWeight" Value="SemiBold"/>
<Setter Property="Width" Value="180"/>
<Setter Property="Height" Value="50"/>
<Setter Property="Margin" Value="15"/>
<Setter Property="Template">
<Setter.Value>
<ControlTemplate TargetType="Button">
<Border Background="{TemplateBinding Background}"
CornerRadius="8"
BorderThickness="0">
<ContentPresenter HorizontalAlignment="Center"
VerticalAlignment="Center"/>
</Border>
</ControlTemplate>
</Setter.Value>
</Setter>
</Style>
</Window.Resources>
<Grid>
<!-- Background gradient matching Vue app -->
<Rectangle>
<Rectangle.Fill>
<LinearGradientBrush StartPoint="0,0" EndPoint="0,1">
<!-- Almost transparent at top -->
<GradientStop Color="#104d97f8" Offset="0"/>
<!-- Semi-transparent in middle -->
<GradientStop Color="#804d97f8" Offset="0.5"/>
<!-- More opaque at bottom -->
<GradientStop Color="#FF100a7d" Offset="1"/>
</LinearGradientBrush>
</Rectangle.Fill>
</Rectangle>
<!-- Main content layout with defined rows -->
<Grid>
<Grid.RowDefinitions>
<RowDefinition Height="Auto"/> <!-- Time -->
<RowDefinition Height="*"/> <!-- Main content -->
<RowDefinition Height="Auto"/> <!-- Buttons -->
</Grid.RowDefinitions>
<!-- Top bar with time -->
<TextBlock x:Name="TimeText"
Grid.Row="0"
Text="00:00:00"
Foreground="White"
FontFamily="Segoe UI"
FontSize="24"
FontWeight="SemiBold"
TextAlignment="Center"
Margin="0,20,0,0"/>
<!-- Center content -->
<StackPanel Grid.Row="1"
VerticalAlignment="Center"
HorizontalAlignment="Center"
Margin="20">
<!-- Game Logo -->
<Image x:Name="GameLogo"
Width="400"
Height="150"
Stretch="Uniform"
Margin="0,0,0,40"/>
<!-- Status text -->
<TextBlock x:Name="StatusText"
Text="PAUSED"
Foreground="White"
FontFamily="Segoe UI"
FontSize="36"
FontWeight="SemiBold"
TextAlignment="Center"
Effect="{StaticResource GlowEffect}"/>
</StackPanel>
<!-- Action Buttons at bottom -->
<StackPanel Grid.Row="2"
Orientation="Horizontal"
HorizontalAlignment="Center"
Margin="0,0,0,40">
<Button Style="{StaticResource GameButton}"
x:Name="ResumeButton"
Content="Resume Game"
Click="OnResumeClick"/>
<Button Style="{StaticResource GameButton}"
x:Name="QuitButton"
Content="Exit"
Background="#FF4444"
Click="OnQuitClick"/>
</StackPanel>
</Grid>
</Grid>
</local:OverlayWindow>