Added ThemeSettings and ContainerSettings to Default Theme Template
Added ThemeSettings and ContainerSettings to Default Theme Template to Demonstrate how these features could be added to developers designing a theme as requested and discussed in Issue #2633
This commit is contained in:
		@ -1,20 +1,48 @@
 | 
			
		||||
@namespace [Owner].Theme.[Theme]
 | 
			
		||||
@inherits ContainerBase
 | 
			
		||||
@inject ISettingService SettingService
 | 
			
		||||
 | 
			
		||||
<div class="container">
 | 
			
		||||
<div class="@_classes">
 | 
			
		||||
    @if (_title && ModuleState.Title != "-")
 | 
			
		||||
    {
 | 
			
		||||
    <div class="row px-4">
 | 
			
		||||
        <div class="d-flex flex-nowrap">
 | 
			
		||||
            <ModuleActions /><h2><ModuleTitle /></h2>
 | 
			
		||||
        </div>
 | 
			
		||||
        <hr class="app-rule" />
 | 
			
		||||
    </div>
 | 
			
		||||
    }
 | 
			
		||||
    else
 | 
			
		||||
    {
 | 
			
		||||
    <ModuleActions />
 | 
			
		||||
    }
 | 
			
		||||
    <div class="row px-4">
 | 
			
		||||
        <div class="container">
 | 
			
		||||
        <div class="container-fluid">
 | 
			
		||||
            <ModuleInstance />
 | 
			
		||||
        </div>
 | 
			
		||||
    </div>
 | 
			
		||||
</div>
 | 
			
		||||
 | 
			
		||||
@code {
 | 
			
		||||
    public override string Name => "Container1";
 | 
			
		||||
    public override string Name => "[Owner] [Theme] - Container1";
 | 
			
		||||
 | 
			
		||||
    private bool _title = true;
 | 
			
		||||
    private string _classes = "container-fluid";
 | 
			
		||||
 | 
			
		||||
    protected override void OnParametersSet()
 | 
			
		||||
    {
 | 
			
		||||
        try
 | 
			
		||||
        {
 | 
			
		||||
            _title = bool.Parse(SettingService.GetSetting(ModuleState.Settings, GetType().Namespace + ":Title", "true"));
 | 
			
		||||
            _classes += " " + SettingService.GetSetting(ModuleState.Settings, GetType().Namespace + ":Background", "");
 | 
			
		||||
            _classes += " " + SettingService.GetSetting(ModuleState.Settings, GetType().Namespace + ":Text", "");
 | 
			
		||||
            _classes += " " + SettingService.GetSetting(ModuleState.Settings, GetType().Namespace + ":Border", "");
 | 
			
		||||
            _classes = _classes.Trim();
 | 
			
		||||
        }
 | 
			
		||||
        catch
 | 
			
		||||
        {
 | 
			
		||||
            // error loading container settings
 | 
			
		||||
        }
 | 
			
		||||
    }
 | 
			
		||||
 | 
			
		||||
}
 | 
			
		||||
							
								
								
									
										106
									
								
								Oqtane.Server/wwwroot/Themes/Templates/External/Client/Containers/ContainerSettings.razor
									
									
									
									
										vendored
									
									
										Normal file
									
								
							
							
						
						
									
										106
									
								
								Oqtane.Server/wwwroot/Themes/Templates/External/Client/Containers/ContainerSettings.razor
									
									
									
									
										vendored
									
									
										Normal file
									
								
							@ -0,0 +1,106 @@
 | 
			
		||||
@namespace [Owner].Theme.[Theme]
 | 
			
		||||
@inherits ModuleBase
 | 
			
		||||
@implements Oqtane.Interfaces.ISettingsControl
 | 
			
		||||
@inject ISettingService SettingService
 | 
			
		||||
@attribute [OqtaneIgnore]
 | 
			
		||||
 | 
			
		||||
