Graceful Theme

I would like to start by saying thanks for such a great theme. and Special thanks for giving us the option to add a custom background image that was very important for us.

I am however running into a bit of a bump while trying to properly set up the header for the forums.

a- I am trying to increase the size of the logo top left corner.
b- I am trying to change the header color to match with the logo background as for some reason I am not sure how to get discourse to accept a .png image that will go along any header color. Without discourse changing it to a jpg and adding automatically adding the background.

The image below will show what I have now

I know there were a few mentions above about this and creating a custom component to override the CSS however I am not very familiar with CSS and I am not sure what lines to add where in my custom component I created.

any help with this will be greatly appreciated!

I’ve just made an update that should fix the recently mentioned color issues (mismatched background, dark mode), thanks for reporting the issues everyone!

1 Like

How do I edit the CSS for this theme?

[image]

1 Like

I am having issue with page width, which shows narrow from right side. attached screenshot for reference.

is anyone else having same issue with this theme and any idea how can we fix this?

1 Like

There is some issue with avatars - placing on top of names

2 Likes

We’re seeing this issue, as well.

3 Likes

Thanks for reporting! I’ve just made another update — take another look and let me know if there are any issues.

5 Likes

@awesomerobot thanks for the update, I think you may need to look mobile view, looks bit extra space on both side?

I’m not certain this is a theme change/issue, but recently when I updated Discourse and all my plugins, my front page with Topic List Thumbnails Theme Component installed went from being 3 columns to 2 columns:

If I use Chrome Inspector and slightly increase the width of the main container, it fixes it. So I’m guessing it may have to do with this recent commit which has some width changes in it:

For now I am addressing it by overriding the width in CSS with main-outlet, but I’m not sure if there are any unintended consequences, or if this is the best way to address it. So this is not necessarily to say that anything needs to be changed, but to mention it did affect layout on my site in this scenario, and to ask if there is any other approach I should be taking to get my desired result (3 column masonry layout). I’ve already fixed the issue so if that should take care of it long-term I’m happy to leave it. :slight_smile:

Is this going to support the new sidebar being integrated into Discourse?

2 Likes

Yes, we plan on updating all of our themes to support it.

2 Likes

Small bug report: the latest version of this theme seems to truncate the forum title when viewed on a small mobile device like an iPhone, as can be seen on https://forums.ankiweb.net/

1 Like

Full-screen chat appears to be semi-broken on the Graceful theme, with both the main window and chat window having a scrollbar. I haven’t been able to recreate this issue with other themes, so it appears to be specific to Graceful.

2 Likes

Why does this theme force the cards to be legacy-style? (the old style before the new Usercard Redesign Experiment) Otherwise, great theme.
Image:
image

1 Like

The updated usercards are an experimental theme component, and it looks like it just wasn’t added to all themes here on Meta… I added it to that one if you’re curious.

4 Likes

IPhone 11, Safari Browser, there are two Problems


1 Like

It is the same on Android. The other sign-in options’ texts are invisible, and the first column of the theme component table is distorted.

2 Likes

Hi,

I just discovered it on my forum as well, fixed it with custom styling:

.btn.btn-social {
    color: var(--d-sidebar-link-color);
}

This gives the same color as your sidebar links.
Hope this helps.

– Ivan

2 Likes

Thanks for the reports and the CSS workarounds! I’ve just updated the theme to address this: UX: fix social login button color, sidebar headings, transparent buttons by awesomerobot · Pull Request #28 · discourse/graceful · GitHub

3 Likes

Hello, I noticed that the Delete Topic button color isn’t prominent enough. Could you please fix it?
图片

1 Like