Bootstrap5

.eslintignore

@@ -18,12 +18,3 @@ logs/
 .eslintrc
 test/files
 *.min.js
-
-/public/src/app.js
-/public/src/client.js
-/public/src/admin/admin.js
-/public/src/modules/translator.common.js
-/public/src/modules/pictureCropper.js
-/public/src/modules/ace-editor.js
-/public/src/client/account/header.js
-/public/src/client/test.js

Gruntfile.js

@@ -54,14 +54,9 @@ module.exports = function (grunt) {
 			}
 		}
 
-		const styleUpdated_Client = pluginList.map(p => `node_modules/${p}/*.less`)
+		const styleUpdated_Client = pluginList.map(p => `node_modules/${p}/*.scss`)
 			.concat(pluginList.map(p => `node_modules/${p}/*.css`))
-			.concat(pluginList.map(p => `node_modules/${p}/+(public|static|less)/**/*.less`))
-			.concat(pluginList.map(p => `node_modules/${p}/+(public|static)/**/*.css`));
-
-		const styleUpdated_Admin = pluginList.map(p => `node_modules/${p}/*.less`)
-			.concat(pluginList.map(p => `node_modules/${p}/*.css`))
-			.concat(pluginList.map(p => `node_modules/${p}/+(public|static|less)/**/*.less`))
+			.concat(pluginList.map(p => `node_modules/${p}/+(public|static|scss)/**/*.scss`))
 			.concat(pluginList.map(p => `node_modules/${p}/+(public|static)/**/*.css`));
 
 		const clientUpdated = pluginList.map(p => `node_modules/${p}/+(public|static)/**/*.js`);
