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

Embed font to SVG

Browse source
This commit is contained in:
Ilya Kantor 2019-08-11 14:17:38 +03:00
parent 1310171dd7
commit 4d44df6a3a
226 changed files with 225 additions and 11893 deletions
Download patch file Download diff file Expand all files Collapse all files

36
2-ui/3-event-details/3-mousemove-mouseover-mouseout-mouseenter-mouseleave/mouseover-mouseout-from-outside.svg
View file

@ -1,35 +1 @@
<?xml version="1.0" encoding="UTF-8"?>
<svg width="440px" height="183px" viewBox="0 0 440 183" version="1.1" xmlns="http://www.w3.org/2000/svg" xmlns:xlink="http://www.w3.org/1999/xlink">
<!-- Generator: sketchtool 55.2 (78181) - https://sketchapp.com -->
<title>mouseover-mouseout-from-outside.svg</title>
<desc>Created with sketchtool.</desc>
<defs>
<rect id="path-1" x="202" y="57" width="126" height="93"></rect>
<mask id="mask-2" maskContentUnits="userSpaceOnUse" maskUnits="objectBoundingBox" x="0" y="0" width="126" height="93" fill="white">
<use xlink:href="#path-1"></use>
</mask>
</defs>
<g id="dom" stroke="none" stroke-width="1" fill="none" fill-rule="evenodd">
<g id="mouseover-mouseout-from-outside.svg">
<use id="Rectangle-10" stroke="#E8C48E" mask="url(#mask-2)" stroke-width="8" fill="#FFF9EB" opacity="0.6" stroke-dasharray="5,1,5,1" xlink:href="#path-1"></use>
<g id="noun_69008_cc" transform="translate(171.000000, 8.000000)" fill="#E8C48E">
<path d="M234.020833,169 L4.97916667,169 C2.23066667,169 0,167.09875 0,164.775 L0,4.225 C0,1.90125 2.23066667,0 4.97916667,0 L234.020833,0 C236.759375,0 239,1.90125 239,4.225 L239,164.775 C239,167.09875 236.759375,169 234.020833,169 L234.020833,169 Z M9.95833333,160.55 L229.041667,160.55 L229.041667,8.45 L9.95833333,8.45 L9.95833333,160.55 L9.95833333,160.55 Z" id="Shape"></path>
<path d="M229.041667,42.25 L9.95833333,42.25 C7.20983333,42.25 4.97916667,40.34875 4.97916667,38.025 C4.97916667,35.70125 7.20983333,33.8 9.95833333,33.8 L229.041667,33.8 C231.780208,33.8 234.020833,35.70125 234.020833,38.025 C234.020833,40.34875 231.780208,42.25 229.041667,42.25 L229.041667,42.25 Z" id="Shape"></path>
<path d="M27.9166667,20.9 C27.9166667,23.11 26.1266667,24.9 23.9166667,24.9 C21.7066667,24.9 19.9166667,23.11 19.9166667,20.9 C19.9166667,18.69 21.7066667,16.9 23.9166667,16.9 C26.1266667,16.9 27.9166667,18.69 27.9166667,20.9 L27.9166667,20.9 Z" id="Shape"></path>
<path d="M47.8333333,20.9 C47.8333333,23.11 46.0433333,24.9 43.8333333,24.9 C41.6233333,24.9 39.8333333,23.11 39.8333333,20.9 C39.8333333,18.69 41.6233333,16.9 43.8333333,16.9 C46.0433333,16.9 47.8333333,18.69 47.8333333,20.9 L47.8333333,20.9 Z" id="Shape"></path>
<path d="M67.75,20.9 C67.75,23.11 65.96,24.9 63.75,24.9 C61.54,24.9 59.75,23.11 59.75,20.9 C59.75,18.69 61.54,16.9 63.75,16.9 C65.96,16.9 67.75,18.69 67.75,20.9 L67.75,20.9 Z" id="Shape"></path>
</g>
<rect id="Rectangle-6" stroke="#E8C48E" stroke-width="2" fill="#FFF9EB" x="232" y="86" width="67" height="34"></rect>
<text id="#TO" font-family="OpenSans-Bold, Open Sans" font-size="14" font-weight="bold" fill="#8A704D">
<tspan x="250.99681" y="109">#TO</tspan>
</text>
<polygon id="Fill-21" fill="#EE6B47" transform="translate(159.000000, 103.646000) scale(-1, 1) translate(-159.000000, -103.646000) " points="223.12832 94.6353921 217.344468 101.853926 105.198001 101.853926 108.348404 94.146 82 103.645409 108.348404 113.146 105.235092 105.438074 217.204218 105.438074 223.12832 112.830378 236 112.830378 228.709332 103.733476 236 94.6353921"></polygon>
<text id="target" font-family="PTMono-Bold, PT Mono" font-size="14" font-weight="bold" fill="#8A704D">
<tspan x="240" y="80">target</tspan>
</text>
<text id="relatedTarget-=-null" font-family="PTMono-Bold, PT Mono" font-size="14" font-weight="bold" fill="#8A704D">
<tspan x="1" y="85">relatedTarget = null</tspan>
</text>
</g>
</g>
</svg>
<svg xmlns="http://www.w3.org/2000/svg" xmlns:xlink="http://www.w3.org/1999/xlink" width="440" height="183" viewBox="0 0 440 183"><defs><style>@import url(https://fonts.googleapis.com/css?family=Open+Sans:bold,italic,bolditalic%7CPT+Mono);@font-face{font-family:&apos;PT Mono&apos;;font-weight:700;font-style:normal;src:local(&apos;PT MonoBold&apos;),url(/pack/modules/styles/blocks/font/PTMonoBold.woff2) format(&apos;woff2&apos;),url(/pack/modules/styles/blocks/font/PTMonoBold.woff) format(&apos;woff&apos;),url(/pack/modules/styles/blocks/font/PTMonoBold.ttf) format(&apos;truetype&apos;)}</style></defs><defs><path id="path-1" d="M202 57h126v93H202z"/><mask id="mask-2" width="126" height="93" x="0" y="0" fill="#fff" maskContentUnits="userSpaceOnUse" maskUnits="objectBoundingBox"><use xlink:href="#path-1"/></mask></defs><g id="dom" fill="none" fill-rule="evenodd" stroke="none" stroke-width="1"><g id="mouseover-mouseout-from-outside.svg"><use id="Rectangle-10" fill="#FFF9EB" stroke="#E8C48E" stroke-dasharray="5,1,5,1" stroke-width="8" mask="url(#mask-2)" opacity=".6" xlink:href="#path-1"/><g id="noun_69008_cc" fill="#E8C48E" transform="translate(171 8)"><path id="Shape" d="M234.02 169H4.98C2.23 169 0 167.099 0 164.775V4.225C0 1.901 2.23 0 4.98 0h229.04c2.74 0 4.98 1.901 4.98 4.225v160.55c0 2.324-2.24 4.225-4.98 4.225zM9.959 160.55h219.084V8.45H9.958v152.1z"/><path id="Shape" d="M229.042 42.25H9.958c-2.748 0-4.979-1.901-4.979-4.225S7.21 33.8 9.96 33.8h219.083c2.738 0 4.979 1.901 4.979 4.225s-2.24 4.225-4.98 4.225zM27.917 20.9c0 2.21-1.79 4-4 4s-4-1.79-4-4 1.79-4 4-4 4 1.79 4 4zM47.833 20.9c0 2.21-1.79 4-4 4s-4-1.79-4-4 1.79-4 4-4 4 1.79 4 4zM67.75 20.9c0 2.21-1.79 4-4 4s-4-1.79-4-4 1.79-4 4-4 4 1.79 4 4z"/></g><path id="Rectangle-6" fill="#FFF9EB" stroke="#E8C48E" stroke-width="2" d="M232 86h67v34h-67z"/><text id="#TO" fill="#8A704D" font-family="OpenSans-Bold, Open Sans" font-size="14" font-weight="bold"><tspan x="250.997" y="109">#TO</tspan></text><path id="Fill-21" fill="#EE6B47" d="M223.128 94.635l-5.784 7.219H105.198l3.15-7.708-26.348 9.5 26.348 9.5-3.113-7.708h111.97l5.923 7.392H236l-7.29-9.097 7.29-9.098z" transform="matrix(-1 0 0 1 318 0)"/><text id="target" fill="#8A704D" font-family="PTMono-Bold, PT Mono" font-size="14" font-weight="bold"><tspan x="240" y="80">target</tspan></text><text id="relatedTarget-=-null" fill="#8A704D" font-family="PTMono-Bold, PT Mono" font-size="14" font-weight="bold"><tspan x="1" y="85">relatedTarget = null</tspan></text></g></g></svg>
Side by side Swipe Overlay

Before

Width:  |  Height:  |  Size: 3.6 KiB

After

Width:  |  Height:  |  Size: 2.5 KiB

Before After
Before After

52
2-ui/3-event-details/3-mousemove-mouseover-mouseout-mouseenter-mouseleave/mouseover-mouseout-over-elems.svg
View file

@ -1,51 +1 @@
<?xml version="1.0" encoding="UTF-8"?>
<svg width="508px" height="92px" viewBox="0 0 508 92" version="1.1" xmlns="http://www.w3.org/2000/svg" xmlns:xlink="http://www.w3.org/1999/xlink">
<!-- Generator: sketchtool 55.2 (78181) - https://sketchapp.com -->
<title>mouseover-mouseout-over-elems.svg</title>
<desc>Created with sketchtool.</desc>
<defs>
<rect id="path-1" x="124" y="31" width="69.0072917" height="52.4511719"></rect>
<mask id="mask-2" maskContentUnits="userSpaceOnUse" maskUnits="objectBoundingBox" x="0" y="0" width="69.0072917" height="52.4511719" fill="white">
<use xlink:href="#path-1"></use>
</mask>
<rect id="path-3" x="207" y="31" width="69.0072917" height="52.4511719"></rect>
<mask id="mask-4" maskContentUnits="userSpaceOnUse" maskUnits="objectBoundingBox" x="0" y="0" width="69.0072917" height="52.4511719" fill="white">
<use xlink:href="#path-3"></use>
</mask>
<rect id="path-5" x="291" y="31" width="69.0072917" height="52.4511719"></rect>
<mask id="mask-6" maskContentUnits="userSpaceOnUse" maskUnits="objectBoundingBox" x="0" y="0" width="69.0072917" height="52.4511719" fill="white">
<use xlink:href="#path-5"></use>
</mask>
</defs>
<g id="dom" stroke="none" stroke-width="1" fill="none" fill-rule="evenodd">
<g id="mouseover-mouseout-over-elems.svg">
<rect id="Rectangle-6" stroke="#E8C48E" stroke-width="2" fill="#FFF9EB" x="375" y="22" width="88.0136719" height="50.4511719"></rect>
<text id="#TO" font-family="OpenSans-Bold, Open Sans" font-size="14" font-weight="bold" fill="#8A704D">
<tspan x="404.99681" y="53">#TO</tspan>
</text>
<rect id="Rectangle-7" stroke="#E8C48E" stroke-width="2" fill="#FFF9EB" x="17" y="22" width="88.0136719" height="50.4511719"></rect>
<text id="#FROM" font-family="OpenSans-Bold, Open Sans" font-size="14" font-weight="bold" fill="#8A704D">
<tspan x="36.3473958" y="53">#FROM</tspan>
</text>
<use id="Rectangle-8" stroke="#E8C48E" mask="url(#mask-2)" stroke-width="8" fill="#FFF9EB" opacity="0.6" stroke-dasharray="5,1,5,1" xlink:href="#path-1"></use>
<text id="&lt;DIV&gt;" opacity="0.6" font-family="OpenSans-Bold, Open Sans" font-size="14" font-weight="bold" fill="#8A704D">
<tspan x="138.964095" y="63">&lt;DIV&gt;</tspan>
</text>
<use id="Rectangle-9" stroke="#E8C48E" mask="url(#mask-4)" stroke-width="8" fill="#FFF9EB" opacity="0.6" stroke-dasharray="5,1,5,1" xlink:href="#path-3"></use>
<text id="&lt;DIV&gt;-2" opacity="0.6" font-family="OpenSans-Bold, Open Sans" font-size="14" font-weight="bold" fill="#8A704D">
<tspan x="221.964095" y="63">&lt;DIV&gt;</tspan>
</text>
<use id="Rectangle-10" stroke="#E8C48E" mask="url(#mask-6)" stroke-width="8" fill="#FFF9EB" opacity="0.6" stroke-dasharray="5,1,5,1" xlink:href="#path-5"></use>
<text id="&lt;DIV&gt;-3" opacity="0.6" font-family="OpenSans-Bold, Open Sans" font-size="14" font-weight="bold" fill="#8A704D">
<tspan x="305.964095" y="63">&lt;DIV&gt;</tspan>
</text>
<polyline id="Fill-21" fill="#EE6B47" transform="translate(247.500000, 47.646000) scale(-1, 1) translate(-247.500000, -47.646000) " points="401 38.6353921 375.340223 38.6353921 363.810075 45.8539263 140.245366 45.8539263 146.525714 38.146 94 47.6454089 146.525714 57.146 140.319306 49.4380737 363.530486 49.4380737 375.340223 56.8303775 401 56.8303775 386.466006 47.7334759 401 38.6353921"></polyline>
<text id="mouseover" font-family="PTMono-Bold, PT Mono" font-size="14" font-weight="bold" fill="#8A704D">
<tspan x="340" y="17">mouseover</tspan>
</text>
<text id="mouseout" font-family="PTMono-Bold, PT Mono" font-size="14" font-weight="bold" fill="#8A704D">
<tspan x="75" y="18">mouseout</tspan>
</text>
</g>
</g>
</svg>
<svg xmlns="http://www.w3.org/2000/svg" xmlns:xlink="http://www.w3.org/1999/xlink" width="508" height="92" viewBox="0 0 508 92"><defs><style>@import url(https://fonts.googleapis.com/css?family=Open+Sans:bold,italic,bolditalic%7CPT+Mono);@font-face{font-family:&apos;PT Mono&apos;;font-weight:700;font-style:normal;src:local(&apos;PT MonoBold&apos;),url(/pack/modules/styles/blocks/font/PTMonoBold.woff2) format(&apos;woff2&apos;),url(/pack/modules/styles/blocks/font/PTMonoBold.woff) format(&apos;woff&apos;),url(/pack/modules/styles/blocks/font/PTMonoBold.ttf) format(&apos;truetype&apos;)}</style></defs><defs><path id="path-1" d="M124 31h69.007v52.451H124z"/><path id="path-3" d="M207 31h69.007v52.451H207z"/><path id="path-5" d="M291 31h69.007v52.451H291z"/><mask id="mask-2" width="69.007" height="52.451" x="0" y="0" fill="#fff" maskContentUnits="userSpaceOnUse" maskUnits="objectBoundingBox"><use xlink:href="#path-1"/></mask><mask id="mask-4" width="69.007" height="52.451" x="0" y="0" fill="#fff" maskContentUnits="userSpaceOnUse" maskUnits="objectBoundingBox"><use xlink:href="#path-3"/></mask><mask id="mask-6" width="69.007" height="52.451" x="0" y="0" fill="#fff" maskContentUnits="userSpaceOnUse" maskUnits="objectBoundingBox"><use xlink:href="#path-5"/></mask></defs><g id="dom" fill="none" fill-rule="evenodd" stroke="none" stroke-width="1"><g id="mouseover-mouseout-over-elems.svg"><path id="Rectangle-6" fill="#FFF9EB" stroke="#E8C48E" stroke-width="2" d="M375 22h88.014v50.451H375z"/><text id="#TO" fill="#8A704D" font-family="OpenSans-Bold, Open Sans" font-size="14" font-weight="bold"><tspan x="404.997" y="53">#TO</tspan></text><path id="Rectangle-7" fill="#FFF9EB" stroke="#E8C48E" stroke-width="2" d="M17 22h88.014v50.451H17z"/><text id="#FROM" fill="#8A704D" font-family="OpenSans-Bold, Open Sans" font-size="14" font-weight="bold"><tspan x="36.347" y="53">#FROM</tspan></text><use id="Rectangle-8" fill="#FFF9EB" stroke="#E8C48E" stroke-dasharray="5,1,5,1" stroke-width="8" mask="url(#mask-2)" opacity=".6" xlink:href="#path-1"/><text id="&lt;DIV&gt;" fill="#8A704D" font-family="OpenSans-Bold, Open Sans" font-size="14" font-weight="bold" opacity=".6"><tspan x="138.964" y="63">&lt;DIV&gt;</tspan></text><use id="Rectangle-9" fill="#FFF9EB" stroke="#E8C48E" stroke-dasharray="5,1,5,1" stroke-width="8" mask="url(#mask-4)" opacity=".6" xlink:href="#path-3"/><text id="&lt;DIV&gt;-2" fill="#8A704D" font-family="OpenSans-Bold, Open Sans" font-size="14" font-weight="bold" opacity=".6"><tspan x="221.964" y="63">&lt;DIV&gt;</tspan></text><use id="Rectangle-10" fill="#FFF9EB" stroke="#E8C48E" stroke-dasharray="5,1,5,1" stroke-width="8" mask="url(#mask-6)" opacity=".6" xlink:href="#path-5"/><text id="&lt;DIV&gt;-3" fill="#8A704D" font-family="OpenSans-Bold, Open Sans" font-size="14" font-weight="bold" opacity=".6"><tspan x="305.964" y="63">&lt;DIV&gt;</tspan></text><path id="Fill-21" fill="#EE6B47" d="M401 38.635h-25.66l-11.53 7.219H140.245l6.28-7.708L94 47.646l52.526 9.5-6.207-7.708H363.53l11.81 7.392H401l-14.534-9.097L401 38.635" transform="matrix(-1 0 0 1 495 0)"/><text id="mouseover" fill="#8A704D" font-family="PTMono-Bold, PT Mono" font-size="14" font-weight="bold"><tspan x="340" y="17">mouseover</tspan></text><text id="mouseout" fill="#8A704D" font-family="PTMono-Bold, PT Mono" font-size="14" font-weight="bold"><tspan x="75" y="18">mouseout</tspan></text></g></g></svg>
Side by side Swipe Overlay

Before

Width:  |  Height:  |  Size: 4 KiB

After

Width:  |  Height:  |  Size: 3.3 KiB

Before After
Before After

23
2-ui/3-event-details/3-mousemove-mouseover-mouseout-mouseenter-mouseleave/mouseover-mouseout.svg
View file

@ -1,22 +1 @@
<?xml version="1.0" encoding="UTF-8"?>
<svg width="278px" height="92px" viewBox="0 0 278 92" version="1.1" xmlns="http://www.w3.org/2000/svg" xmlns:xlink="http://www.w3.org/1999/xlink">
<!-- Generator: sketchtool 55.2 (78181) - https://sketchapp.com -->
<title>mouseover-mouseout.svg</title>
<desc>Created with sketchtool.</desc>
<g id="dom" stroke="none" stroke-width="1" fill="none" fill-rule="evenodd">
<g id="mouseover-mouseout.svg">
<rect id="Rectangle-6" stroke="#E8C48E" stroke-width="2" fill="#FFF9EB" x="95" y="25" width="88.0136719" height="50.4511719"></rect>
<text id="&lt;DIV&gt;" font-family="OpenSans-Bold, Open Sans" font-size="14" font-weight="bold" fill="#8A704D">
<tspan x="118.964095" y="56">&lt;DIV&gt;</tspan>
</text>
<path d="M109,51.8276766 C109,51.8276766 88.1589755,39.0886766 74.3265137,34 C73.990849,36.1044846 73.6561461,38.2078702 73.3204815,40.3112558 C50.6491708,39.1326345 27.6239215,40.8772137 6,45.5449934 C8.76995481,49.733632 11.5399096,53.9217211 14.3098644,58.1098102 C32.5800247,54.1662369 52.0341482,52.6925483 71.1891551,53.6881948 C70.8534905,55.7926793 70.5178258,57.8960649 70.1831229,60 C81.3091081,56.2091804 109,51.8276766 109,51.8276766" id="Fill-55" fill="#EE6B47"></path>
<text id="mouseover" font-family="PTMono-Bold, PT Mono" font-size="14" font-weight="bold" fill="#8A704D">
<tspan x="17" y="21">mouseover</tspan>
</text>
<path d="M268,51.8276766 C268,51.8276766 247.158975,39.0886766 233.326514,34 C232.990849,36.1044846 232.656146,38.2078702 232.320481,40.3112558 C209.649171,39.1326345 186.623921,40.8772137 165,45.5449934 C167.769955,49.733632 170.53991,53.9217211 173.309864,58.1098102 C191.580025,54.1662369 211.034148,52.6925483 230.189155,53.6881948 C229.85349,55.7926793 229.517826,57.8960649 229.183123,60 C240.309108,56.2091804 268,51.8276766 268,51.8276766" id="Fill-56" fill="#EE6B47"></path>
<text id="mouseout" font-family="PTMono-Bold, PT Mono" font-size="14" font-weight="bold" fill="#8A704D">
<tspan x="193" y="21">mouseout</tspan>
</text>
</g>
</g>
</svg>
<svg xmlns="http://www.w3.org/2000/svg" width="278" height="92" viewBox="0 0 278 92"><defs><style>@import url(https://fonts.googleapis.com/css?family=Open+Sans:bold,italic,bolditalic%7CPT+Mono);@font-face{font-family:&apos;PT Mono&apos;;font-weight:700;font-style:normal;src:local(&apos;PT MonoBold&apos;),url(/pack/modules/styles/blocks/font/PTMonoBold.woff2) format(&apos;woff2&apos;),url(/pack/modules/styles/blocks/font/PTMonoBold.woff) format(&apos;woff&apos;),url(/pack/modules/styles/blocks/font/PTMonoBold.ttf) format(&apos;truetype&apos;)}</style></defs><g id="dom" fill="none" fill-rule="evenodd" stroke="none" stroke-width="1"><g id="mouseover-mouseout.svg"><path id="Rectangle-6" fill="#FFF9EB" stroke="#E8C48E" stroke-width="2" d="M95 25h88.014v50.451H95z"/><text id="&lt;DIV&gt;" fill="#8A704D" font-family="OpenSans-Bold, Open Sans" font-size="14" font-weight="bold"><tspan x="118.964" y="56">&lt;DIV&gt;</tspan></text><path id="Fill-55" fill="#EE6B47" d="M109 51.828S88.159 39.088 74.327 34c-.336 2.104-.67 4.208-1.007 6.311-22.67-1.178-45.696.566-67.32 5.234l8.31 12.565c18.27-3.944 37.724-5.417 56.88-4.422-.337 2.105-.672 4.208-1.007 6.312C81.31 56.21 109 51.828 109 51.828"/><text id="mouseover" fill="#8A704D" font-family="PTMono-Bold, PT Mono" font-size="14" font-weight="bold"><tspan x="17" y="21">mouseover</tspan></text><path id="Fill-56" fill="#EE6B47" d="M268 51.828S247.159 39.088 233.327 34c-.336 2.104-.67 4.208-1.007 6.311-22.67-1.178-45.696.566-67.32 5.234l8.31 12.565c18.27-3.944 37.724-5.417 56.88-4.422-.337 2.105-.672 4.208-1.007 6.312C240.31 56.21 268 51.828 268 51.828"/><text id="mouseout" fill="#8A704D" font-family="PTMono-Bold, PT Mono" font-size="14" font-weight="bold"><tspan x="193" y="21">mouseout</tspan></text></g></g></svg>
Side by side Swipe Overlay

Before

Width:  |  Height:  |  Size: 2.2 KiB

After

Width:  |  Height:  |  Size: 1.7 KiB

Before After
Before After

26
2-ui/3-event-details/3-mousemove-mouseover-mouseout-mouseenter-mouseleave/mouseover-to-child.svg
View file

@ -1,25 +1 @@
<?xml version="1.0" encoding="UTF-8"?>
<svg width="233px" height="150px" viewBox="0 0 233 150" version="1.1" xmlns="http://www.w3.org/2000/svg" xmlns:xlink="http://www.w3.org/1999/xlink">
<!-- Generator: sketchtool 55.2 (78181) - https://sketchapp.com -->
<title>mouseover-to-child.svg</title>
<desc>Created with sketchtool.</desc>
<g id="dom" stroke="none" stroke-width="1" fill="none" fill-rule="evenodd">
<g id="mouseover-to-child.svg">
<rect id="Rectangle-7" stroke="#E8C48E" stroke-width="2" fill="#FFF9EB" x="13" y="15" width="210" height="115"></rect>
<text id="#FROM" font-family="OpenSans-Bold, Open Sans" font-size="14" font-weight="bold" fill="#8A704D">
<tspan x="18.5136307" y="31">#FROM</tspan>
</text>
<rect id="Rectangle-6" stroke="#E8C48E" stroke-width="2" fill="#FFF9EB" x="141" y="65" width="67" height="34"></rect>
<text id="#TO" font-family="OpenSans-Bold, Open Sans" font-size="14" font-weight="bold" fill="#8A704D">
<tspan x="159.99681" y="88">#TO</tspan>
</text>
<path d="M150,83.0279175 C150,83.0279175 134.824497,73.7186483 124.752316,70 C124.5079,71.5378926 124.264184,73.074982 124.019768,74.6120715 C107.511532,73.7507714 90.7455739,75.0256562 75,78.436726 C77.0169574,81.4976542 79.0339148,84.5581808 81.0508721,87.6187075 C94.3543869,84.7368655 108.520011,83.6599391 122.467831,84.3875269 C122.223415,85.9254195 121.978999,87.462509 121.735284,89 C129.836729,86.2297857 150,83.0279175 150,83.0279175" id="Fill-54" stroke="#EE6B47" stroke-width="3" fill="#EE6B47" stroke-linecap="square"></path>
<text id="mouseover" font-family="PTMono-Bold, PT Mono" font-size="14" font-weight="bold" fill="#8A704D">
<tspan x="138" y="59">mouseover</tspan>
</text>
<text id="mouseout" font-family="PTMono-Bold, PT Mono" font-size="14" font-weight="bold" fill="#8A704D">
<tspan x="39" y="70">mouseout</tspan>
</text>
</g>
</g>
</svg>
<svg xmlns="http://www.w3.org/2000/svg" width="233" height="150" viewBox="0 0 233 150"><defs><style>@import url(https://fonts.googleapis.com/css?family=Open+Sans:bold,italic,bolditalic%7CPT+Mono);@font-face{font-family:&apos;PT Mono&apos;;font-weight:700;font-style:normal;src:local(&apos;PT MonoBold&apos;),url(/pack/modules/styles/blocks/font/PTMonoBold.woff2) format(&apos;woff2&apos;),url(/pack/modules/styles/blocks/font/PTMonoBold.woff) format(&apos;woff&apos;),url(/pack/modules/styles/blocks/font/PTMonoBold.ttf) format(&apos;truetype&apos;)}</style></defs><g id="dom" fill="none" fill-rule="evenodd" stroke="none" stroke-width="1"><g id="mouseover-to-child.svg"><path id="Rectangle-7" fill="#FFF9EB" stroke="#E8C48E" stroke-width="2" d="M13 15h210v115H13z"/><text id="#FROM" fill="#8A704D" font-family="OpenSans-Bold, Open Sans" font-size="14" font-weight="bold"><tspan x="18.514" y="31">#FROM</tspan></text><path id="Rectangle-6" fill="#FFF9EB" stroke="#E8C48E" stroke-width="2" d="M141 65h67v34h-67z"/><text id="#TO" fill="#8A704D" font-family="OpenSans-Bold, Open Sans" font-size="14" font-weight="bold"><tspan x="159.997" y="88">#TO</tspan></text><path id="Fill-54" fill="#EE6B47" stroke="#EE6B47" stroke-linecap="square" stroke-width="3" d="M150 83.028S134.824 73.718 124.752 70l-.732 4.612c-16.508-.861-33.274.414-49.02 3.825l6.05 9.182c13.304-2.882 27.47-3.96 41.418-3.231L121.735 89C129.837 86.23 150 83.028 150 83.028"/><text id="mouseover" fill="#8A704D" font-family="PTMono-Bold, PT Mono" font-size="14" font-weight="bold"><tspan x="138" y="59">mouseover</tspan></text><text id="mouseout" fill="#8A704D" font-family="PTMono-Bold, PT Mono" font-size="14" font-weight="bold"><tspan x="39" y="70">mouseout</tspan></text></g></g></svg>
Side by side Swipe Overlay

Before

Width:  |  Height:  |  Size: 2 KiB

After

Width:  |  Height:  |  Size: 1.7 KiB

Before After
Before After

21
2-ui/3-event-details/4-mouse-drag-and-drop/2-drag-heroes/solution.view/field.svg
View file

File diff suppressed because one or more lines are too long
Side by side Swipe Overlay

Before

Width:  |  Height:  |  Size: 7.9 KiB

After

Width:  |  Height:  |  Size: 7.9 KiB

Before After
Before After

42
2-ui/3-event-details/4-mouse-drag-and-drop/ball_shift.svg
View file

File diff suppressed because one or more lines are too long
Side by side Swipe Overlay

Before

Width:  |  Height:  |  Size: 10 KiB

After

Width:  |  Height:  |  Size: 5.8 KiB

Before After
Before After

197
2-ui/3-event-details/5-keyboard-events/german-layout.svg
View file

File diff suppressed because one or more lines are too long
Side by side Swipe Overlay

Before

Width:  |  Height:  |  Size: 88 KiB

After

Width:  |  Height:  |  Size: 39 KiB

Before After
Before After

167
2-ui/3-event-details/5-keyboard-events/us-layout.svg
View file

File diff suppressed because one or more lines are too long
Side by side Swipe Overlay

Before

Width:  |  Height:  |  Size: 102 KiB

After

Width:  |  Height:  |  Size: 44 KiB

Before After
Before After