controls.svg (6471B)
1 <?xml version="1.0" encoding="UTF-8"?> 2 <svg id="icons-enhanced-tiles" width="288" height="33" version="1.1" viewBox="0 0 288 33" xmlns="http://www.w3.org/2000/svg" xmlns:xlink="http://www.w3.org/1999/xlink"> 3 <defs> 4 <style type="text/css"><![CDATA[ 5 /* Glyph Styles */ 6 .glyphShape-style { 7 fill: #737373; 8 } 9 .glyphShape-style-hover-gear { 10 fill: #00aeff; 11 } 12 .glyphShape-style-hover-pin { 13 fill: #00aeff; 14 } 15 .glyphShape-style-hover-delete { 16 fill: #666; 17 } 18 .glyphShape-style-hover-active { 19 fill: #999; 20 } 21 /* Circle Background Styles */ 22 .glyphShape-style-circle { 23 fill: #fff; 24 } 25 .glyphShape-style-circle-dropshadow { 26 fill: #000; 27 fill-opacity: .3; 28 filter: url(#filter-shadow-drop); 29 } 30 .default-transparent { 31 opacity: .7; 32 } 33 .default-transparent .glyphShape-style-circle-dropshadow { 34 fill-opacity: .5; 35 } 36 .active-grey .glyphShape-style-circle { 37 fill: #f0f0f0; 38 } 39 ]]></style> 40 <filter id="filter-shadow-drop"> 41 <feOffset dx="0" dy="1.6" in="SourceAlpha" result="filter-shadow-drop-offset"/> 42 <feGaussianBlur in="filter-shadow-drop-offset" result="filter-shadow-drop-blur" stdDeviation="1"/> 43 </filter> 44 <path id="glyphShape-gear" d="m14 18v3h-3v-3h3m1-1h-5v5h5v-5zm6 1v3h-3v-3h3m1-1h-5v5h5v-5zm-8-6v3h-3v-3h3m1-1h-5v5h5v-5zm6 1v3h-3v-3h3m1-1h-5v5h5v-5z"/> 45 <circle id="glyphShape-circle" cx="16" cy="16" r="14"/> 46 <path id="glyphShape-pin" d="M19,15v-5h2V7H11v3h2v5l-3,2v2h5c0,4.5,0.4,8,1,8s1-3.5,1-8h5v-2L19,15z"/> 47 <polygon id="glyphShape-delete" points="22.6 10.6 21.4 9.4 16 14.8 10.6 9.4 9.4 10.6 14.8 16 9.4 21.4 10.6 22.6 16 17.2 21.4 22.6 22.6 21.4 17.2 16"/> 48 <filter id="i" color-interpolation-filters="sRGB"> 49 <feColorMatrix result="color1" type="hueRotate" values="180"/> 50 <feColorMatrix result="color2" values="-1 0 0 0 1 0 -1 0 0 1 0 0 -1 0 1 -0.21 -0.72 -0.07 2 0 "/> 51 </filter> 52 <filter id="h" color-interpolation-filters="sRGB"> 53 <feColorMatrix result="color1" type="hueRotate" values="180"/> 54 <feColorMatrix result="color2" values="-1 0 0 0 1 0 -1 0 0 1 0 0 -1 0 1 -0.21 -0.72 -0.07 2 0 "/> 55 </filter> 56 <filter id="g" color-interpolation-filters="sRGB"> 57 <feColorMatrix result="color1" type="hueRotate" values="180"/> 58 <feColorMatrix result="color2" values="-1 0 0 0 1 0 -1 0 0 1 0 0 -1 0 1 -0.21 -0.72 -0.07 2 0 "/> 59 </filter> 60 <filter id="f" color-interpolation-filters="sRGB"> 61 <feColorMatrix result="color1" type="hueRotate" values="180"/> 62 <feColorMatrix result="color2" values="-1 0 0 0 1 0 -1 0 0 1 0 0 -1 0 1 -0.21 -0.72 -0.07 2 0 "/> 63 </filter> 64 <filter id="e" color-interpolation-filters="sRGB"> 65 <feColorMatrix result="color1" type="hueRotate" values="180"/> 66 <feColorMatrix result="color2" values="-1 0 0 0 1 0 -1 0 0 1 0 0 -1 0 1 -0.21 -0.72 -0.07 2 0 "/> 67 </filter> 68 <filter id="d" color-interpolation-filters="sRGB"> 69 <feColorMatrix result="color1" type="hueRotate" values="180"/> 70 <feColorMatrix result="color2" values="-1 0 0 0 1 0 -1 0 0 1 0 0 -1 0 1 -0.21 -0.72 -0.07 2 0 "/> 71 </filter> 72 <filter id="c" color-interpolation-filters="sRGB"> 73 <feColorMatrix result="color1" type="hueRotate" values="180"/> 74 <feColorMatrix result="color2" values="-1 0 0 0 1 0 -1 0 0 1 0 0 -1 0 1 -0.21 -0.72 -0.07 2 0 "/> 75 </filter> 76 <filter id="b" color-interpolation-filters="sRGB"> 77 <feColorMatrix result="color1" type="hueRotate" values="180"/> 78 <feColorMatrix result="color2" values="-1 0 0 0 1 0 -1 0 0 1 0 0 -1 0 1 -0.21 -0.72 -0.07 2 0 "/> 79 </filter> 80 <filter id="a" color-interpolation-filters="sRGB"> 81 <feColorMatrix result="color1" type="hueRotate" values="180"/> 82 <feColorMatrix result="color2" values="-1 0 0 0 1 0 -1 0 0 1 0 0 -1 0 1 -0.21 -0.72 -0.07 2 0 "/> 83 </filter> 84 </defs> 85 <g id="icon-gear-default" class="semi-transparent" filter="url(#i)"> 86 <use class="glyphShape-style" xlink:href="#glyphShape-gear"/> 87 </g> 88 <g transform="translate(32)" filter="url(#h)"> 89 <use class="glyphShape-style-hover-gear" xlink:href="#glyphShape-gear"/> 90 </g> 91 <g id="icon-pin-default" class="default-transparent" transform="translate(64)" filter="url(#g)"> 92 <use class="glyphShape-style-circle-dropshadow" xlink:href="#glyphShape-circle"/> 93 <use class="glyphShape-style-circle" xlink:href="#glyphShape-circle"/> 94 <use class="glyphShape-style" xlink:href="#glyphShape-pin"/> 95 </g> 96 <g id="icon-delete-default" class="default-transparent" transform="translate(160)" filter="url(#f)"> 97 <use class="glyphShape-style-circle-dropshadow" xlink:href="#glyphShape-circle"/> 98 <use class="glyphShape-style-circle" xlink:href="#glyphShape-circle"/> 99 <use class="glyphShape-style" xlink:href="#glyphShape-delete"/> 100 </g> 101 <g id="icon-delete-hover" transform="translate(192)" filter="url(#e)"> 102 <use class="glyphShape-style-circle-dropshadow" xlink:href="#glyphShape-circle"/> 103 <use class="glyphShape-style-circle" xlink:href="#glyphShape-circle"/> 104 <use class="glyphShape-style-hover-delete" xlink:href="#glyphShape-delete"/> 105 </g> 106 <g id="icon-delete-hover-active" class="active-grey" transform="translate(224)" filter="url(#d)"> 107 <use class="glyphShape-style-circle-dropshadow" xlink:href="#glyphShape-circle"/> 108 <use class="glyphShape-style-circle" xlink:href="#glyphShape-circle"/> 109 <use class="glyphShape-style-hover-active" xlink:href="#glyphShape-delete"/> 110 </g> 111 <g transform="translate(256)" filter="url(#c)"> 112 <use class="glyphShape-style-pin" xlink:href="#glyphShape-pin"/> 113 </g> 114 <g id="icon-pin-hover" class="default-transparent" transform="translate(96)" filter="url(#b)"> 115 <use class="glyphShape-style-circle-dropshadow" style="" xlink:href="#glyphShape-circle"/> 116 <use class="glyphShape-style-circle" fill="#ffffff" xlink:href="#glyphShape-circle"/> 117 <use class="glyphShape-style-hover-pin" style="" xlink:href="#glyphShape-pin"/> 118 </g> 119 <g id="icon-pin-hover-active" class="active-grey" transform="translate(128)" filter="url(#a)"> 120 <use class="glyphShape-style-circle-dropshadow" xlink:href="#glyphShape-circle"/> 121 <use class="glyphShape-style-circle" xlink:href="#glyphShape-circle"/> 122 <use class="glyphShape-style-hover-active" xlink:href="#glyphShape-pin"/> 123 </g> 124 </svg>