Skip to content

Commit dc63faf

Browse files
author
Josh Osborne
committed
icon play & indent/tiny kerning
1 parent f806a73 commit dc63faf

File tree

6 files changed

+74
-19
lines changed

6 files changed

+74
-19
lines changed

_includes/work-overlay.html

+1-1
Original file line numberDiff line numberDiff line change
@@ -1,7 +1,7 @@
11
<div class="bg-white ba bw5 b--white fixed ma6 vh-100 vw-100 noselect tracked-med overflow-scroll overflow-hidden">
22
<div class="f3 fw5">
33
<img class="mb3 mt0" src="{{ site.baseurl }}/images/jekyons-promo.png">
4-
<p class="f3 pt0 mt0 mb5 w-90">Jekyons is a design tool we created to prototype and build websites quickly and without abandon.</p>
4+
<!-- <p class="f3 pt0 mt0 mb5 w-90">Jekyons is a design tool we created to prototype and build websites quickly and without abandon.</p> -->
55
<img class="mb3 mt0" src="{{ site.baseurl }}/images/evidence.jpg">
66
<!-- <p class="mv0">Recent Work —</p>
77
<p class="mv0"><a class="link black dim" href="">Organize</a> — <a class="link black dim" href="">The Evidence of Intimacy</a> — <a class="link black dim" href="">Jekyons</a> — <a class="link black dim" href="">Five Good Things</a></p> -->

css/main.scss

+8
Original file line numberDiff line numberDiff line change
@@ -12,3 +12,11 @@
1212
.m-auto {
1313
margin: auto;
1414
}
15+
16+
#tiny-t {
17+
margin-right: .013em;
18+
}
19+
20+
@media screen and (min-width: 30em) {
21+
.indent-ns { text-indent: 100px; margin-top: 0; margin-bottom: 0; }
22+
}

images/flag.svg

+15
Loading

images/usa.svg

+12
Loading

index.html

+3-3
Original file line numberDiff line numberDiff line change
@@ -8,10 +8,10 @@
88
<div class="pa4 tracked-med absolute overflow-scroll vh-100 noselect white bg-black difference word-tight">
99
<div class="f1-ns f2 fw5 pr4">
1010
<div class="indent-ns pt0 mt0">
11-
<p class="pt0 mt0 mb4">tinychime is a new kind of design &amp; technology practice based in the United States. We work with artists, writers, non-profits, cultural institutions &amp; people with ideas we believe in.</p>
11+
<p class="pt0 mt0 mb4"><span id="tiny-t">T</span>iny Chime is a new kind of design &amp; technology practice based in the United States. We work with artists, writers, non-profits, cultural institutions &amp; people with ideas we believe in.</p>
1212
</div>
13-
<p class="mb0 mt0"><a class="link white dim outline-0" href="mailto:[email protected]">[email protected]</a></p>
14-
<p class="mt0"><a class="link white dim outline-0" href="http://www.twitter.com/tinychime">@tinychime</a></p>
13+
<p class="mb0 mt0"><a class="link white dim" href="mailto:[email protected]">[email protected]</a></p>
14+
<p class="mt0"><a class="link white dim" href="http://www.twitter.com/tinychime">@tinychime</a></p>
1515
</div>
1616
</div>
1717
</div>

visual.html

+35-15
Original file line numberDiff line numberDiff line change
@@ -1,21 +1,41 @@
11
---
22
layout: default
33
---
4-
<div class="overflow-scroll">
5-
6-
<script src="{{ site.baseurl }}/scripts/draw-bg.js"></script>
7-
8-
<div class="pa4 tracked-med absolute overflow-scroll vh-100 noselect white bg-black difference word-tight">
9-
<div class="f1-ns f2 fw5 pr4">
10-
<div class="indent-ns pt0 mt0">
11-
<p class="pt0 mt0 mb4">tinychime is a new kind of design &amp; technology practice based in the United States. We work with artists, writers, non-profits, cultural institutions &amp; people with ideas we believe in.</p>
12-
</div>
13-
<p class="mb0 mt0"><a class="link white dim outline-0" href="mailto:[email protected]">[email protected]</a></p>
14-
<p class="mt0"><a class="link white dim outline-0" href="http://www.twitter.com/tinychime">@tinychime</a></p>
4+
<div class="ma4">
5+
<div class="fl w-100 w-50-m w-third-ns pa2">
6+
<div class="aspect-ratio aspect-ratio--1x1">
7+
<img style="background-image:url(http://mrmrs.io/images/0017.jpg);"
8+
class="db bg-center cover aspect-ratio--object" />
9+
</div>
10+
</div>
11+
<div class="fl w-100 w-50-m w-third-ns pa2">
12+
<div class="aspect-ratio aspect-ratio--1x1">
13+
<img style="background-image:url(http://mrmrs.io/images/0017.jpg);"
14+
class="db bg-center cover aspect-ratio--object" />
15+
</div>
16+
</div>
17+
<div class="fl w-100 w-50-m w-third-ns pa2">
18+
<div class="aspect-ratio aspect-ratio--1x1">
19+
<img style="background-image:url(http://mrmrs.io/images/0017.jpg);"
20+
class="db bg-center cover aspect-ratio--object" />
21+
</div>
22+
</div>
23+
<div class="fl w-100 w-50-m w-third-ns pa2">
24+
<div class="aspect-ratio aspect-ratio--1x1">
25+
<img style="background-image:url(http://mrmrs.io/images/0017.jpg);"
26+
class="db bg-center cover aspect-ratio--object" />
27+
</div>
28+
</div>
29+
<div class="fl w-100 w-50-m w-third-ns pa2">
30+
<div class="aspect-ratio aspect-ratio--1x1">
31+
<img style="background-image:url(http://mrmrs.io/images/0017.jpg);"
32+
class="db bg-center cover aspect-ratio--object" />
33+
</div>
34+
</div>
35+
<div class="fl w-100 w-50-m w-third-ns pa2">
36+
<div class="aspect-ratio aspect-ratio--1x1">
37+
<img style="background-image:url(http://mrmrs.io/images/0017.jpg);"
38+
class="db bg-center cover aspect-ratio--object" />
1539
</div>
1640
</div>
17-
</div>
18-
19-
<div class="">
20-
{% include work-overlay.html %}
2141
</div>

0 commit comments

Comments
 (0)