Skip to content

Commit

Permalink
Update page copy
Browse files Browse the repository at this point in the history
  • Loading branch information
Rich Archer committed Apr 25, 2017
1 parent 2914b32 commit 87c41a2
Show file tree
Hide file tree
Showing 7 changed files with 171 additions and 282 deletions.
128 changes: 0 additions & 128 deletions app/answers.css
View file
Original file line number Diff line number Diff line change
Expand Up @@ -6,131 +6,3 @@
body {
font-family: 'opensanskata', sans-serif;
}

section {
border: 1px solid slategrey;
background-color: white;
position: relative;
}

h1, .h1 {
font-size: 2em;
line-height: 1.25em;
font-weight: normal;
}
h2 {
font-size: 1.625em;
line-height: 1.153em;
font-weight: normal;
}
h3 {
font-size: 1.375em;
line-height: 1.136em;
font-weight: normal;
}
h4 {
font-size: 1.125em;
line-height: 1.111em;
font-weight: normal;
}

.display-block img {
display: block;
}

.display-inline > * {
display: inline-block;
vertical-align: middle;
}

.medium-image img {
width: 150px;
height: 150px;
}

.small-image img {
width: 100px;
height: 100px;
}

.simple-box {
display: block;
padding: 1em;
background-color: tomato;
width: 5em;
height: 5em;
}
.simple-box img {
width: 100%;
height: 100%;
}
.simple-box--bordered {
border: 1em solid royalblue;
}
.simple-box--margined {
margin: 1em;
}
.simple-box--small {
box-sizing: border-box;
}

.box {
background-color: tomato;
text-indent: -1000px;
display: inline-block;
width: 5em;
height: 5em;
vertical-align: bottom;
}

.nolist {
padding-left: 0;
list-style-type: none;
}

.circle {
background-color: dodgerblue;
text-indent: -1000px;
display: inline-block;
width: 7em;
height: 7em;
border-radius: 50%;
vertical-align: bottom;
}

.outline {
display: inline-block;
width: 10em;
height: 10em;
border: 3px solid royalblue;
border-radius: 50%;
text-indent: -1000px;
box-sizing: border-box;
vertical-align: bottom;
}

.lawn {
display: block;
background-color: seagreen;
width: 20em;
height: 20em;
position: relative;
}

.ball {
display: block;
width: 4em;
height: 4em;
border-radius: 50%;
background-color: yellow;
}

.lawn-override {
position: static;
}

.ball--br {
position: absolute;
bottom: 0;
right: 0;
}
12 changes: 6 additions & 6 deletions app/box-model.html
View file
Original file line number Diff line number Diff line change
Expand Up @@ -17,8 +17,8 @@ <h2>The Box Model</h2>
<p>Your version will be compared against <a target="blank" href="/backstop_data/bitmaps_reference/css_kata_Box_model__0_box-model-simple-box_0_phone.png">this</a> guide.</p>

<section id="box-model-simple-box">
<div class="simple-box"><img src='assets/kitten.jpg' alt='a kitten'></div>
<div class="simple-box"><img src='assets/kitten.jpg' alt='a kitten'></div>
<div><img src='assets/kitten.jpg' alt='a kitten'></div>
<div><img src='assets/kitten.jpg' alt='a kitten'></div>
</section>

</li>
Expand All @@ -28,8 +28,8 @@ <h2>The Box Model</h2>
<p>Your version will be compared against <a target="blank" href="/backstop_data/bitmaps_reference/css_kata_Box_model__0_box-model-simple-border-box_0_phone.png">this</a> guide.</p>

<section id="box-model-simple-border-box">
<div class="simple-box simple-box--bordered"><img src='assets/kitten.jpg' alt='a kitten'></div>
<div class="simple-box simple-box--bordered"><img src='assets/kitten.jpg' alt='a kitten'></div>
<div><img src='assets/kitten.jpg' alt='a kitten'></div>
<div><img src='assets/kitten.jpg' alt='a kitten'></div>
</section>
</li>

Expand All @@ -39,8 +39,8 @@ <h2>The Box Model</h2>
<p>Your version will be compared against <a target="blank" href="/backstop_data/bitmaps_reference/css_kata_Box_model__0_box-model-simple-border-margin-box_0_phone.png">this</a> guide.</p>

<section id="box-model-simple-border-margin-box">
<div class="simple-box simple-box--bordered simple-box--margined"><img src='assets/kitten.jpg' alt='a kitten'></div>
<div class="simple-box simple-box--bordered simple-box--margined"><img src='assets/kitten.jpg' alt='a kitten'></div>
<div><img src='assets/kitten.jpg' alt='a kitten'></div>
<div><img src='assets/kitten.jpg' alt='a kitten'></div>
</section>
</li>
</ol>
Expand Down
28 changes: 14 additions & 14 deletions app/css-shapes-101.html
View file
Original file line number Diff line number Diff line change
Expand Up @@ -19,9 +19,9 @@ <h2>CSS shapes 101</h2>
<section id="box-align">

<div>
<div class="box">list item</div>
<div class="box">list item</div>
<div class="box">list item</div>
<div>list item</div>
<div>list item</div>
<div>list item</div>
</div>

