Add CustomCss tab at Skins Admin

Client/package.json

@@ -1,6 +1,6 @@
 {
     "name": "sunengine-client",
-    "version": "2.1.3",
+    "version": "2.2.0",
     "description": "SunEngine - web engine with support of blog, forum and articles functionality",
     "productName": "SunEngine",
     "author": "Dimitrij Polianin",
@@ -13,14 +13,14 @@
         "build & publish": "cd ../Scripts && bash build.sh && bash publish.sh"
     },
     "dependencies": {
-        "@quasar/extras": "^1.4.0",
+        "@quasar/extras": "^1.4.1",
         "axios": "^0.18.1",
         "js-lock": "^0.1.1",
-        "quasar": "^1.7.1",
+        "quasar": "^1.7.3",
         "vue-i18n": "^8.15.3"
     },
     "devDependencies": {
-        "@quasar/app": "^1.5.0",
+        "@quasar/app": "^1.5.1",
         "@quasar/quasar-app-extension-qiconpicker": "^1.0.15",
         "babel-preset-proposals": "^0.1.0",
         "glob": "^7.1.4",

Client/quasar.extensions.json

@@ -2,7 +2,7 @@
   "ide-helper": {
     "addToGitIgnore": true,
     "__internal": {
-      "lastQuasarVersion": "1.7.1",
+      "lastQuasarVersion": "1.7.3",
       "lastIdeHelperVersion": "1.0.0-alpha.3"
     }
   },

Client/src/admin/roles/RolesPermissions.vue

@@ -4,6 +4,7 @@
 
 		<div class="q-gutter-y-lg" v-if="json !== null">
 			<q-input
+				filled
 				input-class="roles-permissions__json-input"
 				v-model="json"
 				type="textarea"

Client/src/admin/skins/CustomCssAdmin.vue

@@ -0,0 +1,74 @@
+<template>
+	<div class="custom-css-admin q-gutter-y-md">
+		<q-input
+			filled
+			input-class="custom-css-admin__text-area"
+			type="textarea"
+			v-model="customCss"
+		/>
+		<div class="clear"></div>
+		<div class="flex">
+			<q-btn
+				no-caps
+				icon="fas fa-save"
+				@click="updateCustomCss"
+				class="send-btn"
+				:label="$tl('saveBtn')"
+			/>
+			<q-space />
+			<q-btn
+				no-caps
+				icon="fas fa-sync-alt"
+				@click="reloadData"
+				class="refresh-btn"
+				:label="$tl('refreshBtn')"
+			/>
+		</div>
+	</div>
+</template>
+
+<script>
+import { Page } from "mixins";
+
+export default {
+	name: "CustomCssAdmin",
+	mixins: [Page],
+	data() {
+		return { customCss: null };
+	},
+	methods: {
+		reloadData() {
+			this.loadData().then(_ => {
+				this.$successNotify(this.$tl("reloadSuccessNotify"), "info");
+			});
+		},
+		loadData() {
+			return this.$request(this.$AdminApi.SkinsAdmin.GetCustomCss).then(
+				response => {
+					this.customCss = response.data;
+				}
+			);
+		},
+		updateCustomCss() {
+			this.$request(this.$AdminApi.SkinsAdmin.UpdateCustomCss, {
+				cssText: this.customCss
+			}).then(_ => {
+				this.$successNotify();
+			});
+		}
+	},
+	created() {
+		this.title = this.$tl("title");
+		this.loadData();
+	}
+};
+</script>
+
+<style lang="scss">
+.custom-css-admin__text-area {
+	font-size: 0.9em !important;
+	max-height: 600px !important;
+	min-height: 400px !important;
+	line-height: unset !important;
+}
+</style>

Client/src/admin/skins/MainSkinsAdmin.vue

@@ -125,8 +125,9 @@
 				class="skins-admin__info-link link"
 				href="https://github.com/sunengine/SunEngine.Skins"
 				target="_blank"
-				>https://github.com/sunengine/SunEngine.Skins</a
 			>
+				https://github.com/sunengine/SunEngine.Skins
+			</a>
 		</q-banner>
 	</div>
 </template>

Client/src/admin/skins/SkinsAdmin.vue

@@ -17,6 +17,13 @@
 				icon="fas fa-puzzle-piece"
 				:label="$tl('partialSkins')"
 			/>
+			<q-route-tab
+				:to="{ name: 'CustomCssAdmin' }"
+				no-caps
+				name="custom-css"
+				icon="fab fa-css3-alt"
+				:label="$tl('customCss')"
+			/>
 		</q-tabs>
 
 		<div class="q-mb-xl"></div>
@@ -44,6 +51,7 @@ export default {
 	beforeCreate() {
 		this.$options.components.MainSkinsAdmin = require("sun").MainSkinsAdmin;
 		this.$options.components.PartialSkinsAdmin = require("sun").PartialSkinsAdmin;
+		this.$options.components.CustomCssAdmin = require("sun").CustomCssAdmin;
 	},
 	created() {
 		this.title = this.$tl("title");

Client/src/api/AdminApi.js

@@ -55,7 +55,9 @@ export default {
 		ChangeSkin: "/Admin/SkinsAdmin/ChangeSkin",
 		DeleteSkin: "/Admin/SkinsAdmin/DeleteSkin",
 		DeletePartialSkin: "/Admin/SkinsAdmin/DeletePartialSkin",
-		EnablePartialSkin: "/Admin/SkinsAdmin/EnablePartialSkin"
+		EnablePartialSkin: "/Admin/SkinsAdmin/EnablePartialSkin",
+		GetCustomCss: "/Admin/SkinsAdmin/GetCustomCss",
+		UpdateCustomCss: "/Admin/SkinsAdmin/UpdateCustomCss"
 	},
 	ConfigurationAdmin: {
 		UploadConfiguration: "/Admin/ConfigurationAdmin/UploadConfiguration",

Client/src/i18n/en-us/admin.js

@@ -458,7 +458,8 @@ export default {
 	SkinsAdmin: {
 		title: "Skins admin",
 		mainSkins: "Main skins",
-		partialSkins: "Partial skins"
+		partialSkins: "Partial skins",
+		customCss: "Custom CSS"
 	},
 	MainSkinsAdmin: {
 		title: "Skins admin",
@@ -485,5 +486,12 @@ export default {
 		btnDeleteOk: "@:Global.dialog.yes",
 		btnDeleteCancel: "@:Global.dialog.cancel",
 		upload: "Upload partial skin"
+	},
+	CustomCssAdmin: {
+		title: "Custom CSS",
+		saveBtn: "@:Global.btn.save",
+		refreshBtn: "Reload from server",
+		reloadSuccessNotify: "Css reloaded from server",
+		successNotify: "Css successfully updated"
 	}
 };

Client/src/i18n/ru/admin.js

@@ -497,7 +497,8 @@ export default {
 	SkinsAdmin: {
 		title: "Темы оформления",
 		mainSkins: "Основные темы",
-		partialSkins: "Дополнительные темы"
+		partialSkins: "Дополнительные темы",
+		customCss: "Произвольный CSS"
 	},
 	MainSkinsAdmin: {
 		title: "Основные темы оформления",
@@ -524,5 +525,12 @@ export default {
 		btnDeleteOk: "@:Global.dialog.yes",
 		btnDeleteCancel: "@:Global.dialog.cancel",
 		upload: "Загрузить дополнительную тему"
+	},
+	CustomCssAdmin: {
+		title: "Произвольный CSS",
+		saveBtn: "@:Global.btn.save",
+		refreshBtn: "Перегрузить с сервера",
+		reloadSuccessNotify: "Данные перезагружены с сервера",
+		successNotify: "Данные успешно сохранены"
 	}
 };

Client/src/router/adminRoutes.js

@@ -19,6 +19,7 @@ import { EditComponent } from "sun";
 import { SkinsAdmin } from "sun";
 import { MainSkinsAdmin } from "sun";
 import { PartialSkinsAdmin } from "sun";
+import {CustomCssAdmin} from "sun";
 import { ConfigurationAdmin } from "sun";
 import { AdminInformation } from "sun";
 
@@ -125,6 +126,14 @@ const routes = [
 					default: PartialSkinsAdmin,
 					navigation: AdminPanel
 				}
+			},
+			{
+				name: "CustomCssAdmin",
+				path: "Custom".toLowerCase(),
+				components: {
+					default: CustomCssAdmin,
+					navigation: AdminPanel
+				}
 			}
 		]
 	},

Client/src/statics/config.js

@@ -10,7 +10,8 @@ const config = {
 		SiteUrl: "http://localhost:5005",
 		UploadImagesUrl: "http://localhost:5000/UploadImages",
 		SkinsUrl: "http://localhost:5005/statics/Skins",
-		PartialSkinsUrl: "http://localhost:5005/statics/PartialSkins"
+		PartialSkinsUrl: "http://localhost:5005/statics/PartialSkins",
+		CustomCssUrl: "http://localhost:5000/statics/custom.css"
 	},
 	Dev: {
 		VueDevTools: true,
@@ -63,3 +64,6 @@ if (config.Global.SiteUrl.startsWith("http://"))
 else if (config.Global.SiteUrl.startsWith("https://"))
 	config.Global.SiteSchema = "https://";
 else throw "SiteUrl in config.js have to start with 'http://' or 'https://'.";
+
+document.writeln(`<link href="${config.Global.CustomCssUrl}" rel="stylesheet" />`);
+

Client/src/statics/custom.css

@@ -0,0 +1,3 @@
+.test1 {
+    color: red;
+}

Client/src/sun.js

@@ -23,6 +23,7 @@ export ProfileRoles from 'src/admin/roles/ProfileRoles.vue'
 export RolesPage from 'src/admin/roles/RolesPage.vue'
 export RolesPermissions from 'src/admin/roles/RolesPermissions.vue'
 export RoleUsers from 'src/admin/roles/RoleUsers.vue'
+export CustomCssAdmin from 'src/admin/skins/CustomCssAdmin.vue'
 export MainSkinsAdmin from 'src/admin/skins/MainSkinsAdmin.vue'
 export PartialSkinsAdmin from 'src/admin/skins/PartialSkinsAdmin.vue'
 export SkinsAdmin from 'src/admin/skins/SkinsAdmin.vue'
@@ -118,6 +119,7 @@ export miscRoutes from 'src/router/miscRoutes.js'
 export pageNotFoundRoute from 'src/router/pageNotFoundRoute.js'
 export personalRoutes from 'src/router/personalRoutes.js'
 export adminState from 'src/store/admin/adminState.js'
+export * from 'src/store/admin/getters/breadcrumbs.js'
 export loadMyUserInfo from 'src/store/auth/actions/loadMyUserInfo.js'
 export login from 'src/store/auth/actions/login.js'
 export logout from 'src/store/auth/actions/logout.js'

README.RU.md

@@ -6,7 +6,7 @@
 
 # SunEngine
 
-<a href="#"><img src="https://img.shields.io/static/v1?label=%D0%92%D0%B5%D1%80%D1%81%D0%B8%D1%8F&message=v2.1.3&color=green"></a>
+<a href="#"><img src="https://img.shields.io/static/v1?label=%D0%92%D0%B5%D1%80%D1%81%D0%B8%D1%8F&message=v2.2.0&color=green"></a>
 <a href="https://sunengine.site"><img src="https://img.shields.io/static/v1?label=%D0%A1%D0%B0%D0%B9%D1%82&message=sunengine.site&color=yellow"></a> 
 <a href="https://demo.sunengine.site"><img src="https://img.shields.io/static/v1?label=%D0%94%D0%B5%D0%BC%D0%BE&message=demo.sunengine.site&color=yellow"></a>
 <a href="https://t.me/SunEngine"><img src="https://img.shields.io/static/v1?label=Telegram&message=@SunEngine&color=success"></a>

README.md

@@ -6,7 +6,7 @@
 
 # SunEngine
 
-<a href="#"><img src="https://img.shields.io/static/v1?label=Version&message=v2.1.3&color=green"></a>
+<a href="#"><img src="https://img.shields.io/static/v1?label=Version&message=v2.2.0&color=green"></a>
 <a href="https://sunengine.site"><img src="https://img.shields.io/static/v1?label=Site%20(Ru)&message=sunengine.site&color=yellow"></a>
 <a href="https://demo.sunengine.site"><img src="https://img.shields.io/static/v1?label=Demo&message=demo.sunengine.site&color=yellow"></a>
 <a href="https://t.me/SunEngine"><img src="https://img.shields.io/static/v1?label=Telegram&message=@SunEngine&color=success"></a>

Server/SunEngine.Admin/Controllers/SkinsAdminController.cs

@@ -87,5 +87,21 @@ public IActionResult GetAllPartialSkins()
 
 			return Json(allSkins);
 		}
+
+		[HttpPost]
+		public IActionResult GetCustomCss()
+		{
+			var cssText = skinsAdminService.GetCustomCss();
+
+			return Ok(cssText);
+		}
+
+		[HttpPost]
+		public IActionResult UpdateCustomCss(string cssText)
+		{
+			skinsAdminService.UpdateCustomCss(cssText);
+
+			return Ok();
+		}
 	}
 }

Server/SunEngine.Admin/Services/ConfigurationAdminService.cs

@@ -43,6 +43,7 @@ public void UpdateClientScripts()
 				["Global:SiteApi"] = typeof(string),
 				["Global:SiteUrl"] = typeof(string),
 				["Global:UploadImagesUrl"] = typeof(string),
+				["Global:StaticsUrl"] = typeof(string),
 				["Global:SkinsUrl"] = typeof(string),
 				["Global:PartialSkinsUrl"] = typeof(string),
 

Server/SunEngine.Admin/Services/SkinsAdminService.cs

@@ -180,6 +180,21 @@ public void EnablePartialSkin(string name, bool enable)
 			configurationAdminService.UpdateClientScripts();
 		}
 
