import Grid from '@material-ui/core/Grid' ; import styled from 'styled-components' ; const NewSvg = styled . svg `
    height: intrinsic;
` ; export const Icon = ( { name , size } ) => { let width = size ? `${ size }rem` : `1rem` ; switch ( name ) { case "bolt" : return ( < NewSvg xmlns = "http://www.w3.org/2000/svg" viewBox = "0 0 43.429 67" width = { width } > < path data - name = "Icon awesome-bolt" d = "M38.428 21.688h-14.2l5.243-15.972A2.965 2.965 0 0026.616 2H8.897a2.957 2.957 0 00-2.928 2.559L2.031 34.091a2.958 2.958 0 002.929 3.347h14.605L13.893 61.37a2.95 2.95 0 005.426 2.153l21.656-37.406a2.947 2.947 0 00-2.547-4.43z" fill = "#ffe200" stroke = "#000" strokeWidth = "4" / > < /NewSvg>); case "cloud" : return ( < NewSvg xmlns = "http://www.w3.org/2000/svg" viewBox = "0 0 114.464 70.125" width = { width } > < g stroke = "#000" strokeWidth = "4" > < path data - name = "Icon awesome-cloud" d = "M97.35 30.723A14.186 14.186 0 0084.125 11.45a14.1 14.1 0 00-7.867 2.391A23.618 23.618 0 0032.17 25.616c0 .4.015.8.03 1.2a21.26 21.26 0 007.055 41.313h54.316a18.892 18.892 0 003.779-37.4z" fill = "#72757e" / > < path data - name = "Icon awesome-cloud" d = "M81.35 30.723A14.186 14.186 0 0068.125 11.45a14.1 14.1 0 00-7.867 2.391A23.618 23.618 0 0016.17 25.616c0 .4.015.8.03 1.2a21.26 21.26 0 007.055 41.313h54.316a18.892 18.892 0 003.779-37.4z" fill = "#f7f7f7" / > < /g></NewSvg > ) ; case "screens" : return ( < NewSvg xmlns = "http://www.w3.org/2000/svg" viewBox = "0 0 104.5 77.6" width = { width } > < g data - name = "Browser icon" stroke = "#000" strokeWidth = "2" > < g data - name = "Rectangle 2" fill = "#72757e" > < rect width = "104" height = "70" rx = "4" stroke = "none" / > < rect x = "1" y = "1" width = "102" height = "68" rx = "3" fill = "none" / > < /g><path data-name="Tracé 6" d="M.5 20.5h104" fill="none"/ > < g data - name = "Ellipse 3" transform = "translate(6 6)" fill = "#e63e3e" > < circle cx = "5" cy = "5" r = "5" stroke = "none" / > < circle cx = "5" cy = "5" r = "4" fill = "none" / > < /g><g data-name="Ellipse 10" transform="translate(20 6)" fill="#e6bf3e"><circle cx="5" cy="5" r="5" stroke="none"/ > < circle cx = "5" cy = "5" r = "4" fill = "none" / > < /g><g data-name="Ellipse 11" transform="translate(34 6)" fill="#3ee651"><circle cx="5" cy="5" r="5" stroke="none"/ > < circle cx = "5" cy = "5" r = "4" fill = "none" / > < /g></g > < path data - name = "Icon awesome-mobile" d = "M88.387 16.728H62.193a5.614 5.614 0 00-5.613 5.613v48.646a5.614 5.614 0 005.613 5.613h26.194A5.614 5.614 0 0094 70.987V22.341a5.614 5.614 0 00-5.613-5.613zM75.29 72.858a3.742 3.742 0 113.742-3.742 3.738 3.738 0 01-3.742 3.742z" fill = "#72757e" stroke = "#000" strokeWidth = "2" / > < g data - name = "Rectangle 3" transform = "translate(60 20)" fill = "#16161a" stroke = "#000" strokeWidth = "2" > < rect width = "31" height = "43" rx = "5" stroke = "none" / > < rect x = "1" y = "1" width = "29" height = "41" rx = "4" fill = "none" / > < /g><g data-name="Rectangle 6" transform="translate(60 20)" fill="#f7f7f7" stroke="#000" strokeWidth="2"><rect width="31" height="43" rx="5" stroke="none"/ > < rect x = "1" y = "1" width = "29" height = "41" rx = "4" fill = "none" / > < /g><g data-name="Rectangle 9" transform="translate(67 55)" fill="#7f5af0" stroke="#000" strokeWidth="2"><rect width="16" height="5" rx="2.5" stroke="none"/ > < rect x = "1" y = "1" width = "14" height = "3" rx = "1.5" fill = "none" / > < /g><g data-name="Tracé 5" fill="#2cb67d"><path d="M74.467 32.858c-1.856 0-3.366-1.407-3.366-3.137 0-1.729 1.51-3.136 3.366-3.136s3.366 1.407 3.366 3.136c0 1.73-1.51 3.137-3.366 3.137z"/ > < path d = "M74.467 27.585c-1.305 0-2.366.958-2.366 2.136 0 1.178 1.061 2.137 2.366 2.137 1.305 0 2.366-.959 2.366-2.137s-1.061-2.136-2.366-2.136m0-2c2.411 0 4.366 1.852 4.366 4.136 0 2.285-1.955 4.137-4.366 4.137-2.411 0-4.366-1.852-4.366-4.137 0-2.284 1.955-4.136 4.366-4.136z" / > < /g><g data-name="Ellipse 7" transform="translate(72 28)" fill="#7f5af0" stroke="#000" strokeWidth="2"><circle cx="4" cy="4" r="4" stroke="none"/ > < circle cx = "4" cy = "4" r = "3" fill = "none" / > < /g></NewSvg > ) ; case "finger" : return ( < NewSvg xmlns = "http://www.w3.org/2000/svg" viewBox = "0 0 58.921 58.926" width = { width } > < path data - name = "Icon awesome-fingerprint" d = "M29.476 28.347a2.668 2.668 0 00-2.668 2.668 81.3 81.3 0 01-3.08 23.521 2.668 2.668 0 105.138 1.442 86.053 86.053 0 003.278-24.963 2.667 2.667 0 00-2.667-2.668zm-.1-9.087A11.121 11.121 0 0017.911 30.5a72.946 72.946 0 01-1.487 15.849 2.668 2.668 0 105.226 1.081 78.277 78.277 0 001.6-17.013A5.793 5.793 0 0129.3 24.6a6.435 6.435 0 016.406 6.167 89.386 89.386 0 01-1.18 15.96 2.667 2.667 0 105.263.868 94.84 94.84 0 001.253-16.912A11.812 11.812 0 0029.38 19.26zm-12.307-2.2a2.671 2.671 0 00-3.754.387A19.284 19.284 0 009.012 29.9 64.57 64.57 0 018 42.358a2.669 2.669 0 005.253.948 69.932 69.932 0 001.1-13.49 13.741 13.741 0 013.113-9 2.67 2.67 0 00-.393-3.755zm12.176-6.93a19.874 19.874 0 00-5.09.553 2.67 2.67 0 101.23 5.195 15.957 15.957 0 013.78-.41c8.387.126 15.313 6.838 15.441 14.963a97.961 97.961 0 01-.62 12.634 2.669 2.669 0 005.3.608 103.3 103.3 0 00.655-13.325c-.172-10.98-9.457-20.048-20.696-20.218zm28.026 13.5a2.668 2.668 0 10-5.211 1.15 27.725 27.725 0 01.523 6.849 2.668 2.668 0 002.646 2.691h.022a2.668 2.668 0 002.668-2.646 33.04 33.04 0 00-.648-8.043zM52.81 13.547A29.576 29.576 0 0029.108 1 27.849 27.849 0 008.834 9.11a26.516 26.516 0 00-7.819 19.314L1 30.811a2.667 2.667 0 002.59 2.745h.08a2.669 2.669 0 002.665-2.591l.018-2.628a21.211 21.211 0 016.257-15.455A22.532 22.532 0 0129.03 6.34a24.222 24.222 0 0119.415 10.272 2.667 2.667 0 104.365-3.065z" fill = "none" stroke = "#7e59ef" strokeWidth = "2" / > < /NewSvg>); case "human-bot" : return ( < NewSvg xmlns = "http://www.w3.org/2000/svg" viewBox = "0 0 89.626 71.219" width = { width } > < g stroke = "#000" strokeWidth = "2" > < path data - name = "Icon awesome-robot" d = "M29.603 24.609v11.8a2.948 2.948 0 002.951 2.951h2.949V21.658h-2.949a2.948 2.948 0 00-2.951 2.951zM72.395 9.854H62.066v-5.9a2.951 2.951 0 10-5.9 0v5.9H45.834a7.376 7.376 0 00-7.378 7.378v25.084a5.908 5.908 0 005.9 5.9h29.515a5.908 5.908 0 005.9-5.9V17.231a7.376 7.376 0 00-7.376-7.377zM53.212 39.365h-5.9v-2.951h5.9zM50.261 28.3a3.689 3.689 0 113.689-3.689 3.688 3.688 0 01-3.689 3.689zm11.8 11.067h-5.9v-2.953h5.9zm8.854 0h-5.9v-2.953h5.9zM67.968 28.3a3.689 3.689 0 113.689-3.689 3.688 3.688 0 01-3.689 3.689zm17.707-6.64h-2.951v17.705h2.951a2.948 2.948 0 002.951-2.951v-11.8a2.948 2.948 0 00-2.951-2.956z" fill = "#7e59ef" / > < path data - name = "Icon awesome-user-alt" d = "M32.481 42.674a17.708 17.708 0 10-17.708-17.708 17.712 17.712 0 0017.708 17.708zm15.74 3.935h-6.776a21.406 21.406 0 01-17.929 0H16.74A15.739 15.739 0 001 62.349v1.968a5.9 5.9 0 005.9 5.9h51.159a5.9 5.9 0 005.9-5.9v-1.968a15.739 15.739 0 00-15.738-15.74z" fill = "#f7f7f7" / > < g data - name = "Ellipse 8" transform = "translate(22.3 17.758)" fill = "#fff" > < circle cx = "3.5" cy = "3.5" r = "3.5" stroke = "none" / > < circle cx = "3.5" cy = "3.5" r = "2.5" fill = "none" / > < /g><g data-name="Ellipse 9" transform="translate(35.3 17.758)" fill="#fff"><circle cx="3.5" cy="3.5" r="3.5" stroke="none"/ > < circle cx = "3.5" cy = "3.5" r = "2.5" fill = "none" / > < /g></g > < /NewSvg>); case "recaptcha" : return ( < NewSvg xmlns = "http://www.w3.org/2000/svg" viewBox = "0 0 256 244" width = { width } > < path d = "M211.3 84.966l-.087-3.652V12.25L192.12 31.344C176.495 12.217 152.723 0 126.097 0 98.387 0 73.77 13.226 58.2 33.7l31.295 31.624A41.851 41.851 0 01102.182 51.1c5.464-4.264 13.205-7.75 23.914-7.75 1.294 0 2.292.15 3.026.436 13.268 1.047 24.77 8.37 31.54 18.998L138.5 84.946l72.788.014" fill = "#1c3aa9" / > < path d = "M125.6.003L121.947.1H52.885l19.093 19.093C52.85 34.8 40.633 58.58 40.633 85.207c0 27.7 13.226 52.326 33.7 67.888l31.624-31.295a41.46 41.46 0 01-14.223-12.677c-4.263-5.464-7.75-13.205-7.75-23.914 0-1.294.15-2.292.436-3.026 1.047-13.268 8.37-24.77 18.998-31.54l22.152 22.152.014-72.788" fill = "#4285f4" / > < path d = "M40.636 85.205l.087 3.652v69.062l19.093-19.093c15.626 19.127 39.398 31.344 66.024 31.344 27.7 0 52.326-13.226 67.888-33.7l-31.295-31.624a41.46 41.46 0 01-12.677 14.223c-5.464 4.264-13.205 7.75-23.914 7.75-1.294 0-2.292-.15-3.026-.436-13.268-1.047-24.77-8.37-31.54-18.998l22.152-22.152c-28.06.1-59.756.175-72.788-.014" fill = "#ababab" / > < path d = "M55.013 203.168c-2.075 0-3.936.394-5.582 1.18a11.57 11.57 0 00-4.187 3.301c-1.127 1.43-1.995 3.167-2.603 5.206-.6 2.022-.886 4.285-.886 6.8v7.22c0 2.523.295 4.795.886 6.817.608 2.022 1.467 3.748 2.576 5.18s2.45 2.532 4.026 3.3 3.346 1.154 5.314 1.154c2.022 0 3.793-.295 5.314-.886 1.54-.6 2.827-1.44 3.865-2.55 1.038-1.127 1.834-2.487 2.4-4.08.573-1.592.912-3.4 1.02-5.42H62.18c-.125 1.557-.34 2.9-.644 4s-.75 1.995-1.342 2.7c-.573.698-1.324 1.217-2.254 1.557-.912.322-2.04.483-3.38.483-1.43 0-2.648-.313-3.65-.94-1.002-.644-1.816-1.52-2.442-2.63-.608-1.1-1.056-2.406-1.342-3.9-.268-1.485-.403-3.086-.403-4.804v-7.273c0-1.843.16-3.516.483-5.02.34-1.503.85-2.782 1.53-3.838s1.54-1.87 2.576-2.442c1.038-.6 2.272-.886 3.704-.886 1.2 0 2.227.18 3.086.537.86.34 1.574.877 2.147 1.6.573.716 1 1.628 1.315 2.737s.5 2.433.617 3.972h4.965c-.1-2.1-.42-3.98-.993-5.6s-1.37-2.997-2.4-4.106-2.263-1.95-3.73-2.523c-1.45-.573-3.122-.86-5.02-.86zm121.2 0c-2.075 0-3.936.394-5.582 1.18a11.57 11.57 0 00-4.187 3.301c-1.127 1.43-1.995 3.167-2.603 5.206-.6 2.022-.886 4.285-.886 6.8v7.22c0 2.523.295 4.795.886 6.817.608 2.022 1.467 3.748 2.576 5.18s2.45 2.532 4.026 3.3 3.346 1.154 5.314 1.154c2.022 0 3.793-.295 5.314-.886 1.54-.6 2.827-1.44 3.865-2.55 1.038-1.127 1.834-2.487 2.4-4.08.573-1.592.912-3.4 1.02-5.42h-4.965c-.125 1.557-.34 2.9-.644 4s-.75 1.995-1.342 2.7c-.573.698-1.324 1.217-2.254 1.557-.912.322-2.04.483-3.38.483-1.43 0-2.648-.313-3.65-.94-1.002-.644-1.816-1.52-2.442-2.63-.608-1.1-1.056-2.406-1.342-3.9-.268-1.485-.403-3.086-.403-4.804v-7.273c0-1.843.16-3.516.483-5.02.34-1.503.85-2.782 1.53-3.838s1.54-1.87 2.576-2.442c1.038-.6 2.272-.886 3.704-.886 1.2 0 2.227.18 3.086.537.86.34 1.574.877 2.147 1.6.573.716 1 1.628 1.315 2.737s.5 2.433.617 3.972h4.965c-.1-2.1-.42-3.98-.993-5.6s-1.37-2.997-2.4-4.106-2.263-1.95-3.73-2.523c-1.45-.573-3.122-.86-5.02-.86zm-92.9.537L70.715 242.78h5.045l3.033-10.198h13.204l3.086 10.198h5.045l-12.614-39.075zm22.14 0v39.075h4.9v-15.297h7.54c1.88 0 3.543-.26 4.992-.778 1.45-.537 2.666-1.306 3.65-2.308 1.002-1.002 1.753-2.236 2.254-3.704.52-1.485.778-3.167.778-5.045 0-1.736-.26-3.328-.778-4.777-.5-1.467-1.243-2.728-2.227-3.784-.984-1.073-2.2-1.905-3.677-2.496-1.45-.6-3.113-.886-4.992-.886zm27.884 0v4.24h10.252v34.835h4.9v-34.835h10.28v-4.24zm61.646 0v39.075h4.9v-18.062H215.6v18.062h4.938v-39.075H215.6v16.8h-15.727v-16.8zm44.2 0l-12.587 39.075h5.045l3.033-10.198h13.204l3.086 10.198H256l-12.614-39.075zm-128.82 4.24h7.54c1.2 0 2.218.215 3.06.644a5.82 5.82 0 012.093 1.718c.555.716.957 1.548 1.208 2.496.268.93.403 1.897.403 2.9 0 1.1-.134 2.13-.403 3.06-.25.912-.653 1.7-1.208 2.4-.537.662-1.235 1.18-2.093 1.557-.84.376-1.86.564-3.06.564h-7.54zm-24.958 2.63l5.34 17.766H80.08zm155.87 0l5.34 17.766H235.95zM10.1 213.205c-1.235 0-2.3.313-3.194.94-.877.626-1.6 1.476-2.2 2.55l-.08-2.952H0v29.038h4.75v-20.773c.447-1.235 1.082-2.2 1.905-2.925.84-.716 1.905-1.073 3.194-1.073l1.1.054a8.14 8.14 0 011.047.134l-.027-4.616a1.592 1.592 0 00-.35-.107 3.09 3.09 0 00-.483-.134 5.105 5.105 0 00-.564-.08 2.483 2.483 0 00-.483-.054zm15.968 0a11.31 11.31 0 00-4 .725c-1.3.483-2.433 1.28-3.435 2.4-.984 1.1-1.78 2.523-2.4 4.294-.608 1.753-.912 3.9-.912 6.468v3.274c0 2.218.26 4.142.778 5.77s1.26 2.98 2.227 4.053c.984 1.056 2.174 1.843 3.57 2.362s2.96.778 4.697.778c1.252 0 2.37-.125 3.355-.376 1.002-.25 1.888-.573 2.657-.966.77-.412 1.43-.877 1.986-1.396s1.03-1.056 1.422-1.6l-2.47-3.006c-.394.483-.814.93-1.26 1.342-.447.394-.94.743-1.476 1.047a8.2 8.2 0 01-1.77.67c-.643.17-1.37.242-2.174.242-2.2 0-3.9-.707-5.072-2.12-1.163-1.413-1.744-3.677-1.744-6.8v-.67h16.2v-2.764c0-2.218-.188-4.178-.564-5.878s-.975-3.13-1.798-4.294a7.79 7.79 0 00-3.167-2.63c-1.288-.608-2.845-.912-4.67-.912zm0 4.08c1.038 0 1.897.188 2.576.564a4.15 4.15 0 011.61 1.583c.412.68.707 1.494.886 2.442.197.93.322 1.96.376 3.086v.644H20.074c.072-1.628.268-2.98.6-4.053s.743-1.923 1.26-2.55c.537-.644 1.154-1.1 1.852-1.342s1.458-.376 2.28-.376z" fill = "#a6a6a6" / > < /NewSvg>); default : return ( < NewSvg > < /NewSvg>); } return ( < NewSvg > < /NewSvg>); } ; export const GridItem = styled ( Grid ) `
    @media only screen and (min-width: 520px){
        padding: 32px 8rem !important;
    }
    @media only screen and (min-width: 960px) and (max-width: 1200px){
        padding: 32px !important;
    }
` ;