Skip to content

Commit

Permalink
Updates from Tiffany
Browse files Browse the repository at this point in the history
  • Loading branch information
Simon Mackie committed Sep 14, 2015
1 parent fcada18 commit dd7e6c4
Show file tree
Hide file tree
Showing 129 changed files with 688 additions and 1,214 deletions.
2 changes: 1 addition & 1 deletion 01-selectors/adjacent-sibling-combinator.html
View file
Original file line number Diff line number Diff line change
Expand Up @@ -34,7 +34,7 @@
<body>
<header>
<h1><i>CSS Master</i> Code Examples: Adjacent Sibling Combinator</h1>
<a href="./">Back to listing</a>
<a href="./index.html">Back to listing</a>
</header>

<main>
Expand Down
2 changes: 1 addition & 1 deletion 01-selectors/attribute-hyphenated.html
View file
Original file line number Diff line number Diff line change
Expand Up @@ -43,7 +43,7 @@
<body>
<header>
<h1><i>CSS Master</i> Code Examples: Attribute selector - Hyphenated values</h1>
<a href="./">Back to listing</a>
<a href="./index.html">Back to listing</a>
</header>
<main>
<article class="articlepromo">
Expand Down
2 changes: 1 addition & 1 deletion 01-selectors/attribute-selectors-substring.html
View file
Original file line number Diff line number Diff line change
Expand Up @@ -29,7 +29,7 @@
<header>
<h1><i>CSS Master</i> Code Examples: Attribute Selectors - Matching value substrings
</h1>
<a href="./">Back to listing</a>
<a href="./index.html">Back to listing</a>
</header>
<main>

Expand Down
2 changes: 1 addition & 1 deletion 01-selectors/attribute-space-separated.html
View file
Original file line number Diff line number Diff line change
Expand Up @@ -50,7 +50,7 @@
<body>
<header>
<h1><i>CSS Master</i> Code Examples: Attribute Selectors - Space Separated Values</h1>
<a href="./">Back to listing</a>
<a href="./index.html">Back to listing</a>
</header>
<main>

Expand Down
2 changes: 1 addition & 1 deletion 01-selectors/child-combinator.html
View file
Original file line number Diff line number Diff line change
Expand Up @@ -26,7 +26,7 @@
<body>
<header>
<h1><i>CSS Master</i> Code Examples: Child Combinator</h1>
<a href="./">Back to listing</a>
<a href="./index.html">Back to listing</a>
</header>

<main>
Expand Down
2 changes: 1 addition & 1 deletion 01-selectors/descendant-combinator.html
View file
Original file line number Diff line number Diff line change
Expand Up @@ -22,7 +22,7 @@
<body>
<header>
<h1><i>CSS Master</i> Code Examples: Descendant Combinator</h1>
<a href="./">Back to listing</a>
<a href="./index.html">Back to listing</a>
</header>

<main>
Expand Down
2 changes: 1 addition & 1 deletion 01-selectors/general-sibling-combinator.html
View file
Original file line number Diff line number Diff line change
Expand Up @@ -42,7 +42,7 @@
<body>
<header>
<h1><i>CSS Master</i> Code Examples: General Sibling Combinator</h1>
<a href="./">Back to listing</a>
<a href="./index.html">Back to listing</a>
</header>
<main>

Expand Down
7 changes: 3 additions & 4 deletions 01-selectors/index.html
View file
Original file line number Diff line number Diff line change
Expand Up @@ -6,15 +6,14 @@
<title>CSS Master: Chapter 2 Selectors</title>
<meta name="description" content="">
<meta name="viewport" content="width=device-width, initial-scale=1">
<script src="../../js/html5shiv.min.js"></script>
<link rel="stylesheet" href="../../css/base.css">
<link rel="stylesheet" href="../../css/chapter7/mq.css">
<script src="../js/html5shiv.min.js"></script>
<link rel="stylesheet" href="../css/base.css">
</head>

<body>
<header>
<h1><i>CSS Master</i> Code Examples: Chapter 2</h1>
<a href="../">Back to listing</a>
<a href="../index.html">Back to listing</a>
</header>

<nav class="content">
Expand Down
2 changes: 1 addition & 1 deletion 01-selectors/input-pseudo-class.html
View file
Original file line number Diff line number Diff line change
Expand Up @@ -13,7 +13,7 @@

<header>
<h1><i>CSS Master</i> Code Examples: Using input-related pseudo-classes</h1>
<a href="./">Back to listing</a>
<a href="./index.html">Back to listing</a>
</header>
<main>

