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

new figures export

Browse source
This commit is contained in:
Ilya Kantor 2015-02-01 14:45:01 +03:00
parent 3af3564921
commit a3492b1f58
60 changed files with 1424 additions and 349 deletions
Download patch file Download diff file Expand all files Collapse all files

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

@ -1 +1,35 @@
<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.508-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><path d="M242.667 10.63h1.476v25.815h-1.476zm-5.905 0h1.476v25.815h-1.476zm-5.905 0h1.476v25.815h-1.476zm16.238-4.556h-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.422-1.974 4.422-4.556V7.594H253v-1.52h-5.905zm-14.762-3.037c0-.91.59-1.518 1.477-1.518h7.38c.886 0 1.477.6 1.477 1.51v3.04h-10.334V3.038zm16.238 33.407c0 1.67-1.32 3.037-2.95 3.037h-16.24c-1.62 0-2.95-1.36-2.95-3.03V7.598h22.14v28.85zM198.798 17.55l.213-6.078c.02-.562.412-1.057 1.01-1.26.595-.2 1.275-.072 1.73.33l14.47 12.855c.31.278.48.655.47 1.042-.017.38-.21.75-.54 1l-15.34 11.81c-.312.242-.714.36-1.116.346-.216-.007-.43-.053-.63-.137-.584-.244-.947-.766-.927-1.328l.196-5.595c-1.327-.066-3.35-.16-5.507-.235-1.99-.07-3.733-.112-5.185-.126-7.944-.075-17.387 4.87-17.48 4.92-.516.27-1.164.267-1.68-.014-.513-.28-.81-.788-.762-1.315 1.184-13.562 24.76-15.85 31.068-16.22zm-11.14 9.815c1.482.013 3.257.056 5.277.127 3.75.13 7.114.317 7.148.32.877.047 1.55.696 1.52 1.46l-.13 3.713 11.28-8.685-10.64-9.45-.142 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.073-3.88 15.98-3.823zM35.197 52.383l4.23-4.376c.39-.404 1.02-.505 1.597-.256.578.25.996.808 1.063 1.41l2.146 19.24c.047.415-.08.808-.35 1.087-.27.28-.658.42-1.074.386l-19.31-1.49c-.398-.03-.77-.21-1.06-.49-.16-.15-.288-.328-.38-.526-.27-.57-.19-1.2.2-1.605l3.892-4.022c-.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.376-16.18-8.025-16.286-8.05-.565-.144-1.043-.58-1.237-1.133-.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.382 2.223 3.836 3.628 2.7 2.61 5.075 5 5.1 5.024.614.62.68 1.554.148 2.104l-2.58 2.672 14.2 1.096-1.58-14.15-2.85 2.95c-.513.537-1.41.52-2.052-.025-.198-.17-18.408-15.587-28.652-11.156C9.74 45.653 16 48.22 20.356 52.22z" 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.508-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>
<?xml version="1.0" encoding="UTF-8" standalone="no"?>
<svg width="392px" height="192px" viewBox="0 0 392 192" version="1.1" xmlns="http://www.w3.org/2000/svg" xmlns:xlink="http://www.w3.org/1999/xlink">
<defs></defs>
<g id="combined" stroke="none" stroke-width="1" fill="none" fill-rule="evenodd">
<g id="variable-change">
<g id="noun_1211_cc" transform="translate(52.000000, -5.000000)">
<path d="M25,94.1960457 L137.557785,94.1960457 L137.557785,137.145664 C137.557785,137.518573 137.479295,138.008386 137.279367,138.440486 C137.07944,138.872587 120.704625,174 120.704625,174 L120.704625,119.63967 L137.559266,94.1960457 L156,66 L43.4407339,66 L25,94.1960457 L25,94.1960457 Z" id="Shape" fill="#E8C48F"></path>
<path d="M25,123 L25,95 L10,123" id="Shape" fill="#E8C48F"></path>
<g id="Rectangle-5-+-&quot;World!&quot;" transform="translate(0.000000, 57.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"></path>
<text id="&quot;World!&quot;" 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">"World!"</tspan>
</text>
</g>
<g id="Rectangle-5-+-&quot;World!&quot;-2" transform="translate(139.643781, 49.254803) rotate(293.000000) translate(-139.643781, -49.254803) translate(102.643781, 11.254803)">
<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"></path>
<text id="&quot;Hello!&quot;" 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="M8,125 L8,179.729971 C8,183.150501 9.4836395,185 12.387122,185 L112.473443,185 C115.59502,185 118,182.4521 118,181.524372 L118,125 L8,125 L8,125 Z" id="Shape" fill="#E8C48F"></path>
</g>
<text id="Message" font-family="Open Sans" font-size="18" font-weight="526" fill="#FFFFFF">
<tspan x="77" y="157">Message</tspan>
</text>
<path d="M58.1116321,51.8083441 C58.1116321,51.8083441 47.657459,40.6232618 40.718887,36.1553077 C40.5505125,38.0030849 40.3826205,39.8498971 40.2142461,41.6967094 C28.8419738,40.6618577 17.2921606,42.1936311 6.44527455,46.2920298 C7.83472576,49.9697335 9.22417698,53.6469547 10.6136282,57.324176 C19.7782168,53.8616442 29.5366994,52.5677178 39.1451405,53.4419142 C38.9767661,55.2896913 38.8083916,57.1365036 38.6404996,58.9837982 C44.221462,55.6553872 58.1116321,51.8083441 58.1116321,51.8083441" id="Fill-54" fill="#E8C48F" transform="translate(32.278453, 47.569553) rotate(11.000000) translate(-32.278453, -47.569553) "></path>
<path d="M287.796688,28.1860236 C287.796688,28.1860236 277.342515,17.0009413 270.403943,12.5329872 C270.235568,14.3807644 270.067676,16.2275766 269.899302,18.0743889 C258.527029,17.0395372 246.977216,18.5713106 236.13033,22.6697093 C237.519781,26.347413 238.909232,30.0246342 240.298684,33.7018555 C249.463272,30.2393237 259.221755,28.9453973 268.830196,29.8195937 C268.661822,31.6673708 268.493447,33.5141831 268.325555,35.3614778 C273.906517,32.0330667 287.796688,28.1860236 287.796688,28.1860236" id="Fill-54" fill="#E8C48F" transform="translate(261.963509, 23.947232) rotate(2.000000) translate(-261.963509, -23.947232) "></path>
<g id="noun_48910_cc" transform="translate(298.000000, 5.000000)">
<path d="M50.9827143,6 L36.0161055,6 C35.4567164,6 35,6.62621359 35,7.39482201 L35,12 L52,12 L52,7.39482201 C52,6.62621359 51.5432836,6 50.9827143,6 L50.9827143,6 Z" id="Shape"></path>
<path d="M84.1925988,9.36030059 L57.803165,9.36030059 L57.803165,6.08482838 C57.803165,2.72879291 54.9894635,0 51.5275421,0 L36.4712707,0 C33.0105365,0 30.1956478,2.72879291 30.1956478,6.08482838 L30.1956478,9.36030059 L3.80740121,9.36030059 C1.70484195,9.36030059 0,11.0118475 0,13.0500982 L0,13.3102024 C0,15.348453 1.70484195,17 3.80740121,17 L84.1925988,17 C86.295158,17 88,15.348453 88,13.3102024 L88,13.0500982 C88,11.0118475 86.2939708,9.36030059 84.1925988,9.36030059 L84.1925988,9.36030059 Z M53,12 L36,12 L36,7.39482201 C36,6.62621359 36.4567164,6 37.0161055,6 L51.9838945,6 C52.5444637,6 53,6.62621359 53,7.39482201 L53,12 L53,12 Z" id="Shape" fill="#E8C48F"></path>
<path d="M74.9552359,20.0447289 L8.04358113,20.0447289 C4.15387761,20.0447289 1,19.3642794 1,23.3113665 L6.28209435,101.692668 C6.28209435,105.636155 9.43715496,109 13.3268585,109 L69.6743245,109 C73.564028,109 76.7179057,105.636155 76.7179057,101.692668 L82,23.3113665 C81.998817,19.3642794 78.8449394,20.0447289 74.9552359,20.0447289 L74.9552359,20.0447289 Z M26.7566501,98.9987039 C25.4744903,99.0375373 24.4044574,98.1989795 24.361495,97.1213538 L22.0012467,36.0255616 C21.9596269,34.947936 22.9652161,34.0414198 24.2433483,34.0013729 C25.5255081,33.961326 26.595541,34.8023109 26.6385035,35.8799365 L28.9987517,96.9757287 C29.0403715,98.0521408 28.0361248,98.9598706 26.7566501,98.9987039 L26.7566501,98.9987039 Z M43,97.0485689 C43,98.1255551 42.328125,99 41.5,99 C40.671875,99 40,98.1243423 40,97.0485689 L40,35.9514311 C40,34.8732321 40.671875,34 41.5,34 C42.328125,34 43,34.8732321 43,35.9514311 L43,97.0485689 L43,97.0485689 Z M61.6385051,97.1213889 C61.5968852,98.1989944 60.5255097,99.0375366 59.2433499,98.9987039 C57.9638752,98.9598713 56.9596285,98.0521585 57.0012483,96.974553 L59.3614965,35.8799014 C59.4031164,34.8022959 60.4731493,33.9613267 61.7553091,34.0013729 C63.0347839,34.0426325 64.0403731,34.9479183 63.9987533,36.0255238 L61.6385051,97.1213889 L61.6385051,97.1213889 Z" id="Shape" fill="#E8C48F"></path>
</g>
</g>
</g>
</svg>
Side by side Swipe Overlay

