csharpc-sharpdotnetxamlavaloniauicross-platformcross-platform-xamlavaloniaguimulti-platformuser-interfacedotnetcore
You can not select more than 25 topics
Topics must start with a letter or number, can include dashes ('-') and can be up to 35 characters long.
202 lines
13 KiB
202 lines
13 KiB
<UserControl xmlns="https://github.com/avaloniaui"
|
|
xmlns:x="http://schemas.microsoft.com/winfx/2006/xaml"
|
|
x:Class="ControlCatalog.Pages.PulseProfileView">
|
|
|
|
<ScrollViewer VerticalScrollBarVisibility="Auto">
|
|
<StackPanel Spacing="0">
|
|
|
|
<!-- Profile Header -->
|
|
<StackPanel HorizontalAlignment="Center" Spacing="8" Margin="16,28,16,24">
|
|
<Border Width="80" Height="80" CornerRadius="40" ClipToBounds="True"
|
|
BorderBrush="#256af4" BorderThickness="3"
|
|
HorizontalAlignment="Center">
|
|
<Border.Background>
|
|
<ImageBrush Source="avares://ControlCatalog/Assets/Pulse/profile_avatar.jpg"
|
|
Stretch="UniformToFill"/>
|
|
</Border.Background>
|
|
</Border>
|
|
<TextBlock Text="Alex Johnson" FontSize="20" FontWeight="Bold" Foreground="White"
|
|
HorizontalAlignment="Center"/>
|
|
<TextBlock Text="Member since Jan 2023" FontSize="12" Foreground="#94a3b8"
|
|
HorizontalAlignment="Center"/>
|
|
</StackPanel>
|
|
|
|
<!-- Stats Grid -->
|
|
<UniformGrid Columns="3" Margin="16,0,16,24">
|
|
<Border CornerRadius="12" Background="#1a1a1a" Padding="12,16" Margin="4">
|
|
<StackPanel HorizontalAlignment="Center" Spacing="4">
|
|
<TextBlock Text="148" FontSize="22" FontWeight="Bold" Foreground="#256af4"
|
|
HorizontalAlignment="Center"/>
|
|
<TextBlock Text="Workouts" FontSize="11" Foreground="#94a3b8"
|
|
HorizontalAlignment="Center"/>
|
|
</StackPanel>
|
|
</Border>
|
|
<Border CornerRadius="12" Background="#1a1a1a" Padding="12,16" Margin="4">
|
|
<StackPanel HorizontalAlignment="Center" Spacing="4">
|
|
<TextBlock Text="62h" FontSize="22" FontWeight="Bold" Foreground="#10b981"
|
|
HorizontalAlignment="Center"/>
|
|
<TextBlock Text="Total Time" FontSize="11" Foreground="#94a3b8"
|
|
HorizontalAlignment="Center"/>
|
|
</StackPanel>
|
|
</Border>
|
|
<Border CornerRadius="12" Background="#1a1a1a" Padding="12,16" Margin="4">
|
|
<StackPanel HorizontalAlignment="Center" Spacing="4">
|
|
<TextBlock Text="45.2K" FontSize="22" FontWeight="Bold" Foreground="#f97316"
|
|
HorizontalAlignment="Center"/>
|
|
<TextBlock Text="Calories" FontSize="11" Foreground="#94a3b8"
|
|
HorizontalAlignment="Center"/>
|
|
</StackPanel>
|
|
</Border>
|
|
</UniformGrid>
|
|
|
|
<!-- Achievements -->
|
|
<TextBlock Text="Achievements" FontSize="18" FontWeight="Bold" Foreground="White"
|
|
Margin="16,0,16,12"/>
|
|
|
|
<ScrollViewer HorizontalScrollBarVisibility="Auto" VerticalScrollBarVisibility="Disabled"
|
|
Margin="0,0,0,24">
|
|
<StackPanel Orientation="Horizontal" Spacing="12" Margin="16,0">
|
|
<!-- Early Bird -->
|
|
<Border Width="120" CornerRadius="16" Background="#1a1a1a" Padding="12,16">
|
|
<StackPanel HorizontalAlignment="Center" Spacing="8">
|
|
<Border Width="44" Height="44" CornerRadius="22"
|
|
Background="#1Af59e0b" HorizontalAlignment="Center">
|
|
<PathIcon Data="M12 2C6.48 2 2 6.48 2 12s4.48 10 10 10 10-4.48 10-10S17.52 2 12 2zm0 18c-4.41 0-8-3.59-8-8s3.59-8 8-8 8 3.59 8 8-3.59 8-8 8zm.5-13H11v6l5.25 3.15.75-1.23-4.5-2.67V7z"
|
|
Width="20" Height="20" Foreground="#f59e0b"/>
|
|
</Border>
|
|
<TextBlock Text="Early Bird" FontSize="12" FontWeight="Bold" Foreground="White"
|
|
HorizontalAlignment="Center" TextAlignment="Center"/>
|
|
<TextBlock Text="30 morning
workouts" FontSize="10" Foreground="#94a3b8"
|
|
HorizontalAlignment="Center" TextAlignment="Center"/>
|
|
</StackPanel>
|
|
</Border>
|
|
<!-- Iron Will -->
|
|
<Border Width="120" CornerRadius="16" Background="#1a1a1a" Padding="12,16">
|
|
<StackPanel HorizontalAlignment="Center" Spacing="8">
|
|
<Border Width="44" Height="44" CornerRadius="22"
|
|
Background="#1A256af4" HorizontalAlignment="Center">
|
|
<PathIcon Data="M20.57 14.86L22 13.43 20.57 12 17 15.57 8.43 7 12 3.43 10.57 2 9.14 3.43 7.71 2 5.57 4.14 4.14 2.71 2.71 4.14l1.43 1.43L2 7.71l1.43 1.43L2 10.57 3.43 12 7 8.43 15.57 17 12 20.57 13.43 22l1.43-1.43L16.29 22l2.14-2.14 1.43 1.43 1.43-1.43-1.43-1.43L22 16.29z"
|
|
Width="20" Height="20" Foreground="#256af4"/>
|
|
</Border>
|
|
<TextBlock Text="Iron Will" FontSize="12" FontWeight="Bold" Foreground="White"
|
|
HorizontalAlignment="Center" TextAlignment="Center"/>
|
|
<TextBlock Text="100 workout
milestone" FontSize="10" Foreground="#94a3b8"
|
|
HorizontalAlignment="Center" TextAlignment="Center"/>
|
|
</StackPanel>
|
|
</Border>
|
|
<!-- Consistent -->
|
|
<Border Width="120" CornerRadius="16" Background="#1a1a1a" Padding="12,16">
|
|
<StackPanel HorizontalAlignment="Center" Spacing="8">
|
|
<Border Width="44" Height="44" CornerRadius="22"
|
|
Background="#1Aef4444" HorizontalAlignment="Center">
|
|
<PathIcon Data="M13.5.67s.74 2.65.74 4.8c0 2.06-1.35 3.73-3.41 3.73-2.07 0-3.63-1.67-3.63-3.73l.03-.36C5.21 7.51 4 10.62 4 14c0 4.42 3.58 8 8 8s8-3.58 8-8C20 8.61 17.41 3.8 13.5.67z"
|
|
Width="20" Height="20" Foreground="#ef4444"/>
|
|
</Border>
|
|
<TextBlock Text="Consistent" FontSize="12" FontWeight="Bold" Foreground="White"
|
|
HorizontalAlignment="Center" TextAlignment="Center"/>
|
|
<TextBlock Text="30-day
streak" FontSize="10" Foreground="#94a3b8"
|
|
HorizontalAlignment="Center" TextAlignment="Center"/>
|
|
</StackPanel>
|
|
</Border>
|
|
<!-- Marathon (locked) -->
|
|
<Border Width="120" CornerRadius="16" Background="#1a1a1a" Padding="12,16"
|
|
Opacity="0.5">
|
|
<StackPanel HorizontalAlignment="Center" Spacing="8">
|
|
<Border Width="44" Height="44" CornerRadius="22"
|
|
Background="#1Aa855f7" HorizontalAlignment="Center">
|
|
<PathIcon Data="M13.49 5.48c1.1 0 2-.9 2-2s-.9-2-2-2-2 .9-2 2 .9 2 2 2zm-3.6 13.9l1-4.4 2.1 2v6h2v-7.5l-2.1-2 .6-3c1.3 1.5 3.3 2.5 5.5 2.5v-2c-1.9 0-3.5-1-4.3-2.4l-1-1.6c-.4-.6-1-1-1.7-1-.3 0-.5.1-.8.1l-5.2 2.2v4.7h2v-3.4l1.8-.7-1.6 8.1-4.9-1-.4 2 7 1.4z"
|
|
Width="20" Height="20" Foreground="#a855f7"/>
|
|
</Border>
|
|
<TextBlock Text="Marathon" FontSize="12" FontWeight="Bold" Foreground="White"
|
|
HorizontalAlignment="Center" TextAlignment="Center"/>
|
|
<TextBlock Text="10 hours in
a week" FontSize="10" Foreground="#94a3b8"
|
|
HorizontalAlignment="Center" TextAlignment="Center"/>
|
|
</StackPanel>
|
|
</Border>
|
|
</StackPanel>
|
|
</ScrollViewer>
|
|
|
|
<!-- Settings -->
|
|
<TextBlock Text="Settings" FontSize="18" FontWeight="Bold" Foreground="White"
|
|
Margin="16,0,16,12"/>
|
|
|
|
<!-- Personal Info -->
|
|
<Border CornerRadius="12" Background="#1a1a1a" Padding="14,12" Margin="16,0,16,8">
|
|
<Grid ColumnDefinitions="Auto,*,Auto">
|
|
<Border Width="36" Height="36" CornerRadius="10"
|
|
Background="#1A256af4" VerticalAlignment="Center">
|
|
<PathIcon Data="M12 12c2.21 0 4-1.79 4-4s-1.79-4-4-4-4 1.79-4 4 1.79 4 4 4zm0 2c-2.67 0-8 1.34-8 4v2h16v-2c0-2.66-5.33-4-8-4z"
|
|
Width="16" Height="16" Foreground="#256af4"/>
|
|
</Border>
|
|
<TextBlock Grid.Column="1" Text="Personal Info" FontSize="14" FontWeight="Medium"
|
|
Foreground="White" VerticalAlignment="Center" Margin="12,0,0,0"/>
|
|
<PathIcon Grid.Column="2" Data="M10 6L8.59 7.41 13.17 12l-4.58 4.59L10 18l6-6z"
|
|
Width="14" Height="14" Foreground="#64748b" VerticalAlignment="Center"/>
|
|
</Grid>
|
|
</Border>
|
|
|
|
<!-- Workout Preferences -->
|
|
<Border CornerRadius="12" Background="#1a1a1a" Padding="14,12" Margin="16,0,16,8">
|
|
<Grid ColumnDefinitions="Auto,*,Auto">
|
|
<Border Width="36" Height="36" CornerRadius="10"
|
|
Background="#1A256af4" VerticalAlignment="Center">
|
|
<PathIcon Data="M19.14 12.94c.04-.3.06-.61.06-.94 0-.32-.02-.64-.07-.94l2.03-1.58c.18-.14.23-.41.12-.61l-1.92-3.32c-.12-.22-.37-.29-.59-.22l-2.39.96c-.5-.38-1.03-.7-1.62-.94l-.36-2.54c-.04-.24-.24-.41-.48-.41h-3.84c-.24 0-.43.17-.47.41l-.36 2.54c-.59.24-1.13.57-1.62.94l-2.39-.96c-.22-.08-.47 0-.59.22L2.74 8.87c-.12.21-.08.47.12.61l2.03 1.58c-.05.3-.07.62-.07.94s.02.64.07.94l-2.03 1.58c-.18.14-.23.41-.12.61l1.92 3.32c.12.22.37.29.59.22l2.39-.96c.5.38 1.03.7 1.62.94l.36 2.54c.05.24.24.41.48.41h3.84c.24 0 .44-.17.47-.41l.36-2.54c.59-.24 1.13-.56 1.62-.94l2.39.96c.22.08.47 0 .59-.22l1.92-3.32c.12-.22.07-.47-.12-.61l-2.01-1.58zM12 15.6c-1.98 0-3.6-1.62-3.6-3.6s1.62-3.6 3.6-3.6 3.6 1.62 3.6 3.6-1.62 3.6-3.6 3.6z"
|
|
Width="16" Height="16" Foreground="#256af4"/>
|
|
</Border>
|
|
<TextBlock Grid.Column="1" Text="Workout Preferences" FontSize="14" FontWeight="Medium"
|
|
Foreground="White" VerticalAlignment="Center" Margin="12,0,0,0"/>
|
|
<PathIcon Grid.Column="2" Data="M10 6L8.59 7.41 13.17 12l-4.58 4.59L10 18l6-6z"
|
|
Width="14" Height="14" Foreground="#64748b" VerticalAlignment="Center"/>
|
|
</Grid>
|
|
</Border>
|
|
|
|
<!-- Notifications -->
|
|
<Border CornerRadius="12" Background="#1a1a1a" Padding="14,12" Margin="16,0,16,8">
|
|
<Grid ColumnDefinitions="Auto,*,Auto">
|
|
<Border Width="36" Height="36" CornerRadius="10"
|
|
Background="#1A256af4" VerticalAlignment="Center">
|
|
<PathIcon Data="M12 22c1.1 0 2-.9 2-2h-4c0 1.1.89 2 2 2zm6-6v-5c0-3.07-1.64-5.64-4.5-6.32V4c0-.83-.67-1.5-1.5-1.5s-1.5.67-1.5 1.5v.68C7.63 5.36 6 7.92 6 11v5l-2 2v1h16v-1l-2-2z"
|
|
Width="16" Height="16" Foreground="#256af4"/>
|
|
</Border>
|
|
<TextBlock Grid.Column="1" Text="Notifications" FontSize="14" FontWeight="Medium"
|
|
Foreground="White" VerticalAlignment="Center" Margin="12,0,0,0"/>
|
|
<PathIcon Grid.Column="2" Data="M10 6L8.59 7.41 13.17 12l-4.58 4.59L10 18l6-6z"
|
|
Width="14" Height="14" Foreground="#64748b" VerticalAlignment="Center"/>
|
|
</Grid>
|
|
</Border>
|
|
|
|
<!-- Connected Apps -->
|
|
<Border CornerRadius="12" Background="#1a1a1a" Padding="14,12" Margin="16,0,16,8">
|
|
<Grid ColumnDefinitions="Auto,*,Auto">
|
|
<Border Width="36" Height="36" CornerRadius="10"
|
|
Background="#1A256af4" VerticalAlignment="Center">
|
|
<PathIcon Data="M3.9 12c0-1.71 1.39-3.1 3.1-3.1h4V7H7c-2.76 0-5 2.24-5 5s2.24 5 5 5h4v-1.9H7c-1.71 0-3.1-1.39-3.1-3.1zM8 13h8v-2H8v2zm9-6h-4v1.9h4c1.71 0 3.1 1.39 3.1 3.1s-1.39 3.1-3.1 3.1h-4V17h4c2.76 0 5-2.24 5-5s-2.24-5-5-5z"
|
|
Width="16" Height="16" Foreground="#256af4"/>
|
|
</Border>
|
|
<TextBlock Grid.Column="1" Text="Connected Apps" FontSize="14" FontWeight="Medium"
|
|
Foreground="White" VerticalAlignment="Center" Margin="12,0,0,0"/>
|
|
<PathIcon Grid.Column="2" Data="M10 6L8.59 7.41 13.17 12l-4.58 4.59L10 18l6-6z"
|
|
Width="14" Height="14" Foreground="#64748b" VerticalAlignment="Center"/>
|
|
</Grid>
|
|
</Border>
|
|
|
|
<!-- Help & Support -->
|
|
<Border CornerRadius="12" Background="#1a1a1a" Padding="14,12" Margin="16,0,16,8">
|
|
<Grid ColumnDefinitions="Auto,*,Auto">
|
|
<Border Width="36" Height="36" CornerRadius="10"
|
|
Background="#1A256af4" VerticalAlignment="Center">
|
|
<PathIcon Data="M12 2C6.48 2 2 6.48 2 12s4.48 10 10 10 10-4.48 10-10S17.52 2 12 2zm1 17h-2v-2h2v2zm2.07-7.75l-.9.92C13.45 12.9 13 13.5 13 15h-2v-.5c0-1.1.45-2.1 1.17-2.83l1.24-1.26c.37-.36.59-.86.59-1.41 0-1.1-.9-2-2-2s-2 .9-2 2H8c0-2.21 1.79-4 4-4s4 1.79 4 4c0 .88-.36 1.68-.93 2.25z"
|
|
Width="16" Height="16" Foreground="#256af4"/>
|
|
</Border>
|
|
<TextBlock Grid.Column="1" Text="Help & Support" FontSize="14" FontWeight="Medium"
|
|
Foreground="White" VerticalAlignment="Center" Margin="12,0,0,0"/>
|
|
<PathIcon Grid.Column="2" Data="M10 6L8.59 7.41 13.17 12l-4.58 4.59L10 18l6-6z"
|
|
Width="14" Height="14" Foreground="#64748b" VerticalAlignment="Center"/>
|
|
</Grid>
|
|
</Border>
|
|
|
|
<Border Height="16"/>
|
|
|
|
</StackPanel>
|
|
</ScrollViewer>
|
|
</UserControl>
|
|
|