Expand Down
15 changes: 7 additions & 8 deletions 01-selectors/pseudo-class-first-last-type.html
View file
Original file line number Diff line number Diff line change
Expand Up @@ -3,26 +3,25 @@
<head>
<meta charset="utf-8">
<meta http-equiv="X-UA-Compatible" content="IE=edge">
<title>:nth-child() (CSS Master)</title>
<title>:first-of-type / :last-of-type (CSS Master)</title>
<meta name="description" content="">
<meta name="viewport" content="width=device-width, initial-scale=1">
<link rel="stylesheet" href="../css/base.css">
<link rel="stylesheet" href="../css/chapter1/selectors-nth-child.css">
</head>
<body>
<header>
<h1><i>CSS Master</i> Code Examples: <code>:nth-of-type()</code></h1>
<a href="./">Back to listing</a>
<h1><i>CSS Master</i> Code Examples: <code>:first-of-type</code> / <code>:last-of-type</code></h1>
<a href="./index.html">Back to listing</a>
</header>

<main>
<h2 style="color:#fffffe">Using <code>:nth-child()</code></h2>
<p>The <code>:first-of-type</code> / <code>:last-of-type</code> pseudo-classes are intended to be used with element or type selectors.</p>
<article class="nth-wrap first-last">

<section class="nth-wrap">
<div class="nth-item">1</div><p class="nth-item">2</p><div class="nth-item">3</div><p class="nth-item">4</div><p class="nth-item">5</p><div class="nth-item">6</div><p class="nth-item">7</p><p class="nth-item">8</p><div class="nth-item">9</div><p class="nth-item">10</p><div class="nth-item">11</div><p class="nth-item">12</p><p class="nth-item">13</p><div class="nth-item">14</div><p class="nth-item">15</p><div class="nth-item">16</div><p class="nth-item">17</p><p class="nth-item">18</p><div class="nth-item">19</div><div class="nth-item">20</div>

<div class="nth-type-item">1</div><p class="nth-type-item">2</p><div class="nth-type-item">3</div><p class="nth-type-item">4</div><p class="nth-type-item">5</p><div class="nth-type-item">6</div><p class="nth-type-item">7</p><p class="nth-type-item">8</p><div class="nth-type-item">9</div><p class="nth-type-item">10</p><div class="nth-type-item">11</div><p class="nth-type-item">12</p><p class="nth-type-item">13</p><div class="nth-type-item">14</div><p class="nth-type-item">15</p><div class="nth-type-item">16</div><p class="nth-type-item">17</p><p class="nth-type-item">18</p><div class="nth-type-item">19</div><div class="nth-type-item">20</div>

</section>
</article>
</main>
<footer>
<p>
Expand Down
2 changes: 1 addition & 1 deletion 01-selectors/pseudo-class-first-last.html
View file
Original file line number Diff line number Diff line change
Expand Up @@ -12,7 +12,7 @@
<body>
<header>
<h1><i>CSS Master</i> Code Examples: Using <code>:first-child</code> and <code>:last-child</code></h1>
<a href="./">Back to listing</a>
<a href="./index.html">Back to listing</a>
</header>

<main>
Expand Down
2 changes: 1 addition & 1 deletion 01-selectors/pseudo-class-first-of-type-first-letter.html
View file
Original file line number Diff line number Diff line change
Expand Up @@ -23,7 +23,7 @@
<body>
<header>
<h1><i>CSS Master</i> Code Examples: Using <code>:first-of-type</code> with <code>::first-letter</code></h1>
<a href="./">Back to listing</a>
<a href="./index.html">Back to listing</a>
</header>

<main>
Expand Down
2 changes: 1 addition & 1 deletion 01-selectors/pseudo-class-not.html
View file
Original file line number Diff line number Diff line change
Expand Up @@ -12,7 +12,7 @@
<body>
<header>
<h1><i>CSS Master</i> Code Examples: <code>:not()</code> selector</h1>
<a href="./">Back to listing</a>
<a href="./index.html">Back to listing</a>
</header>

<main>
Expand Down
12 changes: 6 additions & 6 deletions 01-selectors/pseudo-class-nth-child-AnB.html
View file
Original file line number Diff line number Diff line change
Expand Up @@ -8,12 +8,11 @@
<meta name="viewport" content="width=device-width, initial-scale=1">
<link rel="stylesheet" href="../css/base.css">
<link rel="stylesheet" href="../css/chapter1/selectors-nth-child.css">
<script type="text/javascript" src="../js/chapter1/selectors.js" defer></script>
</head>
<body>
<header>
<h1><i>CSS Master</i> Code Examples: <code>:nth-child()</code></h1>
<a href="./">Back to listing</a>
<a href="./index.html">Back to listing</a>
</header>

<main>
Expand All @@ -25,14 +24,14 @@ <h2>Using <code>:nth-child()</code></h2>
<div>
<label for="step">Step</label>
<input type="number" id="step" step="1" name="step" value="0">

