PowerToys/src/modules/launcher/PowerLauncher/LauncherControl.xaml

<UserControl
    x:Class="PowerLauncher.LauncherControl"
    xmlns="http://schemas.microsoft.com/winfx/2006/xaml/presentation"
    xmlns:x="http://schemas.microsoft.com/winfx/2006/xaml"
    xmlns:mc="http://schemas.openxmlformats.org/markup-compatibility/2006" 
    xmlns:d="http://schemas.microsoft.com/expression/blend/2008" 
    xmlns:p="clr-namespace:PowerLauncher.Properties"
    xmlns:local="clr-namespace:PowerLauncher"
    xmlns:ui="http://schemas.modernwpf.com/2019"
    mc:Ignorable="d" 
    d:DesignHeight="300"
    d:DesignWidth="720">
    <UserControl.Resources>
        <Style x:Key="QueryTextBoxStyle" TargetType="{x:Type TextBox}">
            <Setter Property="Background" Value="Transparent" />
            <Setter Property="BorderThickness" Value="0" />
            <Setter Property="Foreground" Value="{DynamicResource ControlTextBrushKey}"/>
            <Setter Property="CaretBrush" Value="{DynamicResource ControlTextBrushKey}"/>
            <Setter Property="KeyboardNavigation.TabNavigation" Value="None"/>
            <Setter Property="HorizontalContentAlignment" Value="Left"/>
            <Setter Property="FocusVisualStyle" Value="{x:Null}"/>
            <Setter Property="AllowDrop" Value="true"/>
            <Setter Property="ContextMenu" Value="{DynamicResource TextControlContextMenu}" />
            <Setter Property="ui:TextContextMenu.UsingTextContextMenu" Value="True" />
            <Setter Property="ScrollViewer.PanningMode" Value="VerticalFirst"/>
            <Setter Property="Stylus.IsFlicksEnabled" Value="False"/>
            <Setter Property="Padding" Value="12,0,0,0" />
            <Setter Property="Template">
                <Setter.Value>
                    <ControlTemplate TargetType="{x:Type TextBox}">
                        <Grid>
                            <TextBlock Margin="14, 0, 0, 0"
                                       Text="{TemplateBinding Tag}">
                                <TextBlock.Style>
                                    <Style TargetType="{x:Type TextBlock}">
                                        <Setter Property="Foreground" Value="Transparent"/>
                                        <Style.Triggers>
                                            <DataTrigger Binding="{Binding Path=Text, RelativeSource={RelativeSource TemplatedParent}}" Value="">
                                                <Setter Property="Foreground" Value="{DynamicResource TextControlPlaceholderForeground}"/>
                                            </DataTrigger>
                                        </Style.Triggers>
                                    </Style>
                                </TextBlock.Style>
                            </TextBlock>
                            <Border x:Name="border"
                                    Background="{TemplateBinding Background}"
                                    BorderThickness="{TemplateBinding BorderThickness}"
                                    BorderBrush="{TemplateBinding BorderBrush}"
                                    SnapsToDevicePixels="True">
                                <ScrollViewer x:Name="PART_ContentHost"
                                              Background="{TemplateBinding Background}"
                                              Focusable="false"
                                              HorizontalScrollBarVisibility="Hidden"
                                              VerticalScrollBarVisibility="Hidden">
                                    <ScrollViewer.ContentTemplate>
                                        <DataTemplate>
                                            <Grid
                                                Background="{Binding Background, ElementName=PART_ContentHost}"
                                                RenderOptions.ClearTypeHint="Enabled"
                                                TextOptions.TextFormattingMode="Display">
                                                <ContentPresenter Content="{Binding Path=Content, ElementName=PART_ContentHost}"/>
                                            </Grid>
                                        </DataTemplate>
                                    </ScrollViewer.ContentTemplate>
                                </ScrollViewer>
                            </Border>
                        </Grid>
                        <ControlTemplate.Triggers>
                            <Trigger Property="IsEnabled" Value="false">
                                <Setter Property="Opacity" TargetName="border" Value="0.56"/>
                            </Trigger>
                            <Trigger Property="IsMouseOver" Value="true">
                                <Setter Property="BorderBrush" TargetName="border" Value="{StaticResource TextBox.MouseOver.Border}"/>
                            </Trigger>
                            <Trigger Property="IsKeyboardFocused" Value="true">
                                <Setter Property="BorderBrush" TargetName="border" Value="{StaticResource TextBox.Focus.Border}"/>
                            </Trigger>
                        </ControlTemplate.Triggers>
                    </ControlTemplate>
                </Setter.Value>
            </Setter>
            <Style.Triggers>
                <MultiTrigger>
                    <MultiTrigger.Conditions>
                        <Condition Property="IsInactiveSelectionHighlightEnabled" Value="true"/>
                        <Condition Property="IsSelectionActive" Value="false"/>
                    </MultiTrigger.Conditions>
                    <Setter Property="SelectionBrush" Value="{DynamicResource InactiveSelectionHighlightBrushKey}"/>
                </MultiTrigger>
            </Style.Triggers>
        </Style>
    </UserControl.Resources>
    <Grid 
        Height="68"
        VerticalAlignment="Top">
        <!--Background="{ThemeResource BackdropAcrylicBrush}"-->
        <Grid.ColumnDefinitions>
            <ColumnDefinition Width="*"/>
            <ColumnDefinition Width="72"/>
        </Grid.ColumnDefinitions>

        <!--
            for adding on placeholder, look at the style with 90 votes
            https://stackoverflow.com/questions/11873378/adding-placeholder-text-to-textbox
        -->
        <local:CustomSearchBox
            AutomationProperties.Name="{x:Static p:Resources.Query}"
            x:Name="QueryTextBox"
            x:FieldModifier="public"
            Canvas.ZIndex="0"
            Margin="10, 0, 0, 0"
            VerticalAlignment="Center"
            FontSize="24"
            Style="{StaticResource QueryTextBoxStyle}"
            Tag="{x:Static p:Resources.startTyping}"
            RenderOptions.ClearTypeHint="Enabled"
            />
        <TextBlock
            x:Name="AutoCompleteTextBlock"
            x:FieldModifier="public"
            Opacity="0.6"            
            Canvas.ZIndex="-1" 
            Margin="24, 0, 14, 0"
            VerticalAlignment="Center"
            FontSize="24"
            Foreground="{DynamicResource TextControlPlaceholderForeground}"
            Background="{DynamicResource SystemChromeLow}"
            RenderOptions.ClearTypeHint="Enabled"
         />
        <TextBlock
            AutomationProperties.Name="{x:Static p:Resources.SearchIcon}"
            Grid.Column="1"
            Text="&#xE721;"
            FontFamily="Segoe MDL2 Assets"
            FontSize="26" 
            HorizontalAlignment="Center" 
            VerticalAlignment="Center"
            Foreground="{DynamicResource TextControlPlaceholderForeground}" 
            RenderOptions.ClearTypeHint="Enabled"
            TextOptions.TextRenderingMode="Auto"
            SnapsToDevicePixels="True"/>
    </Grid>
</UserControl>