oppi.li
1.svg {
2 display: inline-block;
3 vertical-align: text-top;
4 fill: currentcolor;
5}
6
7.middle .svg {
8 vertical-align: middle;
9}
10
11/* prevent SVGs from shrinking, like in space-starved flexboxes. the sizes
12 here are cherry-picked for our use cases, feel free to add more. after
13 https://developer.mozilla.org/en-US/docs/Web/CSS/attr#type-or-unit is
14 supported in browsers, use `attr(width px)` instead for a generic
15 solution. */
16
17.svg[height="12"] { min-height: 12px; }
18.svg[height="13"] { min-height: 13px; }
19.svg[height="14"] { min-height: 14px; }
20.svg[height="15"] { min-height: 15px; }
21.svg[height="16"] { min-height: 16px; }
22.svg[height="18"] { min-height: 18px; }
23.svg[height="20"] { min-height: 20px; }
24.svg[height="22"] { min-height: 22px; }
25.svg[height="24"] { min-height: 24px; }
26.svg[height="36"] { min-height: 36px; }
27.svg[height="48"] { min-height: 48px; }
28.svg[height="56"] { min-height: 56px; }
29
30.svg[width="12"] { min-width: 12px; }
31.svg[width="13"] { min-width: 13px; }
32.svg[width="14"] { min-width: 14px; }
33.svg[width="15"] { min-width: 15px; }
34.svg[width="16"] { min-width: 16px; }
35.svg[width="18"] { min-width: 18px; }
36.svg[width="20"] { min-width: 20px; }
37.svg[width="22"] { min-width: 22px; }
38.svg[width="24"] { min-width: 24px; }
39.svg[width="36"] { min-width: 36px; }
40.svg[width="48"] { min-width: 48px; }
41.svg[width="56"] { min-width: 56px; }