mirror of
https://github.com/naturalcrit/homebrewery.git
synced 2025-12-30 06:42:45 +00:00
0dc9e9ecdb
New icons for Zoom to Fit, and Fit Width buttons. Used SVGR online tool to create react components and then combined them. If doing in future, be sure to set currentColor on `fill` property in the SVG itself. Make the SVGs as closed curves only (don't rely on stroke). set only a width property, not height.
47 lines
2.5 KiB
JavaScript
47 lines
2.5 KiB
JavaScript
import * as React from 'react';
|
|
|
|
const FitAll = ({ title, titleId, ...props })=>(
|
|
<svg
|
|
xmlns='http://www.w3.org/2000/svg'
|
|
xmlSpace='preserve'
|
|
style={{
|
|
fillRule : 'evenodd',
|
|
clipRule : 'evenodd',
|
|
strokeLinejoin : 'round',
|
|
strokeMiterlimit : 2,
|
|
}}
|
|
viewBox='0 0 100 100'
|
|
width='1em'
|
|
fill='currentColor'
|
|
aria-labelledby={titleId}
|
|
{...props}
|
|
>
|
|
{title ? <title id={titleId}>{title}</title> : null}
|
|
<path d='M45.46 54.54h-14.4v6.304a2.87 2.87 0 0 1-4.9 2.034L15.333 52.033a2.88 2.88 0 0 1 0-4.067l10.825-10.844a2.868 2.868 0 0 1 3.13-.623 2.877 2.877 0 0 1 1.771 2.657v6.303h14.4v-14.4h-6.304a2.867 2.867 0 0 1-2.033-4.9l10.844-10.825a2.88 2.88 0 0 1 4.066 0l10.845 10.825a2.867 2.867 0 0 1 .623 3.129 2.875 2.875 0 0 1-2.657 1.772H54.54v14.4h14.398v-6.304c0-1.163.7-2.211 1.772-2.657a2.868 2.868 0 0 1 3.13.623l10.825 10.844a2.88 2.88 0 0 1 0 4.067L73.84 62.878a2.87 2.87 0 0 1-4.9-2.034V54.54h-14.4v14.4h6.304c1.163 0 2.211.7 2.657 1.772a2.866 2.866 0 0 1-.623 3.128L52.033 84.665a2.879 2.879 0 0 1-4.066 0L37.123 73.84a2.866 2.866 0 0 1-.624-3.128 2.877 2.877 0 0 1 2.657-1.773l6.304.001v-14.4Z' />
|
|
<path d='M100 8.043v83.913A8.048 8.048 0 0 1 91.956 100H8.043A8.047 8.047 0 0 1 0 91.956V8.043A8.047 8.047 0 0 1 8.043 0h83.913A8.047 8.047 0 0 1 100 8.043Zm-6.371 0c0-.923-.75-1.672-1.673-1.672H8.043c-.923 0-1.672.749-1.672 1.672v83.913c0 .923.749 1.673 1.672 1.673h83.913c.924 0 1.673-.75 1.673-1.673V8.043Z' />
|
|
</svg>
|
|
);
|
|
|
|
const FitWidth = ({ title, titleId, ...props })=>(
|
|
<svg
|
|
xmlns='http://www.w3.org/2000/svg'
|
|
xmlSpace='preserve'
|
|
style={{
|
|
fillRule : 'evenodd',
|
|
clipRule : 'evenodd',
|
|
strokeLinejoin : 'round',
|
|
strokeMiterlimit : 2,
|
|
}}
|
|
viewBox='0 0 100 100'
|
|
width='1em'
|
|
fill='currentColor'
|
|
aria-labelledby={titleId}
|
|
{...props}
|
|
>
|
|
{title ? <title id={titleId}>{title}</title> : null}
|
|
<path d='M31.06 54.54v6.304a2.87 2.87 0 0 1-4.9 2.034L15.332 52.032a2.88 2.88 0 0 1 0-4.067L26.16 37.122a2.868 2.868 0 0 1 3.129-.623 2.877 2.877 0 0 1 1.772 2.657v6.303h37.879v-6.303c0-1.163.7-2.211 1.772-2.657a2.868 2.868 0 0 1 3.129.623l10.825 10.844a2.88 2.88 0 0 1 0 4.067L73.84 62.877a2.87 2.87 0 0 1-4.901-2.033V54.54h-37.88ZM9.282 6.248v87.503a4.178 4.178 0 0 1-4.176 4.177H4.85A4.178 4.178 0 0 1 .674 93.75V6.248A4.177 4.177 0 0 1 4.85 2.072h.256a4.177 4.177 0 0 1 4.176 4.176ZM99.326 6.248v87.503a4.178 4.178 0 0 1-4.177 4.177h-.255a4.178 4.178 0 0 1-4.176-4.177V6.248a4.177 4.177 0 0 1 4.176-4.176h.255a4.177 4.177 0 0 1 4.177 4.176Z' />
|
|
</svg>
|
|
);
|
|
export { FitWidth, FitAll };
|
|
|