Skip to content

Commit a2e0e53

Browse files
author
mrmrs
committed
Updating border-radius and borders docs with missing content.
1 parent 5a05c15 commit a2e0e53

File tree

4 files changed

+53
-26
lines changed

4 files changed

+53
-26
lines changed

‎docs/themes/border-radius/index.html

+13-8
Original file line numberDiff line numberDiff line change
@@ -41,7 +41,7 @@
4141
</header>
4242

4343
<main class="">
44-
<article class="bg-near-white bt b--black-10 ph3 pt3 ph5-ns">
44+
<article class="bg-near-white bt b--black-10 pa3 ph5-ns">
4545
<h4 class="f4 mv0 fw6 dib mr4">tachyons-border-radius</h4>
4646
<span class="f4 b dib pl0 ml0 mr4">v3.1.0</span>
4747
<span class="f4 b dib pl0 ml0 mr4">191 B</span>
@@ -63,23 +63,28 @@ <h4 class="f4 mv0 fw6 dib mr4">tachyons-border-radius</h4>
6363
<dd class="db pl0 ml0 f4 f2-ns b">1</dd>
6464
</dl>
6565
</div>
66+
<p class="measure f4 lh-copy">
67+
There is a five step scale for border radius in addition to a utility
68+
that sets border radius to 100%, which when combined with an explicit
69+
height and width will produce a circle.
70+
</p>
6671
</article>
6772
<div class="ph3 ph5-ns pt4 pb5">
68-
<h2 class="f3 bold">Examples</h2>
69-
<h3 class="f5 book pt4 caps">Border Radius</h3>
70-
<div class="mbm phs pv4 white bg-dark-gray br1">
73+
<h2 class="f3">Examples</h2>
74+
<h3 class="f5 pt4">Border Radius</h3>
75+
<div class="mb3 ph2 pv4 white bg-dark-gray br1">
7176
1st step in border-radius scale
7277
</div>
73-
<div class="mbm phs pv4 white bg-dark-gray br2">
78+
<div class="mb3 ph2 pv4 white bg-dark-gray br2">
7479
2nd step in border-radius scale
7580
</div>
76-
<div class="mbm phs pv4 white bg-dark-gray br3">
81+
<div class="mb3 ph2 pv4 white bg-dark-gray br3">
7782
3rd step in border-radius scale
7883
</div>
79-
<div class="mbm phs pvxl white bg-dark-gray br4">
84+
<div class="mb3 ph2 pv5 white bg-dark-gray br4">
8085
4th step in border-radius scale
8186
</div>
82-
<div class="mbm phs pvxl white bg-dark-gray br5">
87+
<div class="mb3 ph2 pv5 white bg-dark-gray br5">
8388
5th step in border-radius scale
8489
</div>
8590
<div class="dt w5">

‎docs/themes/borders/index.html

+10-3
Original file line numberDiff line numberDiff line change
@@ -4,12 +4,12 @@
44
<meta charset="utf-8">
55
<meta http-equiv="X-UA-Compatible" content="IE=Edge">
66
<title>
7-
Borders / Themes / Docs / TACHYONS
7+
tachyons-borders / Themes / Docs / TACHYONS
88
</title>
99
<meta name="author" content="@mr3rs">
1010
<meta name="description" content="CSS">
1111
<meta name="viewport" content="width=device-width, initial-scale=1">
12-
<link rel="stylesheet" href="/css/tachyons.css">
12+
<link rel="stylesheet" href="/css/tachyons.min.css">
1313
</head>
1414
<body class="w-100 sans-serif">
1515
<header class="w-100 pa3 ph5-ns bg-near-white">
@@ -41,7 +41,7 @@
4141
</header>
4242

4343
<main class="">
44-
<article class="bg-near-white bt b--black-10 ph3 pt3 ph5-ns">
44+
<article class="bg-near-white bt b--black-10 pa3 ph5-ns">
4545
<h4 class="f4 mv0 fw6 dib mr4">tachyons-borders</h4>
4646
<span class="f4 b dib pl0 ml0 mr4">v2.0.2</span>
4747
<span class="f4 b dib pl0 ml0 mr4">208 B</span>
@@ -63,6 +63,13 @@ <h4 class="f4 mv0 fw6 dib mr4">tachyons-borders</h4>
6363
<dd class="db pl0 ml0 f4 f2-ns b">2</dd>
6464
</dl>
6565
</div>
66+
<p class="measure f4 lh-copy">
67+
There is a base border module that can be extended with the
68+
border-width, border-color, border-style modules. By default you
69+
don't need to set a border color. It will just inherit whatever the
70+
text color is for that dom node. You can target any side to put a border
71+
on ie. top, right, bottom, left.
72+
</p>
6673
</article>
6774
<div class="ph3 ph5-ns pt4 pb5">
6875
<h2 class="f3 bold">Examples</h2>

‎src/templates/docs/border-radius/index.html

