diff --git a/install/package.json b/install/package.json
index d22e487a20..1c383c8412 100644
--- a/install/package.json
+++ b/install/package.json
@@ -120,7 +120,7 @@
         "rss": "1.2.2",
         "rtlcss": "4.0.0",
         "sanitize-html": "2.7.1",
-        "sass": "1.54.3",
+        "sass": "1.54.9",
         "semver": "7.3.7",
         "serve-favicon": "2.5.0",
         "sharp": "0.30.7",
diff --git a/src/meta/css.js b/src/meta/css.js
index 35f197c3ad..7fc973a6d9 100644
--- a/src/meta/css.js
+++ b/src/meta/css.js
@@ -52,7 +52,7 @@ const buildImports = {
 			'@import "fontawesome";',
 			'@import "admin/admin";',
 			source,
-			'@import "jquery-ui.scss";',
+			'@import "jquery-ui";',
 			'@import "@adactive/bootstrap-tagsinput/src/bootstrap-tagsinput";',
 			'@import "../public/vendor/mdl/material";',
 		].join('\n');
@@ -218,10 +218,7 @@ CSS.buildBundle = async function (target, fork) {
 
 	const data = await getBundleMetadata(target);
 	const minify = process.env.NODE_ENV !== 'development';
-	const [ltr, rtl] = await Promise.all([
-		minifier.css.bundle(data.imports, data.paths, minify, fork, 'ltr'),
-		minifier.css.bundle(data.imports, data.paths, minify, fork, 'rtl'),
-	]);
+	const { ltr, rtl } = await minifier.css.bundle(data.imports, data.paths, minify, fork);
 
 	await Promise.all([
 		fs.promises.writeFile(path.join(__dirname, '../../build/public', `${target}.css`), ltr.code),
diff --git a/src/meta/minifier.js b/src/meta/minifier.js
index 4ad9a97377..d2fe14f475 100644
--- a/src/meta/minifier.js
+++ b/src/meta/minifier.js
@@ -231,29 +231,39 @@ actions.buildCSS = async function buildCSS(data) {
 		loadPaths: data.paths,
 	});
 
-	const postcssArgs = [autoprefixer];
-	if (data.direction === 'rtl') {
-		postcssArgs.push(rtlcss());
+	async function processScss(direction) {
+		const postcssArgs = [autoprefixer];
+		if (direction === 'rtl') {
+			postcssArgs.unshift(rtlcss());
+		}
+		if (data.minify) {
+			postcssArgs.push(clean({
+				processImportFrom: ['local'],
+			}));
+		}
+		return await postcss(postcssArgs).process(scssOutput.css.toString(), {
+			from: undefined,
+		});
 	}
-	if (data.minify) {
-		postcssArgs.push(clean({
-			processImportFrom: ['local'],
-		}));
-	}
-	const result = await postcss(postcssArgs).process(scssOutput.css.toString(), {
-		from: undefined,
-	});
-	return { code: result.css };
+
+	const [ltrresult, rtlresult] = await Promise.all([
+		processScss('ltr'),
+		processScss('rtl'),
+	]);
+
+	return {
+		ltr: { code: ltrresult.css },
+		rtl: { code: rtlresult.css },
+	};
 };
 
 Minifier.css = {};
-Minifier.css.bundle = async function (source, paths, minify, fork, direction) {
+Minifier.css.bundle = async function (source, paths, minify, fork) {
 	return await executeAction({
 		act: 'buildCSS',
 		source: source,
 		paths: paths,
 		minify: minify,
-		direction: direction,
 	}, fork);
 };
 
diff --git a/src/views/admin/extend/plugins.tpl b/src/views/admin/extend/plugins.tpl
index a4f1d399a1..98f93373b4 100644
--- a/src/views/admin/extend/plugins.tpl
+++ b/src/views/admin/extend/plugins.tpl
@@ -119,8 +119,8 @@
 		<div class="modal-dialog">
 			<div class="modal-content">
 				<div class="modal-header">
-					<button type="button" class="close" data-bs-dismiss="modal" aria-hidden="true">&times;</button>
 					<h4 class="modal-title">[[admin/extend/plugins:order-active]]</h4>
+					<button type="button" class="btn-close" data-bs-dismiss="modal" aria-hidden="true"></button>
 				</div>
 				<div class="modal-body">
 					<p>
@@ -132,7 +132,7 @@
 					<ul class="plugin-list"></ul>
 				</div>
 				<div class="modal-footer">
-					<button type="button" class="btn btn-default" data-bs-dismiss="modal">[[global:buttons.close]]</button>
+					<button type="button" class="btn btn-outline-secondary" data-bs-dismiss="modal">[[global:buttons.close]]</button>
 					<button type="button" class="btn btn-primary" id="save-plugin-order">[[global:save]]</button>
 				</div>
 			</div>
diff --git a/src/views/admin/manage/group.tpl b/src/views/admin/manage/group.tpl
index 4bb56d79ec..48f03306ff 100644
--- a/src/views/admin/manage/group.tpl
+++ b/src/views/admin/manage/group.tpl
@@ -126,7 +126,7 @@
 		</div>
 		<div class="col-md-3">
 			<div component="group-selector" class="btn-group">
-				<button type="button" class="btn btn-default dropdown-toggle w-100" data-bs-toggle="dropdown">
+				<button type="button" class="btn btn-outline-secondary dropdown-toggle w-100" data-bs-toggle="dropdown">
 					<span component="group-selector-selected">{group.displayName}</span> <span class="caret"></span>
 				</button>
 				<div component="group-selector-search" class="hidden position-absolute w-100">
diff --git a/src/views/admin/manage/groups.tpl b/src/views/admin/manage/groups.tpl
index 6d7f603f16..fc43cf762d 100644
--- a/src/views/admin/manage/groups.tpl
+++ b/src/views/admin/manage/groups.tpl
@@ -65,8 +65,8 @@
 		<div class="modal-dialog">
 			<div class="modal-content">
 				<div class="modal-header">
-					<button type="button" class="close" data-bs-dismiss="modal" aria-hidden="true">&times;</button>
 					<h4 class="modal-title">[[admin/manage/groups:create]]</h4>
+					<button type="button" class="btn-close" data-bs-dismiss="modal" aria-hidden="true"></button>
 				</div>
 				<div class="modal-body">
 					<div class="alert alert-danger hide" id="create-modal-error"></div>
@@ -95,7 +95,7 @@
 					</form>
 				</div>
 				<div class="modal-footer">
-					<button type="button" class="btn btn-default" data-bs-dismiss="modal">
+					<button type="button" class="btn btn-outline-secondary" data-bs-dismiss="modal">
 						[[global:close]]
 					</button>
 					<button type="button" class="btn btn-primary" id="create-modal-go">
diff --git a/src/views/admin/manage/tags.tpl b/src/views/admin/manage/tags.tpl
index 249e307e45..f021d8601f 100644
--- a/src/views/admin/manage/tags.tpl
+++ b/src/views/admin/manage/tags.tpl
@@ -58,8 +58,8 @@
 		<div class="modal-dialog">
 			<div class="modal-content">
 				<div class="modal-header">
-					<button type="button" class="close" data-bs-dismiss="modal" aria-hidden="true">&times;</button>
 					<h4 class="modal-title">[[admin/manage/tags:create]]</h4>
+					<button type="button" class="btn-close" data-bs-dismiss="modal" aria-hidden="true"></button>
 				</div>
 				<div class="modal-body">
 					<form>
diff --git a/src/views/admin/partials/installed_plugin_item.tpl b/src/views/admin/partials/installed_plugin_item.tpl
index 5f0d4ef103..bb40d8a969 100644
--- a/src/views/admin/partials/installed_plugin_item.tpl
+++ b/src/views/admin/partials/installed_plugin_item.tpl
@@ -48,7 +48,7 @@
 					<!-- IF ../error -->
 					<li data-plugin-id="{../id}" class="clearfix">
 						<div class="float-end">
-							<button class="btn btn-default disabled"><i class="fa fa-exclamation-triangle"></i> [[admin/extend/plugins:plugin-item.unknown]]</button>
+							<button class="btn btn-outline-secondary disabled"><i class="fa fa-exclamation-triangle"></i> [[admin/extend/plugins:plugin-item.unknown]]</button>
 							<button data-action="toggleInstall" data-installed="1" class="btn btn-danger"><i class="fa fa-trash-o"></i> [[admin/extend/plugins:plugin-item.uninstall]]</button>
 						</div>
 
diff --git a/src/views/modals/crop_picture.tpl b/src/views/modals/crop_picture.tpl
index 89c946f3a9..baa3051d48 100644
--- a/src/views/modals/crop_picture.tpl
+++ b/src/views/modals/crop_picture.tpl
@@ -2,8 +2,8 @@
 	<div class="modal-dialog">
 		<div class="modal-content">
 			<div class="modal-header">
-				<button type="button" class="close" data-bs-dismiss="modal" aria-hidden="true">×</button>
 				<h3 id="crop-picture">[[user:crop_picture]]</h3>
+				<button type="button" class="btn-close" data-bs-dismiss="modal" aria-hidden="true"></button>
 			</div>
 			<div class="modal-body">
 				<div id="upload-progress-box" class="progress hide">
@@ -30,7 +30,7 @@
 				</div>
 			</div>
 			<div class="modal-footer">
-				<button class="btn btn-default" data-bs-dismiss="modal" aria-hidden="true">Close</button>
+				<button class="btn btn-outline-secondary" data-bs-dismiss="modal" aria-hidden="true">Close</button>
 				<button class="btn btn-primary upload-btn <!-- IF !allowSkippingCrop -->hidden<!-- ENDIF !allowSkippingCrop -->">[[user:upload_picture]]</button>
 				<button class="btn btn-primary crop-btn">[[user:upload_cropped_picture]]</button>
 			</div>
diff --git a/test/build.js b/test/build.js
index f2f59cd778..29bfe0017b 100644
--- a/test/build.js
+++ b/test/build.js
@@ -110,7 +110,7 @@ describe('minifier', () => {
 	it('.css.bundle() should concat styles', (done) => {
 		minifier.css.bundle(styles, paths, false, false, 'ltr', (err, bundle) => {
 			assert.ifError(err);
-			assert.strictEqual(bundle.code, '.help {\n  margin: 10px;\n}\n\n.yellow {\n  background: yellow;\n}\n\n.help {\n  display: block;\n}\n.help .blue {\n  background: blue;\n}');
+			assert.strictEqual(bundle.ltr.code, '.help {\n  margin: 10px;\n}\n\n.yellow {\n  background: yellow;\n}\n\n.help {\n  display: block;\n}\n.help .blue {\n  background: blue;\n}');
 			done();
 		});
 	});
@@ -118,7 +118,7 @@ describe('minifier', () => {
 	it('.css.bundle() should minify styles', (done) => {
 		minifier.css.bundle(styles, paths, true, false, 'ltr', (err, bundle) => {
 			assert.ifError(err);
-			assert.strictEqual(bundle.code, '.help{margin:10px}.yellow{background:#ff0}.help{display:block}.help .blue{background:#00f}');
+			assert.strictEqual(bundle.ltr.code, '.help{margin:10px}.yellow{background:#ff0}.help{display:block}.help .blue{background:#00f}');
 			done();
 		});
 	});