Skip to content

how to hide "moved" badge with CSS?

Solved Customisation
12 2 4.0k 1
  • wrote on last edited by
    #1

    Hi , I am talking about the moved labels with arrows on the badge that is listed on topics list… how can I target them with CSS?

    Screenshot 2024-03-21 at 15.09.36.png

  • @phenomlab hi Mark, my question is for the “harmony theme”, I believe your code is for the “Persona” ? It is not working…

    wrote on last edited by phenomlab
    #4

    @crazycells no, it was for harmony if I recall correctly. I’ll need to check if not.

    EDIT - the below CSS will hide those types of badges from the topic list

    span.badge.border.border-gray-300.text-body {
        display: none;
    }
    

    The below will hide the same from the topic view

    a.badge.badge.border.border-gray-300.text-body.text-decoration-none {
        display: none;
    }
    

    It’s important to note that this will target other “action” badges also. If you’d like to target specific text whilst leaving other badges alone, this will likely require custom JS to do so. The CSS I provided above is active on Sudonix.

  • Hi , I am talking about the moved labels with arrows on the badge that is listed on topics list… how can I target them with CSS?

    Screenshot 2024-03-21 at 15.09.36.png

    wrote on last edited by
    #2
  • wrote on last edited by
    #3

    @phenomlab hi Mark, my question is for the “harmony theme”, I believe your code is for the “Persona” ? It is not working…

  • @phenomlab hi Mark, my question is for the “harmony theme”, I believe your code is for the “Persona” ? It is not working…

    wrote on last edited by phenomlab
    #4

    @crazycells no, it was for harmony if I recall correctly. I’ll need to check if not.

    EDIT - the below CSS will hide those types of badges from the topic list

    span.badge.border.border-gray-300.text-body {
        display: none;
    }
    

    The below will hide the same from the topic view

    a.badge.badge.border.border-gray-300.text-body.text-decoration-none {
        display: none;
    }
    

    It’s important to note that this will target other “action” badges also. If you’d like to target specific text whilst leaving other badges alone, this will likely require custom JS to do so. The CSS I provided above is active on Sudonix.

  • phenomlab phenomlab has marked this topic as solved on
  • @crazycells no, it was for harmony if I recall correctly. I’ll need to check if not.

    EDIT - the below CSS will hide those types of badges from the topic list

    span.badge.border.border-gray-300.text-body {
        display: none;
    }
    

    The below will hide the same from the topic view

    a.badge.badge.border.border-gray-300.text-body.text-decoration-none {
        display: none;
    }
    

    It’s important to note that this will target other “action” badges also. If you’d like to target specific text whilst leaving other badges alone, this will likely require custom JS to do so. The CSS I provided above is active on Sudonix.

    wrote on last edited by
    #5

    hi @phenomlab , this code is removing all badges includes “pinned”, can we specifically target the “moved” label?

  • hi @phenomlab , this code is removing all badges includes “pinned”, can we specifically target the “moved” label?

    wrote on last edited by
    #6

    @crazycells not with CSS as this is a shared class and would likely have an undesirable affect as I mentioned earlier in the previous post.

    It should be possible with some custom js which I could easily put together.

  • @crazycells not with CSS as this is a shared class and would likely have an undesirable affect as I mentioned earlier in the previous post.

    It should be possible with some custom js which I could easily put together.

    wrote on last edited by
    #7

    @phenomlab Thanks a lot Mark, let me ask first on nodebb community… I have some reasons but let’s see if I can convince them to add this 😄

  • @phenomlab Thanks a lot Mark, let me ask first on nodebb community… I have some reasons but let’s see if I can convince them to add this 😄

    wrote on last edited by
    #8

    @crazycells ok. No issues. Sharing classes like this was always going to cause issues.

  • @crazycells ok. No issues. Sharing classes like this was always going to cause issues.

    wrote on last edited by
    #9
  • wrote on last edited by
    #10

    @crazycells good, but I think it would have made sense to cover all of them.

  • @crazycells good, but I think it would have made sense to cover all of them.

    wrote on last edited by
    #11

    @phenomlab yeah but I believe they already have their own components…

    component=“topic/pinned” and component=“topic/locked” were already exist, just “moved” was missing…

  • @phenomlab yeah but I believe they already have their own components…

    component=“topic/pinned” and component=“topic/locked” were already exist, just “moved” was missing…

    wrote on last edited by
    #12

    @crazycells ah, I see. That makes sense.


Did this solution help you?
Did you find the suggested solution useful? Support 💗 Sudonix with a coffee ☕
If your organisation needs deeper expertise around infrastructure, security, or technology leadership, learn more about Phenomlab Ltd. Many of the deeper technical guides behind Sudonix are published there.

Related Topics
  • 4 Votes
    3 Posts
    2k Views
    crazycells
    thanks @DownPW ! this is definitely very helpful.
  • Spam spam spam

    Solved Configure nodebb
    6
    2 Votes
    6 Posts
    3k Views
    phenomlab
    @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.
  • Where are widgets stored?

    Solved Configure nodebb
    3
    1 Votes
    3 Posts
    1k Views
    Panda
    @phenomlab Thanks, have DMed you
  • Chevron up before & after

    Solved Configure nodebb
    11
    1
    4 Votes
    11 Posts
    3k Views
    cagatay
    @crazycells you are right thank you.
  • Post Style View

    Solved Customisation post style sudonix nodebb
    67
    2
    18 Votes
    67 Posts
    36k Views
    DownPW
    @cagatay Just add margin-left on the element like @phenomlab said to you : topic [component="post/parent"] { margin-left: 10px; } [image: aa08c62b-4223-4cba-8c0f-c73d50474c0d-image.png] Maybe @phenomlab have a better way
  • Blinking text Effect

    Customisation nodebb text effect css
    3
    5 Votes
    3 Posts
    2k Views
    DownPW
    @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
  • Bootstrap Version

    Solved Customisation nodebb bootstrap
    8
    5 Votes
    8 Posts
    3k Views
    Madchatthew
    @phenomlab That will be nice once they have completed that. It will be interesting to see how long that takes. So for now I will use custom css to make it look the way I want. Frameworks just make things a little faster. Thanks @phenomlab
  • Nodebb Hashtag plugin

    Solved General
    15
    1 Votes
    15 Posts
    6k Views
    phenomlab
    @jac Great ! I’ll close this off.