</section>
Expand All @@ -33,10 +33,10 @@ <h2>CSS shapes 101</h2>
<p>Your version will be compared against <a href="/backstop_data/bitmaps_reference/css_kata_Shapes_Circles_0_circle-align_0_phone.png">this</a> guide.</p>
<section id="circle-align">

<ul class="nolist">
<li class="circle">list item</li>
<li class="circle">list item</li>
<li class="circle">list item</li>
<ul>
<li>list item</li>
<li>list item</li>
<li>list item</li>
</ul>

</section>
Expand All @@ -48,9 +48,9 @@ <h2>CSS shapes 101</h2>
<p>Your version will be compared against <a href="/backstop_data/bitmaps_reference/css_kata_Shapes_Circle_Outlines_0_circle-outlines-align_0_phone.png">this</a> guide.</p>
<section id="circle-outlines-align">

<ol class="nolist">
<li class="outline">list item</li>
<li class="outline">list item</li>
<ol>
<li>list item</li>
<li>list item</li>
</ol>

</section>
Expand All @@ -62,10 +62,10 @@ <h2>CSS shapes 101</h2>
<p>Your version will be compared against <a href="/backstop_data/bitmaps_reference/css_kata_Shapes_Combo_0_shapes-align_0_phone.png">this</a> guide.</p>
<section id="shapes-align">

<ul class="nolist">
<li class="box">list item</li>
<li class="circle">list item</li>
<li class="outline">list item</li>
<ul>
<li>list item</li>
<li>list item</li>
<li>list item</li>
</ul>

</section>
Expand Down
12 changes: 6 additions & 6 deletions app/display-inline-block.html
View file
Original file line number Diff line number Diff line change
Expand Up @@ -18,7 +18,7 @@ <h2>Display: inline, inline-block, and block</h2>

<section id="display-stack-images">

<div class="display-block">
<div>
<img src='assets/kitten.jpg' alt='a kitten'>
<img src='assets/puppy.jpg' alt='a puppy'>
</div>
Expand All @@ -33,7 +33,7 @@ <h2>Display: inline, inline-block, and block</h2>

<section id="display-align-images">

<div class="display-inline">
<div>
<div><img src='assets/puppy.jpg' alt='a puppy'></div>
<div><img src='assets/kitten.jpg' alt='a kitten'></div>
</div>
Expand All @@ -51,10 +51,10 @@ <h2>Display: inline, inline-block, and block</h2>

<section id="display-align-resize-images">

<div class="display-inline">
<div class="medium-image"><img src='assets/kitten.jpg' alt='a kitten'></div>
<div class="small-image"><img src='assets/puppy.jpg' alt='a puppy'></div>
<span class="medium-image"><img src='assets/chinchilla.jpg' alt='a chinchilla'></span>
<div>
<div><img src='assets/kitten.jpg' alt='a kitten'></div>
<div><img src='assets/puppy.jpg' alt='a puppy'></div>
<span><img src='assets/chinchilla.jpg' alt='a chinchilla'></span>
</div>

</section>
Expand Down
12 changes: 6 additions & 6 deletions app/positioning.html
View file
Original file line number Diff line number Diff line change
Expand Up @@ -18,8 +18,8 @@ <h2>Positioning</h2>
<p>Your version will be compared against <a target="blank" href="/backstop_data/bitmaps_reference/css_kata_Position_Setup_0_position-setup_0_phone.png">this</a> guide.</p>

<section id="position-setup">
<div class="lawn">
<div class="ball"></div>
<div>
<div></div>
</div>
</section>
</li>
Expand All @@ -29,8 +29,8 @@ <h2>Positioning</h2>
<p>Your version will be compared against <a target="blank" href="/backstop_data/bitmaps_reference/css_kata_Position_Setup_0_position-bottom_0_phone.png">this</a> guide.</p>

<section id="position-bottom">
<div class="lawn">
<div class="ball ball--br"></div>
<div>
<div></div>
</div>
</section>
</li>
Expand All @@ -40,8 +40,8 @@ <h2>Positioning</h2>
<p>Your version will be compared against <a target="blank" href="/backstop_data/bitmaps_reference/css_kata_Position_Setup_0_position-override_0_phone.png">this</a> guide.</p>

<section id="position-override">
<div class="lawn lawn-override">
<div class="ball ball--br"></div>
<div>
<div></div>
</div>
</section>
</li>
Expand Down
2 changes: 1 addition & 1 deletion app/typography-101.html
View file
Original file line number Diff line number Diff line change
Expand Up @@ -12,7 +12,7 @@ <h2>Typography 101</h2>

<ol>
<li>
<p>The font 'Open Sans' has already been linked to this page. Style the page so that 'Open Sans' is the default font used across the site, and the body copy font size is 16px large, with a line-height of <code>1.25em</code>.</p>
<p>The font 'Open Sans' has already been linked to this page. Style the page so that the body copy font size is 16px large, with a line-height of <code>1.25em</code>.</p>

<p>Your version will be compared against <a target="_blank" href="/backstop_data/bitmaps_reference/css_kata_Typography_101_Body_text_0_typography-body-font_0_phone.png">this</a> guide.</p>

Expand Down
Loading

0 comments on commit 87c41a2

Please sign in to comment.