A Graceful theme for Discourse

How do I edit the CSS for this theme?

[image]

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

1 Like

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

2 Likes