Simple WalkThrough For Editing CSS of an Anvil Component

Anvil Q&A
1

Hi - I specifically am trying to edit the CSS of the Tabulator Extension (which is incredible) because I would like to make the font sizes smaller to accommodate large data display in the Tabulator.

looked through the Theme Editing sections on the Anvil site, and find there to be not a singe ‘walk-through’ example of here-is-how-you-can-edit-the-appearance-of-a-singe-component-displayed-by-Anvil-in-the-CSS… Could someone please take the time to do an ‘explain like i am 5 yrs old’ of how one could make simple changes in the CSS? If this exists and I haven’t found it yet then I apologize and would love to know where.

THANKS ANVIL AMAZING PRODUCT - AND I LOVE THE NEW BETA-APP-EDITOR…

2

What I’ve always done to override the CSS of something in Anvil is to:

  1. Scroll all the way to the bottom of the list of forms, and click Native Libraries
  2. Put the CSS I want between style tags, e.g.
<style>
.anvil-extras-tabs .tabs {
    overflow-x: hidden !important;
}
</style>
1 Like