Custom Header Links (icons)

I’ve upgraded this and see the following error message on the /admin/customize/themes page:

Error: Undefined variable: "$add-whitespace". on line 14 of common.scss >> @if $add_whitespace == "true" { ----^

Update: I ticked the new “whitespace” box and unticked it (saving each time) and the error has disappeared.

2 Likes

The report is not wrong, but the severity assessment is a bit off the mark. These links are not user-generated content. Only admins can add them via the admin dashboard. So, it’s safe to assume that you won’t be linking sites you don’t trust as an admin.

That said, I had a quick chat with David, and he suggested adding rel="noopener" to external links anyway. I’ve added that here. If a link is set to open in a new tab, it gets automatically added.

Regarding noreferrer,

I think it’s more beneficial not to add that since you might want to link your main site and get analytics about how many users get referred to the main site from your community.

Is this still the case? Can you share a screenshot of your component settings?

Yeah, I saw that when I updated as well, but it’s not related to the new changes. Somehow the new setting is not getting picked up by the compiler right away. So, you might need to tick that setting and untick it.

No worries though, the error has no impact on your site at all from my testing.

5 Likes

our site showed me today, that I should upgrade the theme component which I just did by clicking on the update button.
But now it does show the error:
Error: Undefined variable: "$add-whitespace". on line 14 of common.scss >> @if $add_whitespace == "true" { ----^

I had this and it resolved itself when I ticked and unticked the box: Custom header links (icons) - #129 by Jonathan5

2 Likes

Thanks for the report @GuidoD

We’re aware of this issue, but it shouldn’t have any impact on your site. It’s a compiler issue that we’re tracking internally.

Let me know if it causes any issues on your site - it shouldn’t.

2 Likes

true, I did not notice any further issue.
I am currently doing a discourse rebuild of the site and will check it again afterwards. If the error will still be there I will check Jonathans hint.

after the rebuild the error was gone :slight_smile:

Thanks for your great theme component that we do use already since two years.

2 Likes

Hi, I’m on Discourse 2.8.0.beta1 and when updating to the last version of this theme component, I have this error message:

Error: Undefined variable: "$add-whitespace". on line 14 of common.scss >> @if $add_whitespace == "true" { ----^
2 Likes

I have the same error as well. I’m on 2.7 stable.

I understand. Like I mentioned above. This won’t impact your site at all.

4 Likes

I can confirm that this works.

Tick this then untick it and reload the page

screenshot-vapingcommunity.co.uk-2021.06.07-13_48_21

Hi, thank you for this plugin.
I made some observation regarding the FA-Icons I would like to share:
The integration of far- Icons seems to work (regular), but fas- doesn’t (solid).

You may try this one:

fas-building
vs.
far-building

Any thoughts on this? There are few far- icons compared to fas- (let alone the design perspective) , so this is an issue…

I think you have to search the code to see which icons can be used, and what names to use for them (unless it’s been changed since the comment above).

Well the description of the theme-component suggests, that one may use every free FA5 icon - regardless of its class (brand, regular, solid).

Take a look of the code you refered to:

There is no if-clause for solid. So it should read:

when "solid"
  key = "fas-"

?

As far as I can tell, that claim has always been wrong.

Mkay - in this case, it should be fixed in the theme-component description?
But it actually does work on all far- icons, so my take ist the fas- were just “forgotten”.

1 Like

The limit of my knowledge is that it isn’t working as described, and how to find out which icons will work from looking at the code :slight_smile:

I think the variable names for the solid icons are generally implemented without prefix. Did you try just building?

Yes, of course. To no avail.
I guess just a small subset of fas- is shipped with discourse.

Works for me… there’s a subset included by default (you can see that under /styleguide/atoms/icons). Additional icons you have to first add, either under admin settings or in the component itself, like with this one:

Screenshot from 2021-06-24 12-58-44

2 Likes

I’ve got that to work too (using “building” in svg icons and in the theme component) – shows the solid version of the icon :+1: I may have to eat my words (I’m still nearly sure that some things didn’t work that should have…)

2 Likes