Skip to content

Instantly share code, notes, and snippets.

@d4tocchini
Created December 1, 2011 08:48
Show Gist options
  • Save d4tocchini/1415097 to your computer and use it in GitHub Desktop.
Save d4tocchini/1415097 to your computer and use it in GitHub Desktop.
icnos.coffee
$.templates.add([
{
name:'btn_gear'
template:
'''
<div class="iconBtn iconBtn_gear circle50 vBox boxPackCenter boxAlignCenter">
{{>icon_gear}}
</div>
'''
} {
name:'btn_plus'
template:
'''
<div class="btn_plus circle50 vBox boxPackCenter boxAlignCenter">
<svg width="34" height="34" xmlns="http://www.w3.org/2000/svg" xmlns:xlink="http://www.w3.org/1999/xlink" style="display:block;">
<g class=" ui_icon" >
<polygon points="34,13.5 20.5,13.5 20.5,0 13.5,0 13.5,13.5 0,13.5 0,20.5 13.5,20.5 13.5,34 20.5,34 20.5,20.5
34,20.5 "/>
</g>
</svg>
</div>
'''
} {
name:'btn_shades'
template:
'''
<div class="iconBtn iconBtm_shades circle50 vBox boxPackCenter boxAlignCenter">
{{>icon_shades}}
</div>
'''
} {
name:'btn_x'
template:
'''
<div class="btn_x circle50 vBox boxPackCenter boxAlignCenter">
<svg width="28.991" height="28.991" xmlns="http://www.w3.org/2000/svg" xmlns:xlink="http://www.w3.org/1999/xlink" style="display:block;">
<g class=" ui_icon" >
<polygon points="28.991,24.042 19.445,14.496 28.991,4.95 24.042,0 14.496,9.546 4.95,0 0,4.95 9.546,14.496
0,24.042 4.95,28.991 14.496,19.445 24.042,28.991 "/>
</g>
</svg>
</div>
'''
} {
name:'icon_announce'
template:
'''
<svg width="24" height="16" xmlns="http://www.w3.org/2000/svg" xmlns:xlink="http://www.w3.org/1999/xlink" style="display:block;">
<g class=" ui_icon" >
<path d="M24,0L1,5V4H0v7h1v-1l4,0.87V15c0,0.97,0.701,2,2,2h7c0.97,0,2-0.701,2-2v-1.739L24,15V0z M14,15H7v-3.696l7,1.522V15z"/>
</g>
</svg>
'''
} {
name:'icon_categories'
template:
'''
<svg width="23.134" height="24.134" xmlns="http://www.w3.org/2000/svg" xmlns:xlink="http://www.w3.org/1999/xlink" style="display:block;">
<g class=" ui_icon" >
<path d="M20.506,15.021C19.092,13.606,8.484,3,8.484,3H0v8.485l12.021,12.021c0,0,1.414,1.414,2.828,0s5.656-5.656,5.656-5.656
S21.92,16.436,20.506,15.021z M5.656,8.657c-0.781,0.781-2.047,0.782-2.828,0c-0.781-0.781-0.781-2.047,0-2.829s2.047-0.78,2.828,0
C6.438,6.61,6.438,7.875,5.656,8.657z"/>
<path opacity="0.5" d="M22.506,12.021C21.092,10.606,10.484,0,10.484,0H2v2h6.898l0.293,0.292c0,0,10.605,10.607,12.021,12.022
c0.342,0.335,0.578,0.716,0.729,1.102c0.346-0.346,0.565-0.565,0.565-0.565S23.92,13.436,22.506,12.021z"/>
</g>
</svg>
'''
} {
name:'icon_chemistry'
template:
'''
<svg width="20" height="24" class="svg_icon" xmlns="http://www.w3.org/2000/svg" xmlns:xlink="http://www.w3.org/1999/xlink" style="display:block;">
<g class="ui_icon">
<path d="M13,8V1h1V0h-1l0,0h-3h0H7l0,0H5.999v1H7v7c0,0-7,10-7,13s3,3,3,3h7h0h7c0,0,3,0,3-3S13,8,13,8z M17,23h-7H3
c-0.334,0-2-0.098-2-2c0-1.955,4.183-8.66,6.819-12.426L8,8.314V8V1h4v7v0.314l0.181,0.26C14.817,12.34,19,19.045,19,21
C19,22.828,17.463,22.992,17,23z"/>
<circle cx="6" cy="19" r="1"/>
<circle cx="9" cy="15" r="2"/>
<circle cx="13" cy="19" r="2"/>
</g>
</svg>
'''
} {
name:'icon_clock'
template:
'''
<svg width="24" height="24" xmlns="http://www.w3.org/2000/svg" xmlns:xlink="http://www.w3.org/1999/xlink" style="display:block;">
<g class=" ui_icon" >
<path d="M12,3c4.963,0,9,4.038,9,9c0,4.963-4.037,9-9,9c-4.962,0-9-4.037-9-9C3,7.038,7.038,3,12,3 M12,0C5.373,0,0,5.373,0,12
c0,6.627,5.373,12,12,12s12-5.373,12-12C24,5.373,18.626,0,12,0L12,0z"/>
<path d="M15,16.5c-0.383,0-0.768-0.146-1.061-0.439l-2.998-2.998c-0.271-0.271-0.439-0.645-0.441-1.058v-0.001
c0-0.002,0-0.003,0-0.004V6c0-0.829,0.671-1.5,1.5-1.5c0.829,0,1.5,0.671,1.5,1.5v5.379l2.561,2.561
c0.586,0.586,0.586,1.535,0,2.121C15.767,16.354,15.384,16.5,15,16.5L15,16.5z"/>
</g>
</svg>
'''
} {
name:'icon_controller'
template:
'''
<svg width="30" height="23" class="svg_icon" xmlns="http://www.w3.org/2000/svg" xmlns:xlink="http://www.w3.org/1999/xlink" style="display:block;">
<g class="ui_icon">
<path d="M23,9h-7V6c0-0.023,0.093-2.429,3.447-4.105c0.493-0.246,0.694-0.848,0.447-1.342c-0.247-0.492-0.847-0.694-1.342-0.447
C14.052,2.355,14,5.854,14,6v3H7c-3.866,0-7,3.134-7,7s3.134,7,7,7c2.378,0,4.476-1.188,5.74-3h4.52c1.265,1.812,3.362,3,5.74,3
c3.866,0,7-3.134,7-7S26.866,9,23,9z M11,17H8v3H6v-3H3v-2h3v-3h2v3h3V17z M21.5,19c-0.828,0-1.5-0.672-1.5-1.5s0.672-1.5,1.5-1.5
s1.5,0.672,1.5,1.5S22.328,19,21.5,19z M25.5,16c-0.828,0-1.5-0.672-1.5-1.5s0.672-1.5,1.5-1.5s1.5,0.672,1.5,1.5S26.328,16,25.5,16
z"/>
</g>
</svg>
'''
} {
name:'icon_gear'
template:
'''
<svg preserveAspectRatio="none" width="34px" height="34px" viewBox="0 0 34 34" class="svg_icon" xmlns="http://www.w3.org/2000/svg" xmlns:xlink="http://www.w3.org/1999/xlink" style="display:block;">
<g class="ui_icon">
<path opacity="0.5" d="M17.001,10c-3.866,0-7,3.134-7,7s3.134,7,7,7s7-3.134,7-7S20.867,10,17.001,10z M17.001,21.9
c-2.706,0-4.9-2.194-4.9-4.9s2.194-4.9,4.9-4.9s4.9,2.194,4.9,4.9S19.707,21.9,17.001,21.9z"/>
<path d="M34.001,13.5L34.001,13.5L34.001,13.5h-4.275h0h0c-4.107,0-1.49-2.778-1.277-2.997l0.026-0.026l3.023-3.023
l-2.475-2.475l0,0l-2.474-2.474l0,0l-0.001-0.001l-3.023,3.023l0,0l-0.01,0.01c-2.814,2.804-2.999-0.733-3.011-1.208V4.276l0-4.275
l-3.5,0h0h0h0l-3.5,0v4.275v0.011c-0.005,4.007-2.676,1.574-2.991,1.272l-0.031-0.031l0,0L7.456,2.505h0v0l0,0l0,0L4.979,4.979l0,0
L2.505,7.454l3.023,3.023l0.017,0.017c2.86,2.876-0.898,3-1.226,3.006H4.276L0,13.5L0,17l0,3.5h0v0h0.001h4.274h0h0.001h0.007
c3.981,0.004,1.614,2.635,1.283,2.983l-0.04,0.04l0,0l-3.022,3.022v0l2.474,2.474l0,0l2.475,2.475v0l0,0l0,0v0c0,0,0,0,3.023-3.023
h0c0.376-0.376,0.705-0.638,0.993-0.811c0.022-0.013,0.041-0.019,0.062-0.031c0.119-0.066,0.232-0.124,0.337-0.161
c0.028-0.01,0.052-0.011,0.08-0.019c0.092-0.027,0.183-0.05,0.264-0.056c0.027-0.002,0.05,0.004,0.077,0.004
c0.075,0.001,0.149,0.004,0.216,0.022c0.024,0.006,0.044,0.019,0.067,0.028c0.062,0.023,0.123,0.048,0.176,0.084
c0.021,0.014,0.039,0.033,0.059,0.049c0.05,0.04,0.099,0.082,0.142,0.132c0.018,0.021,0.033,0.045,0.049,0.067
c0.04,0.052,0.078,0.106,0.111,0.166c0.015,0.027,0.028,0.056,0.042,0.083c0.03,0.06,0.059,0.121,0.084,0.184
c0.013,0.032,0.023,0.065,0.035,0.099c0.021,0.062,0.042,0.124,0.06,0.187c0.01,0.038,0.02,0.076,0.029,0.113
c0.014,0.057,0.027,0.115,0.039,0.171c0.009,0.044,0.017,0.088,0.024,0.131c0.008,0.047,0.016,0.093,0.022,0.138
c0.007,0.051,0.014,0.101,0.019,0.148c0.003,0.028,0.007,0.057,0.009,0.084c0.006,0.062,0.011,0.121,0.015,0.171
c0,0.003,0,0.007,0,0.011c0.008,0.121,0.01,0.207,0.01,0.235v0.023V34h0v0h0.001H17v0l0,0l0,0v0h3.5h0v-4.275v-0.027
c0.015-4.23,3.021-1.225,3.021-1.225l0,0l3.023,3.023v0l0,0l0,0l0,0l2.475-2.475l2.475-2.475l-3.023-3.023l0,0l-0.011-0.011
c-2.875-2.886,0.909-3.007,1.23-3.012h0.032h0H34h0h0l0-3.5L34.001,13.5z M17.001,24c-3.866,0-7-3.134-7-7s3.134-7,7-7s7,3.134,7,7
S20.867,24,17.001,24z"/>
</g>
</svg>
'''
} {
name:'icon_gear2'
template:
'''
<svg preserveAspectRatio="none" width="30px" height="30px" viewBox="0 0 24 24" class="svg_icon" xmlns="http://www.w3.org/2000/svg" xmlns:xlink="http://www.w3.org/1999/xlink" style="display:block;">
<g class="ui_icon">
<path d="M23.078,10.153h-1.107c-0.508,0-1.047-0.396-1.197-0.882l-0.637-1.547c-0.238-0.445-0.141-1.106,0.217-1.465l0.787-0.785
c0.359-0.36,0.359-0.947,0-1.307l-1.309-1.306c-0.357-0.358-0.945-0.358-1.304,0L17.74,3.648c-0.357,0.358-1.02,0.456-1.467,0.216
L14.73,3.229c-0.484-0.15-0.882-0.689-0.882-1.197V0.924C13.849,0.416,13.433,0,12.924,0h-1.846c-0.508,0-0.924,0.416-0.924,0.924
v1.107c0,0.508-0.396,1.047-0.881,1.197L7.729,3.864C7.279,4.105,6.621,4.008,6.262,3.648L5.475,2.862
c-0.359-0.358-0.945-0.358-1.305,0L2.865,4.168c-0.361,0.358-0.361,0.946,0,1.305L3.648,6.26c0.359,0.358,0.459,1.02,0.217,1.465
L3.23,9.272c-0.152,0.485-0.689,0.882-1.197,0.882l-1.109-0.001C0.416,10.153,0,10.568,0,11.076v1.847
c0,0.507,0.416,0.923,0.924,0.923h1.109c0.508,0.002,1.045,0.398,1.195,0.883l0.637,1.547c0.241,0.447,0.143,1.109-0.217,1.467
l-0.785,0.785c-0.359,0.359-0.359,0.945,0,1.307l1.307,1.305c0.359,0.359,0.945,0.359,1.305,0l0.787-0.785
c0.358-0.357,1.018-0.455,1.463-0.215l1.549,0.637c0.484,0.15,0.881,0.689,0.881,1.197v1.105c0,0.506,0.416,0.922,0.924,0.922
h1.846c0.509,0,0.925-0.416,0.925-0.922v-1.105c0-0.508,0.397-1.047,0.882-1.197l1.548-0.637c0.446-0.24,1.106-0.143,1.467,0.215
l0.783,0.785c0.358,0.359,0.946,0.359,1.304,0l1.309-1.305c0.359-0.361,0.359-0.947,0-1.307l-0.787-0.785
c-0.357-0.357-0.455-1.02-0.217-1.467l0.637-1.547c0.15-0.484,0.692-0.881,1.197-0.881h1.107c0.508,0,0.922-0.416,0.922-0.924
v-1.848C24,10.568,23.586,10.153,23.078,10.153z M16.62,11.998c0,2.551-2.067,4.615-4.616,4.615c-2.551,0-4.617-2.064-4.617-4.615
c0-2.549,2.066-4.615,4.617-4.615C14.553,7.383,16.62,9.449,16.62,11.998z"></path>
</g>
</svg>
'''
} {
name:'icon_genie'
template:
'''
<svg width="32.747" height="20" class="svg_icon" xmlns="http://www.w3.org/2000/svg" xmlns:xlink="http://www.w3.org/1999/xlink" style="display:block;">
<g class="ui_icon">
<path d="M22.748,11.5c0,3.037-3.582,5.5-8,5.5c-4.418,0-8-2.463-8-5.5s4.436-6.502,8.001-6.502S22.748,8.463,22.748,11.5z"/>
<path d="M20.118,15.576c0,0,10.104-5.662,12.629-5.613V8.998c-0.001-0.041-1.647-0.009-1.767-0.008
c-0.893,0.011-1.785,0.017-2.678,0.053c-1.395,0.057-2.797,0.346-4.191,0.121c-1.047-0.168-2.016-0.648-2.91-1.201
C21.097,7.9,20.875,7.7,20.408,7.381"/>
<g>
<path d="M4.276,14.197c-1.155,0-2.315-0.242-3.15-0.99c-1.112-0.994-1.402-2.59-0.861-4.742c0.009-0.035,0.02-0.07,0.033-0.105
c0.809-2.173,2.015-3.403,3.584-3.656c3.016-0.488,5.922,3.013,6.244,3.413c0.345,0.431,0.276,1.059-0.154,1.404
C9.541,9.867,8.912,9.797,8.566,9.368c-0.629-0.78-2.785-2.958-4.369-2.69C3.402,6.807,2.727,7.59,2.19,9.006
c-0.229,0.938-0.36,2.147,0.268,2.71c1.054,0.944,4.032,0.273,5.31-0.2c0.514-0.193,1.093,0.071,1.285,0.589
c0.193,0.517-0.07,1.093-0.587,1.286C8.143,13.511,6.219,14.197,4.276,14.197L4.276,14.197z"/>
</g>
<path d="M17.748,19h-6c-0.552,0-1,0.448-1,1h8C18.748,19.448,18.3,19,17.748,19z"/>
<polyline points="11.748,20 13.248,16 16.248,16 17.748,20 "/>
<path d="M12.748,6c0,0,1-2,1-3s2-1,2,0s1,3,1,3H12.748z"/>
<circle cx="14.748" cy="2" r="2"/>
</g>
</svg>
'''
} {
name:'icon_lock'
template:
'''
<svg width="20" height="24" xmlns="http://www.w3.org/2000/svg" xmlns:xlink="http://www.w3.org/1999/xlink" style="display:block;">
<g class=" ui_icon" >
<path d="M17,10.001V7c0,0,0-7-7-7C3.001,0,3,7,3,7v3.001H0v14h20v-14H17z M11,17.724v3.277H9v-3.277c-0.595-0.347-1-0.984-1-1.723
c0-1.104,0.896-2,2-2c1.105,0,2,0.896,2,2C12,16.739,11.595,17.377,11,17.724z M14,10.001h-8v-3c0.011-0.837-0.001-4,4-4
c4,0,3.989,3.176,4,4V10.001z"/>
</g>
</svg>
'''
} {
name:'icon_shades'
template:
'''
<svg preserveAspectRatio="none" width="32px" height="12px" viewBox="0 0 32 12" class="svg_icon" xmlns="http://www.w3.org/2000/svg" xmlns:xlink="http://www.w3.org/1999/xlink" style="display:block;">
<g class="ui_icon">
<path opacity="0.25" d="M29.53,9.516c-0.007,0.054-0.012,0.108-0.012,0.163c0,0.522-0.424,0.946-0.946,0.946h-8.408
c-0.521,0-0.946-0.424-0.946-0.946c0-0.055-0.005-0.109-0.012-0.163L18.704,6l-0.535-3.745c0.034-0.491,0.444-0.88,0.943-0.88
h1.136h9.376c0.499,0,0.91,0.389,0.944,0.88L29.53,9.516z"/>
<path opacity="0.25" d="M12.768,9.5c-0.007,0.054-0.012,0.108-0.012,0.163c0,0.522-0.424,0.946-0.946,0.946H3.401
c-0.522,0-0.946-0.424-0.946-0.946c0-0.055-0.004-0.109-0.012-0.163L1.941,6L1.406,2.255c0.034-0.491,0.444-0.88,0.943-0.88h1.135
h9.376c0.5,0,0.91,0.389,0.944,0.88L12.768,9.516z"/>
<path d="M31.048,1.004C30.53,0.396,29.769,0,28.908,0h-9.09C18.96,0,18.2,0.394,17.684,1h-3.367C13.8,0.394,13.04,0,12.182,0H3.091
C2.231,0,1.47,0.396,0.952,1.004C0.423,1.018,0,1.231,0,1.5v3c0,0.197,0.234,0.364,0.567,0.445L1.183,9.26
C1.225,10.778,2.473,12,4,12h7.273c1.527,0,2.775-1.222,2.817-2.74L14.556,6c0-0.553,0.646-1,1.444-1s1.444,0.447,1.444,1
l0.466,3.26c0.041,1.519,1.289,2.74,2.816,2.74H28c1.527,0,2.775-1.222,2.816-2.74l0.617-4.314C31.766,4.864,32,4.697,32,4.5v-3
C32,1.231,31.577,1.018,31.048,1.004z M12.101,9.04c-0.007,0.047-0.01,0.095-0.01,0.142c0,0.451-0.367,0.818-0.818,0.818H4
c-0.451,0-0.818-0.367-0.818-0.818c0-0.047-0.003-0.095-0.01-0.142L2.275,2.762C2.304,2.336,2.659,2,3.091,2H11.2h0.982
c0.432,0,0.787,0.336,0.816,0.762L12.535,6L12.101,9.04z M28.828,9.04c-0.007,0.047-0.01,0.095-0.01,0.142
C28.818,9.633,28.451,10,28,10h-7.273c-0.451,0-0.818-0.367-0.818-0.818c0-0.047-0.003-0.095-0.01-0.142L19.465,6l-0.463-3.238
C19.031,2.336,19.387,2,19.818,2H20.8h8.108c0.433,0,0.787,0.336,0.816,0.762L28.828,9.04z"/>
</g>
</svg>
'''
}])
Sign up for free to join this conversation on GitHub. Already have an account? Sign in to comment