Before

Width:  |  Height:  |  Size: 3.1 KiB

After

Width:  |  Height:  |  Size: 6.2 KiB

Before After
Before After

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

@ -1 +1,24 @@
<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>
<?xml version="1.0" encoding="UTF-8" standalone="no"?>
<svg width="166px" height="145px" viewBox="0 0 166 145" version="1.1" xmlns="http://www.w3.org/2000/svg" xmlns:xlink="http://www.w3.org/1999/xlink">
<defs></defs>
<g id="combined" stroke="none" stroke-width="1" fill="none" fill-rule="evenodd">
<g id="variable">
<g id="noun_1211_cc-+-Message" transform="translate(13.000000, 3.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="#E8C48F"></path>
<path d="M17,66 L17,38 L2,66" id="Shape" fill="#E8C48F"></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"></path>
<text id="&quot;Hello!&quot;" 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="#E8C48F"></path>
</g>
<text id="Message" font-family="Open Sans" font-size="18" font-weight="526" fill="#FFFFFF">
<tspan x="17" y="105">Message</tspan>
</text>
</g>
</g>
</g>
</svg>
Side by side Swipe Overlay

Before

Width:  |  Height:  |  Size: 965 B

After

Width:  |  Height:  |  Size: 2 KiB

Before After
Before After