Want to use Sudonix themes ?

[cagatay]

twice what it is now

[phenomlab]

@cagatay that’s probably on for desktop, but might look out of place when viewed on a mobile device.

[cagatay]

could you do for mobile also?

[phenomlab]

@cagatay yes, but I’d reiterate the concerns I’ve raised above in the sense that it may impact the flow of other elements.

Essentially, this is fm going to be a relatively simple CSS change.

[cagatay]

Mark hi,
after upgrading 3.9 i have some problems with my web site.
Pls see below photos of my problems;

Also recent post and topics options i dont see my header

[phenomlab]

@cagatay This will be because of the below changes

https://community.nodebb.org/topic/18292/nodebb-3.9.0

It’s related to the brand header section here

<button type="button" class="btn-ghost-sm d-flex gap-2 dropdown-toggle" data-bs-toggle="dropdown"

It needs to be changed to

<button type="button" class="btn btn-ghost btn-sm d-flex gap-2 dropdown-toggle" data-bs-toggle="dropdown"

I’ve made this change on your site, but you’ll also need some additional CSS. This ought to do it, and it’s been also applied to your forum.

.btn-ghost {
    --bs-btn-hover-border-color: var(--bs-body-navbar-active);
    --bs-btn-active-bg: var(--bs-body-navbar-active);
}

[DownPW]

Of course, I am the same problem I have change the css class button on widget brand Header

except that I had an offset present on the brand header.

I did the same manipulations but I cannot remove this shift that we see on the screen.

Any idea how to remove this @phenomlab ?

Before :

After upgrade :

[phenomlab]

@DownPW Is this on your live site, or development? I cannot see any issue?

EDIT - I see it on your DEV site. Not sure where the additional padding is coming from to be honest, but one quick “fix” would be to target this CSS

[type=button]:not(:disabled), [type=reset]:not(:disabled), [type=submit]:not(:disabled), button:not(:disabled)

And use this

[type=button]:not(:disabled), [type=reset]:not(:disabled), [type=submit]:not(:disabled), button:not(:disabled) {
    cursor: pointer;
    margin-top: 0.5rem;
    margin-bottom: 0.5rem;
}

I think you may have added

button.btn.btn-ghost.btn-sm.d-flex.gap-2 {
    padding-top: 0.8rem;
}

Although this isn’t very elegant as padding will in fact make the button much larger.

[DownPW]

yep in dev, always for test before upgrade prod

@phenomlab said in Want to use Sudonix themes ?:

I think you may have added

button.btn.btn-ghost.btn-sm.d-flex.gap-2 {
padding-top: 0.8rem;
}

Yep you’re right my friends.

But your method seems better :

[type=button]:not(:disabled), [type=reset]:not(:disabled), [type=submit]:not(:disabled), button:not(:disabled) {
    cursor: pointer;
    margin-top: 0.5rem;
    margin-bottom: 0.5rem;
}

Thanks

EDIT : ha noooo your code broke the “Answer” Button

keep for now this code

button.btn.btn-ghost.btn-sm.d-flex.gap-2 {
padding-top: 0.8rem;
}

[phenomlab]

@DownPW that’s because it’s targeting the button type. Just change the post button class.

[DownPW]

hmm sorry don’t understand

Edit :

like this maybe ?

.btn.btn-ghost.btn-sm:not(:disabled) {
    cursor: pointer;
    margin-top: 0.5rem;
    margin-bottom: 0.5rem;
}

[phenomlab]

@DownPW Yes, that will work fine. What I meant was that the original CSS I provided targets [type=button] so would impact all others on the page in addition to the intended target.