Add ability to make custom styles

Created on 22 October 2021, over 2 years ago
Updated 22 April 2024, 2 months ago

Problem/Motivation

It doesn't seem to be possible to make custom styles in the D8 version, the module is hardcoded to use the styles defined in TBMegaMenuBuilder::createStyleOptions().

Proposed resolution

Provide an API for adding custom styles.

Remaining tasks

Work out a solution.
Build the solution.
Add test coverage.
Document the solution.

User interface changes

TBD

API changes

TBD

Data model changes

TBD

✨ Feature request
Status

Active

Version

1.0

Component

User interface

Created by

🇺🇸United States DamienMcKenna NH, USA

Live updates comments and jobs are added and updated live.
Sign in to follow issues

Comments & Activities

Not all content is available!

It's likely this issue predates Contrib.social: some issue and comment data are missing.

  • 🇮🇳India ravi kant Jaipur

    As commented in #2, the .SCSS file is available in 2.X version and now it can overwrite as described in https://www.drupal.org/node/2497313 →

  • 🇦🇹Austria maxilein

    thanks for #4.

    #5 I don't know how a manually overwrite each time the module gets updated is helping. Or does it trigger on update?

  • 🇮🇳India ravi kant Jaipur

    @MrDaleSmith

    Don't overwrite directly in the contributed module.
    Use the Libraries-override and Libraries-extend features which overwrite/extend contributed modules libraries from your custom theme.

    Follow the URL https://www.drupal.org/node/2497313 →

  • 🇬🇧United Kingdom MrDaleSmith

    @ravi-kant I'm overriding in my theme's CSS, but how ever you do it I still have to, so that doesn't resolve the actual issue.

  • 🇮🇳India ravi kant Jaipur

    @MrDaleSmith

    libraries-extend:
      core/tb_megamenu:
        - <your custom theme machine name> / <new library in custom theme>
    

    Follow the URL https://www.drupal.org/node/2497313 →

  • 🇬🇧United Kingdom MrDaleSmith

    @ravi-kant I know how to override a library: the issue here is the module is too opinionated about CSS, not that there aren't ways of working around it.

  • 🇮🇳India ravi kant Jaipur

    @MrDaleSmith
    The TB Megamenu is providing sass files - admin.scss, base.scss, styles.scss.
    I will suggest copying base.scss and styles.scss in your theme folder and making necessary changes.
    Then compile sass to create a new library in your theme and use libraries-extend to apply the new library.

  • 🇺🇸United States themodularlab

    While new feature development has stalled a little bit here, we do plan to add functions that will easily allow you to select between a TB theme or your styling. Until that happens, @ravi-kant's suggestion of using libraries-extend/copying the source sass files into your theme should suffice.

  • 🇦🇹Austria maxilein

    I really don't know much about how the styling with all the other themes works. So forgive my probably stupid comment here.
    But they seem to have similar classes and usually do not add colors.
    If (and I don't know if this is the standard drupal case) there are such css and menu elements why do you provide your own and not inherit/use those of themes.
    The Drupal MainMenu seems to work in all themes. So it must have elements that are default.
    If Megamenu would in inherit colors of the current theme it would solve most of the problems I guess.

  • 🇮🇳India ravi kant Jaipur

    @maxilein
    I am understanding your problem.
    But the new color can be apply easily from custom theme.
    Also it depends on current theme work.

Production build 0.69.0 2024