Hamburger Theme Selector

[sam (Sam Saffron)]

Are you on latest, are the themes user selectable?

[Yegor]

There is a checkbox saying “Theme can be selected by users”. So I assume yes.

Thanks for the quick answer.

[Yegor]

so any thoughts, Sam?

[featheredtoast (Jeff Wong)]

Can you confirm that you have done this?

After you import the Hamburger Theme Selector you need to add the Hamburger Theme Selector as a Theme Component.

The way I understand it is you’re going to need the hamburger theme selector added as a Theme Component for all of your other existing themes for it to appear. Add the hamburger theme to all of the others via the Theme includes other child themes option.

[BlackKnob]

this is such a useful extension. Please consider including this as a part of Discourse’ core.

[erlend_sh (Erlend Sogge Heggen)]

Related:

Better theme settings on user front-end

Continuing the discussion from We need a "large fonts" and "small fonts" theme to ship with Discourse: Our themes now support dark/light/{any-color-scheme} toggles as well as variable font sizes But user interface for changing these settings is currently very basic: [11] We should have something closer to this (from GitBook): [53] I don’t have access to my usual image editor so here’s a cruder mockup than usual: [untitled1]

[merefield (Robert)]

Just an FYI for everyone … recent 2.1 Beta update broke the existing Hamburger Theme Selector installations. It simply took an update of the HTS to fix this from within its Theme component admin. (so seems someone knew about this, aha! (@Sam would have been good to have a heads up, sorry if I missed it) ) (there seems however to be a new issue with Themes admin, see my ‘bug’ report)

[alexs (Alex Sherwood)]

Just a minor suggestion - it might be worth adding a ‘Themes’ header to that section of the menu to help users figure out what those are. Where I’ve added the red box -

[piratdavid]

The theme-selector seems to be broken in v2.2.0.beta4 +266.

TypeError: e.reject is not a function
    at Object.a [as setLocalTheme] (_application-0886f4c5dbc868ca081df73f2ba68777febbad4e17b4e00dc8cb7aa447d11a4d.js:21312)
    at 0c56ef81d321af57aa11e5f7762b891635ccf8ce.js?__ws=www.elektronauts.com:16
    at A (_ember_jquery-07f49b58317ea9292d939348ec0091eb50a9d8aaabd9e86cc074ef5f049918aa.js:57655)
    at S (_ember_jquery-07f49b58317ea9292d939348ec0091eb50a9d8aaabd9e86cc074ef5f049918aa.js:57670)
    at C (_ember_jquery-07f49b58317ea9292d939348ec0091eb50a9d8aaabd9e86cc074ef5f049918aa.js:57638)
    at invokeWithOnError (_ember_jquery-07f49b58317ea9292d939348ec0091eb50a9d8aaabd9e86cc074ef5f049918aa.js:12552)
    at a.flush (_ember_jquery-07f49b58317ea9292d939348ec0091eb50a9d8aaabd9e86cc074ef5f049918aa.js:12613)
    at u.flush (_ember_jquery-07f49b58317ea9292d939348ec0091eb50a9d8aaabd9e86cc074ef5f049918aa.js:12737)
    at p.end (_ember_jquery-07f49b58317ea9292d939348ec0091eb50a9d8aaabd9e86cc074ef5f049918aa.js:12807)
    at p.run (_ember_jquery-07f49b58317ea9292d939348ec0091eb50a9d8aaabd9e86cc074ef5f049918aa.js:12921)

happens in

themeSelector.setLocalTheme(key, r.user.user_option.theme_key_seq);

Any ideas?

/David

[david (David Taylor)]

It works ok for me - I’m using it right now on this site!

Can you reproduce the problem here? If so, what browser are you using?

[merefield (Robert)]

Guys, this seems broken at the moment?

I updated to latest of both theme component and main build (tests passed) but getting a javascript error:

Uncaught TypeError: Cannot read property 'immediate_reload' of undefined

At the same time there seems to have been introduced some slick new code for switching Themes on meta that avoids a page refresh.

Is this because the release of this change is out of sync (for some branches) with the update to the Hamburger Theme Selector?

Any idea when the change on meta will be promoted to tests-passed?

[david (David Taylor)]

Meta is running tests-passed (well tests-passed, with a little Ember 3.7 magic on top, but that shouldn’t affect this).

Do you see the “immediate reload” setting in the admin panel, at the bottom of the options for this theme component? It should look like this:

[merefield (Robert)]

Thanks for comfirmation. I see now this feature is already there.

Yes, it is there and checked.

If I uncheck it, the javascript error goes away (and the theme instantly updates without a page reload).

[david (David Taylor)]

Any chance you can share the link for the site? I enabled the setting on Meta, and it still seems to be working ok

[merefield (Robert)]

Thanks for your interest, David, PM’d.

btw, love this new feature!

[david (David Taylor)]

It looks like toggling the setting off/on has fixed the problem. There must be a caching issue somewhere, which I’ll try and track down.

[david (David Taylor)]

@david

There must be a caching issue somewhere

For reference, this was fixed today by @Osama

cc @merefield

Lots of errors on site if theme component introduces settings

Fixed in: https://github.com/discourse/discourse/pull/7131

[Hanzo1 (Hanzo)]

in the hamburger menu

Is it possible to have an actual switch, built with CSS and embedded into the top bar, to switch themes from [A] to [B]?

https://www.w3schools.com/howto/howto_css_switch.asp

Like this. If so, what would be the command required, as it isn’t just a simple link? Perhaps it could utilize the Hamburger Theme Selector in some way?

[dax (Daniela)]

Did you already see Alien Night Theme - A free Dark Theme for Discourse ?

[Hanzo1 (Hanzo)]

PERFECT, thanks Daniela.