Oh, and as I discussed with @duffy — the two sites have different focuses. Ask Fedora is focused on end users and user support, whereas Discussion is primarily for project conversations.

For Discussion.... a start at the front page with source.

Thank you for looking into this task.

Just additional note:

Discourse allows its users to choose themes from the predefined set.

Thus, one of the questions we had with respect to themes is whether it is possible to do a set of themes which would be tailored for different user audiences. Ideally, they would have some common pattern, some sort of style, but different approach. For example: light style, dark style and very minimalist "scientific paper/text-only/gray-scale" style (It might be me, but I feel a bit overwhelmed by those color-coded categories, and avatars on the front page)

While as mattdm said the default theme shouldn't probably stretch too far from the generic Discourse layout, it could be interesting to see something more special and "brave" provided as option for more experienced/curious users.

I've started a very basic theme, mainly just to get familiar with how to create themes for Discourse.

I wasn't sure where to upload it so that others could contribute so for now I've added it to my personal GitHub.

Hoping to spend some more time over the weekend on this

Getting there with the design.
Couple of questions around the banner @duffy:
Is it only supposed to show on the homepage?
Should it be on desktop only or visible for all sizes?

@bcourt WOW!!! That's amazing! Awesome work! Yeh we were thinking the panda banner thing would just be on the front page. It should be dismissable too if possible?

I think we can do that. The banner message is actually a special forum post marked as a banner, and I think an image can be included. This is presumably for Ask, right? The contributor-focused page doesn't have a big banner at all right now, just a one-liner.

I've been added to the theme creator group on discourse so can now share a preview link so that you can take a proper look https://theme-creator.discourse.org/theme/bcourt/fedora

