Ability to switch the Custom CSS (app.settings)

App Building
1

Attempting to add some custom functionality per user to an app.
I can input the app.settings ->Custom CSS which works fine - but want the ability to enable/disable this conditionally based on certain criteria.
Can't find a way to do this within the Custom CSS window

Thanks

Pete

1 Like
2

Hey Pete! You can use template strings in custom CSS to apply it dynamically. Check out this video for an example.

3

Hi Abbey
Unfortunately. cant work out whats going on as the video is abot 5 seconds and not at all clear

Pete

1 Like
4

On the left hand side there is some CSS:

* {
    font-family:  {{ switch1.value ? 'Inter' : 'Times' }}
}

On the right hand side we have a switch with a default value of false, that when toggled changes to true. Our ternary logic in the CSS file updates the font every time the switch is clicked.

If you're trying to use information about the user, you may find it useful to use the Retool API | Retool Docs. You should be able to request information about a user and style dynamically using a setup similar to the example above.

Happy to help look at your particular use case. Please send screenshots (dm if needed) if you need more assistance. We also have Office Hours Tues & Thurs @ 11:00 AM PT if you like some live help!