+		public string GetCustomCss()
+		{
+			var customCssPath = Path.Combine(WwwRootPath, "statics", "custom.css");
+			return !File.Exists(customCssPath) ? "" : File.ReadAllText(customCssPath);
+		}
+
+		public void UpdateCustomCss(string cssText)
+		{
+			var customCssPath = Path.Combine(WwwRootPath, "statics", "custom.css");
+			if (File.Exists(customCssPath))
+				File.Delete(customCssPath);
+
+			File.WriteAllText(customCssPath, cssText);
+		}
+
 		public List<SkinInfo> GetAllSkins(SkinType skinType)
 		{
 			var skinsPaths = Directory.GetDirectories(skinType == SkinType.Main ? SkinsPath : PartialSkinsPath);

Server/SunEngine.Cli/SunEngine.Cli.csproj

@@ -3,7 +3,7 @@
     <PropertyGroup>
         <TargetFramework>netcoreapp3.1</TargetFramework>
         <LangVersion>latest</LangVersion>
-        <Version>2.1.3</Version>
+        <Version>2.2.0</Version>
         <Title>SunEngine</Title>
         <Authors>Dimitrij Polianin</Authors>
         <Description>Site engine with blog, forum and articles functionalities on Asp.Net Core and Vue.Js.</Description>

Server/SunEngine.Core/SunEngine.Core.csproj

@@ -2,7 +2,7 @@
 
     <PropertyGroup>
         <TargetFramework>netcoreapp3.1</TargetFramework>
-        <Version>2.1.3</Version>
+        <Version>2.2.0</Version>
         <LangVersion>default</LangVersion>
     </PropertyGroup>
 
@@ -13,10 +13,10 @@
         <PackageReference Include="linq2db.Identity" Version="2.0.1" />
         <PackageReference Include="Microsoft.AspNetCore.Mvc.Core" Version="2.2.5" />
         <PackageReference Include="Microsoft.AspNetCore.Mvc.ViewFeatures" Version="2.2.0" />
-        <PackageReference Include="Microsoft.Extensions.Caching.Abstractions" Version="3.1.0" />
-        <PackageReference Include="Microsoft.Extensions.Configuration.Json" Version="3.1.0" />
-        <PackageReference Include="Microsoft.Extensions.Identity.Core" Version="3.1.0" />
-        <PackageReference Include="Microsoft.Extensions.Options.ConfigurationExtensions" Version="3.1.0" />
+        <PackageReference Include="Microsoft.Extensions.Caching.Abstractions" Version="3.1.1" />
+        <PackageReference Include="Microsoft.Extensions.Configuration.Json" Version="3.1.1" />
+        <PackageReference Include="Microsoft.Extensions.Identity.Core" Version="3.1.1" />
+        <PackageReference Include="Microsoft.Extensions.Options.ConfigurationExtensions" Version="3.1.1" />
         <PackageReference Include="Microsoft.IdentityModel.Tokens" Version="5.6.0" />
         <PackageReference Include="NJsonSchema" Version="10.1.3" />
         <PackageReference Include="Npgsql" Version="4.1.2" />

Server/SunEngine.DataSeed/SunEngine.DataSeed.csproj

@@ -8,7 +8,7 @@
     <ItemGroup>
         <PackageReference Include="linq2db" Version="2.9.5" />
         <PackageReference Include="linq2db.Identity" Version="2.0.1" />
-        <PackageReference Include="Microsoft.Extensions.Configuration.Json" Version="3.1.0" />
+        <PackageReference Include="Microsoft.Extensions.Configuration.Json" Version="3.1.1" />
         <PackageReference Include="NJsonSchema" Version="10.1.3" />
         <PackageReference Include="Npgsql" Version="4.1.2" />
     </ItemGroup>

Server/SunEngine.Migrations/SunEngine.Migrations.csproj

@@ -11,7 +11,7 @@
         <PackageReference Include="FluentMigrator.Runner" Version="3.2.1" />
         <PackageReference Include="FluentMigrator.Runner.Core" Version="3.2.1" />
         <PackageReference Include="FluentMigrator.Runner.Postgres" Version="3.2.1" />
-        <PackageReference Include="Microsoft.Extensions.Configuration.Json" Version="3.1.0" />
+        <PackageReference Include="Microsoft.Extensions.Configuration.Json" Version="3.1.1" />
         <PackageReference Include="Npgsql" Version="4.1.2" />
     </ItemGroup>