work on reach section

This commit is contained in:
seotts 2020-09-28 15:21:29 -04:00 committed by Karishma Chadha
parent 8b1c008ee2
commit 5ff0e3468b
7 changed files with 344 additions and 14 deletions

View file

@ -11,7 +11,6 @@ const FlexRow = require('../../components/flex-row/flex-row.jsx');
const Comment = require('../../components/comment/comment.jsx');
const People = require('./people.json');
const PeopleGrid = require('../../components/people-grid/people-grid.jsx');
const Avatar = require('../../components/avatar/avatar.jsx');
const Page = require('../../components/page/www/page.jsx');
const render = require('../../lib/render.jsx');
@ -162,14 +161,6 @@ class AnnualReport extends React.Component {
>
<FormattedMessage id="annualReport.subnavMission" />
</a>
<a
className={classNames(
{selectedItem: this.state.currentlyVisible === SECTIONS.reach}
)}
onClick={this.handleSubnavItemClick(SECTIONS.reach)}
>
<FormattedMessage id="annualReport.subnavReach" />
</a>
<a
className={classNames(
{selectedItem: this.state.currentlyVisible === SECTIONS.milestones}
@ -178,6 +169,14 @@ class AnnualReport extends React.Component {
>
<FormattedMessage id="annualReport.subnavMilestones" />
</a>
<a
className={classNames(
{selectedItem: this.state.currentlyVisible === SECTIONS.reach}
)}
onClick={this.handleSubnavItemClick(SECTIONS.reach)}
>
<FormattedMessage id="annualReport.subnavReach" />
</a>
<a
className={classNames(
{selectedItem: this.state.currentlyVisible === SECTIONS.initiatives}
@ -319,7 +318,7 @@ class AnnualReport extends React.Component {
</div>
</FlexRow>
</div>
<div className="message-transition-images">
<div className="transition-images">
<img src="/images/annual-report/message/blocks.svg" />
<img src="/images/annual-report/message/banana.svg" />
</div>
@ -567,13 +566,106 @@ class AnnualReport extends React.Component {
</div>
</div>
</div>
<div className="transition-images">
<img src="/images/annual-report/milestones/vertical-loop.svg" />
<img src="/images/annual-report/milestones/painting-hand.svg" />
</div>
</div>
<div
className="our-reach section"
className="reach-section section"
id="reach"
ref={this.setRef(SECTIONS.reach)}
>
<div className="inner">
<div className="reach-intro">
<h2>
<FormattedMessage id="annualReport.reachTitle" />
</h2>
<p>
<FormattedMessage id="annualReport.reachSubtitle" />
</p>
<div className="reach-numbers">
<div className="reach-datapoint">
<FormattedMessage
id="annualReport.reach170million"
values={{
million: (
<div className="million">
<FormattedMessage id="annualReport.reachMillion" />
</div>
)
}}
/>
<h4>
<FormattedMessage id="annualReport.reachUniqueVisitors" />
</h4>
</div>
<div className="reach-datapoint">
<FormattedMessage
id="annualReport.reach170million"
values={{
million: (
<div className="million">
<FormattedMessage id="annualReport.reachMillion" />
</div>
)
}}
/>
<h4>
<FormattedMessage id="annualReport.reachUniqueVisitors" />
</h4>
</div>
<div className="reach-datapoint">
<FormattedMessage
id="annualReport.reach170million"
values={{
million: (
<div className="million">
<FormattedMessage id="annualReport.reachMillion" />
</div>
)
}}
/>
<h4>
<FormattedMessage id="annualReport.reachUniqueVisitors" />
</h4>
</div>
<div className="reach-datapoint">
<FormattedMessage
id="annualReport.reach170million"
values={{
million: (
<div className="million">
<FormattedMessage id="annualReport.reachMillion" />
</div>
)
}}
/>
<h4>
<FormattedMessage id="annualReport.reachUniqueVisitors" />
</h4>
</div>
</div>
</div>
<div className="reach-growth">
<div className="growth-blurb">
<h3>
<FormattedMessage id="annualReport.reachGrowthTitle" />
</h3>
<p>
<FormattedMessage id="annualReport.reachGrowthBlurb" />
</p>
</div>
<img src="/images/annual-report/milestones/community-growth-graph.svg" />
</div>
<div className="reach-map">
<h3>
<FormattedMessage id="annualReport.reachGlobalCommunity" />
</h3>
<p>
<FormattedMessage id="annualReport.reachMapBlurb" />
</p>
</div>
</div>
</div>
<div

View file

@ -184,7 +184,7 @@ p {
}
}
.message-transition-images {
.transition-images {
display: flex;
justify-content: space-between;
@ -339,6 +339,93 @@ p {
}
}
.transition-images {
width: 100%;
//overflow-x: hidden;
img {
margin-bottom: -200px;
margin-right: -68px;
}
}
}
.reach-section {
.inner {
max-width: 940px;
padding-top: 120px;
display: flex;
flex-direction: column;
align-items: center;
}
background-color: #0EBD8C;
color: $ui-white;
h2, h3, h4, p {
color: $ui-white;
}
.reach-intro {
max-width: 620px;
text-align: center;
p {
font-size: 1.5rem;
}
.reach-numbers {
display: flex;
flex-wrap: wrap;
justify-content: center;
font-size: 5rem;
}
.reach-datapoint {
width: 300px;
text-align: center;
margin: 32px 0;
}
.million {
font-size: 2rem;
font-weight: bold;
margin-bottom: 16px;
}
}
.reach-growth {
max-width: 940px;
display: flex;
align-items: center;
justify-content: center;
flex-wrap: wrap;
margin-top: 76px;
.growth-blurb {
max-width: 300px;
margin: 20px;
}
img {
width: 600px;
}
}
.reach-map {
max-width: 1064px;
background-color: $ui-white;
border-radius: 6px;
color: $type-gray;
padding: 48px;
margin: 52px 0;
text-align: center;
h3, p {
color: $type-gray;
}
}
}
.financials-section {
@ -349,10 +436,10 @@ p {
background-color: #575E75;
width: 100%;
color: #FFFFFF;
color: $ui-white;
h2, h3, p {
color: #FFFFFF;
color: $ui-white;
}
h2 {

View file

@ -43,6 +43,15 @@
"annualReport.milestones2019MessageScratch3": "Launch of Scratch 3.0, expanding what kids can create with code",
"annualReport.milestones2019MessageMove": "Scratch Team moves from MIT into Scratch Foundation",
"annualReport.reachTitle": "Reaching Children Around the World",
"annualReport.reachSubtitle": "Scratch is the worlds largest coding community for kids.",
"annualReport.reachMillion": "million",
"annualReport.reach170million": "170 {million}",
"annualReport.reachUniqueVisitors": "Unique Visitors",
"annualReport.reachGrowthTitle": "Community Growth",
"annualReport.reachGrowthBlurb": "New accounts created in the Scratch Online Community within the last 5 years.",
"annualReport.reachGlobalCommunity": "A Global Community",
"annualReport.reachMapBlurb": "Total accounts registered in the Scratch Online Community through December 31, 2019",
"annualReport.financialsTitle": "Financials - 2019",
"annualReport.financialsRevenue": "Revenues",

File diff suppressed because one or more lines are too long

After

(image error) Size: 78 KiB

View file

@ -0,0 +1,16 @@
<?xml version="1.0" encoding="UTF-8"?>
<svg width="88px" height="88px" viewBox="0 0 88 88" version="1.1" xmlns="http://www.w3.org/2000/svg" xmlns:xlink="http://www.w3.org/1999/xlink">
<title>ScratchJr Command</title>
<defs>
<filter id="filter-1">
<feColorMatrix in="SourceGraphic" type="matrix" values="0 0 0 0 1.000000 0 0 0 0 0.749020 0 0 0 0 0.000000 0 0 0 1.000000 0"></feColorMatrix>
</filter>
</defs>
<g id="ScratchJr-Command" stroke="none" stroke-width="1" fill="none" fill-rule="evenodd" stroke-linecap="round" stroke-linejoin="round">
<g id="Horizontal/Block/Command" transform="translate(8.000000, 12.000000)" filter="url(#filter-1)">
<g transform="translate(36.000000, 32.000000) rotate(14.000000) translate(-36.000000, -32.000000) ">
<path d="M0,49.6568542 C0,48.5959883 0.421427361,47.5785726 1.17157288,46.8284271 L1.17157288,46.8284271 L6.82842712,41.1715729 C7.57857264,40.4214274 8,39.4040117 8,38.3431458 L8,38.3431458 L8,25.6568542 C8,24.5959883 7.57857264,23.5785726 6.82842712,22.8284271 L6.82842712,22.8284271 L1.17157288,17.1715729 C0.421427361,16.4214274 0,15.4040117 0,14.3431458 L0,14.3431458 L0,4 C-2.705415e-16,1.790861 1.790861,4.05812251e-16 4,0 L60,0 C62.209139,-4.05812251e-16 64,1.790861 64,4 L64,14.375 L64.0064166,14.5697275 C64.061881,15.5479932 64.4750092,16.4750092 65.1715729,17.1715729 L70.8284271,22.8284271 C71.5785726,23.5785726 72,24.5959883 72,25.6568542 L72,38.3431458 C72,39.4040117 71.5785726,40.4214274 70.8284271,41.1715729 L65.1715729,46.8284271 C64.4290142,47.5709858 64.0085581,48.5754358 64.0001292,49.6246797 L64,60 C64,62.209139 62.209139,64 60,64 L4,64 C1.790861,64 2.705415e-16,62.209139 0,60 Z" id="Command" stroke="#CC9900" fill="#FFBF00"></path>
</g>
</g>
</g>
</svg>

After

(image error) Size: 1.8 KiB

View file

@ -0,0 +1,72 @@
<?xml version="1.0" encoding="UTF-8"?>
<svg width="320px" height="420px" viewBox="0 0 320 420" version="1.1" xmlns="http://www.w3.org/2000/svg" xmlns:xlink="http://www.w3.org/1999/xlink">
<title>Painting Hand</title>
<defs>
<polygon id="path-1" points="0 0.162265558 109.192927 0.162265558 109.192927 247.32828 0 247.32828"></polygon>
<path d="M25.6606465,6.29924 C23.2966465,-1.36396 17.4238465,-0.55396 10.2658465,1.13564 C-3.12615351,4.29764 -3.93735351,21.70964 12.7378465,18.14684 C21.0610465,16.37084 27.7354465,13.02524 25.6606465,6.29924" id="path-3"></path>
<path d="M15.9744,22.92132 C31.8096,19.20972 38.0856,15.61092 36.3972,7.40772 C34.4724,-1.93548 24.408,-0.64308 11.736,2.33772 C-4.1412,6.07092 -3.5988,27.50892 15.9744,22.92132" id="path-5"></path>
<path d="M16.2111818,24.53016 C32.4783818,20.51136 39.0195818,16.64616 37.6707818,7.88856 C36.1335818,-2.08824 25.8435818,-0.67344 12.8259818,2.55456 C-3.71721823,6.65496 -4.12641823,29.55456 16.2111818,24.53016" id="path-7"></path>
<path d="M10.7705007,18.73608 C22.3937007,16.06488 27.1301007,13.27008 26.4197007,6.53448 C25.6109007,-1.13832 18.2921007,-0.31032 8.98970067,1.83408 C-2.82669933,4.56048 -3.75309933,22.07328 10.7705007,18.73608" id="path-9"></path>
<path d="M48.48492,56.3670694 C36.04692,54.7386694 30.14772,40.4646694 30.14772,40.4646694 C26.93652,33.0462694 16.16052,29.7318694 11.16132,27.6882694 C-0.74868,22.8186694 -2.24628,1.02426945 4.98372,0.0426694498 C11.47332,-0.83933055 16.21812,12.1842694 28.01532,17.6214694 C40.49652,22.2234694 56.10732,9.31386945 68.80332,32.8338694 C80.72532,54.9234694 65.28372,72.5142694 59.91492,75.7530694 C56.28972,66.3606694 52.47972,59.8986694 48.48492,56.3670694" id="path-11"></path>
<polygon id="path-13" points="0.811686506 0.9168 21.2940554 0.9168 21.2940554 26.0709823 0.811686506 26.0709823"></polygon>
</defs>
<g id="Painting-Hand" stroke="none" stroke-width="1" fill="none" fill-rule="evenodd">
<g transform="translate(163.000000, 195.000000) rotate(-19.000000) translate(-163.000000, -195.000000) translate(38.000000, -5.000000)">
<path d="M133.15872,357.51156 L109.17432,315.71916 C136.09632,311.28756 215.29263,286.395328 223.82343,281.217328 C231.30903,276.672928 250.491673,286.213557 249.772873,307.077957 C249.055273,327.941157 222.52632,341.98956 210.80832,345.19236 C192.45312,350.59116 164.88192,356.77596 133.15872,357.51156 Z" id="Fill-10" fill="#755135"></path>
<g id="Group-14" transform="translate(0.000000, 18.283200)">
<mask id="mask-2" fill="white">
<use xlink:href="#path-1"></use>
</mask>
<g id="Clip-13"></g>
<path d="M4.56768,247.32828 C-8.15352,204.06708 8.55888,135.80988 19.84848,91.64988 C29.83488,52.58988 37.15968,18.00948 50.94288,20.47428 C64.72848,22.93788 47.82408,46.83588 62.74248,49.00188 C77.66088,51.16548 75.15888,-4.84572 95.41248,0.52548 C115.24248,5.78508 87.24168,42.78588 101.89728,46.67148 C110.22288,48.87948 93.61608,83.44788 104.50848,86.73348 C117.90048,90.77268 99.83808,111.13428 84.68928,195.88908" id="Fill-12" fill="#0EBD8C" mask="url(#mask-2)"></path>
</g>
<path d="M31.64364,213.50292 C36.64428,209.06892 37.02588,199.19172 42.40668,197.18892 C48.87348,194.78052 45.18828,208.82772 53.93508,208.09212 C57.2535607,207.813013 60.6359415,205.88485 63.9636027,203.310249 C64.8288815,202.511799 65.7629726,201.723481 66.7974,200.97 C67.3161427,200.518279 67.730311,200.234427 68.0447884,200.094092 C78.288043,193.168089 88.9929865,192.350744 87.6162,198.9072 L85.3158,210.1572 L33.1026,241.8948 L4.5678,265.6116 C4.5678,265.6116 3.05591033,258.702755 1.98491973,251.776699 L1.87578043,251.060431 C1.41035273,247.958789 1.04705581,244.901442 0.9618,242.5092 C0.776772816,237.324903 3.86695145,233.648434 8.12503953,231.15498 L8.05404,231.20172 C15.45924,226.78812 9.50484,194.44692 21.88284,190.95252 C32.40324,187.98132 20.52924,221.37372 31.64364,213.50292 Z" id="Combined-Shape" fill="#0EA57A"></path>
<path d="M92.6634,274.5318 L27.6222,318.0522 C3.8802,278.0958 -2.1966,253.2402 9.3954,243.4866 C26.7858,228.8562 22.0002,244.3194 33.9054,229.4154 C45.8094,214.5126 49.311,229.3074 56.0298,221.0394 C62.7474,212.7714 90.4146,193.8186 84.6882,214.1718 C78.6906,235.4958 81.3486,255.615 92.6634,274.5318" id="Fill-17" fill="#FEFEFE"></path>
<path d="M106.60752,378.27792 C103.70832,379.94352 103.06032,384.25752 105.15912,387.91512 C107.25912,391.57272 111.31152,393.18792 114.21192,391.52352 C117.11112,389.85792 117.76032,385.54392 115.66032,381.88632 C113.56032,378.22872 109.50792,376.61352 106.60752,378.27792 L106.60752,378.27792 Z M62.21952,300.56352 L96.09312,281.11752 C96.64872,282.08592 98.25912,284.89032 100.92312,289.53072 C108.19392,302.19792 81.34152,313.87752 91.25352,331.14432 C101.16552,348.40872 109.93632,347.06472 119.09592,363.01992 C124.27272,372.03552 131.04432,390.04992 117.90912,397.60512 C104.76072,405.13872 92.62032,390.20592 87.44352,381.19032 C78.28392,365.23632 83.86872,358.33992 73.95672,341.07312 C64.04472,323.80632 40.19112,339.90432 32.92032,327.23952 C30.25632,322.59912 28.64592,319.79472 28.09032,318.82632 L62.21952,300.56352 Z" id="Fill-19" fill="#CF8B17"></path>
<polygon id="Fill-21" fill="#EC9C13" points="99.64548 286.5564 31.87068 325.4652 25.00188 313.5012 92.77788 274.5924"></polygon>
<path d="M84.69,214.17564 C81.726,224.72364 81.1608,232.92204 81.6036,237.97164 C68.808,236.45484 65.7816,247.48164 59.9076,252.69564 C49.92,261.55884 46.6632,258.02364 33.4608,264.36684 C21.786,269.97684 17.3268,290.65044 15.6108,296.12124 C0,265.61124 1.662,249.99564 9.402,243.49164 C26.79,228.85044 22.002,244.31844 33.906,229.41444 C45.81,214.51044 49.314,229.30644 56.034,221.03964 C62.754,212.77164 90.414,193.82364 84.69,214.17564" id="Fill-23" fill="#0EBD8C"></path>
<g id="Fill-27" transform="translate(75.027754, 370.518520)">
<mask id="mask-4" fill="white">
<use xlink:href="#path-3"></use>
</mask>
<use id="Mask" fill="#755135" xlink:href="#path-3"></use>
<path d="M1.29152649,5.6828 C7.05752649,4.3796 11.6391265,3.14 15.0351265,1.9628 C20.1315265,0.2 25.6527265,5.4524 21.2091265,10.712 C16.7667265,15.9716 8.83952649,20.0324 3.96392649,17.756 C0.714326486,16.2368 -0.537273514,16.8236 0.209126486,19.5164 L17.5983265,23.4464 L26.1459265,13.3268 L29.7879265,5.2052 L19.5663265,-3.4 L10.2051265,-0.3664 L0.134726486,4.7084 L1.29152649,5.6828 Z" fill-opacity="0.15" fill="#000000" mask="url(#mask-4)"></path>
</g>
<g id="Group-4" transform="translate(59.678040, 353.131200)">
<mask id="mask-6" fill="white">
<use xlink:href="#path-5"></use>
</mask>
<use id="Fill-29" fill="#755135" xlink:href="#path-5"></use>
<path d="M-0.5256,7.1268 C10.7076,6.2952 18.4788,5.4828 22.7844,4.692 C29.2428,3.5028 33.9984,9.8016 27.5328,16.3368 C21.0684,22.8696 8.9652,25.9788 3.426,21.3144 C-0.2676,18.204 -2.2092,19.9272 -2.4,26.4816 L22.29,31.5564 L34.7124,17.2128 L40.098,5.778 L25.7364,-6 L12.3228,-1.5396 L-2.1504,5.7936 L-0.5256,7.1268 Z" id="Fill-31" fill-opacity="0.15" fill="#000000" mask="url(#mask-6)"></path>
</g>
<g id="Group-3" transform="translate(51.120938, 333.702840)">
<mask id="mask-8" fill="white">
<use xlink:href="#path-7"></use>
</mask>
<use id="Fill-33" fill="#755135" xlink:href="#path-7"></use>
<path d="M0.158901768,10.1184 C8.65250177,9.4548 15.6449018,7.6548 21.1361018,4.7208 C29.3741018,0.3192 38.3993018,11.0016 30.9929018,16.554 C23.5853018,22.1076 8.21930177,27.162 2.19170177,21.4968 C-1.82589823,17.7216 -2.27469823,19.8576 0.847701768,27.9048 L25.7729018,31.6824 L37.4297018,16.71 L42.2081018,5.0112 L27.2465018,-6 L14.0837018,-0.8436 L0.0137017677,7.2348 L0.158901768,10.1184 Z" id="Fill-35" fill-opacity="0.15" fill="#000000" mask="url(#mask-8)"></path>
</g>
<g id="Group-2" transform="translate(46.662819, 323.075400)">
<mask id="mask-10" fill="white">
<use xlink:href="#path-9"></use>
</mask>
<use id="Fill-37" fill="#755135" xlink:href="#path-9"></use>
<path d="M15.6525807,0.5556 C21.9753807,0.1992 26.4381807,6.4524 21.9957807,11.712 C17.5533807,16.9728 8.75858067,20.4252 3.88178067,18.1476 C0.632180669,16.6296 -0.329019331,17.4192 0.994580669,20.5164 L18.3849807,24.4464 L26.9325807,14.328 L30.5757807,6.2052 L20.3529807,-2.4 C13.0041807,-0.192 11.4369807,0.7932 15.6525807,0.5556" id="Fill-39" fill-opacity="0.15" fill="#000000" mask="url(#mask-10)"></path>
</g>
<g id="Group" transform="translate(63.764040, 297.589731)">
<mask id="mask-12" fill="white">
<use xlink:href="#path-11"></use>
</mask>
<use id="Fill-41" fill="#755135" xlink:href="#path-11"></use>
<path d="M3.588,0.31866945 C0.7524,9.72546945 3.4176,16.6374694 11.5884,21.0546694 C23.8428,27.6822694 31.2144,26.2554694 36.1152,34.1970694 C41.0148,42.1398694 50.3556,48.6798694 53.7576,49.7082694 C57.1584,50.7378694 69.306,46.1082694 69.3,34.0446694 C69.2952,21.9822694 78.1152,57.3594694 69.312,67.7814694 C63.4428,74.7294694 59.2416,77.9766694 56.7084,77.5254694 L45.672,62.0166694 L28.6704,44.1090694 L20.3076,33.8658694 L-1.2732,22.4946694 L-2.4,7.40826945 L3.588,0.31866945 Z" id="Fill-43" fill-opacity="0.15" fill="#000000" mask="url(#mask-12)"></path>
</g>
<g id="Group-51" transform="translate(46.800000, 0.283200)">
<mask id="mask-14" fill="white">
<use xlink:href="#path-13"></use>
</mask>
<g id="Clip-50"></g>
<path d="M13.89468,1.30956 C1.81908,-2.54844 -3.86052,23.20476 5.44428,25.68396 C19.17228,29.34156 28.54308,5.98836 13.89468,1.30956" id="Fill-49" fill="#0EBD8C" mask="url(#mask-14)"></path>
</g>
</g>
</g>
</svg>

After

(image error) Size: 10 KiB

View file

@ -0,0 +1,16 @@
<?xml version="1.0" encoding="UTF-8"?>
<svg width="216px" height="216px" viewBox="0 0 216 216" version="1.1" xmlns="http://www.w3.org/2000/svg" xmlns:xlink="http://www.w3.org/1999/xlink">
<title>Vertical Loop Block</title>
<defs>
<filter id="filter-1">
<feColorMatrix in="SourceGraphic" type="matrix" values="0 0 0 0 1.000000 0 0 0 0 0.670588 0 0 0 0 0.098039 0 0 0 1.000000 0"></feColorMatrix>
</filter>
</defs>
<g id="Vertical-Loop-Block" stroke="none" stroke-width="1" fill="none" fill-rule="evenodd" stroke-linecap="round" stroke-linejoin="round">
<g id="Vertical/Block/Loop" transform="translate(27.000000, 40.000000)" filter="url(#filter-1)">
<g transform="translate(84.000000, 68.000000) rotate(-25.000000) translate(-84.000000, -68.000000) ">
<path d="M16,92 C16,94.209139 17.790861,96 20,96 L30.3431458,96 C31.4040117,96 32.4214274,96.4214274 33.1715729,97.1715729 L33.1715729,97.1715729 L38.8284271,102.828427 C39.5785726,103.578573 40.5959883,104 41.6568542,104 L41.6568542,104 L54.3431458,104 C55.4040117,104 56.4214274,103.578573 57.1715729,102.828427 L57.1715729,102.828427 L62.8284271,97.1715729 C63.5785726,96.4214274 64.5959883,96 65.6568542,96 L65.6568542,96 L164,96 C166.209139,96 168,97.790861 168,100 L168,124 C168,126.209139 166.209139,128 164,128 L49.6568542,128 C48.5959883,128 47.5785726,128.421427 46.8284271,129.171573 L41.1715729,134.828427 C40.4214274,135.578573 39.4040117,136 38.3431458,136 L25.6568542,136 C24.5959883,136 23.5785726,135.578573 22.8284271,134.828427 L17.1715729,129.171573 C16.4214274,128.421427 15.4040117,128 14.3431458,128 L4,128 C1.790861,128 3.22449646e-14,126.209139 3.19744231e-14,124 L3.19744231e-14,4 C3.17038816e-14,1.790861 1.790861,-1.84335299e-13 4,-1.84741111e-13 L14.3431458,-1.37667655e-14 C15.4040117,-1.37667655e-14 16.4214274,0.421427361 17.1715729,1.17157288 L17.1715729,1.17157288 L22.8284271,6.82842712 C23.5785726,7.57857264 24.5959883,8 25.6568542,8 L25.6568542,8 L38.3431458,8 C39.4040117,8 40.4214274,7.57857264 41.1715729,6.82842712 L41.1715729,6.82842712 L46.8284271,1.17157288 C47.5785726,0.421427361 48.5959883,-1.37667655e-14 49.6568542,-1.37667655e-14 L49.6568542,-1.37667655e-14 L164,-1.84741111e-13 C166.209139,-1.85146924e-13 168,1.790861 168,4 L168,44 C168,46.209139 166.209139,48 164,48 L65.6568542,48 C64.5959883,48 63.5785726,48.4214274 62.8284271,49.1715729 L57.1715729,54.8284271 C56.4214274,55.5785726 55.4040117,56 54.3431458,56 L41.6568542,56 C40.5959883,56 39.5785726,55.5785726 38.8284271,54.8284271 L33.1715729,49.1715729 C32.4214274,48.4214274 31.4040117,48 30.3431458,48 L20,48 C17.790861,48 16,49.790861 16,52 L16,92 Z" id="Loop-C-Block" stroke="#CF8B17" fill="#FFAB19"></path>
</g>
</g>
</g>
</svg>

After

(image error) Size: 2.7 KiB