Bubble.io Native Dynamic Card скачать в хорошем качестве

Bubble.io Native Dynamic Card

Switch from column to row to column based on viewport size, all with Bubble.io settings. No CSS. Resources: https://viewports.fyi/ Directions: Step 1 In repeating group or regular group add a group Appearance: Type of content: Your data type Data source: Current cell’s data type Background style: Flat color Color: #ffffff Roundness: 24 Layout: Container layout: Row Make this element fixed-width: checked Width: 100% Make this element fixed-height: checked Height: 100% Step 2 Add your image Appearance Dynamic image: Parent group’s data type’s image Run-mode rendering: Rescale ALT tag: Parent group’s data type’s alt description Define each border independently: checked Top-left: 24 Top-right: 24 Layout Make this element fixed-width: unchecked Min width: 287 Min height: 280 Conditional When Current page width is less than 690 Min width: 100% When Group Card’s width is greater than or equal to 658 and Group Card’s width is less than or equal to 959 Border roundness bottom-left: 24 Border roundness top-right: 0 Step 3a Add Group for Card Content Appearance: Type of content: data type Data source: Parent group’s data type Layout: Container layout: Column Container alignment: Center Apply gap spacing between elements: checked Row gap: 32 Vertical alignment: center Make this element fixed-width: unchecked Min width: 287 Min height: 10 Padding: 24 all around Conditional: When Current page width is less than 690 Min width: 100% Step 3b Add your card contents. In this case, I added a Group Layout: Column Set Row gap to 8 Make this element fixed-width: unchecked Within the Group Add Text for Title Add Text for Description Add Button It will work as long as the card is within the Repeating Group that we set up in the last video. Thank you! https://www.mikreative.com