jeena/en.javascript.info
1
0
Fork 0
Code Issues Pull requests Projects Packages Wiki Activity Actions

minify pictures

Browse source
This commit is contained in:
Ilya Kantor 2015-01-28 14:16:51 +03:00
parent 6eacea0d4f
commit 6c4af3d588
61 changed files with 28 additions and 3075 deletions
Download patch file Download diff file Expand all files Collapse all files

28
1-js/2-first-steps/5-variables/variable-brown.svg
View file

@ -1,27 +1 @@
<?xml version="1.0" encoding="UTF-8" standalone="no"?>
<svg width="148px" height="128px" viewBox="0 0 148 128" version="1.1" xmlns="http://www.w3.org/2000/svg" xmlns:xlink="http://www.w3.org/1999/xlink" xmlns:sketch="http://www.bohemiancoding.com/sketch/ns">
<!-- Generator: Sketch 3.2.2 (9983) - http://www.bohemiancoding.com/sketch -->
<title>noun_1211_cc + Message</title>
<desc>Created with Sketch.</desc>
<defs></defs>
<g id="combined-brown" stroke="none" stroke-width="1" fill="none" fill-rule="evenodd" sketch:type="MSPage">
<g id="variable" sketch:type="MSArtboardGroup" transform="translate(-161.000000, -71.000000)">
<g id="noun_1211_cc-+-Message" sketch:type="MSLayerGroup" transform="translate(161.000000, 71.000000)">
<g id="noun_1211_cc">
<path d="M17,37.1960457 L129.557785,37.1960457 L129.557785,80.1456641 C129.557785,80.5185728 129.479295,81.0083855 129.279367,81.4404861 C129.07944,81.8725868 112.704625,117 112.704625,117 L112.704625,62.6396695 L129.559266,37.1960457 L148,9 L35.4407339,9 L17,37.1960457 L17,37.1960457 Z" id="Shape" fill="#D1C4B1" sketch:type="MSShapeGroup"></path>
<path d="M17,66 L17,38 L2,66" id="Shape" fill="#D1C4B1" sketch:type="MSShapeGroup"></path>
<g id="Rectangle-5-+-&quot;World!&quot;" transform="translate(15.000000, 0.000000)">
<path d="M18.9106925,0.395208397 L73.4146415,58.8435379 L55.0893075,75.9321883 L0.585358502,17.4838588 L18.9106925,0.395208397 L18.9106925,0.395208397 Z" id="Rectangle-5" stroke="#8A704D" stroke-width="2" fill="#FFF9EB" sketch:type="MSShapeGroup"></path>
<text id="&quot;Hello!&quot;" sketch:type="MSTextLayer" transform="translate(39.885486, 40.782373) rotate(47.000000) translate(-39.885486, -40.782373) " font-family="Open Sans" font-size="14" font-weight="526" fill="#8A704D">
<tspan x="10.392998" y="46.2823729">"Hello!"</tspan>
</text>
</g>
<path d="M0,68 L0,122.729971 C0,126.150501 1.4836395,128 4.38712201,128 L104.473443,128 C107.59502,128 110,125.4521 110,124.524372 L110,68 L0,68 L0,68 Z" id="Shape" fill="#D1C4B1" sketch:type="MSShapeGroup"></path>
</g>
<text id="Message" sketch:type="MSTextLayer" font-family="Open Sans" font-size="18" font-weight="526" fill="#FFFFFF">
<tspan x="17" y="105">Message</tspan>
</text>
</g>
</g>
</g>
</svg>
<svg width="148" height="128" viewBox="0 0 148 128" xmlns="http://www.w3.org/2000/svg"><title>noun_1211_cc + Message</title><desc>Created with Sketch.</desc><g fill="none" fill-rule="evenodd"><path d="M17 37.196h112.558v42.95c0 .373-.08.862-.28 1.294-.2.433-16.573 35.56-16.573 35.56V62.64l16.854-25.444L148 9H35.44L17 37.196zM17 66V38L2 66" fill="#D1C4B1"/><path d="M33.91.395l54.505 58.45L70.09 75.93 15.584 17.484 33.91.394z" stroke="#8A704D" stroke-width="2" fill="#FFF9EB"/><text transform="matrix(.682 .731 -.731 .682 15 0)" font-family="Open Sans" font-size="14" font-weight="526" fill="#8A704D"><tspan x="10.393" y="46.282">&amp;quot;Hello!&amp;quot;</tspan></text><path d="M0 68v54.73c0 3.42 1.484 5.27 4.387 5.27h100.086c3.122 0 5.527-2.548 5.527-3.476V68H0z" fill="#D1C4B1"/><text font-family="Open Sans" font-size="18" font-weight="526" fill="#fff" transform="translate(-161 -71) translate(161 71)"><tspan x="17" y="105">Message</tspan></text></g></svg>
Side by side Swipe Overlay

