Canvas Documentation
Bubble Best Practices
v2
v2
  • Welcome
  • Introduction
  • Contents
  • Using Bubble
    • Bubble basics
    • Bubble best practices
      • Principles
      • Database
      • Design
      • Security
      • SEO
      • Speed
      • Modularity
        • Data triggers
  • Using the template
    • Getting the template
    • Setup
      • Quickstart
      • Features and configuration
        • Customizable landing page
        • Header menu
        • Menu focus group
        • Styles and colors
        • Extending the admin portal
        • Set a password policy
        • Enable cookies
        • Alerts
        • Emails
        • Hidden variables popup
        • Set up index page redirects
        • Set up payments on account page
        • Set up social media links
        • Search engine optimization (SEO)
        • Setting up domains
        • Legal docs
    • Extending the template using Canvas Pages
      • How it works
      • Get started
      • Setting up added modules
      • Updating Canvas styles
    • Extending the template manually
      • Padding
      • Pages, groups, and popups
      • Hiding groups
      • Styles
    • Reference
      • Pages
        • index
        • admin
        • home
        • account
        • verify
        • login and loginsimple
        • termsofservice
        • privacypolicy
        • reset_pw
        • standardpage
        • 404
      • Reusable elements
        • header
        • footer
        • signup/login
        • popupsreusable
        • menufocusgroup_template (︙)
        • menufocusgroup_user
        • menufocusgroupfeature_b
        • menufocusgroup_email
        • menufocusgroup_notifications
        • menufocusgroup_shoppingcart
        • menufocusgroup_search
        • cookiespermission
        • homepageblocks
        • admin portal reusables
          • admindashboard
          • admingeneralsettings
          • adminemail
          • adminseosettings
          • adminsocialmediasettings
          • adminsocialmediainfo
          • adminlegalpages
          • adminhomepagesetup
          • adminstyles
          • adminfeaturebacklog
      • Data and workflows
        • Data structure
        • Option sets
        • API workflows
      • Canvas Pages: lists of modules & page templates
  • Demos
    • Yelp for Books
  • Other Canvas templates
Powered by GitBook
On this page
  • Use styles instead of settings individual properties
  • Use conditional properties if you need to deviate from a style

Was this helpful?

  1. Using the template
  2. Extending the template manually

Styles

Using styles to manage the appearance of elements

PreviousHiding groupsNextReference

Last updated 5 years ago

Was this helpful?

The template is based on the principles, which we use with most of our clients. This makes it easy to translate specs into apps without getting caught up in the creative process. Here are a few tips to keep in mind:

Use styles instead of settings individual properties

Each of our apps uses a consistent set of styles (set in theStyles tab). We recommend using these styles instead of manually setting visual attributes on an element, as this maintains consistency and make it easier to make adjustments later.

Use conditional properties if you need to deviate from a style

If you need to give an element a unique style by default, you can assign it the closest existing style and use the conditional formatting tab to say When this url is not empty and set the needed attributes. This will effectively change the default style without breaking the style linkage.

If you might be using some of our advanced features such as style updates, you should refrain from modifying existing styles or changing any of their names.

AirDev Canvas Design
Canvas Styles
Override styles by adding a conditional statement to the element