manifold icon indicating copy to clipboard operation
manifold copied to clipboard

Add support for @media queries

Open tsmyre opened this issue 4 years ago • 0 comments

Manifold presently strips media queries out of user-supplied CSS files:

For example, this block

@media all and (max-width: 400px) {
  .row {
    flex-direction: column;
  }
}

become this

.manifold-text-section .row {
    flex-direction: column;
}

If media queries were supported, however, publishers could leverage them to render content differently for desktop and mobile environments.

I'm at work now on a bilingual project that employs two-column lists for comparative purposes. In the desktop environment, having those comparisons appear next to the other is ideal. Not so in mobile, where the experience is compromised by reduced screen size. Instead, at that scale, it would be a better reading experience to have those blocks of content stacked on top of one another.

tsmyre avatar Jul 13 '20 19:07 tsmyre