-
Notifications
You must be signed in to change notification settings - Fork 0
/
Copy pathplan.html
191 lines (191 loc) · 16.9 KB
/
plan.html
1
2
3
4
5
6
7
8
9
10
11
12
13
14
15
16
17
18
19
20
21
22
23
24
25
26
27
28
29
30
31
32
33
34
35
36
37
38
39
40
41
42
43
44
45
46
47
48
49
50
51
52
53
54
55
56
57
58
59
60
61
62
63
64
65
66
67
68
69
70
71
72
73
74
75
76
77
78
79
80
81
82
83
84
85
86
87
88
89
90
91
92
93
94
95
96
97
98
99
100
101
102
103
104
105
106
107
108
109
110
111
112
113
114
115
116
117
118
119
120
121
122
123
124
125
126
127
128
129
130
131
132
133
134
135
136
137
138
139
140
141
142
143
144
145
146
147
148
149
150
151
152
153
154
155
156
157
158
159
160
161
162
163
164
165
166
167
168
169
170
171
172
173
174
175
176
177
178
179
180
181
182
183
184
185
186
187
188
189
190
191
<!DOCTYPE html><!-- This site was created in Webflow. http://www.webflow.com -->
<!-- Last Published: Mon Apr 12 2021 19:47:28 GMT+0000 (Coordinated Universal Time) -->
<html data-wf-page="60740937ed9c810951897fff" data-wf-site="6045ffa43ae2c8141dfef11a">
<head>
<meta charset="utf-8">
<title>plan</title>
<meta content="plan" property="og:title">
<meta content="plan" property="twitter:title">
<meta content="width=device-width, initial-scale=1" name="viewport">
<meta content="Webflow" name="generator">
<link href="css/normalize.css" rel="stylesheet" type="text/css">
<link href="css/webflow.css" rel="stylesheet" type="text/css">
<link href="css/fixing-fashion.webflow.css" rel="stylesheet" type="text/css">
<!-- [if lt IE 9]><script src="https://cdnjs.cloudflare.com/ajax/libs/html5shiv/3.7.3/html5shiv.min.js" type="text/javascript"></script><![endif] -->
<script type="text/javascript">!function(o,c){var n=c.documentElement,t=" w-mod-";n.className+=t+"js",("ontouchstart"in o||o.DocumentTouch&&c instanceof DocumentTouch)&&(n.className+=t+"touch")}(window,document);</script>
<link href="images/favicon.png" rel="shortcut icon" type="image/x-icon">
<link href="images/webclip.png" rel="apple-touch-icon">
</head>
<body>
<div data-collapse="medium" data-animation="default" data-duration="400" role="banner" class="navbar w-nav">
<a href="#" class="home-logo-link w-inline-block"><img src="images/fixing-fashion-logo.svg" loading="lazy" alt="" class="fixing-fashion-logo"></a>
<nav role="navigation" class="nav-menu w-nav-menu">
<a href="plan.html" aria-current="page" class="nav-link no-highlight w-nav-link w--current">Plan</a>
<a href="collection.html" class="nav-link w-nav-link">Collection</a>
<a href="community.html" class="nav-link w-nav-link">Community</a>
<a href="https://community.fixing.fashion/academy/start/intro.html" target="_blank" class="nav-link w-nav-link">Academy</a>
<a href="#" data-w-id="b0f993b7-c45b-f1e4-105a-a7d83e7d4c4c" class="nav-link store w-nav-link">Store</a>
</nav>
<div data-w-id="4ef45420-c4b8-2cd0-d593-9a3397b5dc54" class="menu-button w-nav-button">
<div class="icon-2 w-icon-nav-menu"></div>
</div>
</div>
<div data-collapse="medium" data-animation="default" data-duration="400" role="banner" class="navbar appear w-nav">
<a href="#" class="home-logo-link hash w-inline-block"><img src="images/fixing-fashion-logo-alone.svg" loading="lazy" alt="" class="fixing-fashion-logo hash"></a>
<nav role="navigation" class="nav-menu white w-nav-menu">
<a href="plan.html" aria-current="page" class="nav-link w-nav-link w--current">Plan</a>
<a href="collection.html" class="nav-link w-nav-link">Collection</a>
<a href="#" class="nav-link w-nav-link">Community</a>
<a href="https://community.fixing.fashion/academy/start/intro.html" target="_blank" class="nav-link w-nav-link">Academy</a>
<a href="#" data-w-id="5f81f963-fd65-cb85-a5b8-d51be3512bab" class="nav-link store w-nav-link">Store</a>
</nav>
<div data-w-id="5f81f963-fd65-cb85-a5b8-d51be3512bad" class="menu-button-2 w-nav-button">
<div class="icon w-icon-nav-menu"></div>
</div>
</div>
<div class="hero">
<div class="hero-images-wrapper">
<div class="image-hero-wrapper"><img src="images/14.jpg" loading="lazy" sizes="(max-width: 991px) 50vw, 35vw" srcset="images/14-p-500.jpeg 500w, images/14-p-800.jpeg 800w, images/14.jpg 1000w" alt="" class="image-hero left"></div>
<div class="image-hero-wrapper"><img src="images/6.-Detailed-Shot9.jpg" loading="lazy" sizes="(max-width: 991px) 50vw, 35vw" srcset="images/6.-Detailed-Shot9-p-500.jpeg 500w, images/6.-Detailed-Shot9-p-800.jpeg 800w, images/6.-Detailed-Shot9-p-1080.jpeg 1080w, images/6.-Detailed-Shot9-p-1600.jpeg 1600w, images/6.-Detailed-Shot9.jpg 2000w" alt="" class="image-hero right"></div>
</div>
<div class="hero-text-wrapper">
<h1 class="h1 right-align">Fashion is broken,<br>let's fix it together.</h1>
<div class="scroll-wrapper">
<h5 class="h5">WATCH THE VIDEO</h5><img src="images/arrow.svg" loading="lazy" alt="" class="arrow">
</div>
</div>
</div>
<div class="banner"><img src="images/fixing-fashion-logo-white-no-bg.svg" loading="lazy" alt="" class="fixingfashion-logo">
<h2 class="h2 space-left">is making repair, care and upgrade the new fashion.</h2>
</div>
<div class="campaign-video">
<div class="div-block-7">
<div style="padding-top:56.17021276595745%" class="video w-video w-embed"><iframe class="embedly-embed" src="https://cdn.embedly.com/widgets/media.html?src=https%3A%2F%2Fwww.youtube.com%2Fembed%2FbuWRaffBdNM%3Ffeature%3Doembed&display_name=YouTube&url=https%3A%2F%2Fwww.youtube.com%2Fwatch%3Fv%3DbuWRaffBdNM&image=https%3A%2F%2Fi.ytimg.com%2Fvi%2FbuWRaffBdNM%2Fhqdefault.jpg&key=96f1f04c5f4143bcb0f2e68c87d65feb&type=text%2Fhtml&schema=youtube" scrolling="no" title="YouTube embed" frameborder="0" allow="autoplay; fullscreen" allowfullscreen="true"></iframe></div>
</div>
<div class="div-block-5">
<div class="html-embed w-embed w-iframe"><iframe id="video" width="650" height="366" src="https://youtube.com/embed/buWRaffBdNM" rel="0" enablejsapi="1" modestbranding="0" controls="0" frameborder="0" allow="accelerometer; autoplay; encrypted-media; gyroscope; picture-in-picture" allowfullscreen=""></iframe></div>
<div id="play-video" data-w-id="8cd66c33-665f-18b1-adc1-5004e6888d87" class="thumb-video"></div>
</div>
</div>
<div class="div-block-6"><img src="images/arrows-bottom.png" loading="lazy" sizes="100vw" srcset="images/arrows-bottom-p-500.png 500w, images/arrows-bottom-p-800.png 800w, images/arrows-bottom-p-1080.png 1080w, images/arrows-bottom-p-1600.png 1600w, images/arrows-bottom-p-2000.png 2000w, images/arrows-bottom-p-2600.png 2600w, images/arrows-bottom.png 3000w" alt="" class="image-3"></div>
<div class="plan">
<div class="steps-wrapper">
<div class="step"><img src="images/alicia-talking-to-camera.jpg" loading="lazy" sizes="(max-width: 479px) 90vw, (max-width: 767px) 70vw, (max-width: 991px) 60vw, 48vw" srcset="images/alicia-talking-to-camera-p-500.jpeg 500w, images/alicia-talking-to-camera.jpg 1000w" alt="" class="step-image">
<div class="step-text-wrapper"><img src="images/1.png" loading="lazy" width="50" alt="" class="image-5">
<h3 class="h3-step">We provide tutorials on how to repair and upgrade clothes.</h3>
<a href="https://community.fixing.fashion/academy/start/intro.html" class="link-block-step-wrapper w-inline-block"><img src="images/circled-arrow.svg" loading="lazy" alt="" class="circled-arrow">
<h6 class="h6">Learn how to make your own fashion</h6>
</a>
</div>
</div>
<div class="step"><img src="images/group-wearing-fixed-clothes.jpg" loading="lazy" sizes="(max-width: 479px) 90vw, (max-width: 767px) 70vw, (max-width: 991px) 60vw, 48vw" srcset="images/group-wearing-fixed-clothes-p-500.jpeg 500w, images/group-wearing-fixed-clothes-p-800.jpeg 800w, images/group-wearing-fixed-clothes.jpg 1000w" alt="" class="step-image">
<div class="step-text-wrapper"><img src="images/2.png" loading="lazy" width="50" alt="" class="image-5">
<h3 class="h3-step">People start to proudly design and wear Fixed Fashion, creating a global community.</h3>
<a href="community.html" class="link-block-step-wrapper w-inline-block"><img src="images/circled-arrow.svg" loading="lazy" alt="" class="circled-arrow">
<h6 class="h6">Discover and join the community</h6>
</a>
</div>
</div>
<div class="step"><img src="images/clothes.jpg" loading="lazy" sizes="(max-width: 479px) 90vw, (max-width: 767px) 70vw, (max-width: 991px) 60vw, 48vw" srcset="images/clothes-p-500.jpeg 500w, images/clothes-p-800.jpeg 800w, images/clothes.jpg 1000w" alt="" class="step-image">
<div class="step-text-wrapper"><img src="images/3.png" loading="lazy" width="50" alt="" class="image-5">
<h3 class="h3-step">Together, we reduce the amount of waste produced by fashion.</h3>
<a href="https://community.fixing.fashion/academy/start/problem" target="_blank" class="link-block-step-wrapper w-inline-block"><img src="images/circled-arrow.svg" loading="lazy" alt="" class="circled-arrow">
<h6 class="h6">Learn more about waste in fashion</h6>
</a>
</div>
</div>
</div>
</div>
<div class="not-for-sale flip">
<div class="not-for-sale-pic-landing _2">
<a href="collection.html" class="link-wrap-not-for-sale w-inline-block"><img src="images/03.jpg" loading="lazy" width="350" sizes="(max-width: 479px) 60vw, (max-width: 767px) 40vw, (max-width: 991px) 35vw, 350px" srcset="images/03-p-500.jpeg 500w, images/03-p-800.jpeg 800w, images/03.jpg 1000w" alt="">
<div class="button-collection-item gg">
<div class="button-collection-left">
<h2 class="h3-technique-heading">Two shirts into a dress</h2>
<div class="technique-wrapper"><img src="images/upgrade_remake.svg" loading="lazy" alt="" class="image-2">
<h6 class="heading-4">remake</h6>
</div>
</div><img src="images/plus.svg" loading="lazy" alt="" class="plus">
</div>
</a>
</div>
<div class="not-for-sale-wrapper">
<h2 class="h2-notforsale">NOT<br>FOR <br>SALE</h2>
<a href="collection.html" class="link-not-for-sale w-inline-block"><img src="images/circled-arrow.svg" loading="lazy" alt="" class="circled-arrow">
<h6 class="h6">Be inspired by our collection</h6>
</a>
</div>
<div class="not-for-sale-pic-landing _1">
<a href="collection.html" class="link-wrap-not-for-sale w-inline-block"><img src="images/apron-not-for-sale.jpg" loading="lazy" width="300" alt="">
<div class="button-collection-item gg">
<div class="button-collection-left">
<h2 class="h3-technique-heading">Avocado pants</h2>
<div class="technique-wrapper"><img src="images/upgrade_decorate.svg" loading="lazy" alt="" class="image-2">
<h6 class="heading-4">decorate</h6>
</div>
</div><img src="images/plus.svg" loading="lazy" alt="" class="plus">
</div>
</a>
</div>
<div class="not-for-sale-pic-landing _3">
<a href="collection.html" class="link-wrap-not-for-sale w-inline-block"><img src="images/2.-Piece-Shot11.jpg" loading="lazy" width="300" sizes="(max-width: 767px) 100vw, (max-width: 991px) 35vw, 300px" srcset="images/2.-Piece-Shot11-p-500.jpeg 500w, images/2.-Piece-Shot11-p-800.jpeg 800w, images/2.-Piece-Shot11-p-1080.jpeg 1080w, images/2.-Piece-Shot11-p-1600.jpeg 1600w, images/2.-Piece-Shot11.jpg 2000w" alt="" class="not-for-sale-flipped">
<div class="button-collection-item gg">
<div class="button-collection-left">
<h2 class="h3-technique-heading">Bad shirts comnibed</h2>
<div class="technique-wrapper"><img src="images/upgrade_remake.svg" loading="lazy" alt="" class="image-2">
<h6 class="heading-4">remake</h6>
</div>
</div><img src="images/plus.svg" loading="lazy" alt="" class="plus">
</div>
</a>
</div>
</div>
<div class="footer">
<a href="https://www.instagram.com/explore/tags/fixingfashion/" target="_blank" class="link-fixing-fashion-footer w-inline-block">
<div class="footer-content-wrapper">
<h4 class="h4-footer">Help us make FIXING FASHION <br>the new fashion.</h4>
<div class="text-block">Share on your fixes using #fixingfashion</div>
</div>
</a>
</div>
<div class="one-army-footer">
<a href="https://www.onearmy.earth/" target="_blank" class="oa-link w-inline-block"></a>
</div>
<div class="oa-footer-wrapper"><img src="images/One-Army-Star-Logo.svg" loading="lazy" alt="" class="one-army-logo">
<h5 class="h5-oa">Fixing Fashion is a project by <a href="http://onearmy.earth/" target="_blank" class="inline-link"><span class="text-span">One Army</span></a>
</h5>
</div>
<div class="overlay-store">
<div class="store-text-scroll-one">
<div data-w-id="ba618a01-93f2-c1e3-6404-a1da90d360f9" class="text-scroll-wrapper">
<h4 class="heading-5">We do not want to sell you anything - We do not want to sell you anything - We do not want to sell you anything - We do not want to sell you anything - We do not want to sell you anything - We do not want to sell you anything - We do not want to sell you anything - We do not want to sell you anything - We do not want to sell you anything - We do not want to sell you anything - We do not want to sell you anything - We do not want to sell you anything - We do not want to sell you anything - We do not want to sell you anything - We do not want to sell you anything - We do not want to sell you anything - We do not want to sell you anything - We do not want to sell you anything - We do not want to sell you anything - We do not want to sell you anything - We do not want to sell you anything - We do not want to sell you anything - We do not want to sell you anything - We do not want to sell you anything -</h4>
</div>
</div>
<div class="store-text-scroll-one black">
<div data-w-id="ba618a01-93f2-c1e3-6404-a1da90d360fd" class="text-scroll-wrapper new-shit">
<h4 class="heading-5">Fixing is the new fashion - Fixing is the new fashion - Fixing is the new fashion - Fixing is the new fashion - Fixing is the new fashion - Fixing is the new fashion - Fixing is the new fashion - Fixing is the new fashion - Fixing is the new fashion - Fixing is the new fashion - Fixing is the new fashion - Fixing is the new fashion - Fixing is the new fashion - Fixing is the new fashion - Fixing is the new fashion - Fixing is the new fashion - Fixing is the new fashion - Fixing is the new fashion - Fixing is the new fashion - Fixing is the new fashion - Fixing is the new fashion - Fixing is the new fashion - Fixing is the new fashion - Fixing is the new fashion - Fixing is the new fashion - Fixing is the new fashion - Fixing is the new fashion - Fixing is the new fashion - Fixing is the new fashion - Fixing is the new fashion - Fixing is the new fashion - Fixing is the new fashion - Fixing is the new fashion - Fixing is the new fashion - </h4>
</div>
</div>
<div class="store-text-scroll-one">
<div data-w-id="ba618a01-93f2-c1e3-6404-a1da90d36101" class="text-scroll-wrapper old-fas">
<h4 class="heading-5">Buying is old fashion - Buying is old fashion - Buying is old fashion - Buying is old fashion - Buying is old fashion - Buying is old fashion - Buying is old fashion - Buying is old fashion - Buying is old fashion - Buying is old fashion - Buying is old fashion - Buying is old fashion - Buying is old fashion - Buying is old fashion - Buying is old fashion - Buying is old fashion - Buying is old fashion - Buying is old fashion - Buying is old fashion - Buying is old fashion - Buying is old fashion - Buying is old fashion - Buying is old fashion - Buying is old fashion - Buying is old fashion - Buying is old fashion - Buying is old fashion - Buying is old fashion - Buying is old fashion - Buying is old fashion - Buying is old fashion - Buying is old fashion - Buying is old fashion - Buying is old fashion - Buying is old fashion - Buying is old fashion - Buying is old fashion - Buying is old fashion - Buying is old fashion - Buying is old fashion </h4>
</div>
</div>
<div class="store-text-scroll-one black">
<div data-w-id="ba618a01-93f2-c1e3-6404-a1da90d36105" class="text-scroll-wrapper make-fash">
<h4 class="heading-5">You make your fashion - You make your fashion - You make your fashion - You make your fashion - You make your fashion - You make your fashion - You make your fashion - You make your fashion - You make your fashion - You make your fashion - You make your fashion - You make your fashion - You make your fashion - You make your fashion - You make your fashion - You make your fashion - You make your fashion - You make your fashion - You make your fashion - You make your fashion - You make your fashion - You make your fashion - You make your fashion - You make your fashion - You make your fashion - You make your fashion - You make your fashion - You make your fashion - You make your fashion - You make your fashion - You make your fashion - You make your fashion - You make your fashion - You make your fashion - You make your fashion - You make your fashion - </h4>
</div>
</div>
</div>
<script src="https://d3e54v103j8qbb.cloudfront.net/js/jquery-3.5.1.min.dc5e7f18c8.js?site=6045ffa43ae2c8141dfef11a" type="text/javascript" integrity="sha256-9/aliU8dGd2tb6OSsuzixeV4y/faTqgFtohetphbbj0=" crossorigin="anonymous"></script>
<script src="js/webflow.js" type="text/javascript"></script>
<!-- [if lte IE 9]><script src="https://cdnjs.cloudflare.com/ajax/libs/placeholders/3.0.2/placeholders.min.js"></script><![endif] -->
<script>
$('#play-video').on('click', function(e) {
var $video = $('#video');
src = $video.attr('src');
$video.attr('src', src + '?autoplay=1');
});
</script>
</body>
</html>