Before

Width:  |  Height:  |  Size: 2.5 KiB

After

Width:  |  Height:  |  Size: 965 B

Before After
Before After

48
1-js/2-first-steps/5-variables/variable-change.svg
View file

@ -1,47 +1 @@
<?xml version="1.0" encoding="UTF-8" standalone="no"?>
<svg width="253px" height="176px" viewBox="0 0 253 176" version="1.1" xmlns="http://www.w3.org/2000/svg" xmlns:xlink="http://www.w3.org/1999/xlink" xmlns:sketch="http://www.bohemiancoding.com/sketch/ns">
<!-- Generator: Sketch 3.2.2 (9983) - http://www.bohemiancoding.com/sketch -->
<title>Diagrams 2</title>
<desc>Created with Sketch.</desc>
<defs></defs>
<g id="variable-change" stroke="none" stroke-width="1" fill="none" fill-rule="evenodd" sketch:type="MSPage">
<rect id="Rectangle-2" stroke="#979797" fill="#E8E8E8" sketch:type="MSShapeGroup" transform="translate(142.959003, 41.528366) rotate(47.000000) translate(-142.959003, -41.528366) " x="103" y="29" width="79.918006" height="25.0567324"></rect>
<text id="&quot;Hello!&quot;" opacity="0.7" sketch:type="MSTextLayer" transform="translate(146.500000, 43.500000) rotate(47.000000) translate(-146.500000, -43.500000) " font-family="Open Sans" font-size="14" font-weight="normal" fill="#373535">
<tspan x="122" y="49">"Hello!"</tspan>
</text>
<g id="trash62" sketch:type="MSLayerGroup" transform="translate(222.000000, 0.000000)" fill="#979797">
<g id="Group" sketch:type="MSShapeGroup">
<rect id="Rectangle-path" x="20.6666667" y="10.6296296" width="1.47619048" height="25.8148148"></rect>
<rect id="Rectangle-path" x="14.7619048" y="10.6296296" width="1.47619048" height="25.8148148"></rect>
<rect id="Rectangle-path" x="8.85714286" y="10.6296296" width="1.47619048" height="25.8148148"></rect>
<path d="M25.0952381,6.07407407 L22.1428571,6.07407407 L22.1428571,3.03703704 C22.1428571,1.36666667 20.8142857,0 19.1904762,0 L11.8095238,0 C10.1857143,0 8.85714286,1.36666667 8.85714286,3.03703704 L8.85714286,6.07407407 L5.9047619,6.07407407 L0,6.07407407 L0,7.59259259 L2.95238095,7.59259259 L2.95238095,36.4444444 C2.95238095,39.0259259 4.87142857,41 7.38095238,41 L23.6190476,41 C26.1285714,41 28.047619,39.0259259 28.047619,36.4444444 L28.047619,7.59259259 L31,7.59259259 L31,6.07407407 L25.0952381,6.07407407 L25.0952381,6.07407407 Z M10.3333333,3.03703704 C10.3333333,2.12592593 10.9238095,1.51851852 11.8095238,1.51851852 L19.1904762,1.51851852 C20.0761905,1.51851852 20.6666667,2.12592593 20.6666667,3.03703704 L20.6666667,6.07407407 L10.3333333,6.07407407 L10.3333333,3.03703704 L10.3333333,3.03703704 Z M26.5714286,36.4444444 C26.5714286,38.1148148 25.2428571,39.4814815 23.6190476,39.4814815 L7.38095238,39.4814815 C5.75714286,39.4814815 4.42857143,38.1148148 4.42857143,36.4444444 L4.42857143,7.59259259 L26.5714286,7.59259259 L26.5714286,36.4444444 L26.5714286,36.4444444 Z" id="Shape"></path>
</g>
</g>
<g id="left221-2" sketch:type="MSLayerGroup" transform="translate(192.401869, 23.588287) scale(-1, 1) rotate(-2.000000) translate(-192.401869, -23.588287) translate(155.931845, 9.197409)" fill="#979797">
<path d="M30.2888412,8.13169869 L30.2888412,2.04595641 C30.2888412,1.48343299 29.9074863,0.974528918 29.3182523,0.751950009 C28.7290183,0.529371101 28.0453269,0.634584407 27.57924,1.02100612 L12.6611767,13.3658208 C12.339511,13.6321053 12.1566747,14.0030702 12.1566747,14.3907711 C12.1566747,14.7785786 12.339511,15.1495434 12.6611767,15.415828 L27.57924,27.7607493 C27.8829137,28.0125363 28.2799507,28.145039 28.6825798,28.145039 C28.8967804,28.145039 29.1132907,28.1071963 29.3182523,28.0296988 C29.9076079,27.8071199 30.2888412,27.2983224 30.2888412,26.7356924 L30.2888412,21.1354024 C31.6175657,21.1165343 33.6451775,21.0938287 35.802501,21.0938287 C37.792427,21.0938287 39.5378824,21.1126968 40.9895109,21.1497933 C48.9349919,21.3531843 58.2021466,26.6269613 58.2947804,26.6802609 C58.800255,26.970317 59.4474763,26.9888652 59.9717937,26.7260985 C60.4959895,26.4638647 60.809267,25.9663667 60.7816714,25.4375286 C60.0729372,11.8362304 36.5833242,8.72204447 30.2888412,8.13169869 L30.2888412,8.13169869 Z M41.0831173,18.3328056 C39.6006108,18.2946431 37.8240344,18.2753487 35.802501,18.2753487 C32.0474257,18.2753487 28.6784465,18.3428259 28.6447725,18.3434655 C27.7721664,18.3610544 27.0746164,18.9868976 27.0746164,19.7524923 L27.0746164,23.4683235 L16.1054057,14.3908777 L27.0746164,5.31353844 L27.0746164,9.41749696 C27.0746164,10.1579343 27.7290102,10.7723714 28.5718325,10.8233258 C28.83235,10.8392091 52.6405895,12.4104797 56.9260604,22.7161603 C53.2740738,20.9912804 46.9922337,18.4838565 41.0831173,18.3328056 L41.0831173,18.3328056 Z" id="Shape" sketch:type="MSShapeGroup"></path>
</g>
<g id="left221-3" sketch:type="MSLayerGroup" transform="translate(26.401869, 52.588287) scale(-1, 1) rotate(-44.000000) translate(-26.401869, -52.588287) translate(-10.068155, 38.197409)" fill="#979797">
<path d="M30.2888412,8.13169869 L30.2888412,2.04595641 C30.2888412,1.48343299 29.9074863,0.974528918 29.3182523,0.751950009 C28.7290183,0.529371101 28.0453269,0.634584407 27.57924,1.02100612 L12.6611767,13.3658208 C12.339511,13.6321053 12.1566747,14.0030702 12.1566747,14.3907711 C12.1566747,14.7785786 12.339511,15.1495434 12.6611767,15.415828 L27.57924,27.7607493 C27.8829137,28.0125363 28.2799507,28.145039 28.6825798,28.145039 C28.8967804,28.145039 29.1132907,28.1071963 29.3182523,28.0296988 C29.9076079,27.8071199 30.2888412,27.2983224 30.2888412,26.7356924 L30.2888412,21.1354024 C31.6175657,21.1165343 33.6451775,21.0938287 35.802501,21.0938287 C37.792427,21.0938287 39.5378824,21.1126968 40.9895109,21.1497933 C48.9349919,21.3531843 58.2021466,26.6269613 58.2947804,26.6802609 C58.800255,26.970317 59.4474763,26.9888652 59.9717937,26.7260985 C60.4959895,26.4638647 60.809267,25.9663667 60.7816714,25.4375286 C60.0729372,11.8362304 36.5833242,8.72204447 30.2888412,8.13169869 L30.2888412,8.13169869 Z M41.0831173,18.3328056 C39.6006108,18.2946431 37.8240344,18.2753487 35.802501,18.2753487 C32.0474257,18.2753487 28.6784465,18.3428259 28.6447725,18.3434655 C27.7721664,18.3610544 27.0746164,18.9868976 27.0746164,19.7524923 L27.0746164,23.4683235 L16.1054057,14.3908777 L27.0746164,5.31353844 L27.0746164,9.41749696 C27.0746164,10.1579343 27.7290102,10.7723714 28.5718325,10.8233258 C28.83235,10.8392091 52.6405895,12.4104797 56.9260604,22.7161603 C53.2740738,20.9912804 46.9922337,18.4838565 41.0831173,18.3328056 L41.0831173,18.3328056 Z" id="Shape" sketch:type="MSShapeGroup"></path>
</g>
<path d="M44.5,117 L146.5,117" id="Line-2" stroke="#979797" stroke-width="2" stroke-linecap="square" sketch:type="MSShapeGroup"></path>
<path d="M2.5,173.5 L44.5,117.5" id="Line" stroke="#979797" stroke-width="2" stroke-linecap="square" sketch:type="MSShapeGroup"></path>
<path d="M133.5,172.5 L175.5,116.5" id="Line-3" stroke="#979797" stroke-width="2" stroke-linecap="square" sketch:type="MSShapeGroup"></path>
<path d="M44.5,77 L176.5,77" id="Line-7" stroke="#979797" stroke-width="2" stroke-linecap="square" sketch:type="MSShapeGroup"></path>
<path d="M2.5,133.5 L44.5,77.5" id="Line-8" stroke="#979797" stroke-width="2" stroke-linecap="square" sketch:type="MSShapeGroup"></path>
<path d="M133.5,133.5 L175.5,77.5" id="Line-9" stroke="#979797" stroke-width="2" stroke-linecap="square" sketch:type="MSShapeGroup"></path>
<path d="M44,117.5 L44,77.5" id="Line-4" stroke="#979797" stroke-width="2" stroke-linecap="square" sketch:type="MSShapeGroup"></path>
<rect id="Rectangle-5" stroke="#979797" stroke-width="2" fill="#E8E8E8" sketch:type="MSShapeGroup" transform="translate(82.959003, 108.528366) rotate(47.000000) translate(-82.959003, -108.528366) " x="43" y="96" width="79.918006" height="25.0567324"></rect>
<text id="&quot;World!&quot;" sketch:type="MSTextLayer" transform="translate(86.500000, 110.500000) rotate(47.000000) translate(-86.500000, -110.500000) " font-family="Open Sans" font-size="14" font-weight="normal" fill="#373535">
<tspan x="59" y="116">"World!"</tspan>
</text>
<path d="M176,116 L176,77.5" id="Line-5" stroke="#979797" stroke-width="2" stroke-linecap="square" sketch:type="MSShapeGroup"></path>
<rect id="Rectangle-4" stroke="#979797" stroke-width="2" fill="#FFFFFF" sketch:type="MSShapeGroup" x="1" y="134" width="133" height="40"></rect>
<g id="Rectangle-3-+-Oval-1-+-message" sketch:type="MSLayerGroup" transform="translate(38.000000, 147.000000)">
<rect id="Rectangle-3" stroke="#979797" fill="#FFFFFF" sketch:type="MSShapeGroup" x="0" y="0" width="63" height="16"></rect>
<circle id="Oval-1" stroke="#979797" sketch:type="MSShapeGroup" cx="3.5" cy="3.5" r="1.5"></circle>
<text id="message" sketch:type="MSTextLayer" font-family="Consolas" font-size="14" font-weight="normal" fill="#373535">
<tspan x="7" y="12">message</tspan>
</text>
</g>
</g>
</svg>
<svg width="253" height="176" viewBox="0 0 253 176" xmlns="http://www.w3.org/2000/svg"><title>Diagrams 2</title><desc>Created with Sketch.</desc><g fill="none" fill-rule="evenodd"><path stroke="#979797" fill="#E8E8E8" d="M124.865 3.774l54.504 58.42-18.32 17.09-54.505-58.42z"/><text opacity=".7" transform="rotate(47 146.5 43.5)" font-family="Open Sans" font-size="14" fill="#373535"><tspan x="122" y="49">&amp;quot;Hello!&amp;quot;</tspan></text><g fill="#979797"><path d="M242.667 10.63h1.476v25.815h-1.476zm-5.905 0h1.476v25.815h-1.476zm-5.905 0h1.476v25.815h-1.476zM247.095 6.074h-2.952V3.037c0-1.67-1.33-3.037-2.953-3.037h-7.38c-1.624 0-2.953 1.367-2.953 3.037v3.037H222v1.52h2.952v28.85c0 2.582 1.92 4.556 4.43 4.556h16.237c2.51 0 4.425-1.974 4.425-4.556V7.594H253v-1.52h-5.905zm-14.762-3.037c0-.91.59-1.518 1.477-1.518h7.38c.886 0 1.477.603 1.477 1.514V6.07h-10.334V3.038zm16.238 33.407c0 1.67-1.324 3.037-2.95 3.037h-16.24c-1.62 0-2.95-1.362-2.95-3.033V7.597h22.14v28.85z"/></g><path d="M198.796 17.55l.213-6.078c.02-.562.414-1.057 1.01-1.26.597-.2 1.277-.072 1.73.33l14.47 12.855c.313.278.482.655.47 1.042-.015.383-.21.75-.54 1.002l-15.336 11.81c-.312.242-.714.36-1.116.346-.216-.007-.43-.053-.63-.137-.584-.242-.947-.764-.927-1.326l.197-5.595c-1.327-.065-3.35-.16-5.507-.234-1.988-.07-3.732-.112-5.184-.126-7.945-.074-17.388 4.87-17.48 4.92-.517.27-1.165.268-1.68-.013-.514-.28-.81-.788-.763-1.315 1.184-13.563 24.76-15.852 31.068-16.222zm-11.14 9.815c1.482.013 3.257.056 5.277.127 3.75.13 7.114.317 7.148.32.875.047 1.55.696 1.52 1.46l-.13 3.713 11.28-8.685-10.64-9.45-.144 4.1c-.026.74-.7 1.33-1.545 1.35-.26.01-24.1.746-28.742 10.89 3.71-1.594 10.072-3.88 15.98-3.823zM35.196 52.383l4.23-4.376c.39-.404 1.02-.505 1.598-.256.578.25.996.805 1.063 1.407L44.233 68.4c.047.414-.08.807-.35 1.086-.27.28-.658.42-1.074.386l-19.31-1.49c-.395-.03-.77-.21-1.06-.49-.156-.15-.285-.328-.378-.526-.27-.57-.19-1.2.2-1.605l3.893-4.024c-.943-.937-2.385-2.363-3.936-3.862-1.43-1.382-2.7-2.582-3.77-3.564-5.854-5.377-16.18-8.026-16.286-8.05-.566-.145-1.044-.58-1.238-1.134-.196-.553-.075-1.13.312-1.49 9.96-9.286 29.015 4.8 33.95 8.75zm-14.85-.167c1.09 1.002 2.383 2.223 3.837 3.628 2.7 2.61 5.075 5 5.1 5.024.614.62.68 1.554.148 2.104l-2.58 2.672L41.05 66.74l-1.58-14.15-2.85 2.95c-.515.537-1.413.52-2.054-.025-.198-.17-18.408-15.587-28.652-11.156 3.826 1.297 10.085 3.86 14.44 7.86z" fill="#979797"/><path d="M44.5 117h102m-144 56.5l42-56m89 55l42-56M44.5 77h132m-174 56.5l42-56m89 56l42-56M44 117.5v-40" stroke="#979797" stroke-width="2" stroke-linecap="square"/><path stroke="#979797" stroke-width="2" fill="#E8E8E8" d="M64.865 70.774l54.504 58.42-18.32 17.09-54.505-58.42z"/><text transform="rotate(47 86.5 110.5)" font-family="Open Sans" font-size="14" fill="#373535"><tspan x="59" y="116">&amp;quot;World!&amp;quot;</tspan></text><path d="M176 116V77.5" stroke="#979797" stroke-width="2" stroke-linecap="square"/><path stroke="#979797" stroke-width="2" fill="#fff" d="M1 134h133v40H1z"/><g transform="translate(38 147)"><path stroke="#979797" fill="#fff" d="M0 0h63v16H0z"/><circle stroke="#979797" cx="3.5" cy="3.5" r="1.5"/><text font-family="Consolas" font-size="14" fill="#373535"><tspan x="7" y="12">message</tspan></text></g></g></svg>
Side by side Swipe Overlay