<label for="offset">Offset</label>
<input type="number" id="offset" step="1" name="offset" value="0">
<button type="submit">Update</button>
<button type="reset">Reset</button>
</div>
</div>
</form>

<section id="nth-wrap"><div class="nth-item">1</div><div class="nth-item">2</div><div class="nth-item">3</div><div class="nth-item">4</div><div class="nth-item">5</div><div class="nth-item">6</div><div class="nth-item">7</div><div class="nth-item">8</div><div class="nth-item">9</div><div class="nth-item">10</div><div class="nth-item">11</div><div class="nth-item">12</div><div class="nth-item">13</div><div class="nth-item">14</div><div class="nth-item">15</div><div class="nth-item">16</div><div class="nth-item">17</div><div class="nth-item">18</div><div class="nth-item">19</div><div class="nth-item">20</div>
<div class="nth-item">21</div><div class="nth-item">22</div><div class="nth-item">23</div><div class="nth-item">24</div><div class="nth-item">25</div>

Expand All @@ -42,9 +41,10 @@ <h2>Using <code>:nth-child()</code></h2>

<footer>
<p>With a tip of the cap to <a href="http://nth-test.com/">nth-test</a>.</p>
<p>
<p>
Examples from <i>CSS Master</i> written by Tiffany B. Brown and published by SitePoint, Ltd. &copy; 2015.
</p>
</footer>
<script type="text/javascript" src="../js/chapter1/selectors.js" defer></script>
</body>
</html>
2 changes: 1 addition & 1 deletion 01-selectors/pseudo-class-nth-child.html
View file
Original file line number Diff line number Diff line change
Expand Up @@ -12,7 +12,7 @@
<body>
<header>
<h1><i>CSS Master</i> Code Examples: <code>:nth-child()</code></h1>
<a href="./">Back to listing</a>
<a href="./index.html">Back to listing</a>
</header>

<main>
Expand Down
12 changes: 6 additions & 6 deletions 01-selectors/pseudo-class-nth-last-child-AnB.html
View file
Original file line number Diff line number Diff line change
Expand Up @@ -8,12 +8,11 @@
<meta name="viewport" content="width=device-width, initial-scale=1">
<link rel="stylesheet" href="../css/base.css">
<link rel="stylesheet" href="../css/chapter1/selectors-nth-child.css">
<script type="text/javascript" src="../js/chapter1/selectors.js" defer></script>
</head>
<body>
<header>
<h1><i>CSS Master</i> Code Examples: <code>:nth-last-child()</code></h1>
<a href="./">Back to listing</a>
<a href="./index.html">Back to listing</a>
</header>

<main>
Expand All @@ -25,14 +24,14 @@ <h2>Using <code>:nth-last-child()</code></h2>
<div>
<label for="step">Step</label>
<input type="number" id="step" step="1" name="step" value="0">

<label for="step">Offset</label>
<input type="number" id="offset" step="1" name="offset" value="0">
<button type="submit">Update</button>
<button type="reset">Reset</button>
</div>
</div>
</form>

<section id="nth-wrap"><div class="nth-item">1</div><div class="nth-item">2</div><div class="nth-item">3</div><div class="nth-item">4</div><div class="nth-item">5</div><div class="nth-item">6</div><div class="nth-item">7</div><div class="nth-item">8</div><div class="nth-item">9</div><div class="nth-item">10</div><div class="nth-item">11</div><div class="nth-item">12</div><div class="nth-item">13</div><div class="nth-item">14</div><div class="nth-item">15</div><div class="nth-item">16</div><div class="nth-item">17</div><div class="nth-item">18</div><div class="nth-item">19</div><div class="nth-item">20</div>
<div class="nth-item">21</div><div class="nth-item">22</div><div class="nth-item">23</div><div class="nth-item">24</div><div class="nth-item">25</div>

Expand All @@ -42,9 +41,10 @@ <h2>Using <code>:nth-last-child()</code></h2>

<footer>
<p>With a tip of the cap to <a href="http://nth-test.com/">nth-test</a>.</p>
<p>
<p>
Examples from <i>CSS Master</i> written by Tiffany B. Brown and published by SitePoint, Ltd. &copy; 2015.
</p>
</footer>
<script type="text/javascript" src="../js/chapter1/selectors.js"></script>
</body>
</html>
8 changes: 4 additions & 4 deletions 01-selectors/pseudo-class-nth-last-of-type.html
View file
Original file line number Diff line number Diff line change
Expand Up @@ -8,12 +8,11 @@
<meta name="viewport" content="width=device-width, initial-scale=1">
<link rel="stylesheet" href="../css/base.css">
<link rel="stylesheet" href="../css/chapter1/selectors-nth-child.css">
<script type="text/javascript" src="../js/chapter1/selectors.js" defer></script>
</head>
<body>
<header>
<h1><i>CSS Master</i> Code Examples: <code>:nth-last-of-type()</code></h1>
<a href="./">Back to listing</a>
<a href="./index.html">Back to listing</a>
</header>