+20-12
Original file line numberDiff line numberDiff line change
@@ -14,7 +14,7 @@
1414
<body class="w-100 sans-serif">
1515
<%= siteHeader %>
1616
<main class="">
17-
<article class="bg-near-white bt b--black-10 ph3 pt3 ph5-ns">
17+
<article class="bg-near-white bt b--black-10 pa3 ph5-ns">
1818
<h4 class="f4 mv0 fw6 dib mr4"><%= name %></h4>
1919
<span class="f4 b dib pl0 ml0 mr4">v<%= moduleVersion %></span>
2020
<span class="f4 b dib pl0 ml0 mr4"><%= moduleSize %></span>
@@ -36,23 +36,31 @@ <h4 class="f4 mv0 fw6 dib mr4"><%= name %></h4>
3636
<dd class="db pl0 ml0 f4 f2-ns b"><%= moduleObj.rules.size.average %></dd>
3737
</dl>
3838
</div>
39+
<p class="measure f4 lh-copy">
40+
There is a five step scale for border radius in addition to a utility
41+
that sets border radius to 100%, which when combined with an explicit
42+
height and width will produce a circle.
43+
</p>
3944
</article>
4045
<div class="ph3 ph5-ns pt4 pb5">
41-
<h2 class="f3 bold">Examples</h2>
42-
<h3 class="f5 book pt4 caps">Border Radius</h3>
43-
<div class="mbm phs pv4 white bg-dark-gray br1">
44-
1st step in border-radius scale
46+
<h2 class="f3">Examples</h2>
47+
<h3 class="f5 pt4">Border Radius</h3>
48+
<div class="mb3 ph2 pv4 white bg-dark-gray br0">
49+
<code>.br0</code>
4550
</div>
46-
<div class="mbm phs pv4 white bg-dark-gray br2">
47-
2nd step in border-radius scale
51+
<div class="mb3 ph2 pv4 white bg-dark-gray br1">
52+
<code>.br1</code>
4853
</div>
49-
<div class="mbm phs pv4 white bg-dark-gray br3">
50-
3rd step in border-radius scale
54+
<div class="mb3 ph2 pv4 white bg-dark-gray br2">
55+
<code>.br2</code>
5156
</div>
52-
<div class="mbm phs pvxl white bg-dark-gray br4">
53-
4th step in border-radius scale
57+
<div class="mb3 ph2 pv4 white bg-dark-gray br3">
58+
<code>.br4</code>
5459
</div>
55-
<div class="mbm phs pvxl white bg-dark-gray br5">
60+
<div class="mb3 ph2 pv5 white bg-dark-gray br4">
61+
<code>.br5</code>
62+
</div>
63+
<div class="mb3 ph2 pv5 white bg-dark-gray br5">
5664
5th step in border-radius scale
5765
</div>
5866
<div class="dt w5">

‎src/templates/docs/borders/index.html

+10-3
Original file line numberDiff line numberDiff line change
@@ -4,17 +4,17 @@
44
<meta charset="utf-8">
55
<meta http-equiv="X-UA-Compatible" content="IE=Edge">
66
<title>
7-
Borders / Themes / Docs / TACHYONS
7+
<%= name %> / Themes / Docs / TACHYONS
88
</title>
99
<meta name="author" content="@mr3rs">
1010
<meta name="description" content="CSS">
1111
<meta name="viewport" content="width=device-width, initial-scale=1">
12-
<link rel="stylesheet" href="/css/tachyons.css">
12+
<link rel="stylesheet" href="/css/tachyons.min.css">
1313
</head>
1414
<body class="w-100 sans-serif">
1515
<%= siteHeader %>
1616
<main class="">
17-
<article class="bg-near-white bt b--black-10 ph3 pt3 ph5-ns">
17+
<article class="bg-near-white bt b--black-10 pa3 ph5-ns">
1818
<h4 class="f4 mv0 fw6 dib mr4"><%= name %></h4>
1919
<span class="f4 b dib pl0 ml0 mr4">v<%= moduleVersion %></span>
2020
<span class="f4 b dib pl0 ml0 mr4"><%= moduleSize %></span>
@@ -36,6 +36,13 @@ <h4 class="f4 mv0 fw6 dib mr4"><%= name %></h4>
3636
<dd class="db pl0 ml0 f4 f2-ns b"><%= moduleObj.rules.size.average %></dd>
3737
</dl>
3838
</div>
39+
<p class="measure f4 lh-copy">
40+
There is a base border module that can be extended with the
41+
border-width, border-color, border-style modules. By default you
42+
don't need to set a border color. It will just inherit whatever the
43+
text color is for that dom node. You can target any side to put a border
44+
on ie. top, right, bottom, left.
45+
</p>
3946
</article>
4047
<div class="ph3 ph5-ns pt4 pb5">
4148
<h2 class="f3 bold">Examples</h2>

0 commit comments

Comments
 (0)