Before

Width:  |  Height:  |  Size: 8.7 KiB

After

Width:  |  Height:  |  Size: 3.2 KiB

Before After
Before After

28
1-js/2-first-steps/5-variables/variable-gray.svg
View file

@ -1,27 +1 @@
<?xml version="1.0" encoding="UTF-8" standalone="no"?>
<svg width="148px" height="128px" viewBox="0 0 148 128" version="1.1" xmlns="http://www.w3.org/2000/svg" xmlns:xlink="http://www.w3.org/1999/xlink" xmlns:sketch="http://www.bohemiancoding.com/sketch/ns">
<!-- Generator: Sketch 3.2.2 (9983) - http://www.bohemiancoding.com/sketch -->
<title>noun_1211_cc + Message</title>
<desc>Created with Sketch.</desc>
<defs></defs>
<g id="combined-grey" stroke="none" stroke-width="1" fill="none" fill-rule="evenodd" sketch:type="MSPage">
<g id="variable" sketch:type="MSArtboardGroup" transform="translate(-161.000000, -71.000000)">
<g id="noun_1211_cc-+-Message" sketch:type="MSLayerGroup" transform="translate(161.000000, 71.000000)">
<g id="noun_1211_cc">
<path d="M17,37.1960457 L129.557785,37.1960457 L129.557785,80.1456641 C129.557785,80.5185728 129.479295,81.0083855 129.279367,81.4404861 C129.07944,81.8725868 112.704625,117 112.704625,117 L112.704625,62.6396695 L129.559266,37.1960457 L148,9 L35.4407339,9 L17,37.1960457 L17,37.1960457 Z" id="Shape" fill="#C7C7C7" sketch:type="MSShapeGroup"></path>
<path d="M17,66 L17,38 L2,66" id="Shape" fill="#C7C7C7" sketch:type="MSShapeGroup"></path>
<g id="Rectangle-5-+-&quot;World!&quot;" transform="translate(15.000000, 0.000000)">
<path d="M18.9106925,0.395208397 L73.4146415,58.8435379 L55.0893075,75.9321883 L0.585358502,17.4838588 L18.9106925,0.395208397 L18.9106925,0.395208397 Z" id="Rectangle-5" stroke="#8A704D" stroke-width="2" fill="#FFF9EB" sketch:type="MSShapeGroup"></path>
<text id="&quot;Hello!&quot;" sketch:type="MSTextLayer" transform="translate(39.885486, 40.782373) rotate(47.000000) translate(-39.885486, -40.782373) " font-family="Open Sans" font-size="14" font-weight="526" fill="#8A704D">
<tspan x="10.392998" y="46.2823729">"Hello!"</tspan>
</text>
</g>
<path d="M0,68 L0,122.729971 C0,126.150501 1.4836395,128 4.38712201,128 L104.473443,128 C107.59502,128 110,125.4521 110,124.524372 L110,68 L0,68 L0,68 Z" id="Shape" fill="#C7C7C7" sketch:type="MSShapeGroup"></path>
</g>
<text id="Message" sketch:type="MSTextLayer" font-family="Open Sans" font-size="18" font-weight="526" fill="#FFFFFF">
<tspan x="17" y="105">Message</tspan>
</text>
</g>
</g>
</g>
</svg>
<svg width="148" height="128" viewBox="0 0 148 128" xmlns="http://www.w3.org/2000/svg"><title>noun_1211_cc + Message</title><desc>Created with Sketch.</desc><g fill="none" fill-rule="evenodd"><path d="M17 37.196h112.558v42.95c0 .373-.08.862-.28 1.294-.2.433-16.573 35.56-16.573 35.56V62.64l16.854-25.444L148 9H35.44L17 37.196zM17 66V38L2 66" fill="#C7C7C7"/><path d="M33.91.395l54.505 58.45L70.09 75.93 15.584 17.484 33.91.394z" stroke="#8A704D" stroke-width="2" fill="#FFF9EB"/><text transform="matrix(.682 .731 -.731 .682 15 0)" font-family="Open Sans" font-size="14" font-weight="526" fill="#8A704D"><tspan x="10.393" y="46.282">&amp;quot;Hello!&amp;quot;</tspan></text><path d="M0 68v54.73c0 3.42 1.484 5.27 4.387 5.27h100.086c3.122 0 5.527-2.548 5.527-3.476V68H0z" fill="#C7C7C7"/><text font-family="Open Sans" font-size="18" font-weight="526" fill="#fff" transform="translate(-161 -71) translate(161 71)"><tspan x="17" y="105">Message</tspan></text></g></svg>
Side by side Swipe Overlay

