FKB Pro - Social theme

I’ve checked my update latest, but the category is still at left side.

@Don
Hi,
I’ve applied the ‘Custom embedded replies (theme-component)’ to the ‘FKB Pro - Social themed’. It’s not bad on the desktop, but on mobile, the right comment column layout is quite narrow, and the ‘Jump to post’ icon is also attached to the bottom. As a result, the space on the left appears quite wide. Do you have any plans to arrange the thread and user icon on the left column part as far to the left as possible, and adjust the layout to balance it so that the comments can be seen a bit wider?

@Don I’ve stumbled into another minor conflict between FKB Pro and Discourse Custom Wizard

2 Likes

Thanks @Drew-ART, I removed the outline overrides. :+1: After update theme it should work.

2 Likes

If i wanted to add custom CSS to the theme, would i be right in thinking that the ‘settings editor’ is replacing the edit html/css button?

So where @Don’s CSS finishes:

{
	"setting": "dark_btn_hover",
	"value": "rgba(var(--primary-rgb),.1)"
}
]

I’d just carry on below like with something like this

data-category-id='offers' [
  .discourse-kanban-list {
	 width: 50%;
     }
]

(one category only has two columns in its Kanban board and i want those to be wider, 50% of the space each)

Is it possible to use the Right Sidebar component with the “stock” FKB panel? so that the top section is FKB panel but below it is the rest of the Right Sidebar component?

Also, there is an issue when the sidebar is closed there is a gap to the right

image

Obviously this gap is needed when the sidebar is visible but not when it’s hidden.

Presumably the fix is this

.fkb-panel-hidden .list-container .full-width { 
	gap: 0;
}
1 Like

On the create account modal, I’m seeing the third-party login buttons improperly aligned. Only happening on mobile (and scaling text size to 75% snaps them back into alignment). I’m wondering if this is a FKB PRO error or not?

They look correct on my sign in modal, only the account creation one is messed up. Otherwise this theme has been BEAUTIFUL, thank you!

1 Like

Hello @Drew-ART, Sorry for the delay.

With settings editor you can do the same when you change a theme setting. So in this case you can change the colors. These settings are restricted. If you want to make bigger changes on buttons etc. You have to create a new component -and activate it to the theme- where you can place your code.

I am not too familiar with kanban CSS but I think the data-category-id is should be a number.

Looks something like this.

[data-category-id="your-category-id"] {
  .discourse-kanban-list {
    width: 50%;
  }
}

And you have to place this in a new component. Something like I show here: FKB Pro - Social theme - #88 by Don


Hello @Fma965, Yes, technically it’s possible. Now it works like when you use the right sidebar component then the default section is hidden but it possible to use the both together with some CSS I think.


Hello @thisisjoshjones, Thanks :slightly_smiling_face: Yeah I think, I have to update the theme CSS to suits the new core modal changes. I’ll fix this.

I did try experimenting with CSS but this didn’t seem possible, the div was empty from my testing.

@Fma965, I’ve added a new setting to show Right Sidebar Blocks below the FKB Panel.

Screenshot 2023-12-22 at 14.04.05


I’ve also updated the modal classes to suits to the new core changes.

@thisisjoshjones I think this issue will be fixes if you update your Discourse to the latest version. Since your Discourse last update was a month ago (Nov 18) and this modal issue was fixed since then (Nov 20).

Nice work, thanks

Something else i noticed is “After Header” html does not work
image

Dev Tools

The HTML is never added, it does show in the profiler but not the actual webpage source

Moving it to Header instead of After Header and it shows up, is this an issue with the theme or something else?

I’ve checked this now and works for me in After Header.

1 Like

Hmm, something else must be interfering with it on my instance then, not a big deal. thanks

EDIT: when the discourse-right-side-blocks theme component is enabled it doesn’t work.

Yeah, I see. I can repro it with Default theme too. It’s probably an issue with Right Sidebar Blocks theme component.

2 Likes

You were right thank you!

1 Like

Hello,

I have an issue: on the last version of Discourse 3.2.0.beta4-dev there is no link to edit the CSS/HTML in the theme panel…

Just wonder to know if this issue is only with my version of Discourse or if somebody that made a fresh install or update to this last Discourse version has the same problem?..

Hello @pzguillaume,

You can’t edit remote themes. This was introduced a while back.

4 Likes

To complete Ondrej’s answer, you can create a new theme component, attach it to your theme, and apply all your customizations here. :+1:

image

4 Likes

@ondrej : thank you. I’m new on Discourse and I didn’t know…

@Arkshine : thank you too! You help me very much! :clap: :blush:

2 Likes