mirror of
https://github.com/NodeBB/NodeBB.git
synced 2026-02-06 06:40:07 +01:00
skin support, correct order of imports for overrides
This commit is contained in:
@@ -39,6 +39,7 @@
|
||||
"body-parser": "1.20.0",
|
||||
"bootbox": "https://github.com/makeusabrew/bootbox.git#v6-wip",
|
||||
"bootstrap": "5.2.0",
|
||||
"bootswatch": "5.2.0",
|
||||
"chalk": "4.1.2",
|
||||
"chart.js": "2.9.4",
|
||||
"cli-graph": "3.2.2",
|
||||
@@ -86,7 +87,6 @@
|
||||
"morgan": "1.10.0",
|
||||
"mousetrap": "1.6.5",
|
||||
"multiparty": "4.2.3",
|
||||
"@nodebb/bootswatch": "3.4.2",
|
||||
"nconf": "0.12.0",
|
||||
"nodebb-plugin-2factor": "5.0.2",
|
||||
"nodebb-plugin-composer-default": "8.0.0",
|
||||
|
||||
@@ -70,7 +70,7 @@ $brand-danger: #d9534f;
|
||||
@mixin user-icon() {
|
||||
display: inline-block;
|
||||
text-align: center;
|
||||
color: $gray-300;
|
||||
color: $gray-light;
|
||||
font-weight: normal;
|
||||
vertical-align: middle;
|
||||
overflow: hidden; /* stops alt text from overflowing past boundaries if image does not load */
|
||||
@@ -175,7 +175,7 @@ $brand-danger: #d9534f;
|
||||
position: absolute;
|
||||
text-align: center;
|
||||
font-size: 24px;
|
||||
color: $gray-300;
|
||||
color: $gray-light;
|
||||
width: 100%;
|
||||
display: none;
|
||||
}
|
||||
|
||||
1
public/scss/overrides.scss
Normal file
1
public/scss/overrides.scss
Normal file
@@ -0,0 +1 @@
|
||||
// global bs5 overrides if necessary
|
||||
@@ -23,42 +23,47 @@ CSS.supportedSkins = [
|
||||
];
|
||||
|
||||
const buildImports = {
|
||||
client: function (source) {
|
||||
client: function (source, themeData) {
|
||||
return [
|
||||
'@import "bootstrap/scss/bootstrap";',
|
||||
'@import "../../public/scss/mixins.scss";',
|
||||
'@import "../../public/scss/generics.scss";',
|
||||
'@import "../../public/scss/responsive-utilities.scss";',
|
||||
'@import "mixins";',
|
||||
'@import "generics";',
|
||||
'@import "fontawesome";',
|
||||
'@import "./theme";',
|
||||
boostrapImport(themeData),
|
||||
'@import "responsive-utilities";',
|
||||
source,
|
||||
|
||||
'@import "../../public/scss/jquery-ui.scss";',
|
||||
'@import "../node_modules/@adactive/bootstrap-tagsinput/src/bootstrap-tagsinput";',
|
||||
'@import "../node_modules/cropperjs/dist/cropper";',
|
||||
|
||||
'@import "../../public/scss/flags.scss";',
|
||||
|
||||
'@import "../../public/scss/global.scss";',
|
||||
'@import "../../public/scss/modals.scss";',
|
||||
'@import "jquery-ui";',
|
||||
'@import "@adactive/bootstrap-tagsinput/src/bootstrap-tagsinput";',
|
||||
'@import "cropperjs/dist/cropper";',
|
||||
'@import "flags";',
|
||||
'@import "global";',
|
||||
'@import "modals";',
|
||||
].join('\n');
|
||||
},
|
||||
admin: function (source) {
|
||||
return [
|
||||
'@import "bootstrap/scss/bootstrap";',
|
||||
'@import "../../public/scss/mixins.scss";',
|
||||
'@import "../public/scss/generics.scss";',
|
||||
'@import "../../public/scss/responsive-utilities.scss";',
|
||||
'@import "mixins.scss";',
|
||||
'@import "generics.scss";',
|
||||
'@import "responsive-utilities.scss";',
|
||||
'@import "fontawesome";',
|
||||
'@import "../public/scss/admin/admin.scss";',
|
||||
'@import "admin/admin.scss";',
|
||||
source,
|
||||
'@import "../../public/scss/jquery-ui.scss";',
|
||||
'@import "../node_modules/@adactive/bootstrap-tagsinput/src/bootstrap-tagsinput";',
|
||||
'@import "jquery-ui.scss";',
|
||||
'@import "@adactive/bootstrap-tagsinput/src/bootstrap-tagsinput";',
|
||||
'@import "../public/vendor/mdl/material";',
|
||||
].join('\n');
|
||||
},
|
||||
};
|
||||
|
||||
function boostrapImport(themeData) {
|
||||
const { bootswatchSkin } = themeData;
|
||||
return [
|
||||
bootswatchSkin ? `@import "bootswatch/dist/${bootswatchSkin}/variables";` : '',
|
||||
'@import "./theme";',
|
||||
bootswatchSkin ? `@import "bootswatch/dist/${bootswatchSkin}/bootswatch";` : '',
|
||||
].join('\n');
|
||||
}
|
||||
|
||||
async function filterMissingFiles(filepaths) {
|
||||
const exists = await Promise.all(
|
||||
filepaths.map(async (filepath) => {
|
||||
@@ -118,19 +123,15 @@ async function getBundleMetadata(target) {
|
||||
target = 'client';
|
||||
}
|
||||
}
|
||||
let skinImport = [];
|
||||
|
||||
let themeData = null;
|
||||
if (target === 'client') {
|
||||
const themeData = await db.getObjectFields('config', ['theme:type', 'theme:id', 'bootswatchSkin']);
|
||||
themeData = await db.getObjectFields('config', ['theme:type', 'theme:id', 'bootswatchSkin']);
|
||||
const themeId = (themeData['theme:id'] || 'nodebb-theme-persona');
|
||||
const baseThemePath = path.join(nconf.get('themes_path'), (themeData['theme:type'] && themeData['theme:type'] === 'local' ? themeId : 'nodebb-theme-vanilla'));
|
||||
paths.unshift(baseThemePath);
|
||||
|
||||
themeData.bootswatchSkin = skin || themeData.bootswatchSkin;
|
||||
if (themeData && themeData.bootswatchSkin) {
|
||||
skinImport.push(`\n@import "./@nodebb/bootswatch/${themeData.bootswatchSkin}/variables.less";`);
|
||||
skinImport.push(`\n@import "./@nodebb/bootswatch/${themeData.bootswatchSkin}/bootswatch.less";`);
|
||||
}
|
||||
skinImport = skinImport.join('');
|
||||
}
|
||||
|
||||
const [scssImports, cssImports, acpScssImports] = await Promise.all([
|
||||
@@ -144,8 +145,8 @@ async function getBundleMetadata(target) {
|
||||
return await getImports(filteredFiles, prefix, extension);
|
||||
}
|
||||
|
||||
let imports = `${skinImport}\n${cssImports}\n${scssImports}\n${acpScssImports}`;
|
||||
imports = buildImports[target](imports);
|
||||
let imports = `${cssImports}\n${scssImports}\n${acpScssImports}`;
|
||||
imports = buildImports[target](imports, themeData);
|
||||
|
||||
return { paths: paths, imports: imports };
|
||||
}
|
||||
|
||||
Reference in New Issue
Block a user