Files
Nitrox/Nitrox.Launcher/Models/Styles/Theme/TextBoxStyle.axaml
2025-07-06 00:23:46 +02:00

168 lines
11 KiB
XML

<Styles xmlns="https://github.com/avaloniaui" xmlns:x="http://schemas.microsoft.com/winfx/2006/xaml"
xmlns:converters="clr-namespace:Nitrox.Launcher.Models.Converters">
<Design.PreviewWith>
<Panel Background="CornflowerBlue">
<StackPanel
Margin="10"
Orientation="Horizontal"
Spacing="20">
<StackPanel Spacing="10">
<ThemeVariantScope RequestedThemeVariant="Light">
<Border
Background="White"
HorizontalAlignment="Center"
Padding="10">
<StackPanel Spacing="10" Width="200">
<TextBox HorizontalAlignment="Stretch" Watermark="Watermark" />
<TextBox HorizontalAlignment="Stretch" Text="Light" />
<TextBox
Classes="revealPasswordButton"
HorizontalAlignment="Stretch"
Text="Light" />
</StackPanel>
</Border>
</ThemeVariantScope>
<ThemeVariantScope RequestedThemeVariant="Dark">
<Border
Background="Black"
HorizontalAlignment="Center"
Padding="10">
<StackPanel Spacing="10" Width="200">
<TextBox HorizontalAlignment="Stretch" Watermark="Watermark" />
<TextBox HorizontalAlignment="Stretch" Text="Dark" />
<TextBox
Classes="revealPasswordButton"
HorizontalAlignment="Stretch"
Text="Dark" />
</StackPanel>
</Border>
</ThemeVariantScope>
</StackPanel>
</StackPanel>
</Panel>
</Design.PreviewWith>
<Style Selector="TextBox">
<Setter Property="Foreground" Value="{DynamicResource BrandBlack}" />
<Setter Property="CornerRadius" Value="8" />
<Setter Property="Padding" Value="14" />
<Setter Property="Background" Value="{DynamicResource BrandControlBackground}" />
<Setter Property="BorderThickness" Value="0" />
<Setter Property="CaretBrush" Value="{DynamicResource BrandCaret}" />
<Setter Property="VerticalContentAlignment" Value="Center" />
<Style Selector="^ /template/ Border">
<Setter Property="Background" Value="{TemplateBinding Background}" />
<Setter Property="CornerRadius" Value="{TemplateBinding CornerRadius}" />
<Setter Property="BorderThickness" Value="{TemplateBinding BorderThickness}" />
<Setter Property="Transitions">
<Transitions>
<DoubleTransition Duration="0:0:0.15" Property="Opacity" />
</Transitions>
</Setter>
<Style Selector="^:pointerover">
<Setter Property="Background" Value="{TemplateBinding Background}" />
<Setter Property="Opacity" Value=".75" />
</Style>
<Style Selector="^:focus">
<Setter Property="Background" Value="{TemplateBinding Background}" />
</Style>
</Style>
<!-- Remove base border (which removes default Avalonia border brush styles) -->
<Style Selector="^ /template/ Border#PART_BorderElement">
<Setter Property="Opacity" Value="0" />
</Style>
<!-- Fix cursor selection of textbox (weird issue with DockPanel#PART_InnerDockPanel still keeping margin) -->
<Style Selector="^ /template/ Panel > Border > Grid"> <!-- Most senior grid with negative margin to counteract InnerDockPanel -->
<Setter Property="Margin" Value="{Binding Padding, RelativeSource={RelativeSource TemplatedParent}, Converter={converters:TextBoxPaddingToMarginConverter}, ConverterParameter=True}" />
</Style>
<Style Selector="^ /template/ TextBlock#PART_Watermark"> <!-- Watermark text -->
<Setter Property="Margin" Value="{Binding Padding, RelativeSource={RelativeSource TemplatedParent}, Converter={converters:TextBoxPaddingToMarginConverter}}" />
</Style>
<Style Selector="^ /template/ TextPresenter#PART_TextPresenter"> <!-- Text -->
<Setter Property="Margin" Value="{Binding Padding, RelativeSource={RelativeSource TemplatedParent}, Converter={converters:TextBoxPaddingToMarginConverter}}" />
</Style>
<Style Selector="^ /template/ Border > Grid > ContentPresenter:nth-child(3)"> <!-- Reveal Password Button -->
<Setter Property="Margin" Value="{Binding Padding, RelativeSource={RelativeSource TemplatedParent}, Converter={converters:TextBoxPaddingToMarginConverter}}" />
</Style>
<!-- Watermark foreground dimming -->
<Style Selector="^ /template/ TextBlock#PART_Watermark">
<Setter Property="Transitions">
<Transitions>
<BrushTransition Duration="0:0:0.15" Property="Foreground" />
</Transitions>
</Setter>
</Style>
<!-- Disabled Style -->
<Style Selector="^:disabled">
<Style Selector="^ /template/ Border">
<Setter Property="Background" Value="{TemplateBinding Background}" />
</Style>
<Setter Property="Foreground" Value="{TemplateBinding Foreground}" />
</Style>
<!-- Reveal Password Button syle -->
<Style Selector="^.revealPasswordButton[AcceptsReturn=False][IsReadOnly=False]:not(TextBox:empty)">
<Setter Property="PasswordChar" Value="●" />
<Setter Property="InnerRightContent">
<Template>
<ToggleButton
Focusable="True"
IsChecked="{Binding $parent[TextBox].RevealPassword, Mode=TwoWay}"
Width="35">
<Grid>
<!-- TODO: Replace these with image icons -->
<PathIcon
Data="m10.051 7.0032c2.215 0 4.0105 1.7901 4.0105 3.9984s-1.7956 3.9984-4.0105 3.9984c-2.215 0-4.0105-1.7901-4.0105-3.9984s1.7956-3.9984 4.0105-3.9984zm0 1.4994c-1.3844 0-2.5066 1.1188-2.5066 2.499s1.1222 2.499 2.5066 2.499 2.5066-1.1188 2.5066-2.499-1.1222-2.499-2.5066-2.499zm0-5.0026c4.6257 0 8.6188 3.1487 9.7267 7.5613 0.10085 0.40165-0.14399 0.80877-0.54686 0.90931-0.40288 0.10054-0.81122-0.14355-0.91208-0.54521-0.94136-3.7492-4.3361-6.4261-8.2678-6.4261-3.9334 0-7.3292 2.6792-8.2689 6.4306-0.10063 0.40171-0.50884 0.64603-0.91177 0.54571s-0.648-0.5073-0.54737-0.90901c1.106-4.4152 5.1003-7.5667 9.728-7.5667z"
Height="8"
IsVisible="{Binding !$parent[ToggleButton].IsChecked}"
Width="12" />
<PathIcon
Data="m0.21967 0.21965c-0.26627 0.26627-0.29047 0.68293-0.07262 0.97654l0.07262 0.08412 4.0346 4.0346c-1.922 1.3495-3.3585 3.365-3.9554 5.7495-0.10058 0.4018 0.14362 0.8091 0.54543 0.9097 0.40182 0.1005 0.80909-0.1436 0.90968-0.5455 0.52947-2.1151 1.8371-3.8891 3.5802-5.0341l1.8096 1.8098c-0.70751 0.7215-1.1438 1.71-1.1438 2.8003 0 2.2092 1.7909 4 4 4 1.0904 0 2.0788-0.4363 2.8004-1.1438l5.9193 5.9195c0.2929 0.2929 0.7677 0.2929 1.0606 0 0.2663-0.2662 0.2905-0.6829 0.0726-0.9765l-0.0726-0.0841-6.1135-6.1142 0.0012-0.0015-1.2001-1.1979-2.8699-2.8693 2e-3 -8e-4 -2.8812-2.8782 0.0012-0.0018-1.1333-1.1305-4.3064-4.3058c-0.29289-0.29289-0.76777-0.29289-1.0607 0zm7.9844 9.0458 3.5351 3.5351c-0.45 0.4358-1.0633 0.704-1.7392 0.704-1.3807 0-2.5-1.1193-2.5-2.5 0-0.6759 0.26824-1.2892 0.7041-1.7391zm1.7959-5.7655c-1.0003 0-1.9709 0.14807-2.8889 0.425l1.237 1.2362c0.5358-0.10587 1.0883-0.16119 1.6519-0.16119 3.9231 0 7.3099 2.6803 8.2471 6.4332 0.1004 0.4018 0.5075 0.6462 0.9094 0.5459 0.4019-0.1004 0.6463-0.5075 0.5459-0.9094-1.103-4.417-5.0869-7.5697-9.7024-7.5697zm0.1947 3.5093 3.8013 3.8007c-0.1018-2.0569-1.7488-3.7024-3.8013-3.8007z"
Height="12"
IsVisible="{Binding $parent[ToggleButton].IsChecked}"
Width="12" />
</Grid>
<ToggleButton.Styles>
<Style Selector="ToggleButton">
<Setter Property="Transitions">
<Transitions>
<DoubleTransition Duration="0:0:0.15" Property="Opacity" />
<TransformOperationsTransition Duration="0:0:.075" Property="RenderTransform" />
</Transitions>
</Setter>
<Setter Property="Background" Value="Transparent" />
<Style Selector="^:pointerover /template/ ContentPresenter">
<Setter Property="Background" Value="Transparent" />
<Setter Property="Opacity" Value=".5" />
<Setter Property="Cursor" Value="Hand" />
</Style>
<Style Selector="^:checked /template/ ContentPresenter">
<Setter Property="Background" Value="Transparent" />
</Style>
<Style Selector="^:pressed /template/ ContentPresenter">
<Setter Property="Background" Value="Transparent" />
<Setter Property="RenderTransform" Value="scale(0.95)" />
</Style>
<Style Selector="^:disabled /template/ ContentPresenter">
<Setter Property="TextBlock.Foreground" Value="{Binding $parent[Button].Foreground}" />
<Setter Property="Background" Value="{Binding $parent[Button].Background}" />
</Style>
</Style>
</ToggleButton.Styles>
</ToggleButton>
</Template>
</Setter>
</Style>
</Style>
</Styles>