<div class="container">
 | 
			
		||||
    <div class="row mb-1 align-items-center">
 | 
			
		||||
        <Label Class="col-sm-3" For="title" ResourceKey="Title" ResourceType="@resourceType" HelpText="Specify If The Module Title Should Be Displayed">Display Title?</Label>
 | 
			
		||||
        <div class="col-sm-9">
 | 
			
		||||
            <select id="title" class="form-select" @bind="@_title">
 | 
			
		||||
                <option value="true">Yes</option>
 | 
			
		||||
                <option value="false">No</option>
 | 
			
		||||
            </select>
 | 
			
		||||
        </div>
 | 
			
		||||
    </div>
 | 
			
		||||
    <div class="row mb-1 align-items-center">
 | 
			
		||||
        <Label Class="col-sm-3" For="background\" ResourceKey="Background" ResourceType="@resourceType" HelpText="Optionally Specify A Background Color For The Container">Background Color:</Label>
 | 
			
		||||
        <div class="col-sm-9">
 | 
			
		||||
            <select id="background" class="form-select" @bind="@_background">
 | 
			
		||||
                <option value="">None</option>
 | 
			
		||||
                <option value="bg-primary">Primary</option>
 | 
			
		||||
                <option value="bg-secondary">Secondary</option>
 | 
			
		||||
                <option value="bg-success">Success</option>
 | 
			
		||||
                <option value="bg-danger">Danger</option>
 | 
			
		||||
                <option value="bg-warning">Warning</option>
 | 
			
		||||
                <option value="bg-info">Info</option>
 | 
			
		||||
                <option value="bg-light">Light</option>
 | 
			
		||||
                <option value="bg-dark">Dark</option>
 | 
			
		||||
            </select>
 | 
			
		||||
        </div>
 | 
			
		||||
    </div>
 | 
			
		||||
    <div class="row mb-1 align-items-center">
 | 
			
		||||
        <Label Class="col-sm-3" For="text" ResourceKey="Text" ResourceType="@resourceType" HelpText="Optionally Specify A Text Color For The Container">Text Color:</Label>
 | 
			
		||||
        <div class="col-sm-9">
 | 
			
		||||
            <select id="text" class="form-select" @bind="@_text">
 | 
			
		||||
                <option value="">None</option>
 | 
			
		||||
                <option value="text-primary">Primary</option>
 | 
			
		||||
                <option value="text-secondary">Secondary</option>
 | 
			
		||||
                <option value="text-success">Success</option>
 | 
			
		||||
                <option value="text-danger">Danger</option>
 | 
			
		||||
                <option value="text-warning">Warning</option>
 | 
			
		||||
                <option value="text-info">Info</option>
 | 
			
		||||
                <option value="text-light">Light</option>
 | 
			
		||||
                <option value="text-dark">Dark</option>
 | 
			
		||||
            </select>
 | 
			
		||||
        </div>
 | 
			
		||||
    </div>
 | 
			
		||||
    <div class="row mb-1 align-items-center">
 | 
			
		||||
        <Label Class="col-sm-3" For="border" ResourceKey="Border" ResourceType="@resourceType" HelpText="Optionally Specify A Border For The Container">Border Color:</Label>
 | 
			
		||||
        <div class="col-sm-9">
 | 
			
		||||
            <select id="border" class="form-select" @bind="@_border">
 | 
			
		||||
                <option value="">None</option>
 | 
			
		||||
                <option value="border">Default</option>
 | 
			
		||||
                <option value="border border-primary">Primary</option>
 | 
			
		||||
                <option value="border border-secondary">Secondary</option>
 | 
			
		||||
                <option value="border border-success">Success</option>
 | 
			
		||||
                <option value="border border-danger">Danger</option>
 | 
			
		||||
                <option value="border border-warning">Warning</option>
 | 
			
		||||
                <option value="border border-info">Info</option>
 | 
			
		||||
                <option value="border border-light">Light</option>
 | 
			
		||||
                <option value="border border-dark">Dark</option>
 | 
			
		||||
            </select>
 | 
			
		||||
        </div>
 | 
			
		||||
    </div>
 | 
			
		||||
</div>
 | 
			
		||||
 | 
			
		||||
@code {
 | 
			
		||||
	private string resourceType = "[Owner].Theme.[Theme].ContainerSettings, [Owner].Theme.[Theme].Client.Oqtane"; // for localization
 | 
			
		||||
    private string _title = "true";
 | 
			
		||||
    private string _background = "";
 | 
			
		||||
    private string _text = "";
 | 
			
		||||
    private string _border = "";
 | 
			
		||||
 | 
			
		||||
    protected override void OnInitialized()
 | 
			
		||||
    {
 | 
			
		||||
        try
 | 
			
		||||
        {
 | 
			
		||||
            _title = SettingService.GetSetting(ModuleState.Settings, GetType().Namespace + ":Title", "true");
 | 
			
		||||
            _background = SettingService.GetSetting(ModuleState.Settings, GetType().Namespace + ":Background", "");
 | 
			
		||||
            _text = SettingService.GetSetting(ModuleState.Settings, GetType().Namespace + ":Text", "");
 | 
			
		||||
            _border = SettingService.GetSetting(ModuleState.Settings, GetType().Namespace + ":Border", "");
 | 
			
		||||
        }
 | 
			
		||||
        catch (Exception ex)
 | 
			
		||||
        {
 | 
			
		||||
            ModuleInstance.AddModuleMessage(ex.Message, MessageType.Error);
 | 
			
		||||
        }
 | 
			
		||||
    }
 | 
			
		||||
 | 
			
		||||
    public async Task UpdateSettings()
 | 
			
		||||
    {
 | 
			
		||||
        try
 | 
			
		||||
        {
 | 
			
		||||
			var settings = await SettingService.GetModuleSettingsAsync(ModuleState.ModuleId);
 | 
			
		||||
            settings = SettingService.SetSetting(settings, GetType().Namespace + ":Title", _title);
 | 
			
		||||
            settings = SettingService.SetSetting(settings, GetType().Namespace + ":Background", _background);
 | 
			
		||||
            settings = SettingService.SetSetting(settings, GetType().Namespace + ":Text", _text);
 | 
			
		||||
            settings = SettingService.SetSetting(settings, GetType().Namespace + ":Border", _border);
 | 
			
		||||
            await SettingService.UpdateModuleSettingsAsync(settings, ModuleState.ModuleId);
 | 
			
		||||
        }
 | 
			
		||||
        catch (Exception ex)
 | 
			
		||||
        {
 | 
			
		||||
            ModuleInstance.AddModuleMessage(ex.Message, MessageType.Error);
 | 
			
		||||
        }
 | 
			
		||||
    }
 | 
			
		||||
}
 | 
			
		||||
		Reference in New Issue
	
	Block a user