It looks like there are (at least) two ways to add the welcome banner. It could be done as a post marked as a banner which has the dismiss functionality but it looks like that will be output inside the container so not full width.
The other way (which I've done in the theme) is to create a plugin which allows you to output it anywhere and pick which pages it's shown on (currently I've set it to the home and list pages).
I can add in a button to dismiss it and set a cookie so the preference is remembered.

On Mon, Nov 30, 2020 at 10:24:33PM +0000, Ben Court wrote:

It looks like there are (at least) two ways to add the welcome banner. It could be done as a post marked as a banner which has the dismiss functionality but it looks like that will be output inside the container so not full width.
The other way (which I've done in the theme) is to create a plugin which allows you to output it anywhere and pick which pages it's shown on (currently I've set it to the home and list pages).
I can add in a button to dismiss it and set a cookie so the preference is remembered.

If we do it this way, it seems like the "start here" button should set that
cookie.... it just highlights the Start Here category, so people can find
it, so clicking that and being done with the banner seem like they're one
and the same.

--
Matthew Miller mattdm@mattdm.org http://mattdm.org/
Fedora Project Leader mattdm@fedoraproject.org http://fedoraproject.org/

If we do it this way, it seems like the "start here" button should set that
cookie.... it just highlights the Start Here category, so people can find
it, so clicking that and being done with the banner seem like they're one
and the same.

I would still have an explicit "X" in the corner to dismiss... for folks not interested in clicking "Start Here" because they're already active users, I think an explicit X is a good idea.

I would still have an explicit "X" in the corner to dismiss... for folks not interested in clicking "Start Here" because they're already active users, I think an explicit X is a good idea.

That makes sense. An X is unobtrusive and easy, too.

Updated the banner so that clicking either the "start here" link or the new "X" button will dismiss it and set a cookie so it isn't displayed again

@bcourt I can't see the banner on mobile - is that by design?

@duffy it's on the todo list :smile: I need to move the banner plugin code in to the correct folder so it's output for both (the guide I was following was for a desktop only plugin) and then look at the styling as not sure how small the image is going to be if keeping the aspect ratio

Your screenshot has highlighted the other mobile issue, the code of conduct link doesn't fit in the header.
The two options I thought of are either adding it in to the hamburger menu on mobile, or it could be added to the welcome banner as a second button on mobile?

If I keep the aspect ratio of the image then the rays are suddenly cut off, the second screenshot is setting the background-size to cover which looks a bit empty on the right (ignore the spacing between the button and image, this was just quickly testing)

Apart from the mobile banner issue (see screenshots above) I think it's pretty much there.

Here's the preview link again, https://theme-creator.discourse.org/theme/bcourt/fedora
Let me know if you spot any issues

A simple solution for the banner on mobile would be to remove the rays from the image, what do you think @duffy?

@bcourt Hey sorry I fell off the radar on this with the holidays, etc. I agree removing the rays would be a good mobile solution. Are you happy with the theme as-is? Is it time to shipit? :)

This is the design for Ask, right?

We don't have a "start here" landing spot on Discussion, although we could create one. I think it'd be nice to have a different banner image, and while they should be similar, it'd also be nice for them to have a little bit of distinction so you can remember which one you're on.

Also, some of the key folks at Ask are experimenting with adding a search box with some explanatory text to a more prominent location (currently like this):

... although that's gotten some pushback on being too intrusive for regular users. I have no idea how that fits in. :)

Oh, also: typefaces! Are those part of the theme? Discourse has a "base font" and "heading font" which can be set separately -- I think the theme overrides but I'm not sure.

@bcourt Hey sorry I fell off the radar on this with the holidays, etc. I agree removing the rays would be a good mobile solution. Are you happy with the theme as-is? Is it time to shipit? :)

No problem, hope you had nice holidays :)
I've just updated the mobile banner to remove the rays, looks much better.
The only piece missing is the logo, but I guess you upload that via the discourse admin? Other than that I'd say it's time to shipit!

Oh, also: typefaces! Are those part of the theme? Discourse has a "base font" and "heading font" which can be set separately -- I think the theme overrides but I'm not sure.

I'm currently including Montserrat and Open Sans from google fonts for use in the theme.

@bcourt Sorry, I missed your "shippit" there in the post-holiday catchup. Thanks so much for doing this. Yes, the logo is uploaded separately.

I guess two questions remain:

1. How do we officially ship it?
2. I'm actually a little unclear still on whether this design was meant to go on Ask (user focused, multi-lingual, currently has the big multi-lingual banner problem) or Discuss (contributor-focused, English, only has a minimal banner right now pointing user support to Ask). Help me know what you had in mind!

2, part b: I think we can use the same basic theme on both, but I would expect the banner to be different, and I think it would be nice to have some slight visual cues that they're different too. If this design is clearly meant for one or the other, should I open a new ticket for the other one? (Or two new tickets, for differentiating the basic theme here on the two specific sites?)

(I'm going to file separate tickets for logos in a little bit.)

How do we officially ship it?

https://meta.discourse.org/t/how-do-i-install-a-theme-or-theme-component/63682
Looks like you can download the folder locally and then upload from there or install straight from a git repo.

It's currently uploaded to my personal github, would you like it moved to pagure or a fedora github/gitlab etc? It would make it easier for others to contribute to any bugfixes/changes in future.

I'm actually a little unclear still on whether this design was meant to go on Ask (user focused, multi-lingual, currently has the big multi-lingual banner problem) or Discuss (contributor-focused, English, only has a minimal banner right now pointing user support to Ask). Help me know what you had in mind!

I think it's for Discuss, is that right @duffy?

Yeah, let's move it to a Pagure repo (possibly one owned by the design team collectively?)

Is that something I'm able to do? I'm not familiar with pagure, I can see options to create a new project or group but not repo.

Otherwise the repo is here https://github.com/thebencourt/fedora-discourse-theme so someone else could move it

Hello. I'm a sophomore at IIT Roorkee, India, and a self-taught product designer. I'm a newcomer to open-source and am interested to work with Fedora Design Team. I was following this issue. Is it completed or is their any way I can still contribute to it?

@yavnikaa There's still some more to do. Someone needs to figure out how to get this into a Design team pagure repo, and we also need something for Ask Fedora.

I am not particularly familiar with pagure, sorry!
For Ask Fedora, I understand that you need a different banner, but not too intrusive. Then, the position of search needs to be worked out and we need to solve the multilingual banner issue, right? Can we open a separate ticket to continue the discussion there?
I have cloned the github repo from @bcourt and would share my ideas and work soon :)

Hello. I am sorry for the delay, wasn't well. Sharing my progress here!

This is how i'm planning for the banner to look. Kept it similar to Discussions yet distinctive. It's taking me some time to figure out discourse but you can preview my theme https://theme-creator.discourse.org/u/yavnikaa/themes/4492 here.

For the search position, shall we put it in the centre, but then for the rest of the pages it needs to be on the header only, and that might look inconsistent. Your views?

I'll post on the site itself to see what people think!

I think probably we want the language names in the respective language, right?

One concern I have is needing to update the graphic if we add languages.

I think probably we want the language names in the respective language, right?

One concern I have is needing to update the graphic if we add languages.

Yes, we could surely put the languages name in their own language only. What are you saying about the graphic? Was unable to understand, sorry.

If the languages are actually part of the graphic rather than added by code (which I'm not sure we can easily do), if we add German or Czech or something we would have to update the graphic.

Oh, right! I am trying to implement it via code on Discourse, or else we'll have to look up for an alternative, I guess :))

Hello. I am sorry for the delay, wasn't well. Sharing my progress here!

This is how i'm planning for the banner to look. Kept it similar to Discussions yet distinctive. It's taking me some time to figure out discourse but you can preview my theme https://theme-creator.discourse.org/u/yavnikaa/themes/4492 here.

For the search position, shall we put it in the centre, but then for the rest of the pages it needs to be on the header only, and that might look inconsistent. Your views?

Hi! I am from @mattdm's post on Discourse. We cannot preview the theme as we receive an "access denied" error:

Hello. I am sorry for the delay, wasn't well. Sharing my progress here!

This is how i'm planning for the banner to look. Kept it similar to Discussions yet distinctive. It's taking me some time to figure out discourse but you can preview my theme https://theme-creator.discourse.org/u/yavnikaa/themes/4492 here.

For the search position, shall we put it in the centre, but then for the rest of the pages it needs to be on the header only, and that might look inconsistent. Your views?

Hi! I am from @mattdm's post on Discourse. We cannot preview the theme as we receive an "access denied" error:

I'm no sure as to why this is happening. I'll check it at my end and get back to you. Maybe, try logging in and see if you are able to view the theme?

Still not working, even when logged into discourse meta.

I'm sorry, I'll look into it and get back to you!

No worries!

@yavnikaa Thanks for your work! I am having a similar access denied issue, but I can give you feedback from a graphic design / text perspective:

• I like that you've taken translations into account!

• The new panda is very cute :)

• Is this meant for Ask Fedora (ask.fedoraproject.org) or Fedora Discussions (discussions.fedoraproject.org)? I think the messaging would be different depending. (If it's for ask, maybe we need a different ticket?)

• "Clear your doubts" makes sense, but is maybe a little awkward / not common phrasing. I think a different label would be better. Where does the button bring you?

• I totally drew up the mountain / sunburst composition as a filler because I hadn't thought too deeply about what kind of symbolism / narrative / idea we wanted for the graphic on the banner and I did it on a live video session! I think we might want to rethink the artwork, what do you think? I'd suggest something different based on whether or not this is for ask or discuss, so first let's nail that down, then maybe we could brainstorm on the best picture/theme for this?

Yeah definitely. We can rework on the graphic theme and banner for the two websites accordingly. I was making this for ask fedora. Yes, the button text can be simplified and will redirect the user to the page where they can post their question.

To start off, and avoid confusion, shall I open two tickets, for the banners of ask and discussions respectively (just like their logo tickets) ?

Yep let's do that, I'll go ahead and make them and have this ticket depend on them.

https://pagure.io/design/issue/733
https://pagure.io/design/issue/734

Just wondering what the status on this is?
Apart from uploading it to a design/websites pagure repo is it ready to go or are the banners being reworked first?

Just wondering what the status on this is?
Apart from uploading it to a design/websites pagure repo is it ready to go or are the banners being reworked first?

Hi @bcourt :))
The banners are being worked upon. We are almost ready with the discuss.fpo's banner. I'll post my draft for ask.fpo as well soon.
Once the banners are done and approved, it won't take more than a week to complete the custom theme from my end.