deepdrft/DeepDrftWeb.Client/Layout/MainLayout.razor

@inherits LayoutComponentBase

<MudThemeProvider Theme="@_themeManager.Theme" IsDarkMode="_isDarkMode" />
<MudPopoverProvider />
<MudDialogProvider />
<MudSnackbarProvider />
<MudLayout>
    <MudThemeManagerButton OnClick="@((e) => OpenThemeManager(true))" />
    <MudThemeManager Open="_themeManagerOpen" OpenChanged="OpenThemeManager" Theme="_themeManager" ThemeChanged="UpdateTheme" />
    <MudAppBar Elevation="_themeManager.AppBarElevation">
        <MudAvatar Class="mr-2">
            <MudImage Src="img/deepdrft-logo.jpg"></MudImage>
        </MudAvatar>
        <NavMenu />
        <MudSpacer/>
        <MudIconButton Icon="@(DarkLightModeButtonIcon)" Color="Color.Inherit" OnClick="@DarkModeToggle"/>
        <MudIconButton Icon="@Icons.Material.Filled.MoreVert" Color="Color.Inherit" Edge="Edge.End"/>
    </MudAppBar>
    <MudMainContent Class="pt-16 pa-4" Style="min-height: 100vh">
        @Body
    </MudMainContent>
</MudLayout>


<div id="blazor-error-ui" data-nosnippet>
    An unhandled error has occurred.
    <a href="." class="reload">Reload</a>
    <span class="dismiss">🗙</span>
</div>

@code {
    private bool _drawerOpen = true;
    private bool _isDarkMode = true;
    // private MudTheme? _theme = null;

    protected override void OnInitialized()
    {
        base.OnInitialized();
        _themeManager = new ThemeManagerTheme
        {
            Theme =
            {
                PaletteDark = _darkPalette,
                PaletteLight = _lightPalette
            }
        };

        StateHasChanged();
    }

    private void DrawerToggle()
    {
        _drawerOpen = !_drawerOpen;
    }

    private void DarkModeToggle()
    {
        _isDarkMode = !_isDarkMode;
    }
    
    private ThemeManagerTheme _themeManager;
    public bool _themeManagerOpen = false;

    void OpenThemeManager(bool value)
    {
        _themeManagerOpen = value;
    }

    void UpdateTheme(ThemeManagerTheme value)
    {
        _themeManager = value;
        StateHasChanged();
    }

    private readonly PaletteLight _lightPalette = new()
    {
        Primary = "#9370DB",           // MediumPurple - stronger but still pastel
        Secondary = "#F4A460",         // SandyBrown - warm pastel orange
        Tertiary = "#FF1493",          // DeepPink - vibrant accent (kept neon)
        Info = "#8A2BE2",             // BlueViolet - stronger purple info
        Success = "#98FB98",          // PaleGreen - soft success
        Warning = "#FFEAA7",          // Light peach - soft warning
        Error = "#FFB6C1",            // LightPink - soft error
        Black = "#2F2F2F",            // Dark gray for text
        White = "#FFFFFF",            // Pure white
        Surface = "#FFFAF0",          // FloralWhite - creamy surface
        Background = "#FAF0E6",       // Linen - warm cream background
        AppbarText = "#2F2F2F",       // Dark text on light appbar
        AppbarBackground = "rgba(211,180,221,0.90)", // Translucent plum - more presence
        DrawerBackground = "#D3B4DD", // Plum drawer - stronger presence
        TextPrimary = "#2F2F2F",      // Dark primary text
        TextSecondary = "#6B6B6B",    // Medium gray secondary text
        GrayLight = "#E6E6FA",        // Lavender - light purple-tinted gray
        GrayLighter = "#F8F8FF",      // GhostWhite - very light purple-tinted
        GrayDefault = "#BC8F8F",      // RosyBrown - warm gray
        GrayDark = "#8B4513",         // SaddleBrown - warm dark gray
        Divider = "#E6E6FA",          // Lavender - soft purple divider lines
        TableLines = "#E6E6FA",       // Lavender - soft table lines
    };

    private readonly PaletteDark _darkPalette = new()
    {
        Primary = "#FF69B4",          // HotPink - softer magenta for dark mode
        Secondary = "#4B0082",        // Indigo - deep purple from logo
        Tertiary = "#8A2BE2",         // BlueViolet - purple accent instead of blue
        Info = "#9370DB",            // MediumPurple - purple info instead of blue
        Success = "#00FF7F",         // SpringGreen - bright success
        Warning = "#FFD700",         // Gold - warning color
        Error = "#FF6347",           // Tomato - error color
        Black = "#000000",           // Pure black
        White = "#FFFFFF",           // Pure white
        Surface = "#2D1B4E",         // Dark purple - surface with purple tint
        Background = "#0D0D0D",      // Near black - very dark background
        BackgroundGray = "#1A1A1A",  // Very dark gray
        AppbarText = "#FFFFFF",      // White text on dark appbar
        AppbarBackground = "rgba(45,27,78,0.95)", // Translucent dark purple
        DrawerBackground = "#2D1B4E", // Dark purple drawer
        DrawerIcon = "#E0E0E0",      // Light gray icons
        DrawerText = "#E0E0E0",      // Light gray drawer text
        ActionDefault = "#BDBDBD",   // Light gray for actions
        ActionDisabled = "#757575",  // Medium gray for disabled
        ActionDisabledBackground = "#2F2F2F", // Dark gray background
        TextPrimary = "#FFFFFF",     // White primary text
        TextSecondary = "#E0E0E0",   // Light gray secondary text
        TextDisabled = "#757575",    // Disabled text
        GrayLight = "#424242",       // Light gray in dark mode
        GrayLighter = "#2F2F2F",     // Lighter gray in dark mode
        GrayDefault = "#757575",     // Default gray
        GrayDark = "#BDBDBD",        // Dark gray (inverted for dark mode)
        Divider = "#424242",         // Medium gray divider lines
        LinesDefault = "#424242",    // Default lines
        TableLines = "#424242",      // Table lines
        OverlayLight = "rgba(0,0,0,0.7)", // Dark overlay
        OverlayDark = "rgba(255,255,255,0.1)", // Light overlay for dark mode
    };

    public string DarkLightModeButtonIcon => _isDarkMode switch
    {
        true => Icons.Material.Rounded.AutoMode,
        false => Icons.Material.Outlined.DarkMode,
    };
}