Before

Width:  |  Height:  |  Size: 2.5 KiB

After

Width:  |  Height:  |  Size: 965 B

Before After
Before After

28
1-js/2-first-steps/5-variables/variable-green.svg
View file

@ -1,27 +1 @@
<?xml version="1.0" encoding="UTF-8" standalone="no"?>
<svg width="148px" height="128px" viewBox="0 0 148 128" version="1.1" xmlns="http://www.w3.org/2000/svg" xmlns:xlink="http://www.w3.org/1999/xlink" xmlns:sketch="http://www.bohemiancoding.com/sketch/ns">
<!-- Generator: Sketch 3.2.2 (9983) - http://www.bohemiancoding.com/sketch -->
<title>noun_1211_cc + Message</title>
<desc>Created with Sketch.</desc>
<defs></defs>
<g id="combined-green" stroke="none" stroke-width="1" fill="none" fill-rule="evenodd" sketch:type="MSPage">
<g id="variable" sketch:type="MSArtboardGroup" transform="translate(-161.000000, -71.000000)">
<g id="noun_1211_cc-+-Message" sketch:type="MSLayerGroup" transform="translate(161.000000, 71.000000)">
<g id="noun_1211_cc">
<path d="M17,37.1960457 L129.557785,37.1960457 L129.557785,80.1456641 C129.557785,80.5185728 129.479295,81.0083855 129.279367,81.4404861 C129.07944,81.8725868 112.704625,117 112.704625,117 L112.704625,62.6396695 L129.559266,37.1960457 L148,9 L35.4407339,9 L17,37.1960457 L17,37.1960457 Z" id="Shape" fill="#CFCE95" sketch:type="MSShapeGroup"></path>
<path d="M17,66 L17,38 L2,66" id="Shape" fill="#CFCE95" sketch:type="MSShapeGroup"></path>
<g id="Rectangle-5-+-&quot;World!&quot;" transform="translate(15.000000, 0.000000)">
<path d="M18.9106925,0.395208397 L73.4146415,58.8435379 L55.0893075,75.9321883 L0.585358502,17.4838588 L18.9106925,0.395208397 L18.9106925,0.395208397 Z" id="Rectangle-5" stroke="#8A704D" stroke-width="2" fill="#FFF9EB" sketch:type="MSShapeGroup"></path>
<text id="&quot;Hello!&quot;" sketch:type="MSTextLayer" transform="translate(39.885486, 40.782373) rotate(47.000000) translate(-39.885486, -40.782373) " font-family="Open Sans" font-size="14" font-weight="526" fill="#8A704D">
<tspan x="10.392998" y="46.2823729">"Hello!"</tspan>
</text>
</g>
<path d="M0,68 L0,122.729971 C0,126.150501 1.4836395,128 4.38712201,128 L104.473443,128 C107.59502,128 110,125.4521 110,124.524372 L110,68 L0,68 L0,68 Z" id="Shape" fill="#CFCE95" sketch:type="MSShapeGroup"></path>
</g>
<text id="Message" sketch:type="MSTextLayer" font-family="Open Sans" font-size="18" font-weight="526" fill="#FFFFFF">
<tspan x="17" y="105">Message</tspan>
</text>
</g>
</g>
</g>
</svg>
<svg width="148" height="128" viewBox="0 0 148 128" xmlns="http://www.w3.org/2000/svg"><title>noun_1211_cc + Message</title><desc>Created with Sketch.</desc><g fill="none" fill-rule="evenodd"><path d="M17 37.196h112.558v42.95c0 .373-.08.862-.28 1.294-.2.433-16.573 35.56-16.573 35.56V62.64l16.854-25.444L148 9H35.44L17 37.196zM17 66V38L2 66" fill="#CFCE95"/><path d="M33.91.395l54.505 58.45L70.09 75.93 15.584 17.484 33.91.394z" stroke="#8A704D" stroke-width="2" fill="#FFF9EB"/><text transform="matrix(.682 .731 -.731 .682 15 0)" font-family="Open Sans" font-size="14" font-weight="526" fill="#8A704D"><tspan x="10.393" y="46.282">&amp;quot;Hello!&amp;quot;</tspan></text><path d="M0 68v54.73c0 3.42 1.484 5.27 4.387 5.27h100.086c3.122 0 5.527-2.548 5.527-3.476V68H0z" fill="#CFCE95"/><text font-family="Open Sans" font-size="18" font-weight="526" fill="#fff" transform="translate(-161 -71) translate(161 71)"><tspan x="17" y="105">Message</tspan></text></g></svg>
Side by side Swipe Overlay

