Skip to content

Commit 83c6453

Browse files
skadeskade
committed
Revert "extract rows css in a reusable component"
This reverts commit 3616df4.
1 parent 04e0af1 commit 83c6453

File tree

4 files changed

+47
-98
lines changed

4 files changed

+47
-98
lines changed

‎src/styles/app.scss

Lines changed: 1 addition & 71 deletions
Original file line numberDiff line numberDiff line change
@@ -224,76 +224,6 @@ section .container {
224224
padding-top: 20px;
225225
}
226226

227-
.row {
228-
display: flex;
229-
flex-direction: column;
230-
padding-top: 2rem;
231-
padding-bottom: 2rem;
232-
233-
@media all and (min-width: 60rem) {
234-
flex-direction: row;
235-
padding-top: 0;
236-
padding-bottom: 0;
237-
margin: 0 -0.5rem;
238-
}
239-
240-
.row-column {
241-
padding-left: 0;
242-
padding-top: 0;
243-
padding-bottom: 2rem;
244-
display: flex;
245-
flex-direction: column;
246-
247-
&.with-image {
248-
flex-direction: row;
249-
align-items: start;
250-
251-
@media all and (min-width: 60rem) {
252-
flex-direction: column;
253-
align-items: center;
254-
255-
& > * {
256-
flex: 1;
257-
}
258-
259-
img {
260-
flex: initial;
261-
}
262-
}
263-
264-
img {
265-
display: block;
266-
margin-right: 2rem;
267-
268-
@media all and (min-width: 60rem) {
269-
margin-right: 0;
270-
margin-bottom: 2rem;
271-
}
272-
}
273-
}
274-
275-
@media all and (min-width: 60rem) {
276-
padding: 1rem 0.5rem 0 0.5rem;
277-
max-width: 34rem;
278-
flex: 1;
279-
align-items: center;
280-
}
281-
}
282-
}
283-
284-
.push-button-down {
285-
display: flex;
286-
flex-direction: column;
287-
288-
& > * {
289-
flex: 1;
290-
}
291-
292-
.button {
293-
flex: initial;
294-
}
295-
}
296-
297227
// TODO: remove when switching to Tachyons -- these are overrides for Skeleton.
298228
ul.nav, ul.nav li {
299229
margin-bottom: 0;
@@ -848,4 +778,4 @@ blockquote::before {
848778

849779
.download-link {
850780
color: $link-color;
851-
}
781+
}

‎templates/components/what/wasm/get-started.hbs

Lines changed: 22 additions & 13 deletions
Original file line numberDiff line numberDiff line change
@@ -4,31 +4,40 @@
44
<h2>Get started!</h2>
55
<div class="highlight"></div>
66
</header>
7-
<div class="row">
8-
<div class="row-column with-image">
9-
<img src="/static/images/webassembly-logo.svg" alt="WebAssembly Logo" class="h3-l mw4"/>
10-
<div class="push-button-down">
11-
<p>
7+
<div class="flex flex-column flex-row-l pv4 pv0-l">
8+
<div class="flex flex-row flex-column-l justify-between-l mw8 measure-wide-l w-100 mt5 mt2-l">
9+
<div class="v-top tc-l">
10+
<img src="/static/images/webassembly-logo.svg" alt="WebAssembly Logo"
11+
class="mw3 mw4-ns"/>
12+
</div>
13+
<div class="v-top pl4 pl0-l pt0 pt3-l measure-wide-l flex-l flex-column-l flex-auto-l justify-between-l pl4-l">
14+
<p class="flex-grow-1">
1215
Learn more about the fast, safe, and open virtual machine called
1316
WebAssembly, and read its standard.
1417
</p>
1518
<a href="https://webassembly.org/" class="button button-secondary">Learn More</a>
1619
</div>
1720
</div>
18-
<div class="row-column with-image">
19-
<img src="/static/images/wasm-ferris.png" alt="wasm ferris" class="h3-l mw4"/>
20-
<div class="push-button-down">
21-
<p>
21+
<div class="flex flex-row flex-column-l justify-between-l mw8 measure-wide-l w-100 mt5 mt2-l">
22+
<div class="v-top tc-l">
23+
<img src="/static/images/wasm-ferris.png" alt="wasm ferris"
24+
class="mw3 mw4-ns"/>
25+
</div>
26+
<div class="v-top pl4 pl0-l pt0 pt3-l measure-wide-l flex-l flex-column-l flex-auto-l justify-between-l pl4-l">
27+
<p class="flex-grow-1">
2228
Learn how to build, debug, profile, and deploy WebAssembly
2329
applications using Rust!
2430
</p>
2531
<a href="https://rustwasm.github.io/book" class="button button-secondary">Read The Book</a>
2632
</div>
2733
</div>
28-
<div class="row-column with-image">
29-
<img src="/static/images/mdn-logo.svg" alt="MDN logo" class="h3-l mw4"/>
30-
<div class="push-button-down">
31-
<p>
34+
<div class="flex flex-row flex-column-l justify-between-l mw8 measure-wide-l w-100 mt5 mt2-l">
35+
<div class="v-top tc-l">
36+
<img src="/static/images/mdn-logo.svg" alt="MDN logo"
37+
class="mw3 mw4-ns"/>
38+
</div>
39+
<div class="v-top pl4 pl0-l pt0 pt3-l measure-wide-l flex-l flex-column-l flex-auto-l justify-between-l pl4-l">
40+
<p class="flex-grow-1">
3241
Learn more about WebAssembly on the Mozilla Developer Network.
3342
</p>
3443
<a href="https://developer.mozilla.org/en-US/docs/WebAssembly" class="button button-secondary">Check it out</a>

‎templates/components/what/wasm/js.hbs

Lines changed: 5 additions & 4 deletions
Original file line numberDiff line numberDiff line change
@@ -4,24 +4,25 @@
44
<h2>Plays well with JavaScript</h2>
55
<div class="highlight"></div>
66
</header>
7-
<div class="row">
8-
<div class="row-column">
7+
<div class="flex flex-column flex-row-l pv4 pv0-l">
8+
<div class="v-top pl4 pl0-l pt0 pt3-l measure-wide-l flex-l flex-column-l flex-auto-l justify-between-l pl4-l">
99
<h3 class="tc-l">Augment, don’t replace</h3>
1010
<p class="flex-grow-1">
1111
The dream of WebAssembly is not to kill JavaScript but to work
1212
alongside of it, to help super charge processing-heavy or low-level
1313
tasks &mdash; tasks that benefit from Rust’s focus on performance.
1414
</p>
1515
</div>
16-
<div class="row-column">
16+
<div class="v-top pl4 pl0-l pt0 pt3-l measure-wide-l flex-l flex-column-l flex-auto-l justify-between-l pl4-l">
1717
<h3 class="tc-l">Works with familiar toolchains</h3>
1818
<p class="flex-grow-1">
19+
1920
Publish Rust WebAssembly packages to package registries like npm.
2021
Bundle and ship them with webpack, Parcel, and others.
2122
Maintain them with tools like <code>npm audit</code> and Greenkeeper.
2223
</p>
2324
</div>
24-
<div class="row-column">
25+
<div class="v-top pl4 pl0-l pt0 pt3-l measure-wide-l flex-l flex-column-l flex-auto-l justify-between-l pl4-l">
2526
<h3 class="tc-l">Seamless interop</h3>
2627
<p class="flex-grow-1">
2728
Automatically generate binding code between Rust, WebAssembly, and JavaScript APIs.

‎templates/components/what/wasm/pitch.hbs

Lines changed: 19 additions & 10 deletions
Original file line numberDiff line numberDiff line change
@@ -4,10 +4,13 @@
44
<h2>Why Rust?</h2>
55
<div class="highlight"></div>
66
</header>
7-
<div class="row">
8-
<div class="row-column with-image">
9-
<img src="/static/images/gears.svg" alt="Gears" class="mw3 mw4-ns" />
10-
<div>
7+
<div class="flex flex-column flex-row-l pv4 pv0-l">
8+
<div class="flex flex-row flex-column-l justify-between-l mw8 measure-wide-l w-100 mt5 mt2-l">
9+
<div class="v-top tc-l">
10+
<img src="/static/images/gears.svg" alt="Gears"
11+
class="mw3 mw4-ns" />
12+
</div>
13+
<div class="v-top pl4 pl0-l pt0 pt3-l measure-wide-l flex-l flex-column-l flex-auto-l justify-between-l pl4-l">
1114
<h3 class="tc-l">Predictable performance</h3>
1215
<p class="flex-grow-1">
1316
No unpredictable garbage collection pauses. No JIT compiler
@@ -16,9 +19,12 @@
1619
</p>
1720
</div>
1821
</div>
19-
<div class="row-column with-image">
20-
<img src="/static/images/microscope.svg" alt="A microscope" class="mw3 mw4-ns" />
21-
<div>
22+
<div class="flex flex-row flex-column-l justify-between-l mw8 measure-wide-l w-100 mt5 mt2-l">
23+
<div class="v-top tc-l">
24+
<img src="/static/images/microscope.svg" alt="A microscope"
25+
class="mw3 mw4-ns" />
26+
</div>
27+
<div class="v-top pl4 pl0-l pt0 pt3-l measure-wide-l flex-l flex-column-l flex-auto-l justify-between-l pl4-l">
2228
<h3 class="tc-l">Small code size</h3>
2329
<p class="flex-grow-1">
2430
Small code size means faster page loads. Rust-generated
@@ -27,9 +33,12 @@
2733
</p>
2834
</div>
2935
</div>
30-
<div class="row-column with-image">
31-
<img src="/static/images/luggage.svg" alt="Luggage" class="mw3 mw4-ns"/>
32-
<div>
36+
<div class="flex flex-row flex-column-l justify-between-l mw8 measure-wide-l w-100 mt5 mt2-l">
37+
<div class="v-top tc-l">
38+
<img src="/static/images/luggage.svg" alt="Luggage"
39+
class="mw3 mw4-ns"/>
40+
</div>
41+
<div class="v-top pl4 pl0-l pt0 pt3-l measure-wide-l flex-l flex-column-l flex-auto-l justify-between-l pl4-l">
3342
<h3 class="tc-l">Modern amenities</h3>
3443
<p class="flex-grow-1">
3544
A lively ecosystem of libraries to help you hit the

0 commit comments

Comments
 (0)