mirror of
https://github.com/brianlovin/security-checklist.git
synced 2026-03-11 08:55:31 +00:00
131 lines
13 KiB
JavaScript
131 lines
13 KiB
JavaScript
// @flow
|
|
import * as React from 'react';
|
|
import styled from 'styled-components';
|
|
|
|
type Props = {
|
|
glyph: string,
|
|
size?: number,
|
|
};
|
|
|
|
export const InlineSvg = styled.svg`
|
|
position: absolute;
|
|
top: 0;
|
|
right: 0;
|
|
bottom: 0;
|
|
left: 0;
|
|
height: 100%;
|
|
width: 100%;
|
|
color: inherit;
|
|
fill: currentColor;
|
|
`;
|
|
|
|
export const SvgWrapper = styled.div`
|
|
display: inline-block;
|
|
flex: 0 0 ${props => (props.size ? `${props.size}px` : '32px')};
|
|
width: ${props => (props.size ? `${props.size}px` : '32px')};
|
|
height: ${props => (props.size ? `${props.size}px` : '32px')};
|
|
min-width: ${props => (props.size ? `${props.size}px` : '32px')};
|
|
min-height: ${props => (props.size ? `${props.size}px` : '32px')};
|
|
position: relative;
|
|
color: inherit;
|
|
`;
|
|
|
|
type GlyphProps = {
|
|
glyph: string,
|
|
};
|
|
|
|
export const Glyph = ({ glyph }: GlyphProps): any => {
|
|
switch (glyph) {
|
|
case 'facebook':
|
|
return (
|
|
<g>
|
|
<path d="M19.491,27.944c7.731,-0.319 8.509,-2.242 8.509,-11.944c0,-11 -1,-12 -12,-12c-11,0 -12,1 -12,12c0,10.985 0.997,11.997 11.956,12l0,-7.667l-2.956,0l0,-3.377l2.956,0l0,-2.491c0,-2.891 1.789,-4.465 4.403,-4.465c1.251,0 2.327,0.092 2.641,0.133l0,3.021l-1.813,0.001c-1.421,0 -1.696,0.666 -1.696,1.644l0,2.157l3.39,0l-0.442,3.377l-2.948,0l0,7.611Z" />
|
|
</g>
|
|
);
|
|
case 'link':
|
|
return (
|
|
<g>
|
|
<path d="M16.693,16.664c0.376,-0.375 1.001,-0.413 1.377,-0.038l0.083,0.084c0.358,0.357 0.386,0.93 0.032,1.291c-0.026,0.026 -0.051,0.052 -0.077,0.078c-0.867,0.866 -1.671,1.438 -2.514,1.655c0,0 -0.001,0 -0.001,0c-0.078,0.02 -0.157,0.037 -0.236,0.051c0,0 0,0 0,0c-0.802,0.142 -1.646,-0.036 -2.616,-0.582l0,0c-0.907,-0.511 -1.923,-1.343 -3.119,-2.539c-3.959,-3.959 -3.939,-5.959 -1.414,-8.485c2.526,-2.525 4.526,-2.545 8.485,1.414c0.439,0.439 0.828,0.853 1.171,1.247c0.102,0.117 -0.009,0.3 -0.162,0.28c0,0 0,0 -0.001,0c-0.559,-0.074 -1.083,-0.035 -1.58,0.094c-0.299,0.078 -0.624,0.012 -0.842,-0.206c-1.958,-1.958 -3.035,-2.492 -3.63,-2.571c-0.366,-0.049 -0.902,0.032 -2.027,1.156c-1.124,1.125 -1.205,1.661 -1.156,2.027c0.079,0.595 0.613,1.672 2.571,3.63c0.432,0.433 0.822,0.796 1.173,1.1c0,0 0,0 0,0c0.046,0.04 0.091,0.079 0.136,0.117c0,0 0,0 0,0c0.841,0.712 1.45,1.073 1.891,1.24c0,0 0,0 0,0c0.166,0.062 0.308,0.098 0.429,0.114c0,0 0,0 0,0c0.367,0.049 0.903,-0.032 2.027,-1.157Zm3.07,-1.099c-0.912,-0.79 -1.563,-1.181 -2.027,-1.357c0,0 0,0 0,0c-0.166,-0.063 -0.308,-0.098 -0.43,-0.114c0,0 0,0 0,0c-0.367,-0.049 -0.902,0.032 -2.027,1.156c-0.375,0.376 -1.001,0.414 -1.376,0.038l-0.083,-0.083c-0.358,-0.358 -0.387,-0.931 -0.032,-1.291c0.025,-0.026 0.051,-0.052 0.077,-0.078c0.866,-0.866 1.671,-1.438 2.514,-1.655l0,0c0.873,-0.225 1.786,-0.07 2.853,0.531c0,0 0,0 0,0c0.906,0.51 1.923,1.343 3.118,2.538c3.96,3.96 3.94,5.96 1.414,8.486c-2.525,2.525 -4.525,2.545 -8.485,-1.415c-0.438,-0.438 -0.828,-0.852 -1.171,-1.246c-0.102,-0.117 0.009,-0.301 0.163,-0.28c0.559,0.074 1.083,0.035 1.581,-0.094c0.299,-0.078 0.623,-0.012 0.841,0.206c1.958,1.958 3.035,2.492 3.63,2.571c0.367,0.049 0.903,-0.032 2.027,-1.157c1.125,-1.124 1.206,-1.66 1.157,-2.027c-0.079,-0.595 -0.613,-1.672 -2.571,-3.63c-0.433,-0.432 -0.822,-0.795 -1.173,-1.099Z" />
|
|
</g>
|
|
);
|
|
case 'share':
|
|
return (
|
|
<g fillRule="nonzero">
|
|
<path d="M16.707,5.294c-0.39,-0.39 -1.024,-0.39 -1.414,0l-3,3c-0.391,0.391 -0.391,1.024 0,1.415c0.39,0.39 1.024,0.39 1.414,0l1.293,-1.293l0,9.585c0,0.553 0.448,1 1,1c0.552,0 1,-0.447 1,-1l0,-9.585l1.293,1.293c0.39,0.39 1.024,0.39 1.414,0c0.391,-0.391 0.391,-1.024 0,-1.415l-3,-3Zm-5.817,7.023c0.588,-0.114 1.11,0.36 1.11,0.959l0,0.426c0,0.265 -0.198,0.487 -0.459,0.531l-0.002,0c-1.042,0.17 -1.486,0.416 -1.706,0.612c-0.191,0.171 -0.42,0.489 -0.588,1.31l-0.007,0.03c-0.191,0.926 -0.238,2.106 -0.238,3.815l0,0.003c0,1.709 0.047,2.889 0.238,3.814l0.007,0.031c0.168,0.821 0.397,1.139 0.588,1.309c0.219,0.197 0.662,0.442 1.699,0.612l0.017,0.002c1.094,0.182 2.493,0.231 4.45,0.23l0.002,0c1.957,0.001 3.356,-0.048 4.45,-0.23l0.017,-0.002c1.037,-0.17 1.48,-0.415 1.699,-0.611c0.191,-0.171 0.42,-0.489 0.588,-1.31l0.007,-0.031c0.191,-0.925 0.238,-2.105 0.238,-3.814l0,-0.003c0,-1.709 -0.047,-2.889 -0.238,-3.815l-0.007,-0.03c-0.168,-0.821 -0.397,-1.139 -0.588,-1.31c-0.22,-0.196 -0.664,-0.442 -1.706,-0.612l-0.002,0c-0.262,-0.044 -0.459,-0.266 -0.459,-0.531l0,-0.426c0,-0.599 0.522,-1.073 1.11,-0.959c3.362,0.655 3.89,2.553 3.89,7.684c0,7.059 -1,8 -9,8c-8,0 -9,-0.941 -9,-8c0,-5.131 0.528,-7.029 3.89,-7.684Z" />
|
|
</g>
|
|
);
|
|
case 'twitter':
|
|
return (
|
|
<g>
|
|
<path d="M16,28c11,0 12,-1 12,-12c0,-11 -1,-12 -12,-12c-11,0 -12,1 -12,12c0,11 1,12 12,12Zm5.825,-13.901c0,3.669 -2.889,7.901 -8.172,7.901l0,0c-1.622,0 -3.132,-0.46 -4.403,-1.248c0.225,0.026 0.454,0.039 0.685,0.039c1.346,0 2.585,-0.444 3.568,-1.189c-1.258,-0.022 -2.318,-0.825 -2.684,-1.928c0.175,0.032 0.355,0.05 0.54,0.05c0.262,0 0.516,-0.034 0.758,-0.098c-1.315,-0.255 -2.305,-1.377 -2.305,-2.722c0,-0.013 0,-0.024 0.001,-0.036c0.387,0.208 0.829,0.333 1.301,0.348c-0.772,-0.498 -1.279,-1.348 -1.279,-2.312c0,-0.509 0.143,-0.985 0.389,-1.396c1.417,1.681 3.534,2.786 5.921,2.902c-0.049,-0.204 -0.074,-0.416 -0.074,-0.633c0,-1.533 1.286,-2.777 2.872,-2.777c0.826,0 1.573,0.338 2.097,0.877c0.654,-0.124 1.269,-0.356 1.824,-0.674c-0.215,0.649 -0.67,1.192 -1.263,1.536c0.581,-0.067 1.134,-0.216 1.649,-0.437c-0.384,0.557 -0.872,1.046 -1.433,1.438c0.006,0.119 0.008,0.239 0.008,0.359Z" />
|
|
</g>
|
|
);
|
|
case 'view-forward':
|
|
return (
|
|
<g>
|
|
<path d="M12.982,23.89c-0.354,-0.424 -0.296,-1.055 0.128,-1.408c1.645,-1.377 5.465,-4.762 6.774,-6.482c-1.331,-1.749 -5.1,-5.085 -6.774,-6.482c-0.424,-0.353 -0.482,-0.984 -0.128,-1.408c0.353,-0.425 0.984,-0.482 1.409,-0.128c1.839,1.532 5.799,4.993 7.2,6.964c0.219,0.312 0.409,0.664 0.409,1.054c0,0.39 -0.19,0.742 -0.409,1.053c-1.373,1.932 -5.399,5.462 -7.2,6.964l-0.001,0.001c-0.424,0.354 -1.055,0.296 -1.408,-0.128Z" />
|
|
</g>
|
|
);
|
|
case 'github':
|
|
return (
|
|
<g>
|
|
<path d="M18.837,27.966c8.342,-0.241 9.163,-1.997 9.163,-11.966c0,-11 -1,-12 -12,-12c-11,0 -12,1 -12,12c0,9.995 0.826,11.734 9.228,11.968c0.073,-0.091 0.1,-0.205 0.1,-0.321c0,-0.25 -0.01,-2.816 -0.015,-3.699c-3.037,0.639 -3.678,-1.419 -3.678,-1.419c-0.497,-1.222 -1.213,-1.548 -1.213,-1.548c-0.991,-0.656 0.075,-0.643 0.075,-0.643c1.096,0.075 1.673,1.091 1.673,1.091c0.974,1.617 2.556,1.15 3.178,0.879c0.099,-0.683 0.381,-1.15 0.693,-1.414c-2.425,-0.267 -4.974,-1.175 -4.974,-5.23c0,-1.155 0.426,-2.099 1.124,-2.839c-0.113,-0.268 -0.487,-1.344 0.107,-2.8c0,0 0.917,-0.285 3.003,1.084c0.871,-0.235 1.805,-0.352 2.734,-0.356c0.927,0.004 1.861,0.121 2.734,0.356c2.085,-1.369 3,-1.084 3,-1.084c0.596,1.456 0.221,2.532 0.108,2.8c0.7,0.74 1.123,1.684 1.123,2.839c0,4.065 -2.553,4.96 -4.986,5.221c0.392,0.327 0.741,0.973 0.741,1.96c0,0.946 -0.006,2.619 -0.01,3.728c-0.002,0.549 -0.003,0.959 -0.003,1.074c0,0.109 0.029,0.224 0.095,0.319Z" />
|
|
</g>
|
|
);
|
|
case 'apple':
|
|
return (
|
|
<g>
|
|
<path d="M16.6437 15.5861C16.3385 16.2848 15.9772 16.928 15.5586 17.5193C14.9881 18.3255 14.5209 18.8835 14.1609 19.1934C13.6027 19.702 13.0048 19.9625 12.3644 19.9773C11.9047 19.9773 11.3504 19.8477 10.705 19.5847C10.0576 19.323 9.46262 19.1934 8.91858 19.1934C8.34801 19.1934 7.73608 19.323 7.08155 19.5847C6.42601 19.8477 5.89793 19.9847 5.49417 19.9983C4.88012 20.0242 4.26806 19.7563 3.65713 19.1934C3.2672 18.8563 2.77947 18.2786 2.1952 17.4601C1.56832 16.586 1.05294 15.5725 0.649179 14.417C0.216767 13.1689 5.70276e-08 11.9603 5.70276e-08 10.7902C5.70276e-08 9.44984 0.292262 8.29382 0.877656 7.32509C1.33773 6.54696 1.94978 5.93315 2.71581 5.48255C3.48185 5.03195 4.30955 4.80232 5.20091 4.78763C5.68863 4.78763 6.32822 4.93713 7.12303 5.23095C7.9156 5.52576 8.42451 5.67526 8.64762 5.67526C8.81444 5.67526 9.37977 5.50045 10.3382 5.15194C11.2445 4.82874 12.0094 4.69492 12.636 4.74763C14.334 4.88343 15.6097 5.54675 16.4581 6.74177C14.9395 7.6536 14.1883 8.93072 14.2032 10.5691C14.2169 11.8452 14.6841 12.9071 15.6022 13.7503C16.0183 14.1417 16.483 14.4441 17 14.6589C16.8879 14.9812 16.7695 15.2898 16.6437 15.5861ZM12.7494 0.400111C12.7494 1.40034 12.3806 2.33425 11.6456 3.19867C10.7586 4.22629 9.68574 4.8201 8.5223 4.7264C8.50747 4.6064 8.49888 4.48011 8.49888 4.3474C8.49888 3.38718 8.9207 2.35956 9.66979 1.51934C10.0438 1.09392 10.5194 0.740188 11.0962 0.458011C11.6718 0.180044 12.2162 0.0263202 12.7282 8.94779e-09C12.7431 0.133712 12.7494 0.267436 12.7494 0.400099V0.400111Z" />
|
|
</g>
|
|
);
|
|
case 'app-store':
|
|
return (
|
|
<g>
|
|
<path d="M12.2058 17.2207C11.9485 17.2394 11.707 17.2523 11.5 17.2523C10.1315 17.2523 7.64606 16.8628 4.77537 15.7674C4.4045 15.6265 4.21906 15.2111 4.35994 14.8402C4.50081 14.4679 4.91625 14.2796 5.28856 14.4248C7.97956 15.4512 10.3169 15.8148 11.5 15.8148C11.7171 15.8148 11.9844 15.7976 12.2734 15.7717C12.3524 14.7094 12.489 13.7118 12.673 12.9398H9.34375C8.947 12.9398 8.625 12.6178 8.625 12.2211C8.625 9.21529 9.92019 5.49072 11.3217 2.87735H0.71875C0.322 2.87735 0 3.19935 0 3.5961V19.4086C0 19.8053 0.322 20.1273 0.71875 20.1273H12.3194C12.2187 19.239 12.1842 18.2327 12.2058 17.2207ZM5.75 6.4711C5.75 6.07435 6.072 5.75235 6.46875 5.75235C6.8655 5.75235 7.1875 6.07435 7.1875 6.4711V7.9086C7.1875 8.30535 6.8655 8.62735 6.46875 8.62735C6.072 8.62735 5.75 8.30535 5.75 7.9086V6.4711Z" />
|
|
<path d="M22.2813 2.87735H12.9792C11.7113 5.03216 10.2968 8.54685 10.0884 11.5023H13.6563C13.9021 11.5023 14.1306 11.6274 14.2629 11.8344C14.3951 12.0428 14.4124 12.303 14.3074 12.5244C14.0156 13.1497 13.8259 14.2897 13.7267 15.5633C14.8609 15.3505 16.2294 14.9912 17.7129 14.4262C18.0809 14.2825 18.4992 14.4679 18.6401 14.8417C18.7824 15.2125 18.5969 15.628 18.2246 15.7688C16.5083 16.4229 14.9371 16.8225 13.6519 17.0396C13.6246 18.1537 13.6606 19.2562 13.754 20.1273H22.2813C22.678 20.1273 23 19.8053 23 19.4086V3.5961C23 3.19935 22.678 2.87735 22.2813 2.87735ZM15.8125 7.9086C15.8125 8.30535 15.4905 8.62735 15.0938 8.62735C14.697 8.62735 14.375 8.30535 14.375 7.9086V6.4711C14.375 6.07435 14.697 5.75235 15.0938 5.75235C15.4905 5.75235 15.8125 6.07435 15.8125 6.4711V7.9086Z" />
|
|
<path d="M14.1651 0.213652C13.8848 -0.0666602 13.4291 -0.0666602 13.1488 0.213652C12.5882 0.77284 11.9442 1.71585 11.3217 2.87735H12.9792C13.409 2.1471 13.8216 1.57209 14.1651 1.22997C14.4454 0.949653 14.4454 0.493965 14.1651 0.213652Z" />
|
|
<path d="M14.168 21.7776C13.9797 21.5706 13.8417 20.951 13.754 20.1273H12.3194C12.4588 21.365 12.7247 22.3684 13.1488 22.7925C13.2868 22.9305 13.4622 22.9966 13.639 22.9966C13.8172 22.9966 13.9984 22.9276 14.1407 22.7925C14.4224 22.5237 14.4282 22.0665 14.168 21.7776Z" />
|
|
</g>
|
|
);
|
|
case 'windows':
|
|
return (
|
|
<g>
|
|
<path d="M0 2.83167L7.7647 1.72197L7.76809 9.58155L0.00709303 9.62793L0 2.83167ZM7.761 10.4871L7.76703 18.3536L0.0060269 17.2338L0.00559175 10.4344L7.761 10.4871ZM8.70226 1.5768L18.9976 0V9.48159L8.70226 9.56736V1.5768ZM19 10.5611L18.9976 20L8.70224 18.4752L8.68781 10.5434L19 10.5611Z" />
|
|
</g>
|
|
);
|
|
case 'android':
|
|
return (
|
|
<g>
|
|
<path d="M1.98508 7.17365H1.92873C1.20629 7.17365 0.617249 7.76456 0.617249 8.48513V14.1951C0.617249 14.9185 1.20629 15.5075 1.92873 15.5075H1.98604C2.70848 15.5075 3.29752 14.9166 3.29752 14.1951V8.48508C3.29656 7.76456 2.70661 7.17365 1.98508 7.17365Z" />
|
|
<path d="M3.92507 16.399C3.92507 17.0623 4.46711 17.6024 5.13036 17.6024H6.41837V20.6866C6.41837 21.411 7.00928 22 7.72985 22H7.7862C8.5096 22 9.09956 21.41 9.09956 20.6866V17.6024H10.8996V20.6866C10.8996 21.411 11.4923 22 12.2129 22H12.2684C12.9917 22 13.5807 21.41 13.5807 20.6866V17.6024H14.8697C15.532 17.6024 16.074 17.0623 16.074 16.399V7.38312H3.92507V16.399Z" />
|
|
<path d="M13.0255 1.91553L14.0486 0.33634C14.1143 0.236737 14.0852 0.10055 13.9847 0.0357013C13.8851 -0.0300621 13.7489 -0.00279859 13.684 0.0995919L12.6234 1.73331C11.8277 1.40732 10.939 1.22414 10.0005 1.22414C9.06101 1.22414 8.17416 1.40732 7.37659 1.73331L6.31785 0.0995919C6.25304 -0.00279859 6.11585 -0.0300621 6.01534 0.0357013C5.91482 0.100506 5.88568 0.236737 5.95145 0.33634L6.97544 1.91553C5.1294 2.82023 3.88465 4.52533 3.88465 6.48125C3.88465 6.6015 3.89218 6.71987 3.9025 6.83729H16.0993C16.1097 6.71987 16.1162 6.6015 16.1162 6.48125C16.1163 4.52533 14.8706 2.82023 13.0255 1.91553ZM7.17273 4.74327C6.84861 4.74327 6.58556 4.48209 6.58556 4.15706C6.58556 3.83203 6.84861 3.57177 7.17273 3.57177C7.49871 3.57177 7.75989 3.83199 7.75989 4.15706C7.75989 4.48213 7.49684 4.74327 7.17273 4.74327ZM12.8273 4.74327C12.5032 4.74327 12.2401 4.48209 12.2401 4.15706C12.2401 3.83203 12.5032 3.57177 12.8273 3.57177C13.1523 3.57177 13.4135 3.83199 13.4135 4.15706C13.4135 4.48209 13.1523 4.74327 12.8273 4.74327Z" />
|
|
<path d="M18.0703 7.17365H18.0158C17.2934 7.17365 16.7025 7.76456 16.7025 8.48513V14.1951C16.7025 14.9185 17.2943 15.5075 18.0158 15.5075H18.0713C18.7946 15.5075 19.3827 14.9166 19.3827 14.1951V8.48508C19.3827 7.76456 18.7928 7.17365 18.0703 7.17365Z" />
|
|
</g>
|
|
);
|
|
default:
|
|
return null;
|
|
}
|
|
};
|
|
|
|
export default function Icon(props: Props) {
|
|
const { size = 32, glyph } = props;
|
|
|
|
return (
|
|
<SvgWrapper size={size} className="icon">
|
|
<InlineSvg
|
|
fillRule="evenodd"
|
|
clipRule="evenodd"
|
|
strokeLinejoin="round"
|
|
strokeMiterlimit="1.414"
|
|
xmlns="http://www.w3.org/2000/svg"
|
|
aria-label={glyph}
|
|
viewBox="0 0 32 32"
|
|
preserveAspectRatio="xMidYMid meet"
|
|
fit
|
|
>
|
|
<title>{glyph}</title>
|
|
<Glyph glyph={glyph} />
|
|
</InlineSvg>
|
|
</SvgWrapper>
|
|
);
|
|
}
|