@dsb.dk/designsystem
Version:
Development environment for creating components to the DSB Designsystem.
55 lines (50 loc) • 12.7 kB
JavaScript
import { T } from '../lit-element-a21c046d.js';
// THIS FILE IS AUTOGENERATED
function getIcon(name) {
if (name === "arrow--left") {
return T` <svg xmlns="http://www.w3.org/2000/svg" style="transform: rotate(180deg)" data-name="Layer 1" viewBox="0 0 30 30"> <path d="M30 15L20 25h-7l8-8H0v-4h21l-8-8h7l10 10z"/> </svg> ` }
if (name === "arrow--right") {
return T` <svg xmlns="http://www.w3.org/2000/svg" data-name="Layer 1" viewBox="0 0 30 30"> <path d="M30 15L20 25h-7l8-8H0v-4h21l-8-8h7l10 10z"/> </svg> ` }
if (name === "brand-shape") {
return T` <svg xmlns="http://www.w3.org/2000/svg" xmlns:xlink="http://www.w3.org/1999/xlink" viewBox="0 0 1440 539"> <defs> <path id="a" d="M1440 150v448.7L344.36 687.69a400 400 0 01-105.3-5.4L0 637.98V150h1440z"/> </defs> <use fill-rule="evenodd" transform="translate(0 -150)" xlink:href="#a"/> </svg> ` }
if (name === "burger") {
return T` <svg xmlns="http://www.w3.org/2000/svg" viewBox="0 -53 384 384"> <path d="M368 155H16a16 16 0 010-32h352a16 16 0 010 32zm0 0M368 32H16a16 16 0 010-32h352a16 16 0 010 32zm0 0M368 277H16a16 16 0 010-32h352a16 16 0 010 32zm0 0"/> </svg> ` }
if (name === "check") {
return T` <svg xmlns="http://www.w3.org/2000/svg" viewBox="0 0 449 449"> <path d="M143 324L36 217 0 252l143 143L449 89l-36-35z"/> </svg> ` }
if (name === "cross") {
return T` <svg xmlns="http://www.w3.org/2000/svg" viewBox="0 0 512 512"> <path d="M284.29 256L506.14 34.14a20 20 0 10-28.28-28.28L256 227.72 34.14 5.86A20 20 0 105.86 34.14L227.7 256 5.87 477.86a20 20 0 1028.28 28.28L256 284.3l221.86 221.85c3.9 3.9 9.02 5.86 14.14 5.86s10.24-1.95 14.14-5.86a20 20 0 000-28.28L284.3 256z"/> </svg> ` }
if (name === "customerservice") {
return T` <svg xmlns="http://www.w3.org/2000/svg" viewBox="0 0 60 60"> <path fill-rule="evenodd" d="M41.9 5C43 5 44 6 44 7.1V53c0 1.1-1 2.1-2.1 2.1H18C17 55 16 54 16 52.9V7C16 6 17 5 18.1 5H42zm-9.7 45.8h-4.4V53h4.4v-2zm9.6-39.5H18.2v37.5h23.6V11.3zM33.2 8h-6.4v1h6.4v-1z"/> </svg> ` }
if (name === "dsb-logo--outlined") {
return T` <!-- [fix this] - i've just added a stroke, nothing official --> <svg xmlns="http://www.w3.org/2000/svg" viewBox="-10 0 246.113 200.749"> <path d="M220.363 87.264l-42.885-74.168C172.42 4.362 164.776 0 154.786 0H69.25C59.264 0 51.61 4.362 46.555 13.096L3.749 87.264c-5.031 8.746-4.974 17.555.026 26.201l42.78 74.188c5.057 8.735 12.71 13.096 22.695 13.096h85.537c9.99 0 17.635-4.361 22.692-13.096l42.857-74.188c5.004-8.646 5.058-17.455.03-26.201" stroke-width="6" stroke="white" fill="none"></path> <path fill="#fff" d="M169.19 117.857h-9.121v-14.969h6.353c8.797 0 12.38 2.185 12.38 8.066 0 5.05-3.422 6.903-9.612 6.903m-9.121-37.704h6.272c5.291 0 10.584.423 10.584 6.074 0 6.259-4.394 7.461-11.237 7.461h-5.62V80.153zm19.546 18.287v-2.11c7.655-.982 10.75-5.58 10.75-11.76 0-11.76-11.077-14.024-21.256-14.024h-22.478v57.217h21.828c11.482 0 24.27-1.66 24.27-16.433 0-8.592-6.68-12.061-13.114-12.89m-64.779 30.228c-7.082 0-13.273-.603-20.278-2.27v-10.359c6.19 1.292 10.751 1.97 16.941 1.97 6.272 0 12.299-.917 12.299-7.248 0-12.815-28.67-1.618-28.67-24.836 0-12.437 11.238-16.282 22.885-16.282 5.459 0 10.912.454 16.37 1.112v10.058c-4.968-.66-8.306-.962-13.272-.962-5.136 0-11.65-.18-11.65 5.698 0 10.704 29.237 2.188 29.237 24.575 0 14.247-12.377 18.544-23.862 18.544m-58.587-11.036h-6.76V80.756h7.492c7.005 0 18.16 2.381 18.16 17.835 0 13.644-7.328 19.041-18.892 19.041m2.036-47.086H35.48v57.217h24.516c6.351 0 29.4-4.07 29.4-28.722 0-23.594-15.717-28.495-31.11-28.495"></path> </svg> ` }
if (name === "dsb-logo") {
return T` <svg xmlns="http://www.w3.org/2000/svg" viewBox="0 0 224.113 200.749"> <path d="M220.363 87.264l-42.885-74.168C172.42 4.362 164.776 0 154.786 0H69.25C59.264 0 51.61 4.362 46.555 13.096L3.749 87.264c-5.031 8.746-4.974 17.555.026 26.201l42.78 74.188c5.057 8.735 12.71 13.096 22.695 13.096h85.537c9.99 0 17.635-4.361 22.692-13.096l42.857-74.188c5.004-8.646 5.058-17.455.03-26.201"/> <path fill="#fff" d="M169.19 117.857h-9.121v-14.969h6.353c8.797 0 12.38 2.185 12.38 8.066 0 5.05-3.422 6.903-9.612 6.903m-9.121-37.704h6.272c5.291 0 10.584.423 10.584 6.074 0 6.259-4.394 7.461-11.237 7.461h-5.62V80.153zm19.546 18.287v-2.11c7.655-.982 10.75-5.58 10.75-11.76 0-11.76-11.077-14.024-21.256-14.024h-22.478v57.217h21.828c11.482 0 24.27-1.66 24.27-16.433 0-8.592-6.68-12.061-13.114-12.89m-64.779 30.228c-7.082 0-13.273-.603-20.278-2.27v-10.359c6.19 1.292 10.751 1.97 16.941 1.97 6.272 0 12.299-.917 12.299-7.248 0-12.815-28.67-1.618-28.67-24.836 0-12.437 11.238-16.282 22.885-16.282 5.459 0 10.912.454 16.37 1.112v10.058c-4.968-.66-8.306-.962-13.272-.962-5.136 0-11.65-.18-11.65 5.698 0 10.704 29.237 2.188 29.237 24.575 0 14.247-12.377 18.544-23.862 18.544m-58.587-11.036h-6.76V80.756h7.492c7.005 0 18.16 2.381 18.16 17.835 0 13.644-7.328 19.041-18.892 19.041m2.036-47.086H35.48v57.217h24.516c6.351 0 29.4-4.07 29.4-28.722 0-23.594-15.717-28.495-31.11-28.495"/> </svg> ` }
if (name === "dsbplus") {
return T` <svg xmlns="http://www.w3.org/2000/svg" viewBox="0 0 60 60"> <g fill-rule="evenodd"> <path d="M42.7 4v5.7H37V14h5.7v5.7H47V14h5.7V9.7H47V4zM44.7 29c0-1.3-1.2-1.6-2.3-1.6H41v3.4h1.2c1.5 0 2.5-.3 2.5-1.8M42.4 32.9H41v3.7h2c1.3 0 2-.7 2-1.8 0-1.4-.7-1.9-2.6-1.9"/> <path d="M42.8 38.7h-4.6V25.4H43c2.2 0 4.5.5 4.5 3.3 0 1.4-.6 2.5-2.3 2.7v.5c1.4.2 2.9 1 2.9 3 0 3.4-2.8 3.8-5.3 3.8m-12.4.2c-1.5 0-2.9-.2-4.4-.4v-2.2c1.4.1 2.3.3 3.7.3 1.3 0 2.6-.3 2.6-1.8 0-3-6.2-.4-6.2-5.8 0-3 2.5-3.8 5-3.8l3.5.2v2.1l-2.9-.1c-1 0-2.5 0-2.5 1.4 0 2.5 6.3.6 6.3 5.8 0 3.3-2.7 4.3-5.1 4.3m-12.5-.2h-5.3V25.4h5c3.2 0 6.6 1.1 6.6 6.6 0 5.7-5 6.7-6.3 6.7m32.7-16.1h-11V17H34V9.7H20.5c-2 0-3.9 1-4.9 2.8L5.8 29.6c-1 1.8-1 4 0 5.7l9.8 17c1 1.8 2.9 2.9 5 2.9h19.6c2 0 4-1.1 5-2.8L55 35.3c1-1.8 1-4 0-5.7l-4.4-7z"/> <path d="M17.3 27.6h-1.6v9H17c2.5 0 4-1.5 4-4.7 0-3.6-2.3-4.3-3.8-4.3"/> </g> </svg> ` }
if (name === "flag--denmark") {
return T` <svg xmlns="http://www.w3.org/2000/svg" viewBox="0 0 512 512"> <circle cx="256" cy="256" r="256" fill="#f0f0f0"/> <g fill="#d80027"> <path d="M200.3 222.6h309.5A256 256 0 00200.3 6.1v216.5zM133.6 222.6V31.1A256.2 256.2 0 002.2 222.6h131.4zM133.6 289.4H2.2a256.2 256.2 0 00131.4 191.5V289.4zM200.3 289.4v216.5a256 256 0 00309.5-216.5H200.3z"/> </g> </svg> ` }
if (name === "flag--england") {
return T` <svg xmlns="http://www.w3.org/2000/svg" viewBox="0 0 512 512"> <circle cx="256" cy="256" r="256" fill="#f0f0f0"/> <g fill="#0052b4"> <path d="M53 100.1a255 255 0 00-44.2 89.1H142l-89-89zM503.2 189.2a255 255 0 00-44.1-89l-89.1 89h133.2zM8.8 322.8a255 255 0 0044.1 89l89-89H9zM411.9 53a255 255 0 00-89.1-44.2V142l89-89zM100.1 459a255 255 0 0089.1 44.2V370l-89 89zM189.2 8.8a255 255 0 00-89 44.1l89 89V9zM322.8 503.2a255 255 0 0089-44.1l-89-89.1v133.2zM370 322.8l89 89a255 255 0 0044.2-89H370z"/> </g> <g fill="#d80027"> <path d="M509.8 222.6H289.4V2.2a258.6 258.6 0 00-66.8 0v220.4H2.2a258.6 258.6 0 000 66.8h220.4v220.4a258.5 258.5 0 0066.8 0V289.4h220.4a258.5 258.5 0 000-66.8z"/> <path d="M322.8 322.8L437 437c5.3-5.2 10.3-10.7 15-16.4l-97.7-97.8h-31.5zM189.2 322.8L75 437c5.2 5.3 10.7 10.3 16.4 15l97.8-97.7v-31.5zM189.2 189.2L75 75a256.6 256.6 0 00-15 16.4l97.7 97.8h31.5zM322.8 189.2L437 75a256.3 256.3 0 00-16.4-15l-97.8 97.7v31.5z"/> </g> </svg> ` }
if (name === "magnifying-glass") {
return T` <svg xmlns="http://www.w3.org/2000/svg" viewBox="0 0 451 451"> <path d="M447 428L337.6 318.4A192.5 192.5 0 00192.4 0C86.3 0 0 86.3 0 192.3s86.3 192.3 192.3 192.3c48.2 0 92.3-17.8 126-47.2L428.2 447a13.2 13.2 0 0019 0 13.5 13.5 0 000-19zM27 192.3C27 101.1 101 27 192.3 27c91.1 0 165.3 74.2 165.3 165.3s-74.2 165.4-165.4 165.4A165.6 165.6 0 0127 192.3z"/> </svg> ` }
if (name === "pause") {
return T` <svg xmlns="http://www.w3.org/2000/svg" viewBox="0 0 477.87 477.87"> <path d="M187.73 0H51.2a17.07 17.07 0 00-17.07 17.07V460.8c0 9.43 7.64 17.07 17.07 17.07h136.53c9.43 0 17.07-7.64 17.07-17.07V17.07C204.8 7.64 197.16 0 187.73 0zM426.67 0H290.13a17.07 17.07 0 00-17.06 17.07V460.8c0 9.43 7.64 17.07 17.06 17.07h136.54c9.42 0 17.06-7.64 17.06-17.07V17.07C443.73 7.64 436.1 0 426.67 0z"/> </svg> ` }
if (name === "percent") {
return T` <svg xmlns="http://www.w3.org/2000/svg" viewBox="0 0 60 60"> <path fill-rule="nonzero" d="M25.5 51L42.1 9.3h-6.6L33.9 13h-9c-1.7-2.9-4.8-4.5-9.2-4.5C8.7 8.6 5 12.8 5 19.2 5 25.8 8.7 30 15.7 30c7 0 10.6-4.1 10.6-10.7v-1.4H32L18.7 51h6.8zm-9.8-26.2c-3.3 0-4.1-2.6-4.1-5.6 0-3 .8-5.5 4-5.5 3.5 0 4.2 2.5 4.2 5.5s-.8 5.6-4 5.6zm29.4 26.9c7 0 10.5-4.1 10.5-10.7 0-6.5-3.5-10.6-10.6-10.6-7 0-10.6 4.2-10.6 10.6 0 6.6 3.6 10.7 10.7 10.7zm0-5C41.7 46.7 41 44 41 41s.8-5.5 4-5.5c3.4 0 4.1 2.6 4.1 5.5 0 3-.7 5.7-4 5.7z"/> </svg> ` }
if (name === "pin") {
return T` <svg xmlns="http://www.w3.org/2000/svg" viewBox="0 0 512 512"> <path d="M256 0C154 0 71 83 71 185c0 127 166 314 173 321 6 8 18 8 24 0 7-7 173-194 173-321C441 83 358 0 256 0zm0 279a93 93 0 110-187 93 93 0 010 187z"/> </svg> ` }
if (name === "play") {
return T` <svg xmlns="http://www.w3.org/2000/svg" viewBox="0 0 320 320"> <path d="M295.84 146.05l-256-144A15.99 15.99 0 0016 16v288a15.99 15.99 0 0023.84 13.95l256-144c5.02-2.85 8.16-8.16 8.16-13.95s-3.14-11.1-8.16-13.95z"/> </svg> ` }
if (name === "plus") {
return T` <svg xmlns="http://www.w3.org/2000/svg" viewBox="0 0 448 448"> <path d="M272 184a8 8 0 01-8-8V0h-80v176a8 8 0 01-8 8H0v80h176a8 8 0 018 8v176h80V272a8 8 0 018-8h176v-80zm0 0"/> </svg> ` }
if (name === "ticketservice") {
return T` <svg xmlns="http://www.w3.org/2000/svg" viewBox="0 0 60 60"> <g fill-rule="evenodd"> <path d="M27.2 8.6H13.1a.9.9 0 01-.9-.9c0-.5.4-.9.9-.9h14.1c.5 0 .9.4.9 1 0 .4-.4.8-.9.8zm0 4.4H13.1a.9.9 0 01-.9-1c0-.4.4-.8.9-.8h14.1c.5 0 .9.4.9.9s-.4.9-.9.9zm-9.9 18.6h-4.7v-1.2l1.5-.1v-4.6l-1.5-.2v-1l2-.6h1.1v6.4h1.6v1.3zM10 4.6v35.3h13l.4-3.6H13.2a.9.9 0 01-1-1c0-.4.5-.8 1-.8h10.4l2.7-20.2 4 .6V4.6H10z"/> <path d="M44.8 24l-14-2a1 1 0 01-.7-1c0-.5.5-.8 1-.8l13.8 1.9c.5 0 .9.5.8 1 0 .5-.4.8-.9.8zm-.5 4.4h-.1l-14-1.9a1 1 0 01-.7-1c.1-.5.5-.9 1-.8l14 1.9c.4 0 .7.5.7 1-.1.4-.5.8-.9.8zm-2.6 23.4l-14-1.9a1 1 0 01-.7-1c0-.5.5-.8 1-.8L41.8 50c.5 0 .9.5.8 1 0 .5-.4.8-.9.8zm-14-8c1-.8 3.3-2.4 3.4-3.8.1-.8-.3-1.2-1.2-1.3l-1.4-.2.2-1.2 2 .1c1.4.2 2.5.8 2.3 2.5-.2 1.7-2.2 3-3.5 4l3.2.5-.1 1.3-5.1-.7.1-1.3zm.9-26.3L24 53.1l20 2.7 4.3-35.6-19.7-2.7z"/> </g> </svg> ` }
if (name === "trafficinfo") {
return T` <svg xmlns="http://www.w3.org/2000/svg" viewBox="0 0 60 60"> <g fill-rule="evenodd"> <path d="M30.8 51.5H20.2l1.5-2h17.6l1.4 2h-9.9zm8.3-6.5h-3l1.6 2.3H23.3l1.5-2.3h-3L14 56h3l1.6-2.1H42.4l1.7 2.1H47l-7.9-11zM30.5 27.2l-14.8-.3.3-8s-.4-7 9-7h11c9.4 0 9 7 9 7l.3 8-14.8.3zm9.3 12.1a3 3 0 01-2.9-2.9 3 3 0 013-2.8 3 3 0 012.9 2.8 3 3 0 01-3 3zm-18.8 0a3 3 0 01-3-2.9 3 3 0 013-2.8 3 3 0 012.9 2.8 3 3 0 01-3 3zM30.5 6c1.6 0 2.8.8 2.8 1.8s-1.2 1.9-2.8 1.9c-1.6 0-2.8-.9-2.8-1.9 0-1 1.2-1.8 2.8-1.8zm17.4 16.2s-.2-8-2.5-13.4C43.2 3.5 30.8 4 30.5 4c-.3 0-12.7-.5-15 4.8-2.2 5.4-2.4 13.4-2.4 13.4s-.6 17 1.7 19c2.3 2.2 3.4 1.8 6.7 1.8h18c3.3 0 4.4.4 6.7-1.7 2.3-2.2 1.7-19 1.7-19z"/> </g> </svg> ` }
if (name === "user") {
return T` <svg xmlns="http://www.w3.org/2000/svg" viewBox="0 0 512 512"> <path d="M437 331c-28-28-61-49-97-61a148 148 0 10-168 0A255 255 0 000 512h40a216 216 0 01432 0h40c0-68-27-133-75-181zm-181-75a108 108 0 110-216 108 108 0 010 216z"/> </svg> ` }
if (name === "world") {
return T` <svg xmlns="http://www.w3.org/2000/svg" viewBox="0 0 31.4 31.4"> <path d="M28.8 7l-.5.1-2.5.2-.7 1.2-.5-.2-2-1.8-.3-1-.4-1-1.3-1-1.4-.3v.6l1.4 1.5.7.8-.8.4-.7-.2-1-.4.1-.8-1.3-.5-.4 1.8-1.3.3.1 1 1.7.4.3-1.7 1.4.2.6.4h1l.8 1.4 1.8 2-.1.7-1.5-.2-2.6 1.3-1.9 2.2-.2 1h-.7l-1.3-.5-1.2.5.3 1.3.6-.6h.9v1.1l.7.3.8.8 1.2-.3 1.5.2 1.6.4.9.1 1.4 1.7 2.7 1.6-1.8 3.3-1.8.9-.7 2-2.7 1.7-.3 1a15.7 15.7 0 009.4-24z"/> <path d="M17.5 24l-1.1-2.2 1-2.2-1-.3-1.2-1.2-2.6-.6-.9-1.8v1h-.4l-2.2-3v-2.5L7.4 8.5 4.8 9H3l-.8-.6 1-.9-1 .3a15.7 15.7 0 0015.5 23.5l-.2-2 .7-2.8-.7-2.6zM5.8 5l2.8-.3L10 4l1.5.4 2.3-.1.8-1.3 1.1.2 2.8-.3.8-.8 1-.7 1.6.2h.6A15.6 15.6 0 003.6 5.6l2.2-.6zm10.6-3.4l1.6-1 1 .7-1.5 1.1-1.4.2-.7-.5 1-.5zm-4.8 0l.7.4 1-.3.5.9-2.2.5-1-.6s1-.6 1-.8z"/> </svg> ` }
}
const allIcons = ['arrow--left','arrow--right','brand-shape','burger','check','cross','customerservice','dsb-logo--outlined','dsb-logo','dsbplus','flag--denmark','flag--england','magnifying-glass','pause','percent','pin','play','plus','ticketservice','trafficinfo','user','world'];
export { allIcons, getIcon };