<main>
Expand All @@ -26,12 +25,12 @@ <h2>Using <code>:nth-last-of-type()</code></h2>
<div>
<label for="step">Step</label>
<input type="number" id="step" step="1" name="step" value="0">

<label for="step">Offset</label>
<input type="number" id="offset" step="1" name="offset" value="0">
<button type="submit">Update</button>
<button type="reset">Reset</button>
</div>
</div>
</form>


Expand All @@ -46,5 +45,6 @@ <h2>Using <code>:nth-last-of-type()</code></h2>
Examples from <i>CSS Master</i> written by Tiffany B. Brown and published by SitePoint, Ltd. &copy; 2015.
</p>
</footer>
<script type="text/javascript" src="../js/chapter1/selectors.js" defer></script>
</body>
</html>
6 changes: 3 additions & 3 deletions 01-selectors/pseudo-class-nth-of-type.html
View file
Original file line number Diff line number Diff line change
Expand Up @@ -13,7 +13,7 @@
<body>
<header>
<h1><i>CSS Master</i> Code Examples: <code>:nth-of-type()</code></h1>
<a href="./">Back to listing</a>
<a href="./index.html">Back to listing</a>
</header>

<main>
Expand All @@ -26,12 +26,12 @@ <h2>Using <code>:nth-of-type()</code></h2>
<div>
<label for="step">Step</label>
<input type="number" id="step" step="1" name="step" value="0">

<label for="step">Offset</label>
<input type="number" id="offset" step="1" name="offset" value="0">
<button type="submit">Update</button>
<button type="reset">Reset</button>
</div>
</div>
</form>


Expand Down
2 changes: 1 addition & 1 deletion 01-selectors/pseudo-class-only-child.html
View file
Original file line number Diff line number Diff line change
Expand Up @@ -12,7 +12,7 @@
<body>
<header>
<h1><i>CSS Master</i> Code Examples: <code>:only-child</code></h1>
<a href="./">Back to listing</a>
<a href="./index.html">Back to listing</a>
</header>

<main>
Expand Down
12 changes: 1 addition & 11 deletions 01-selectors/pseudo-class-target.html
View file
Original file line number Diff line number Diff line change
Expand Up @@ -13,7 +13,7 @@

<header>
<h1><i>CSS Master</i> Code Examples: Using the <code>:target</code> pseudoclass</h1>
<a href="./">Back to listing</a>
<a href="./index.html">Back to listing</a>
</header>

<main>
Expand All @@ -40,16 +40,6 @@ <h1><i>CSS Master</i> Code Examples: Using the <code>:target</code> pseudoclass<
</li>
</ul>
</div>

<script type="text/javascript">
[].map.call( document.querySelectorAll('a'), function(a) {
a.addEventListener('click', function(e) {
// e.preventDefault();
});
});
</script>
</main>

<footer>
<p>
Examples from <i>CSS Master</i> written by Tiffany B. Brown and published by SitePoint, Ltd. &copy; 2015.
Expand Down
4 changes: 2 additions & 2 deletions 01-selectors/pseudo-el-first-letter-drop.html
View file
Original file line number Diff line number Diff line change
Expand Up @@ -9,7 +9,7 @@
<link rel="stylesheet" href="../css/base.css">
<style type="text/css">

p::first-letter {
main p::first-letter {
font: bold italic 3rem / 2rem serif;
font-style: italic;
color: #607d8b;
Expand All @@ -23,7 +23,7 @@
<body>
<header>
<h1><i>CSS Master</i> Code Examples: <code>::first-letter</code></h1>
<a href="./">Back to listing</a>
<a href="./index.html">Back to listing</a>
</header>

<main>
Expand Down
6 changes: 3 additions & 3 deletions 01-selectors/pseudo-el-first-letter-init.html
View file
Original file line number Diff line number Diff line change
Expand Up @@ -8,11 +8,11 @@
<meta name="viewport" content="width=device-width, initial-scale=1">
<link rel="stylesheet" href="../css/base.css">
<style type="text/css">
p{
main p{
margin-bottom: 2em;
}

p::first-letter {
main p::first-letter {
font: bold italic 3em / .5 serif;
font-style: italic;
color: #3f51b5;
Expand All @@ -26,7 +26,7 @@
<body>
<header>
<h1><i>CSS Master</i> Code Examples: <code>::first-letter</code></h1>
<a href="./">Back to listing</a>
<a href="./index.html">Back to listing</a>
</header>

<main>
Expand Down
Loading

0 comments on commit dd7e6c4

Please sign in to comment.