Forum Documentation Showcase Pricing Learn more

AirDev Canvas App v1.3


#1

Hi Bubblers,

We made some updates to the Canvas App (original forum post here) and would like to share the latest 1.3 version with all of you:

  1. Updated fully-responsive login page:

You can customize the right portion of this page (image, add a tagline, font color, and background color) from the Owner’s Portal in the Canvas App.

  1. Updated homepage maker pricing block - the design here is similar to what we have on our AirDev website

You can add between 2 to 4 pricing options here and the content can be customized from the homepage tab in the Owner’s Portal of the Canvas App.

Don’t forget to try out our Canvas Pages (original forum posts here and here) once you get the latest version of the Canvas App!

Stephanie
AirDev


Introducing AirDev Canvas - the free app foundation for your next Bubble project
#2

Hi Bubblers,

We just released a new group for AirDev Canvas Pages (original forum post here)! This is a group requested by @seanhoots.

This is a horizontal scroll repeating group that scrolls off-screen which we have used in a lot of our client apps before. It has worked out pretty well for us and it’s also fully responsive!

Let us know if you would like any other assets and we’ll add it to our list of upcoming releases. Thanks again for all your support!

Stephanie
AirDev


Introducing AirDev Canvas Pages - build custom and fully-responsive pages in just a few minutes
#3

Hi @stephanie, I was testing your demo page on mobile and i’m getting some issue with the corner radius.
I realized in landscape mode there is a rounded corner to each of the cells.
But in portrait mode the rounded corners dissapears.
See the screencast below.

Secondly is it possible that to have a left gap for the leftmost cell on page load and still have cells scroll to the edge of the screen when scrolling left like on the right side?
Thanks


#4

Hi Sean,

Thank you for testing! - here are some thoughts to your questions:

  1. There is a conditional statement on the group style where the border roundness will be 0 when the current page width is less than or equal to 440 (people can customize this or remove this conditional statement).

  2. Currently, you can only collapse horizontal spaces in Bubble by adding a hiding rule to a group in the responsive editor. There isn’t really a very straightforward way to do this here especially when we’re using a horizontal repeating group. I think the simplest way to replicate the behavior you are describing is to:

  • Convert the main content group (tile) into a reusable element
  • In the repeating group, drop two reusable content groups stacked on top of each other and put each of them in their own groups (check the settings for “collapse this group’s height when hidden” for both).
  • Make the top tile group left justified in the repeating group and add a conditional statement that says: “when current page width is less than or equal to 500, hide this group”
  • Make the bottom tile group right justified in the repeating group. Uncheck the box for this element is visible on page load. Add a conditional statement that says “when current page width is less than or equal to 500, show this group”

Hope this helps!

Stephanie
AirDev


#5

Hey @seanhoots are you looking to have the RG spill over both the left and right sides of the screen, so you get the same effect in both directions? I think your idea of doing so and then making the very first cell blank (so when you load the page you don’t see half of the first item) would work.

Doing this is a little tricky, and there are two approaches:

  1. Create a blank item in the database and make sure that it sorts to the beginning with whatever your expression is. This is simple, but not so ideal because your database is messy.

  2. Make the RG’s data type be a list of numbers or some other object, where you can make the count be one more than the count you need. Then have a second hidden RG somewhere that holds the actual list of items you want. Then within the cell of the original RG, create a group of the data type you want, and have its source refer to the appropriate cell in the other RG (e.g., cell 2 in the main RG should refer to cell 1 in the hidden RG). This way you get a RG with a blank first cell and all the others filled in.

I hope this is relatively clear!


#6

Hi @stephanie,

Thanks again for this great resource. I have a couple of bugs to report with the homepage maker (blocks):

  1. The ‘Process’ block includes a tagline and there doesn’t appear to be a way to edit the tagline, not without editing the block directly in the Bubble database (data tab).

  2. I added a new (second) CTA block and the gradient colours wouldn’t save. Looking at the workflows, the custom event that to create a Block Entry doesn’t appear to set the colour fields, so again I had to set them in the data tab of the editor.


#7

Hi Louis,

Thank you so much for submitting these bugs. I’ve looked into these but am unable to replicate the bugs in Canvas App v1.3. For your reference, here’s my process (video here) of updating the process and CTA blocks. For the CTA blocks, the colors are saved not when the block is created (via the custom workflow) but you when you press save for the block entry in the edit popup.

Can you check what Canvas App version your app is on? You can find this by going to the data tab > app data > website > canvas app version field.

Let me know and I’m happy to look into it! Thank you again for using Canvas! :smiley:


#8

Hi @stephanie,

That is odd - that you can’t reproduce it I mean, because I tried twice with the same result. I have checked and the version is indeed 1.3. I did also hit the Save button, multiple times. Based on your video, the only thing I think I did differently was that for the gradient, I may have set the second colour first, but I don’t think that would have made a difference. Oh and I also moved the CTA banner up by changing the order number to 6 (and setting what was previously 6 to 12 or something.

Your video did show me what I was missing for setting the tagline. I was just hitting the Edit link and seeing only the actual steps. Thanks.


#9

Hi Louis,

Try upgrading the color plugin to the latest version from the plugins tab.


#10

Hi Bubblers,

Check out our latest updates to Canvas Pages here. We’ve updated the user interface of Canvas Pages and released a new group widget!

Best,
Stephanie


#11

Hi Bubblers,

We just released a few updates for our free Canvas: App Foundation Template (v1.4). You can learn more about how to use our templates and modules here.

  1. Added new terms of service and privacy policy pages in the app. We’ve also added the ability for app owners to customize their Terms of Service and Privacy Policy documents from the Owner’s Portal using Rich Text editors.

  1. App owners can show / hide their terms and privacy links in the footer and during sign up.

  1. New UI in the sign up / log in reusable to require a user to check the box for “I agree to the Terms of Service and Privacy Policy” before signing up. This will save the current data/time in the user object of when the user agreed to the terms and privacy policy.

  2. Minor updates to the order of the tabs in the Owner’s Portal

Best,
Stephanie
AirDev