• Home
  • Categories
  • Recent
  • Popular
  • Top
  • Tags
  • Users
  • Groups
  • Documentation
    • Home
    • Read API
    • Write API
    • Plugin Development
Skins
  • Light
  • Cerulean
  • Cosmo
  • Flatly
  • Journal
  • Litera
  • Lumen
  • Lux
  • Materia
  • Minty
  • Morph
  • Pulse
  • Sandstone
  • Simplex
  • Sketchy
  • Spacelab
  • United
  • Yeti
  • Zephyr
  • Dark
  • Cyborg
  • Darkly
  • Quartz
  • Slate
  • Solar
  • Superhero
  • Vapor

  • Default (No Skin)
  • No Skin
Collapse
v3.5.2 Latest
Buy Hosting

Boxes around each category

Scheduled Pinned Locked Moved General Discussion
8 Posts 4 Posters 761 Views
    • Oldest to Newest
    • Newest to Oldest
    • Most Votes
Reply
  • Reply as topic
Log in to reply
This topic has been deleted. Only users with topic management privileges can see it.
  • S Offline
    S Offline
    signal15
    wrote on last edited by
    #1

    Does anyone know what CSS would need to be modified and how to get boxes around each top level category on the main page? Similar to the Cabane Libre theme.

    1 Reply Last reply
    0
  • PitaJP Offline
    PitaJP Offline
    PitaJ Global Moderator Plugin & Theme Dev
    wrote on last edited by
    #2

    Can you provide a screenshot or something showing what you want?

    1 Reply Last reply
    0
  • The WormsT Offline
    The WormsT Offline
    The Worms GNU/Linux
    wrote on last edited by
    #3

    I'm use persona theme and modify theme.less

    Add this line :

    .category-item,.row li {margin-bottom:6px;margin-left:2px;margin-right:2px;background-color:#f6f9fd;-webkit-border-radius:7px;border-radius:7px}
    
    1 Reply Last reply
    1
  • S Offline
    S Offline
    signal15
    wrote on last edited by signal15
    #4

    @The-Worms, I added this to the very end of ./node_modules/nodebb-theme-persona/less/bootstrap/theme.less

    I stopped nodebb, did a nodebb build, restart nginx, and started nodebb again. Nothing happened. Any idea what's wrong?

    Edit: fixed. I modified it in node_modules/nodebb-theme-persona/theme.less instead. That's weird it didn't work, since that file has an include to the one in the bootstrap directory.

    The WormsT 1 Reply Last reply
    0
  • S Offline
    S Offline
    signal15
    wrote on last edited by signal15
    #5

    This looks great. Is there a way to change that box color when different skins are selected? I'm assuming I just need to go into the skins in question, and then add that same line in a file somewhere with the color I want.

    Edit: Looks like that's not possible. The skins are dynamically loaded from bootswatch.com, there are no files for them.

    1 Reply Last reply
    0
  • The WormsT Offline
    The WormsT Offline
    The Worms GNU/Linux
    replied to signal15 on last edited by
    #6

    @signal15 said in Boxes around each category:

    @The-Worms, I added this to the very end of ./node_modules/nodebb-theme-persona/less/bootstrap/theme.less

    I stopped nodebb, did a nodebb build, restart nginx, and started nodebb again. Nothing happened. Any idea what's wrong?

    Edit: fixed. I modified it in node_modules/nodebb-theme-persona/theme.less instead. That's weird it didn't work, since that file has an include to the one in the bootstrap directory.

    Use live edit css in adminboard for your test :
    0_1532542191735_Capture.PNG

    1 Reply Last reply
    1
  • julianJ Offline
    julianJ Offline
    julian GNU/Linux
    wrote on last edited by
    #7

    It is not advisable to edit the theme in node_modules/ directly, as future upgrades will replace those files. As @The-Worms says, you should make your one-off CSS fixes in the admin panel.

    1 Reply Last reply
    1
  • S Offline
    S Offline
    signal15
    wrote on last edited by
    #8

    Thanks, I will fix it.

    1 Reply Last reply
    0

Copyright © 2023 NodeBB | Contributors
  • Login

  • Don't have an account? Register

  • Login or register to search.
Powered by NodeBB Contributors
  • First post
    Last post
0
  • Home
  • Categories
  • Recent
  • Popular
  • Top
  • Tags
  • Users
  • Groups
  • Documentation
    • Home
    • Read API
    • Write API
    • Plugin Development