Skip to content

Want to use Sudonix themes ?

Chitchat
80 5 23.8k 1
  • hahahah 🙂 it was very easy for you but for me not same 🙂

    thank you Mark for all.

    but as i see there is a problem for image founding,

    8a7e2dc6-4afb-4f03-8a2c-7d5141816612-image.png

    @cagatay It’s not an issue. The reason as to why OGProxy uses it’s own image is because the provided URL does not present one. This is for a variety of reasons - often to do with security and image scraping. If you want to embed YouTube videos, you should consider using nodebb-plugin-ns-embed for this purpose.

  • Mark hi
    As you know i m using your theme and codes.
    My users want to biz size avatar, could we do it?

  • Mark hi
    As you know i m using your theme and codes.
    My users want to biz size avatar, could we do it?

    @cagatay can you elaborate? Not sure what you’re referring to.

  • size of avatar we can do it big one?

    image.png

  • size of avatar we can do it big one?

    image.png

    @cagatay yes, that should be fairly simple to do, but what size? There may also be an impact to adjacent elements so I’d need an idea of the size you are looking for.

  • twice what it is now

  • twice what it is now

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

  • could you do for mobile also?

  • could you do for mobile also?

    @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.

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

    image.png

    Also recent post and topics options i dont see my header

    image.png

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

    image.png

    Also recent post and topics options i dont see my header

    image.png

    @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);
    }
    
  • 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 :
    daed0cbc-7791-44eb-a1c1-28e4168051e4-image.png

    After upgrade :

    1d3ffc95-51eb-43f6-beef-df34161af0da-image.png

  • 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 :
    daed0cbc-7791-44eb-a1c1-28e4168051e4-image.png

    After upgrade :

    1d3ffc95-51eb-43f6-beef-df34161af0da-image.png

    @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 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.

    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

    96be1a13-ad61-4065-b02d-4ef2b4a85b0c-image.png

    keep for now this code

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

  • 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

    96be1a13-ad61-4065-b02d-4ef2b4a85b0c-image.png

    keep for now this code

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

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

  • 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;
    }
    
  • 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;
    }
    

    @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.

  • @phenomlab i have some problems with my below items when selected this type of tree;

    image.png

  • @phenomlab i have some problems with my below items when selected this type of tree;

    image.png

    @cagatay In your CSS, locate the block starting

    .category-card .text-muted.timeago
    

    And remove

    margin-left: -180px;
    
  • Mark hi,

    I know that you also update your own css and js along with nodebb’s updates but mine is old one when we first set it up.

    I would like to your help to use your current css and js codes if its possible?

    Thank you for your helping.


Related Topics
  • What’s going on with NodeBB?

    Performance nodebb script die
    20
    8 Votes
    20 Posts
    3k Views
    @cagatay The most reliable way to upgrade Node.js on Ubuntu depends on how you originally installed it. Method 1: Using NVM (Recommended) If you already use Node Version Manager (NVM), upgrading is simple. NVM allows you to keep both versions and switch between them if needed. Install Node 22: nvm install 22 Switch to Node 22: nvm use 22 Set it as your default: nvm alias default 22 Verify the change: node -v Method 2: Using NodeSource (PPA) If you installed Node.js via apt using the NodeSource repository, you need to update the repository script to point to the new version. Remove the old NodeSource list (optional but cleaner): sudo rm /etc/apt/sources.list.d/nodesource.list Download and run the NodeSource setup script for Node 22: curl -fsSL [https://deb.nodesource.com/setup_22.x](https://deb.nodesource.com/setup_22.x) | sudo -E bash - Install/Upgrade Node.js: sudo apt-get install -y nodejs Verify the installation: node -v Method 3: Using the ‘n’ Package If you have npm installed, you can use the n interactive manager. Clear the npm cache: sudo npm cache clean -f Install the ‘n’ helper: sudo npm install -g n Install Node 22: sudo n 22 Update your shell: hash -r Troubleshooting Permission Denied: If you see permission errors using Method 2 or 3, ensure you are using sudo. Path Issues: If node -v still shows version 20 after upgrading via NVM, restart your terminal or run source ~/.bashrc. Conflicts: Avoid mixing these methods. If you switch from apt to nvm, it is best to sudo apt remove nodejs first to avoid path conflicts.
  • Spam spam spam

    Solved Configure nodebb
    6
    2 Votes
    6 Posts
    2k Views
    @Panda said in Spam spam spam: ok, yes Ive seen the queue, it shows IP, but doesnt have a field for comments from registrant. It’s not designed for that. It merely serves as a gateway between posts appearing on your form or not. @Panda said in Spam spam spam: It would be better if nodebb had this plugin included in ACP list, as not only then do you know its approved and should work, but many people cant or dont want to use CLI on the server That’s a question for the NodeBB devs but in all honesty you can’t not use the CLI when installing nodebb so to be this isn’t a big deal.
  • Who uses Flarum?

    Chitchat flarum forum
    22
    7 Votes
    22 Posts
    6k Views
    @Madchatthew I use it here. It is faster, but not sure if that extends to build times.
  • Header Menu After Upgrading V3.1.1

    Solved Customisation header nodebb
    2
    1
    2 Votes
    2 Posts
    1k Views
    @cagatay this relates to a change the css classes used for the brand header meaning it will now float to the left instead of right. If you’d like to retain the original behavior, you can add this css class [data-widget-area="brand-header"] { justify-content: end; display: flex; } Further information here https://community.nodebb.org/topic/17090/manual-build-a-custom-header-in-harmony/19?_=1684069325296
  • NodeBB v3 Chat Very Slow

    Moved Performance nodebb v3 nodebb chat
    47
    11 Votes
    47 Posts
    17k Views
    @DownPW Seems fine.
  • Blinking text Effect

    Customisation nodebb text effect css
    3
    5 Votes
    3 Posts
    1k Views
    @phenomlab I love it too @phenomlab said in Blinking text Effect: Has that “broken neon light” look that you see in films. It’s exactly that, kind of old neon signs of bar or pubs a bit cyberpunk too
  • Theming support in Sudonix

    Moved Announcements themes
    41
    5
    61 Votes
    41 Posts
    18k Views
    @phenomlab said in Theming support in Sudonix: I thought I’d better come by here with an update so everyone knows that the Swatch project isn’t abandoned, or has simply “gone cold”. In fact, quite the opposite. I’ve setup a dev instance on my home network which I’m currently developing against. I’ll put some screenshots up soon, but the Swatch code is currently enjoying a rewrite. The great news is that you’ll get ten times the flexibility you have now meaning greater support for light themes, although the downside is that there isn’t that much backwards compatibility meaning some of my own themes even need to be completely redesigned. However, this isn’t the end of the world. Once you’re familiar with the classes, it really doesn’t take long at all to create your own themes. More to follow. I’ll be putting together a video of what the revamped theme will look like very soon - just got some small issues to iron out, and code cleanup beforehand…
  • [NODEBB] Help for my custom CSS

    Solved Customisation nodebb css bugfix
    257
    49 Votes
    257 Posts
    131k Views
    @cagatay sorry for late response. This looks too be one of the widgets, and I’m wondering if you have custom code that targets this. Had this recently happened after an upgrade or other changes?