Before

Width:  |  Height:  |  Size: 2.5 KiB

After

Width:  |  Height:  |  Size: 965 B

Before After
Before After

28
1-js/2-first-steps/5-variables/variable.svg
View file

@ -1,27 +1 @@
<?xml version="1.0" encoding="UTF-8" standalone="no"?>
<svg width="148px" height="128px" viewBox="0 0 148 128" version="1.1" xmlns="http://www.w3.org/2000/svg" xmlns:xlink="http://www.w3.org/1999/xlink" xmlns:sketch="http://www.bohemiancoding.com/sketch/ns">
<!-- Generator: Sketch 3.2.2 (9983) - http://www.bohemiancoding.com/sketch -->
<title>noun_1211_cc + Message</title>
<desc>Created with Sketch.</desc>
<defs></defs>
<g id="combined" stroke="none" stroke-width="1" fill="none" fill-rule="evenodd" sketch:type="MSPage">
<g id="variable" sketch:type="MSArtboardGroup" transform="translate(-161.000000, -71.000000)">
<g id="noun_1211_cc-+-Message" sketch:type="MSLayerGroup" transform="translate(161.000000, 71.000000)">
<g id="noun_1211_cc">
<path d="M17,37.1960457 L129.557785,37.1960457 L129.557785,80.1456641 C129.557785,80.5185728 129.479295,81.0083855 129.279367,81.4404861 C129.07944,81.8725868 112.704625,117 112.704625,117 L112.704625,62.6396695 L129.559266,37.1960457 L148,9 L35.4407339,9 L17,37.1960457 L17,37.1960457 Z" id="Shape" fill="#E7C392" sketch:type="MSShapeGroup"></path>
<path d="M17,66 L17,38 L2,66" id="Shape" fill="#E7C392" sketch:type="MSShapeGroup"></path>
<g id="Rectangle-5-+-&quot;World!&quot;" transform="translate(15.000000, 0.000000)">
<path d="M18.9106925,0.395208397 L73.4146415,58.8435379 L55.0893075,75.9321883 L0.585358502,17.4838588 L18.9106925,0.395208397 L18.9106925,0.395208397 Z" id="Rectangle-5" stroke="#8A704D" stroke-width="2" fill="#FFF9EB" sketch:type="MSShapeGroup"></path>
<text id="&quot;Hello!&quot;" sketch:type="MSTextLayer" transform="translate(39.885486, 40.782373) rotate(47.000000) translate(-39.885486, -40.782373) " font-family="Open Sans" font-size="14" font-weight="526" fill="#8A704D">
<tspan x="10.392998" y="46.2823729">"Hello!"</tspan>
</text>
</g>
<path d="M0,68 L0,122.729971 C0,126.150501 1.4836395,128 4.38712201,128 L104.473443,128 C107.59502,128 110,125.4521 110,124.524372 L110,68 L0,68 L0,68 Z" id="Shape" fill="#E7C392" sketch:type="MSShapeGroup"></path>
</g>
<text id="Message" sketch:type="MSTextLayer" font-family="Open Sans" font-size="18" font-weight="526" fill="#FFFFFF">
<tspan x="17" y="105">Message</tspan>
</text>
</g>
</g>
</g>
</svg>
<svg width="148" height="128" viewBox="0 0 148 128" xmlns="http://www.w3.org/2000/svg"><title>noun_1211_cc + Message</title><desc>Created with Sketch.</desc><g fill="none" fill-rule="evenodd"><path d="M17 37.196h112.558v42.95c0 .373-.08.862-.28 1.294-.2.433-16.573 35.56-16.573 35.56V62.64l16.854-25.444L148 9H35.44L17 37.196zM17 66V38L2 66" fill="#E7C392"/><path d="M33.91.395l54.505 58.45L70.09 75.93 15.584 17.484 33.91.394z" stroke="#8A704D" stroke-width="2" fill="#FFF9EB"/><text transform="matrix(.682 .731 -.731 .682 15 0)" font-family="Open Sans" font-size="14" font-weight="526" fill="#8A704D"><tspan x="10.393" y="46.282">&amp;quot;Hello!&amp;quot;</tspan></text><path d="M0 68v54.73c0 3.42 1.484 5.27 4.387 5.27h100.086c3.122 0 5.527-2.548 5.527-3.476V68H0z" fill="#E7C392"/><text font-family="Open Sans" font-size="18" font-weight="526" fill="#fff" transform="translate(-161 -71) translate(161 71)"><tspan x="17" y="105">Message</tspan></text></g></svg>
Side by side Swipe Overlay

Before

Width:  |  Height:  |  Size: 2.5 KiB

After

Width:  |  Height:  |  Size: 965 B

Before After
Before After