Skip to content
New issue

Have a question about this project? Sign up for a free GitHub account to open an issue and contact its maintainers and the community.

By clicking “Sign up for GitHub”, you agree to our terms of service and privacy statement. We’ll occasionally send you account related emails.

Already on GitHub? Sign in to your account

Masonry spacing issues #116

Open
ryantrip opened this issue May 20, 2021 · 0 comments
Open

Masonry spacing issues #116

ryantrip opened this issue May 20, 2021 · 0 comments

Comments

@ryantrip
Copy link

Hello,

I'm running into spacing issues with the masonry feature. This issue comes in two parts:

  1. Spacing between tiles with masonry: enabled is smaller than spacing with masonry: disabled
  2. Tiles wider than "1" push the next cards too far away. Example: Configured for tileOnRow: 3 with two tiles. The first tile has a widerSize: 2. Second tile has a no set size (normal). The second tile is being pushed to the next row when it should be on the first row next to the first tile. If I set the tiles per row to 4, the 2nd tile shows up in the first row, but with large spacing in-between.

Masonry tile spacing:
image
Normal tile spacing:
Screen Shot 2021-05-19 at 11 16 55 PM
"Wider" masonry issue (tileOnRow: 5 instead of "4" to show the 2nd spacing issue I mentioned):
image

Config:

- enableColumns: true
  rows:
    - columns:
        - column: 1
          entities:
            - entities:
                - card: picture-glance
                  cardOptions:
                    title: Front Door
                    entities:
                      - binary_sensor.doorbell_motion
                      - input_boolean.picture_glance_card_fix
                    camera_image: camera.doorbell
                    camera_view: live
                  cardStyle: |
                    :host {
                      display: flex !important;
                      height: 100% !important;
                    }
                    ha-card {
                      box-shadow: none !important;
                      width: 100% !important;
                    }
                    .box {
                      background-color: #FFF !important;
                      color: #000 !important;
                    }
                    .row:nth-of-type(3){
                      display: none !important;
                    }  
                    ha-icon-button.state-on {
                      color: #f7d958 !important;
                    }
                  noPadding: true
                  wider: true
                  widerSize: 3
                  higher: true
                  higherSize: 2
                - entity: lock.front_door_lock
                  offStates:
                    - locked
                  tap_action:
                    action: toggle
                    entity: lock.front_door_lock
                - entity: lock.garage_entry_door_lock
                  offStates:
                    - locked
                  tap_action:
                    action: toggle
                    entity: lock.garage_entry_door_lock
                - entity: cover.garage_door
                  offStates:
                    - closed
              title: Doors
          tileOnRow: 5
  masonry: true
  statePositionTop: true
  tileHoldAnimation: false
  type: 'custom:homekit-card'
Sign up for free to join this conversation on GitHub. Already have an account? Sign in to comment
Labels
None yet
Projects
None yet
Development

No branches or pull requests

1 participant