MediaQuery

A vertically stacked set of interactive headings that each reveal a section of content.

import { MediaQuery } from '@iftakhar/ui';

<MediaQuery query='(min-width: 1024px)'>
  <pre>min-width: 1024px</pre> {/* if screen width is bigger than 1024px then it will be shown */}
</MediaQuery>

<MediaQuery query='(max-width: 1024px)'>
  <pre>max-width: 1024px</pre> {/* if screen width is smaller than 1024px then it will be shown */}
</MediaQuery>