[nodebb-theme-peace] Peace Theme for NodeBB

[baris]

Peace is a simple theme with a sidebar navigation, it comes with a builtin bootswatch theme switcher.

More info and source https://github.com/barisusakli/nodebb-theme-peace

Screenshots

Categories

Category

Topic

Skin Switcher & Sidebar

[HolyPhoenix]

Wow, I modified persona to set all of that info to fixed at the top of the post. This is better. Definitely like this.

[baris]

I rebuilt this theme for the upcoming NodeBB 3.0 release with BS5 support.
Updated main topic with new images and info. @julian already posted about it in our blog. https://nodebb.org/blog/bringing-back-better-bootswatch/

[cagatay]

thank you @baris

[Teemberland]

I need that skin switcher for Slick. I only need a default and dark.

[baris]

The skin switcher is fairly simple, the markup is in https://github.com/barisusakli/nodebb-theme-peace/blob/master/templates/partials/skin-switcher.tpl.

And the js code that handles the changing of themes is

$('[component="skinSwitcher"]').on('click', '.dropdown-item', function () {
	const skin = $(this).attr('data-value');
	$('[component="skinSwitcher"] .dropdown-item .fa-check').addClass('invisible');
	$(this).find('.fa-check').removeClass('invisible');
	require(['forum/account/settings', 'hooks'], function (accountSettings, hooks) {
		hooks.one('action:skin.change', function (hookData) {
			$('[component="skinSpinner"]').addClass('invisible');
		});
		$('[component="skinSpinner"]').removeClass('invisible');
		accountSettings.changeSkin(skin);
	});
});

[Teemberland]

@baris said in [nodebb-theme-peace] Peace Theme for NodeBB:

The skin switcher is fairly simple, the markup is in https://github.com/barisusakli/nodebb-theme-peace/blob/master/templates/partials/skin-switcher.tpl.

And the js code that handles the changing of themes is

$('[component="skinSwitcher"]').on('click', '.dropdown-item', function () {
	const skin = $(this).attr('data-value');
	$('[component="skinSwitcher"] .dropdown-item .fa-check').addClass('invisible');
	$(this).find('.fa-check').removeClass('invisible');
	require(['forum/account/settings', 'hooks'], function (accountSettings, hooks) {
		hooks.one('action:skin.change', function (hookData) {
			$('[component="skinSpinner"]').addClass('invisible');
		});
		$('[component="skinSpinner"]').removeClass('invisible');
		accountSettings.changeSkin(skin);
	});
});

@baris this theme is compatible with v2 right? I tried adding the skin switcher to Slick, but the moment I add the filterMiddlewareRenderHeader to hooks, I get an internal server error. Any ideas why?

[phenomlab]

@Teemberland no, it's for v3 only

[nodebb-theme-peace] Peace Theme for NodeBB

I rebuilt this theme for the upcoming NodeBB 3.0 release with BS5 support. Updated main topic with new images and info. @julian already posted about it in ou...

NodeBB Community (community.nodebb.org)