add theme creator module to simplify the scaffolding of external themes

2021-04-07 13:05:18 -04:00
parent d05747af1e
commit 1d3a79437c
20 changed files with 760 additions and 6 deletions
--- a/Oqtane.Server/wwwroot/Themes/Templates/External/Client/AssemblyInfo.cs
+++ b/Oqtane.Server/wwwroot/Themes/Templates/External/Client/AssemblyInfo.cs
@ -0,0 +1,4 @@
+using System.Resources;
+using Microsoft.Extensions.Localization;
+
+[assembly: RootNamespace("[Owner].[Theme].Client")]
--- a/Oqtane.Server/wwwroot/Themes/Templates/External/Client/Containers/Container1.razor
+++ b/Oqtane.Server/wwwroot/Themes/Templates/External/Client/Containers/Container1.razor
@ -0,0 +1,20 @@
+@namespace [Owner].[Theme]
+@inherits ContainerBase
+
+<div class="container">
+    <div class="row px-4">
+        <div class="d-flex flex-nowrap">
+            <ModuleActions /><h2><ModuleTitle /></h2>
+        </div>
+        <hr class="app-rule" />
+    </div>
+    <div class="row px-4">
+        <div class="container">
+            <ModuleInstance />
+        </div>
+    </div>
+</div>
+
+@code {
+    public override string Name => "Container1";
+}
--- a/Oqtane.Server/wwwroot/Themes/Templates/External/Client/ThemeInfo.cs
+++ b/Oqtane.Server/wwwroot/Themes/Templates/External/Client/ThemeInfo.cs
@ -0,0 +1,15 @@
+using Oqtane.Models;
+using Oqtane.Themes;
+
+namespace [Owner].[Theme]
+{
+    public class ThemeInfo : ITheme
+    {
+        public Theme Theme => new Theme
+        {
+            Name = "[Theme]",
+            Version = "1.0.0"
+        };
+
+    }
+}
--- a/Oqtane.Server/wwwroot/Themes/Templates/External/Client/Themes/Theme1.razor
+++ b/Oqtane.Server/wwwroot/Themes/Templates/External/Client/Themes/Theme1.razor
@ -0,0 +1,107 @@
+@namespace [Owner].[Theme]
+@inherits ThemeBase
+
+<main role="main">
+    <nav class="navbar navbar-expand-md navbar-dark bg-primary fixed-top">
+        <Logo /><Menu Orientation="Horizontal" />
+        <div class="controls ml-md-auto">
+            <div class="controls-group"><UserProfile /> <Login /> <ControlPanel /></div>
+        </div>
+    </nav>
+    <div class="container">
+        <div class="row">
+            <div class="col-md-12">
+                <Pane Name="Content" />
+            </div>
+        </div>
+    </div>
+    <Pane Name="Top Full Width" />
+    <div class="container">
+        <div class="row">
+            <div class="col-md-12">
+                <Pane Name="Top 100%" />
+            </div>
+        </div>
+        <div class="row">
+            <div class="col-md-6">
+                <Pane Name="Left 50%" />
+            </div>
+            <div class="col-md-6">
+                <Pane Name="Right 50%" />
+            </div>
+        </div>
+        <div class="row">
+            <div class="col-md-4">
+                <Pane Name="Left 33%" />
+            </div>
+            <div class="col-md-4">
+                <Pane Name="Center 33%" />
+            </div>
+            <div class="col-md-4">
+                <Pane Name="Right 33%" />
+            </div>
+        </div>
+        <div class="row">
+            <div class="col-md-3">
+                <Pane Name="Left Outer 25%" />
+            </div>
+            <div class="col-md-3">
+                <Pane Name="Left Inner 25%" />
+            </div>
+            <div class="col-md-3">
+                <Pane Name="Right Inner 25%" />
+            </div>
+            <div class="col-md-3">
+                <Pane Name="Right Outer 25%" />
+            </div>
+        </div>
+        <div class="row">
+            <div class="col-md-3">
+                <Pane Name="Left 25%" />
+            </div>
+            <div class="col-md-6">
+                <Pane Name="Center 50%" />
+            </div>
+            <div class="col-md-3">
+                <Pane Name="Right 25%" />
+            </div>
+        </div>
+        <div class="row">
+            <div class="col-md-8">
+                <Pane Name="Left Sidebar 66%" />
+            </div>
+            <div class="col-md-4">
+                <Pane Name="Right Sidebar 33%" />
+            </div>
+        </div>
+        <div class="row">
+            <div class="col-md-4">
+                <Pane Name="Left Sidebar 33%" />
+            </div>
+            <div class="col-md-8">
+                <Pane Name="Right Sidebar 66%" />
+            </div>
+        </div>
+        <div class="row">
+            <div class="col-md-12">
+                <Pane Name="Bottom 100%" />
+            </div>
+        </div>
+    </div>
+    <Pane Name="Bottom Full Width" />
+</main>
+
+@code {
+    public override string Name => "Theme1";
+
+    public override string Panes => "Content,Top Full Width,Top 100%,Left 50%,Right 50%,Left 33%,Center 33%,Right 33%,Left Outer 25%,Left Inner 25%,Right Inner 25%,Right Outer 25%,Left 25%,Center 50%,Right 25%,Left Sidebar 66%,Right Sidebar 33%,Left Sidebar 33%,Right Sidebar 66%,Bottom 100%,Bottom Full Width";
+
+    public override List<Resource> Resources => new List<Resource>()
+    {
+        new Resource { ResourceType = ResourceType.Stylesheet, Url = "https://stackpath.bootstrapcdn.com/bootstrap/4.5.0/css/bootstrap.min.css", Integrity = "sha384-9aIt2nRpC12Uk9gS9baDl411NQApFmC26EwAOH8WgZl5MYYxFfc+NcPb1dKGj7Sk", CrossOrigin = "anonymous" },
+        new Resource { ResourceType = ResourceType.Stylesheet, Url = ThemePath() + "Theme.css" },
+        new Resource { ResourceType = ResourceType.Script, Bundle = "Bootstrap", Url = "https://code.jquery.com/jquery-3.5.1.slim.min.js", Integrity = "sha384-DfXdz2htPH0lsSSs5nCTpuj/zy4C+OGpamoFVy38MVBnE+IbbVYUew+OrCXaRkfj", CrossOrigin = "anonymous" },
+        new Resource { ResourceType = ResourceType.Script, Bundle = "Bootstrap", Url = "https://cdn.jsdelivr.net/npm/popper.js@1.16.0/dist/umd/popper.min.js", Integrity = "sha384-Q6E9RHvbIyZFJoft+2mJbHaEWldlvI9IOYy5n3zV9zzTtmI3UksdQRVvoxMfooAo", CrossOrigin = "anonymous" },
+        new Resource { ResourceType = ResourceType.Script, Bundle = "Bootstrap", Url = "https://stackpath.bootstrapcdn.com/bootstrap/4.5.0/js/bootstrap.min.js", Integrity = "sha384-OgVRvuATP1z7JjHLkuOU7Xw704+h835Lr+6QL9UvYjZE3Ipu6Tp75j7Bh/kR0JKI", CrossOrigin = "anonymous" }
+    };
+}
--- a/Oqtane.Server/wwwroot/Themes/Templates/External/Client/[Owner].[Theme].Client.csproj
+++ b/Oqtane.Server/wwwroot/Themes/Templates/External/Client/[Owner].[Theme].Client.csproj
@ -0,0 +1,34 @@
+<Project Sdk="Microsoft.NET.Sdk.Razor">
+
+  <PropertyGroup>
+    <TargetFramework>net5.0</TargetFramework>
+    <RazorLangVersion>3.0</RazorLangVersion>
+    <Version>1.0.0</Version>
+    <Authors>[Owner]</Authors>
+    <Company>[Owner]</Company>
+    <Description>[Description]</Description>
+    <Product>[Owner].[Theme]</Product>
+    <Copyright>[Owner]</Copyright>
+    <AssemblyName>[Owner].[Theme].Client.Oqtane</AssemblyName>
+  </PropertyGroup>
+
+  <ItemGroup>
+    <PackageReference Include="Microsoft.AspNetCore.Components.WebAssembly" Version="5.0.0" />
+    <PackageReference Include="Microsoft.AspNetCore.Components.WebAssembly.DevServer" Version="5.0.0" PrivateAssets="all" />
+    <PackageReference Include="Microsoft.AspNetCore.Components.WebAssembly.Authentication" Version="5.0.0" />
+    <PackageReference Include="Microsoft.Extensions.Localization" Version="5.0.0" />
+    <PackageReference Include="System.Net.Http.Json" Version="5.0.0" />
+  </ItemGroup>
+
+  <ItemGroup>
+    [ClientReference]
+    [SharedReference]
+  </ItemGroup>
+
+  <PropertyGroup>
+    <!-- there may be other elements here -->
+    <BlazorWebAssemblyEnableLinking>false</BlazorWebAssemblyEnableLinking>
+    <GeneratePackageOnBuild>false</GeneratePackageOnBuild>
+  </PropertyGroup>
+
+</Project>
--- a/Oqtane.Server/wwwroot/Themes/Templates/External/Client/_Imports.razor
+++ b/Oqtane.Server/wwwroot/Themes/Templates/External/Client/_Imports.razor
@ -0,0 +1,21 @@
+@using System
+@using System.Linq
+@using System.Collections.Generic
+@using System.Net.Http
+@using System.Net.Http.Json
+
+@using Microsoft.AspNetCore.Components.Routing
+@using Microsoft.AspNetCore.Components.Web
+@using Microsoft.JSInterop
+
+@using Oqtane.Models
+@using Oqtane.Modules
+@using Oqtane.Modules.Controls
+@using Oqtane.Providers
+@using Oqtane.Security
+@using Oqtane.Services
+@using Oqtane.Shared
+@using Oqtane.Themes
+@using Oqtane.Themes.Controls
+@using Oqtane.UI
+@using Oqtane.Enums
--- a/Oqtane.Server/wwwroot/Themes/Templates/External/Client/wwwroot/Themes/[Owner].[Theme]/Theme.css
+++ b/Oqtane.Server/wwwroot/Themes/Templates/External/Client/wwwroot/Themes/[Owner].[Theme]/Theme.css
@ -0,0 +1,83 @@
+/* Oqtane Styles */
+
+body {
+    padding-top: 7rem;
+}
+
+.controls {
+    z-index: 2000;
+    padding-top: 15px;
+    padding-bottom: 15px;
+    margin-right: 10px;
+}
+
+.app-menu .nav-item {
+    font-size: 0.9rem;
+    padding-bottom: 0.5rem;
+}
+
+.app-menu .nav-item a {
+    border-radius: 4px;
+    height: 3rem;
+    display: flex;
+    align-items: center;
+    line-height: 3rem;
+}
+
+.app-menu .nav-item a.active {
+    background-color: rgba(255,255,255,0.25);
+    color: white;
+}
+
+.app-menu .nav-item a:hover {
+    background-color: rgba(255,255,255,0.1);
+    color: white;
+}
+
+.app-menu .nav-link .oi {
+    width: 1.5rem;
+    font-size: 1.1rem;
+    vertical-align: text-top;
+    top: -2px;
+}
+
+.navbar-toggler {
+    background-color: rgba(255, 255, 255, 0.1);
+    margin-left: auto;
+}
+
+div.app-moduleactions a.dropdown-toggle, div.app-moduleactions div.dropdown-menu {
+    color:#ffffff;
+}
+
+@media (max-width: 767px) {
+
+    .app-menu {
+        width: 100%
+    }
+
+    .navbar {
+        position: fixed;
+        top: 60px;
+        width: 100%;
+    }
+
+    .controls {
+        height: 60px;
+        top: 15px;
+        position: fixed;
+        top: 0px;
+        width: 100%;
+        background-color: rgb(0, 0, 0);
+    }
+
+    .controls-group {
+        float: right;
+        margin-right: 25px;
+    }
+
+    .content {
+        position: relative;
+        top: 60px;
+    }
+}
--- a/Oqtane.Server/wwwroot/Themes/Templates/External/Package/[Owner].[Theme].Package.csproj
+++ b/Oqtane.Server/wwwroot/Themes/Templates/External/Package/[Owner].[Theme].Package.csproj
@ -0,0 +1,17 @@
+<Project Sdk="Microsoft.NET.Sdk">
+
+  <PropertyGroup>
+    <TargetFramework>net5.0</TargetFramework>
+    <GeneratePackageOnBuild>false</GeneratePackageOnBuild>
+  </PropertyGroup>
+
+  <ItemGroup>
+    <ProjectReference Include="..\Client\[Owner].[Theme].Client.csproj" />
+  </ItemGroup>
+
+  <Target Name="PostBuild" AfterTargets="PostBuildEvent">
+    <Exec Command="IF $(ConfigurationName) == Debug (debug.cmd)" />
+    <Exec Command="IF $(ConfigurationName) == Release (release.cmd)" />
+  </Target>
+
+</Project>
--- a/Oqtane.Server/wwwroot/Themes/Templates/External/Package/[Owner].[Theme].nuspec
+++ b/Oqtane.Server/wwwroot/Themes/Templates/External/Package/[Owner].[Theme].nuspec
@ -0,0 +1,27 @@
+<?xml version="1.0" encoding="utf-8"?>
+<package xmlns="http://schemas.microsoft.com/packaging/2010/07/nuspec.xsd">
+  <metadata>
+    <id>[Owner].[Theme]</id>
+    <version>1.0.0</version>
+    <authors>[Owner]</authors>
+    <owners>[Owner]</owners>
+    <title>[Theme]</title>
+    <description>[Theme]</description>
+    <copyright>[Owner]</copyright>
+    <requireLicenseAcceptance>false</requireLicenseAcceptance>
+    <license type="expression">MIT</license>
+    <projectUrl>https://github.com/oqtane/oqtane.framework</projectUrl>
+    <iconUrl>https://www.oqtane.org/Portals/0/icon.jpg</iconUrl>
+    <tags>oqtane module</tags>
+    <releaseNotes></releaseNotes>
+    <summary></summary>
+    <dependencies>
+      <dependency id="Oqtane.Framework" version="[FrameworkVersion]" />
+    </dependencies>
+  </metadata>
+  <files>
+    <file src="..\Client\bin\Release\net5.0\[Owner].[Theme].Client.Oqtane.dll" target="lib\net5.0" /> 
+    <file src="..\Client\bin\Release\net5.0\[Owner].[Theme].Client.Oqtane.pdb" target="lib\net5.0" /> 
+    <file src="..\Client\wwwroot\**\*.*" target="wwwroot" /> 
+  </files>
+</package>
--- a/Oqtane.Server/wwwroot/Themes/Templates/External/Package/debug.cmd
+++ b/Oqtane.Server/wwwroot/Themes/Templates/External/Package/debug.cmd
@ -0,0 +1,3 @@
+XCOPY "..\Client\bin\Debug\net5.0\[Owner].[Theme].Client.Oqtane.dll" "..\..\[RootFolder]\Oqtane.Server\bin\Debug\net5.0\" /Y
+XCOPY "..\Client\bin\Debug\net5.0\[Owner].[Theme].Client.Oqtane.pdb" "..\..\[RootFolder]\Oqtane.Server\bin\Debug\net5.0\" /Y
+XCOPY "..\Client\wwwroot\*" "..\..\[RootFolder]\Oqtane.Client\wwwroot\" /Y /S /I
--- a/Oqtane.Server/wwwroot/Themes/Templates/External/Package/release.cmd
+++ b/Oqtane.Server/wwwroot/Themes/Templates/External/Package/release.cmd
@ -0,0 +1,2 @@
+"..\..\[RootFolder]\oqtane.package\nuget.exe" pack [Owner].[Theme].nuspec 
+XCOPY "*.nupkg" "..\..\[RootFolder]\Oqtane.Server\wwwroot\Themes\" /Y
--- a/Oqtane.Server/wwwroot/Themes/Templates/External/[Owner].[Theme].sln
+++ b/Oqtane.Server/wwwroot/Themes/Templates/External/[Owner].[Theme].sln
@ -0,0 +1,36 @@
+
+Microsoft Visual Studio Solution File, Format Version 12.00
+# Visual Studio Version 16
+VisualStudioVersion = 16.0.28621.142
+MinimumVisualStudioVersion = 10.0.40219.1
+Project("{9A19103F-16F7-4668-BE54-9A1E7A4F7556}") = "[Owner].[Theme].Client", "Client\[Owner].[Theme].Client.csproj", "{AA8E58A1-CD09-4208-BF66-A8BB341FD669}"
+EndProject
+Project("{FAE04EC0-301F-11D3-BF4B-00C04F79EFBC}") = "[Owner].[Theme].Package", "Package\[Owner].[Theme].Package.csproj", "{C5CE512D-CBB7-4545-AF0F-9B6591A0C3A7}"
+EndProject
+Global
+	GlobalSection(SolutionConfigurationPlatforms) = preSolution
+		Debug|Any CPU = Debug|Any CPU
+		Release|Any CPU = Release|Any CPU
+		Wasm|Any CPU = Wasm|Any CPU
+	EndGlobalSection
+	GlobalSection(ProjectConfigurationPlatforms) = postSolution
+		{AA8E58A1-CD09-4208-BF66-A8BB341FD669}.Debug|Any CPU.ActiveCfg = Debug|Any CPU
+		{AA8E58A1-CD09-4208-BF66-A8BB341FD669}.Debug|Any CPU.Build.0 = Debug|Any CPU
+		{AA8E58A1-CD09-4208-BF66-A8BB341FD669}.Release|Any CPU.ActiveCfg = Release|Any CPU
+		{AA8E58A1-CD09-4208-BF66-A8BB341FD669}.Release|Any CPU.Build.0 = Release|Any CPU
+		{AA8E58A1-CD09-4208-BF66-A8BB341FD669}.Wasm|Any CPU.ActiveCfg = Release|Any CPU
+		{AA8E58A1-CD09-4208-BF66-A8BB341FD669}.Wasm|Any CPU.Build.0 = Release|Any CPU
+		{C5CE512D-CBB7-4545-AF0F-9B6591A0C3A7}.Debug|Any CPU.ActiveCfg = Debug|Any CPU
+		{C5CE512D-CBB7-4545-AF0F-9B6591A0C3A7}.Debug|Any CPU.Build.0 = Debug|Any CPU
+		{C5CE512D-CBB7-4545-AF0F-9B6591A0C3A7}.Release|Any CPU.ActiveCfg = Release|Any CPU
+		{C5CE512D-CBB7-4545-AF0F-9B6591A0C3A7}.Release|Any CPU.Build.0 = Release|Any CPU
+		{C5CE512D-CBB7-4545-AF0F-9B6591A0C3A7}.Wasm|Any CPU.ActiveCfg = Debug|Any CPU
+		{C5CE512D-CBB7-4545-AF0F-9B6591A0C3A7}.Wasm|Any CPU.Build.0 = Debug|Any CPU
+	EndGlobalSection
+	GlobalSection(SolutionProperties) = preSolution
+		HideSolutionNode = FALSE
+	EndGlobalSection
+	GlobalSection(ExtensibilityGlobals) = postSolution
+		SolutionGuid = {1D016F15-46FE-4726-8DFD-2E4FD4DC7668}
+	EndGlobalSection
+EndGlobal