Hwo to override a generic setting in Bulma

Viewed 31

In an app that uses Bulma, there is a requirement to display URLs with an underline. However, Bulma's generic.scss file specifies that anchor tags have no text decoration (see here). I looked through the Bulma customization docs for a way to override this setting but do not see any variables to do that. The current work around is to put class="is-underlined" in all the anchor tags in the app...less than ideal. Is there a way to override this in Bulma?

1 Answers

Within your project you could always update/change the styles, either by

  • adding some SCSS file before or after the bulma.scss
  • adding an additional CSS file in your index.html

Using either approach, you can override just about anything. Here's how I do it for additional print styles on link URLs: https://github.com/suterma/bulma-print/blob/main/sass/helpers.scss

You could do for example:

/* underline link URLs */
a[href] {
  text-decoration: underline;
}

And add this AFTER your inclusion of bulma.

Related