MWDelaney / sage-acf-wp-blocks

Composer library for generating ACF Gutenberg blocks from templates. Intended for use with Roots/Sage (http://roots.io)
346 stars 66 forks source link

Accordion body renders weird at ~850px width #35

Open nanoo-k opened 4 years ago

nanoo-k commented 4 years ago

I ran into an issue where the accordion content blocks were looking weird at roughly 850px screen widths on Google Chrome Version 80.0.3987.116 (Official Build) (64-bit). I'm working from the dev-master branch.

The issue didn't appear on accordions that had plain text inside them but in the accordion that had images and other formatting.

[lgc_column grid="33" tablet_grid="33" mobile_grid="100" last="false"]
Some text
[/lgc_column]
[lgc_column grid="33" tablet_grid="33" mobile_grid="100" last="false"]
here
[/lgc_column]
[lgc_column grid="33" tablet_grid="33" mobile_grid="100" last="true"]
more info link
[/lgc_column]

I fixed it by overriding this CSS (Line 1511, says my element inspector):

@media (max-width: 1024px) {
  .lgc-clear {
    display: none;
  }
}

I just wrote a new rule that set it to display: block !important:

@media (max-width: 1024px) { .lgc-clear { display: block !important; } }

Here's some images to show what I'm talking about.

how-it-should-look how-it-should-not-look

Not sure how you want to handle it. I fixed the problem for my situation, but am not sure if it's indicative of a broader issue.