Chalarangelo / furl

Functional react.js components.

Home Page:https://furl.netlify.com/

Geek Repo:Geek Repo

Github PK Tool:Github PK Tool

SVGs shrink based on screen size when part of a Grid

Chalarangelo opened this issue · comments

Consider the following component tree:

<Grid>
  <Row>
    <Column size={3}>
      <Button>
        <Icon name='github' height={18} width={18}/>
      </Button>
    </Column>
  </Row>
</Grid>

In the above example the Icon component will shrink proportionately to the screen size, as the Column is resized and its max-width, set in _Reset.scss, updates automatically.

This is a very annoying bug and it requires a fix and re-evaluation of the related CSS ruleset.

The bug does not come from combining SVG with Grid. In fact, it comes from the responsiveness of images. A minimum size, at least for icons, could help a little bit.