@@ -72,24 +67,15 @@ module.exports = function (grunt) {
 		const langUpdated = pluginList.map(p => `node_modules/${p}/+(public|static|languages)/**/*.json`);
 
 		grunt.config(['watch'], {
-			styleUpdated_Client: {
+			styleUpdated: {
 				files: [
-					'public/less/**/*.less',
+					'public/scss/**/*.scss',
 					...styleUpdated_Client,
 				],
 				options: {
 					interval: 1000,
 				},
 			},
-			styleUpdated_Admin: {
-				files: [
-					'public/less/**/*.less',
-					...styleUpdated_Admin,
-				],
-				options: {
-					interval: 1000,
-				},
-			},
 			clientUpdated: {
 				files: [
 					'public/src/**/*.js',
@@ -167,24 +153,22 @@ module.exports = function (grunt) {
 	grunt.event.removeAllListeners('watch');
 	grunt.event.on('watch', (action, filepath, target) => {
 		let compiling;
-		if (target === 'styleUpdated_Client') {
-			compiling = 'clientCSS';
-		} else if (target === 'styleUpdated_Admin') {
-			compiling = 'acpCSS';
+		if (target === 'styleUpdated') {
+			compiling = ['clientCSS', 'acpCSS'];
 		} else if (target === 'clientUpdated') {
-			compiling = 'js';
+			compiling = ['js'];
 		} else if (target === 'templatesUpdated') {
-			compiling = 'tpl';
+			compiling = ['tpl'];
 		} else if (target === 'langUpdated') {
-			compiling = 'lang';
+			compiling = ['lang'];
 		} else if (target === 'serverUpdated') {
 			// empty require cache
 			const paths = ['./src/meta/build.js', './src/meta/index.js'];
 			paths.forEach(p => delete require.cache[require.resolve(p)]);
 			return run();
 		}
 
-		require('./src/meta/build').build([compiling], { webpack: false }, (err) => {
+		require('./src/meta/build').build(compiling, { webpack: false }, (err) => {
 			if (err) {
 				winston.error(err.stack);
 			}

install/data/defaults.json

@@ -182,5 +182,6 @@
     "composer:showHelpTab": 1,
     "composer:allowPluginHelp": 1,
     "maxReconnectionAttempts": 5,
-    "reconnectionDelay": 1500
+    "reconnectionDelay": 1500,
+    "disableCustomUserSkins": 0
 }

install/data/footer.json

@@ -2,7 +2,7 @@
 	{
 		"widget": "html",
 		"data" : {
-			"html": "<footer id=\"footer\" class=\"container footer\">\r\n\t<div>\r\n\t\tPowered by <a target=\"_blank\" href=\"https://nodebb.org\">NodeBB</a> | <a target=\"_blank\" href=\"//github.com/NodeBB/NodeBB/graphs/contributors\">Contributors</a>\r\n\t</div>\r\n</footer>",
+			"html": "<footer id=\"footer\" class=\"container footer d-flex flex-column align-items-center gap-1 mb-2\">\n\t<span>Powered by <a class=\"link-secondary text-decoration-underline\" target=\"_blank\" href=\"https://nodebb.org\">NodeBB</a></span>\n\t<span><a class=\"link-secondary\" target=\"_blank\" href=\"//github.com/NodeBB/NodeBB/graphs/contributors\"><i class=\"fa fa-users\"></i> <span class=\"text-decoration-underline\">Contributors<span></a></span>\n</footer>",
 			"title":"",
 			"container":""
 		}

install/data/navigation.json

@@ -4,7 +4,7 @@
 		"title": "[[global:header.categories]]",
 		"enabled": true,
 		"iconClass": "fa-list",
-		"textClass": "visible-xs-inline",
+		"textClass": "d-lg-none",
 		"text": "[[global:header.categories]]"
 	},
 	{
@@ -13,7 +13,7 @@
 		"title": "[[global:header.unread]]",
 		"enabled": true,
 		"iconClass": "fa-inbox",
-		"textClass": "visible-xs-inline",
+		"textClass": "d-lg-none",
 		"text": "[[global:header.unread]]",
 		"groups": ["registered-users"]
 	},
@@ -22,47 +22,47 @@
 		"title": "[[global:header.recent]]",
 		"enabled": true,
 		"iconClass": "fa-clock-o",
-		"textClass": "visible-xs-inline",
+		"textClass": "d-lg-none",
 		"text": "[[global:header.recent]]"
 	},
 	{
 		"route": "/tags",
 		"title": "[[global:header.tags]]",
 		"enabled": true,
 		"iconClass": "fa-tags",
-		"textClass": "visible-xs-inline",
+		"textClass": "d-lg-none",
 		"text": "[[global:header.tags]]"
 	},
 	{
 		"route": "/popular",
 		"title": "[[global:header.popular]]",
 		"enabled": true,
 		"iconClass": "fa-fire",
-		"textClass": "visible-xs-inline",
+		"textClass": "d-lg-none",
 		"text": "[[global:header.popular]]"
 	},
 	{
 		"route": "/users",
 		"title": "[[global:header.users]]",
 		"enabled": true,
 		"iconClass": "fa-user",
-		"textClass": "visible-xs-inline",
+		"textClass": "d-lg-none",
 		"text": "[[global:header.users]]"
 	},
 	{
 		"route": "/groups",
 		"title": "[[global:header.groups]]",
 		"enabled": true,
 		"iconClass": "fa-group",
-		"textClass": "visible-xs-inline",
+		"textClass": "d-lg-none",
 		"text": "[[global:header.groups]]"
 	},
 	{
 		"route": "/admin",
 		"title": "[[global:header.admin]]",
 		"enabled": true,
 		"iconClass": "fa-cogs",
-		"textClass": "visible-xs-inline",
+		"textClass": "d-lg-none",
 		"text": "[[global:header.admin]]",
 		"groups": ["administrators"]
 	}

install/package.json

@@ -2,8 +2,8 @@
     "name": "nodebb",
     "license": "GPL-3.0",
     "description": "NodeBB Forum",
-    "version": "2.8.6",
-    "homepage": "http://www.nodebb.org",
+    "version": "3.0.0-beta.2",
+    "homepage": "https://www.nodebb.org",
     "repository": {
         "type": "git",
         "url": "https://github.com/NodeBB/NodeBB/"
@@ -30,15 +30,17 @@
     "dependencies": {
         "@adactive/bootstrap-tagsinput": "0.8.2",
         "@isaacs/ttlcache": "1.2.1",
+        "@popperjs/core": "2.11.6",
         "ace-builds": "1.15.3",
         "archiver": "5.3.1",
         "async": "3.2.4",
         "autoprefixer": "10.4.14",
         "bcryptjs": "2.4.3",
         "benchpressjs": "2.5.1",
         "body-parser": "1.20.2",
-        "bootbox": "5.5.3",
-        "bootstrap": "3.4.1",
+        "bootbox": "6.0.0",
+        "bootstrap": "5.2.3",
+        "bootswatch": "5.2.3",
         "chalk": "4.1.2",
         "chart.js": "2.9.4",
         "cli-graph": "3.2.2",
@@ -87,22 +89,22 @@
         "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.1.3",
-        "nodebb-plugin-composer-default": "9.2.5",
-        "nodebb-plugin-dbsearch": "5.1.5",
-        "nodebb-plugin-emoji": "4.0.6",
-        "nodebb-plugin-emoji-android": "3.0.0",
-        "nodebb-plugin-markdown": "10.1.1",
-        "nodebb-plugin-mentions": "3.0.13",
-        "nodebb-plugin-spam-be-gone": "1.0.3",
+        "nodebb-plugin-2factor": "7.0.4",
+        "nodebb-plugin-composer-default": "10.0.42",
+        "nodebb-plugin-dbsearch": "6.0.0",
+        "nodebb-plugin-emoji": "5.0.5",
+        "nodebb-plugin-emoji-android": "4.0.0",
+        "nodebb-plugin-markdown": "12.0.2",
+        "nodebb-plugin-mentions": "4.0.4",
+        "nodebb-plugin-ntfy": "1.0.15",
+        "nodebb-plugin-spam-be-gone": "2.0.5",
         "nodebb-rewards-essentials": "0.2.2",
-        "nodebb-theme-lavender": "6.0.1",
-        "nodebb-theme-persona": "12.1.16",
-        "nodebb-theme-slick": "2.0.4",
-        "nodebb-theme-vanilla": "12.1.20",
-        "nodebb-widget-essentials": "6.0.1",
+        "nodebb-theme-harmony": "1.0.0-beta.77",
+        "nodebb-theme-lavender": "7.0.9",
+        "nodebb-theme-peace": "2.0.19",
+        "nodebb-theme-persona": "13.0.50",
+        "nodebb-widget-essentials": "7.0.6",
         "nodemailer": "6.9.1",
         "nprogress": "0.2.0",
         "passport": "0.6.0",
@@ -119,7 +121,9 @@
         "request-promise-native": "1.0.9",
         "rimraf": "3.0.2",
         "rss": "1.2.2",
+        "rtlcss": "4.0.0",
         "sanitize-html": "2.10.0",
+        "sass": "1.54.9",
         "semver": "7.3.8",
         "serve-favicon": "2.5.0",
         "sharp": "0.31.3",
@@ -137,7 +141,6 @@
         "timeago": "1.6.7",
         "tinycon": "0.6.8",
         "toobusy-js": "0.5.1",
-        "uglify-es": "3.3.9",
         "validator": "13.9.0",
         "webpack": "5.76.1",
         "webpack-merge": "5.8.0",
@@ -166,6 +169,9 @@
         "nyc": "15.1.0",
         "smtp-server": "3.11.0"
     },
+    "optionalDependencies": {
+        "sass-embedded": "1.55.0"
+    },
     "resolutions": {
         "*/jquery": "3.6.4"
     },
@@ -176,11 +182,6 @@
         "node": ">=12"
     },
     "maintainers": [
-        {
-            "name": "Andrew Rodrigues",
-            "email": "andrew@nodebb.org",
-            "url": "https://github.com/psychobunny"
-        },
         {
             "name": "Julian Lam",
             "email": "julian@nodebb.org",

install/web.js

@@ -6,14 +6,14 @@ const bodyParser = require('body-parser');
 const fs = require('fs');
 const path = require('path');
 const childProcess = require('child_process');
-const less = require('less');
 
 const webpack = require('webpack');
 const nconf = require('nconf');
 
 const Benchpress = require('benchpressjs');
 const mkdirp = require('mkdirp');
 const { paths } = require('../src/constants');
+const sass = require('../src/utils').getSass();
 
 const app = express();
 let server;
@@ -73,7 +73,7 @@ web.install = async function (port) {
 	try {
 		await Promise.all([
 			compileTemplate(),
-			compileLess(),
+			compileSass(),
 			runWebpack(),
 			copyCSS(),
 			loadDefaults(),
@@ -247,23 +247,28 @@ async function compileTemplate() {
 	]);
 }
 
-async function compileLess() {
+async function compileSass() {
 	try {
-		const installSrc = path.join(__dirname, '../public/less/install.less');
+		const installSrc = path.join(__dirname, '../public/scss/install.scss');
 		const style = await fs.promises.readFile(installSrc);
-		const css = await less.render(String(style), { filename: path.resolve(installSrc) });
-		await fs.promises.writeFile(path.join(__dirname, '../public/installer.css'), css.css);
+		const scssOutput = sass.compileString(String(style), {
+			loadPaths: [
+				path.join(__dirname, '../public/scss'),
+			],
+		});
+
+		await fs.promises.writeFile(path.join(__dirname, '../public/installer.css'), scssOutput.css.toString());
 	} catch (err) {
-		winston.error(`Unable to compile LESS: \n${err.stack}`);
+		winston.error(`Unable to compile SASS: \n${err.stack}`);
 		throw err;
 	}
 }
 
 async function copyCSS() {
-	const src = await fs.promises.readFile(
-		path.join(__dirname, '../node_modules/bootstrap/dist/css/bootstrap.min.css'), 'utf8'
+	await fs.promises.copyFile(
+		path.join(__dirname, '../node_modules/bootstrap/dist/css/bootstrap.min.css'),
+		path.join(__dirname, '../public/bootstrap.min.css'),
 	);
-	await fs.promises.writeFile(path.join(__dirname, '../public/bootstrap.min.css'), src);
 }
 
 async function loadDefaults() {

public/language/en-GB/admin/admin.json

@@ -4,8 +4,6 @@
 
 	"acp-title": "%1 | NodeBB Admin Control Panel",
 	"settings-header-contents": "Contents",
-	"changes-saved": "Changes Saved",
-	"changes-saved-message": "Your changes to the NodeBB configuration have been saved.",
 	"changes-not-saved": "Changes Not Saved",
 	"changes-not-saved-message": "NodeBB encountered a problem saving your changes. (%1)"
 }

public/language/en-GB/admin/appearance/customise.json

@@ -1,7 +1,7 @@
 {
-	"custom-css": "Custom CSS/LESS",
-	"custom-css.description": "Enter your own CSS/LESS declarations here, which will be applied after all other styles.",
-	"custom-css.enable": "Enable Custom CSS/LESS",
+	"custom-css": "Custom CSS/SASS",
+	"custom-css.description": "Enter your own CSS/SASS declarations here, which will be applied after all other styles.",
+	"custom-css.enable": "Enable Custom CSS/SASS",
 
 	"custom-js": "Custom Javascript",
 	"custom-js.description": "Enter your own javascript here. It will be executed after the page is loaded completely.",

public/language/en-GB/admin/extend/widgets.json

@@ -8,9 +8,9 @@
 	"containers.none": "None",
 	"container.well": "Well",
 	"container.jumbotron": "Jumbotron",
-	"container.panel": "Panel",
-	"container.panel-header": "Panel Header",
-	"container.panel-body": "Panel Body",
+	"container.card": "Card",
+	"container.card-header": "Card Header",
+	"container.card-body": "Card Body",
 	"container.alert": "Alert",
 
 	"alert.confirm-delete": "Are you sure you wish to delete this widget?",

public/language/en-GB/admin/manage/groups.json

@@ -39,6 +39,5 @@
 	"revert": "Revert",
 
 	"edit.no-users-found": "No Users Found",
-	"edit.confirm-remove-user": "Are you sure you want to remove this user?",
-	"edit.save-success": "Changes saved!"
+	"edit.confirm-remove-user": "Are you sure you want to remove this user?"
 }

public/language/en-GB/admin/manage/privileges.json

@@ -49,7 +49,6 @@
 	"alert.confirm-moderate": "<strong>Are you sure you wish to grant the moderation privilege to this user group?</strong> This group is public, and any users can join at will.",
 	"alert.confirm-admins-mods": "<strong>Are you sure you wish to grant the &quot;Admins &amp; Mods&quot; privilege to this user/group?</strong> Users with this privilege are able to promote and demote other users into privileged positions, <em>including super administrator</em>",
 	"alert.confirm-save": "Please confirm your intention to save these privileges",
-	"alert.saved": "Privilege changes saved and applied",
 	"alert.confirm-discard": "Are you sure you wish to discard your privilege changes?",
 	"alert.discarded": "Privilege changes discarded",
 	"alert.confirm-copyToAll": "Are you sure you wish to apply this set of <strong>%1</strong> to <strong>all categories</strong>?",