agrobot_base/AgroBase/OperationControl/Views/Operacao/OperacaoBottomView.xaml

<UserControl x:Class="OperationControl.Views.Operacao.OperacaoBottomView"
             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:local="clr-namespace:OperationControl.Views.Operacao"
             xmlns:conv="clr-namespace:OperationControl.Converters"
             xmlns:models="clr-namespace:OperationControl.Models"
             mc:Ignorable="d" 
             d:DesignHeight="450" d:DesignWidth="800">
    <UserControl.Resources>
        <conv:NullToVisibilityConverter x:Key="NullToVisibilityConverter" />

        <Style x:Key="ThinScrollBar" TargetType="ScrollBar">
            <Setter Property="Height" Value="6"/>
            <Setter Property="Background" Value="Transparent"/>
            <Setter Property="Template">
                <Setter.Value>
                    <ControlTemplate TargetType="ScrollBar">
                        <Grid Background="Transparent">
                            <Track x:Name="PART_Track" Height="6">
                                <Track.DecreaseRepeatButton>
                                    <RepeatButton Command="ScrollBar.LineLeftCommand" Visibility="Collapsed" />
                                </Track.DecreaseRepeatButton>
                                <Track.IncreaseRepeatButton>
                                    <RepeatButton Command="ScrollBar.LineRightCommand" Visibility="Collapsed" />
                                </Track.IncreaseRepeatButton>
                                <Track.Thumb>
                                    <Thumb Height="6"
                                           Background="#4B5563"
                                           Margin="0"
                                           BorderThickness="0"/>
                                </Track.Thumb>
                            </Track>
                        </Grid>
                    </ControlTemplate>
                </Setter.Value>
            </Setter>
        </Style>
    </UserControl.Resources>

    <Grid Background="Transparent">
        <!-- Barra inferior -->
        <Border x:Name="brdBottom"
                Height="80"
                VerticalAlignment="Top"
                BorderBrush="#222"
                BorderThickness="1"
                Background="#11161C">
            <Grid>
                <ScrollViewer x:Name="svAlertas"
                              HorizontalScrollBarVisibility="Auto"
                              VerticalScrollBarVisibility="Disabled"
                              CanContentScroll="False"
                              Margin="6,0,6,0">
                    <ScrollViewer.Resources>
                        <Style TargetType="ScrollBar" BasedOn="{StaticResource ThinScrollBar}" />
                    </ScrollViewer.Resources>

                    <ItemsControl ItemsSource="{Binding AlertasAtivos}">
                        <ItemsControl.ItemsPanel>
                            <ItemsPanelTemplate>
                                <StackPanel Orientation="Horizontal"/>
                            </ItemsPanelTemplate>
                        </ItemsControl.ItemsPanel>

                        <ItemsControl.ItemTemplate>
                            <DataTemplate DataType="{x:Type models:AlertaModel}">
                                <Border Margin="6,4,0,4"
                                        Padding="8,4"
                                        CornerRadius="6"
                                        Cursor="Hand"
                                        MouseLeftButtonUp="Alerta_MouseLeftButtonUp">
                                    <Border.Style>
                                        <Style TargetType="Border">
                                            <Setter Property="Background" Value="#1C1F23"/>
                                            <Setter Property="BorderBrush" Value="#3A424F"/>
                                            <Setter Property="BorderThickness" Value="1"/>

                                            <Style.Triggers>
                                                <DataTrigger Binding="{Binding Severidade}" Value="Warning">
                                                    <Setter Property="BorderBrush" Value="#EFBF2F"/>
                                                </DataTrigger>
                                                <DataTrigger Binding="{Binding Severidade}" Value="Error">
                                                    <Setter Property="BorderBrush" Value="#FF5656"/>
                                                </DataTrigger>
                                                <DataTrigger Binding="{Binding Severidade}" Value="Critical">
                                                    <Setter Property="BorderBrush" Value="#FF5656"/>
                                                    <Setter Property="Background" Value="#3A171C"/>
                                                </DataTrigger>
                                            </Style.Triggers>
                                        </Style>
                                    </Border.Style>

                                    <StackPanel Orientation="Horizontal">
                                        <TextBlock Text="{Binding Icone}"
                                                   FontSize="14"
                                                   Margin="0,0,6,0"/>

                                        <StackPanel>
                                            <TextBlock Text="{Binding Titulo}"
                                                       FontWeight="Bold"
                                                       Foreground="#F5F7FA"
                                                       FontSize="11"/>

                                            <TextBlock Text="{Binding Mensagem}"
                                                       Foreground="#B7C0CC"
                                                       FontSize="10"
                                                       TextTrimming="CharacterEllipsis"
                                                       MaxWidth="260"/>
                                        </StackPanel>
                                    </StackPanel>
                                </Border>
                            </DataTemplate>
                        </ItemsControl.ItemTemplate>
                    </ItemsControl>
                </ScrollViewer>

                <TextBlock Text="Nenhum alerta ativo"
                           HorizontalAlignment="Center"
                           VerticalAlignment="Center"
                           Foreground="#636C7A"
                           FontSize="11">
                    <TextBlock.Style>
                        <Style TargetType="TextBlock">
                            <Setter Property="Visibility" Value="Collapsed"/>
                            <Style.Triggers>
                                <DataTrigger Binding="{Binding AlertasAtivos.Count}" Value="0">
                                    <Setter Property="Visibility" Value="Visible"/>
                                </DataTrigger>
                            </Style.Triggers>
                        </Style>
                    </TextBlock.Style>
                </TextBlock>
            </Grid>
        </Border>

        <!-- Toast -->
        <Border x:Name="brdToastAlerta"
                HorizontalAlignment="Right"
                VerticalAlignment="Top"
                Margin="0,-78,20,0"
                Padding="10,8"
                CornerRadius="8"
                Background="#1C1F23"
                BorderBrush="#3A424F"
                BorderThickness="1"
                Cursor="Hand"
                Visibility="{Binding ToastAlerta, Converter={StaticResource NullToVisibilityConverter}}"
                MouseLeftButtonUp="ToastAlerta_MouseLeftButtonUp">

            <Border.Style>
                <Style TargetType="Border">
                    <Setter Property="Opacity" Value="0.95"/>

                    <Style.Triggers>
                        <DataTrigger Binding="{Binding ToastAlerta.Severidade}" Value="Warning">
                            <Setter Property="BorderBrush" Value="#EFBF2F"/>
                        </DataTrigger>
                        <DataTrigger Binding="{Binding ToastAlerta.Severidade}" Value="Error">
                            <Setter Property="BorderBrush" Value="#FF5656"/>
                        </DataTrigger>
                        <DataTrigger Binding="{Binding ToastAlerta.Severidade}" Value="Critical">
                            <Setter Property="BorderBrush" Value="#FF5656"/>
                            <Setter Property="Background" Value="#3A171C"/>
                        </DataTrigger>
                    </Style.Triggers>
                </Style>
            </Border.Style>

            <StackPanel Orientation="Horizontal">
                <TextBlock Text="{Binding ToastAlerta.Icone}"
                           FontSize="16"
                           Margin="0,0,6,0"/>

                <StackPanel>
                    <StackPanel Orientation="Horizontal">
                        <Border Background="#2F3B4A"
                                CornerRadius="4"
                                Padding="4,1"
                                Margin="0,0,6,0">
                            <TextBlock Text="{Binding ToastAlerta.Rover_ID}"
                                       Foreground="White"
                                       FontSize="10"
                                       FontWeight="Bold"/>
                        </Border>

                        <TextBlock Text="{Binding ToastAlerta.Titulo}"
                                   FontWeight="Bold"
                                   Foreground="#F5F7FA"
                                   FontSize="11"/>
                    </StackPanel>

                    <TextBlock Text="{Binding ToastAlerta.Mensagem}"
                               Foreground="#B7C0CC"
                               FontSize="10"
                               TextWrapping="Wrap"
                               MaxWidth="320"/>
                </StackPanel>
            </StackPanel>
        </Border>
    </Grid>
</UserControl>