Skip to content

Commit e522392

Browse files
wesboswesbos
authored
Merge pull request wesbos#18 from bencodezen/styles/titles-and-more
Styles/titles and more
2 parents 5e779f7 + e8bf8fc commit e522392

File tree

82 files changed

+129
-1247
lines changed

Some content is hidden

Large Commits have some content hidden by default. Use the searchbox below for content that may be hidden.

82 files changed

+129
-1247
lines changed

‎02 - Starter Files Setup/test-START.html ‎02 - Starter Files and Tooling Setup/test-START.html

+1-1
Original file line numberDiff line numberDiff line change
@@ -5,7 +5,7 @@
55
<meta charset="UTF-8">
66
<meta name="viewport" content="width=device-width, initial-scale=1.0">
77
<link rel="stylesheet" href="../assets/style.css">
8-
<title>Starter Files!</title>
8+
<title>Starter Files and Tooling Setup!</title>
99
</head>
1010

1111
<style>

‎03 - CSS Grid Fundamentals/css-grid-fundamentals-FINISHED.html

+1-1
Original file line numberDiff line numberDiff line change
@@ -5,7 +5,7 @@
55
<meta charset="UTF-8">
66
<meta name="viewport" content="width=device-width, initial-scale=1.0">
77
<link rel="stylesheet" href="../assets/style.css">
8-
<title>Fundamentals!</title>
8+
<title>CSS Grid Fundamentals!</title>
99
</head>
1010

1111
<body>

‎03 - CSS Grid Fundamentals/css-grid-fundamentals-START.html

+1-1
Original file line numberDiff line numberDiff line change
@@ -5,7 +5,7 @@
55
<meta charset="UTF-8">
66
<meta name="viewport" content="width=device-width, initial-scale=1.0">
77
<link rel="stylesheet" href="../assets/style.css">
8-
<title>Fundamentals!</title>
8+
<title>CSS Grid Fundamentals!</title>
99
</head>
1010

1111
<body>

‎05 - CSS Grid Implicit vs Explicit Tracks/implicit-vs-explicit-FINISHED.html

+1-1
Original file line numberDiff line numberDiff line change
@@ -5,7 +5,7 @@
55
<meta charset="UTF-8">
66
<meta name="viewport" content="width=device-width, initial-scale=1.0">
77
<link rel="stylesheet" href="../assets/style.css">
8-
<title>Implicit vs Explicit Grid</title>
8+
<title>CSS Grid Implicit vs Explicit Grid Tracks!</title>
99
</head>
1010

1111
<body>

‎05 - CSS Grid Implicit vs Explicit Tracks/implicit-vs-explicit-START.html

+2-2
Original file line numberDiff line numberDiff line change
@@ -5,7 +5,7 @@
55
<meta charset="UTF-8">
66
<meta name="viewport" content="width=device-width, initial-scale=1.0">
77
<link rel="stylesheet" href="../assets/style.css">
8-
<title>Implicit vs Explicit Grid</title>
8+
<title>CSS Grid Implicit vs Explicit Grid Tracks!</title>
99
</head>
1010

1111
<body>
@@ -23,4 +23,4 @@
2323
</style>
2424
</body>
2525

26-
</html>
26+
</html>

‎06 - CSS grid-auto-flow Explained/autoflow-FINISHED.html

+1-1
Original file line numberDiff line numberDiff line change
@@ -5,7 +5,7 @@
55
<meta charset="UTF-8">
66
<meta name="viewport" content="width=device-width, initial-scale=1.0">
77
<link rel="stylesheet" href="../assets/style.css">
8-
<title>grid-auto-flow</title>
8+
<title>CSS grid-auto-flow Explained!</title>
99
</head>
1010

1111
<body>

‎06 - CSS grid-auto-flow Explained/autoflow-START.html

+1-1
Original file line numberDiff line numberDiff line change
@@ -5,7 +5,7 @@
55
<meta charset="UTF-8">
66
<meta name="viewport" content="width=device-width, initial-scale=1.0">
77
<link rel="stylesheet" href="../assets/style.css">
8-
<title>grid-auto-flow</title>
8+
<title>CSS grid-auto-flow Explained!</title>
99
</head>
1010

1111
<body>

‎07 - Sizing tracks in CSS Grid/sizing-tracks-FINISHED.html

+1-1
Original file line numberDiff line numberDiff line change
@@ -5,7 +5,7 @@
55
<meta charset="UTF-8">
66
<meta name="viewport" content="width=device-width, initial-scale=1.0">
77
<link rel="stylesheet" href="../assets/style.css">
8-
<title>Sizing tracks in CSS Grid</title>
8+
<title>Sizing Tracks in CSS Grid!</title>
99
</head>
1010

1111
<body>

‎07 - Sizing tracks in CSS Grid/sizing-tracks-START.html

+1-1
Original file line numberDiff line numberDiff line change
@@ -5,7 +5,7 @@
55
<meta charset="UTF-8">
66
<meta name="viewport" content="width=device-width, initial-scale=1.0">
77
<link rel="stylesheet" href="../assets/style.css">
8-
<title>Sizing tracks in CSS Grid</title>
8+
<title>Sizing Tracks in CSS Grid!</title>
99
</head>
1010

1111
<body>

‎08 - CSS Grid repeat function/repeat-FINISHED.html

+1-1
Original file line numberDiff line numberDiff line change
@@ -5,7 +5,7 @@
55
<meta charset="UTF-8">
66
<meta name="viewport" content="width=device-width, initial-scale=1.0">
77
<link rel="stylesheet" href="../assets/style.css">
8-
<title>CSS Grid Repeat</title>
8+
<title>CSS Grid repeat Function!</title>
99
</head>
1010

1111
<body>

‎08 - CSS Grid repeat function/repeat-START.html

+1-1
Original file line numberDiff line numberDiff line change
@@ -5,7 +5,7 @@
55
<meta charset="UTF-8">
66
<meta name="viewport" content="width=device-width, initial-scale=1.0">
77
<link rel="stylesheet" href="../assets/style.css">
8-
<title>CSS Grid Repeat</title>
8+
<title>CSS Grid repeat Function!</title>
99
</head>
1010

1111
<body>

‎09 - Sizing Grid Items/sizing-items-FINISHED.html

+1-1
Original file line numberDiff line numberDiff line change
@@ -5,7 +5,7 @@
55
<meta charset="UTF-8">
66
<meta name="viewport" content="width=device-width, initial-scale=1.0">
77
<link rel="stylesheet" href="../assets/style.css">
8-
<title>Sizing Grid Items</title>
8+
<title>Sizing Grid Items!</title>
99
</head>
1010

1111
<body>

‎09 - Sizing Grid Items/sizing-items-START.html

+1-1
Original file line numberDiff line numberDiff line change
@@ -5,7 +5,7 @@
55
<meta charset="UTF-8">
66
<meta name="viewport" content="width=device-width, initial-scale=1.0">
77
<link rel="stylesheet" href="../assets/style.css">
8-
<title>Sizing Grid Items</title>
8+
<title>Sizing Grid Items!</title>
99
</head>
1010

1111
<body>

‎10 - Placing Grid Items/placing-FINISHED.html

+1-1
Original file line numberDiff line numberDiff line change
@@ -5,7 +5,7 @@
55
<meta charset="UTF-8">
66
<meta name="viewport" content="width=device-width, initial-scale=1.0">
77
<link rel="stylesheet" href="../assets/style.css">
8-
<title>Placing Grid Items</title>
8+
<title>Placing Grid Items!</title>
99
</head>
1010

1111
<body>

‎10 - Placing Grid Items/placing-START.html

+2-2
Original file line numberDiff line numberDiff line change
@@ -5,7 +5,7 @@
55
<meta charset="UTF-8">
66
<meta name="viewport" content="width=device-width, initial-scale=1.0">
77
<link rel="stylesheet" href="../assets/style.css">
8-
<title>Placing Grid Items</title>
8+
<title>Placing Grid Items!</title>
99
</head>
1010

1111
<body>
@@ -52,4 +52,4 @@
5252
</style>
5353
</body>
5454

55-
</html>
55+
</html>

‎11 - Spanning and Placing Cardio/get-sweaty-FINISHED.html

+1-1
Original file line numberDiff line numberDiff line change
@@ -5,7 +5,7 @@
55
<meta charset="UTF-8">
66
<meta name="viewport" content="width=device-width, initial-scale=1.0">
77
<link rel="stylesheet" href="../assets/style.css">
8-
<title>Spanning & Placing Cardio</title>
8+
<title>Spanning & Placing Cardio!</title>
99
</head>
1010

1111
<body>

‎11 - Spanning and Placing Cardio/get-sweaty-START.html

+1-1
Original file line numberDiff line numberDiff line change
@@ -5,7 +5,7 @@
55
<meta charset="UTF-8">
66
<meta name="viewport" content="width=device-width, initial-scale=1.0">
77
<link rel="stylesheet" href="../assets/style.css">
8-
<title>Spanning & Placing Cardio</title>
8+
<title>Spanning & Placing Cardio!</title>
99
</head>
1010

1111
<body>

‎12 - auto-fit and auto-fill Explained/auto-fit-and-auto-fill-FINISHED.html ‎12 - auto-fit and auto-fill/auto-fit-and-auto-fill-FINISHED.html

+1-1
Original file line numberDiff line numberDiff line change
@@ -5,7 +5,7 @@
55
<meta charset="UTF-8">
66
<meta name="viewport" content="width=device-width, initial-scale=1.0">
77
<link rel="stylesheet" href="../assets/style.css">
8-
<title>auto-fit and auto-fill</title>
8+
<title>auto-fit and auto-fill!</title>
99
</head>
1010

1111
<body>

‎12 - auto-fit and auto-fill Explained/auto-fit-and-auto-fill-START.html ‎12 - auto-fit and auto-fill/auto-fit-and-auto-fill-START.html

+2-2
Original file line numberDiff line numberDiff line change
@@ -5,7 +5,7 @@
55
<meta charset="UTF-8">
66
<meta name="viewport" content="width=device-width, initial-scale=1.0">
77
<link rel="stylesheet" href="../assets/style.css">
8-
<title>auto-fit and auto-fill</title>
8+
<title>auto-fit and auto-fill!</title>
99
</head>
1010

1111
<body>
@@ -41,4 +41,4 @@
4141
</style>
4242
</body>
4343

44-
</html>
44+
</html>

‎13 - Using minmax() for Responsive Grids/minmax-FINISHED.html

+1-1
Original file line numberDiff line numberDiff line change
@@ -5,7 +5,7 @@
55
<meta charset="UTF-8">
66
<meta name="viewport" content="width=device-width, initial-scale=1.0">
77
<link rel="stylesheet" href="../assets/style.css">
8-
<title>CSS Grid minmax()</title>
8+
<title>Using minmax() for Responsive Grids!</title>
99
</head>
1010

1111
<body>

‎13 - Using minmax() for Responsive Grids/minmax-START.html

+1-1
Original file line numberDiff line numberDiff line change
@@ -5,7 +5,7 @@
55
<meta charset="UTF-8">
66
<meta name="viewport" content="width=device-width, initial-scale=1.0">
77
<link rel="stylesheet" href="../assets/style.css">
8-
<title>CSS Grid minmax()</title>
8+
<title>Using minmax() for Responsive Grids!</title>
99
</head>
1010

1111
<body>

‎14 - Grid Template Areas/area-line-names-FINISHED.html

+1-2
Original file line numberDiff line numberDiff line change
@@ -5,7 +5,7 @@
55
<meta charset="UTF-8">
66
<meta name="viewport" content="width=device-width, initial-scale=1.0">
77
<link rel="stylesheet" href="../assets/style.css">
8-
<title>Line Names from Grid Areas</title>
8+
<title>Grid Template Areas: Line Names from Grid Areas!</title>
99
</head>
1010

1111
<body>
@@ -57,7 +57,6 @@
5757
grid-column: 💩-start / 🍔-end;
5858
grid-row-end: 💩-end;
5959
}
60-
6160
</style>
6261
</body>
6362

‎14 - Grid Template Areas/area-line-names-START.html

+1-2
Original file line numberDiff line numberDiff line change
@@ -5,7 +5,7 @@
55
<meta charset="UTF-8">
66
<meta name="viewport" content="width=device-width, initial-scale=1.0">
77
<link rel="stylesheet" href="../assets/style.css">
8-
<title>Line Names from Grid Areas</title>
8+
<title>Grid Template Areas: Line Names from Grid Areas!</title>
99
</head>
1010

1111
<body>
@@ -47,7 +47,6 @@
4747
display: grid;
4848
grid-gap: 20px;
4949
}
50-
5150
</style>
5251
</body>
5352

‎14 - Grid Template Areas/areas-FINISHED.html

+7-5
Original file line numberDiff line numberDiff line change
@@ -5,7 +5,7 @@
55
<meta charset="UTF-8">
66
<meta name="viewport" content="width=device-width, initial-scale=1.0">
77
<link rel="stylesheet" href="../assets/style.css">
8-
<title>CSS Grid Template Areas</title>
8+
<title>Grid Template Areas</title>
99
</head>
1010

1111
<body>
@@ -44,22 +44,24 @@
4444
.item1 {
4545
grid-area: sidebar-1;
4646
}
47+
4748
.item2 {
4849
grid-area: content;
4950
}
51+
5052
.item3 {
5153
grid-area: sidebar-2;
5254
}
5355

5456
@media (max-width: 700px) {
5557
.container {
5658
grid-template-areas:
57-
"content content content"
58-
"sidebar-1 sidebar-1 sidebar-2"
59-
"footer footer footer"
59+
"content content content"
60+
"sidebar-1 sidebar-1 sidebar-2"
61+
"footer footer footer"
6062
}
6163
}
6264
</style>
6365
</body>
6466

65-
</html>
67+
</html>

‎14 - Grid Template Areas/areas-START.html

+2-3
Original file line numberDiff line numberDiff line change
@@ -5,7 +5,7 @@
55
<meta charset="UTF-8">
66
<meta name="viewport" content="width=device-width, initial-scale=1.0">
77
<link rel="stylesheet" href="../assets/style.css">
8-
<title>CSS Grid Template Areas</title>
8+
<title>Grid Template Areas</title>
99
</head>
1010

1111
<body>
@@ -30,8 +30,7 @@
3030
display: grid;
3131
grid-gap: 20px;
3232
}
33-
3433
</style>
3534
</body>
3635

37-
</html>
36+
</html>

‎14 - Grid Template Areas/areas.html

-40
This file was deleted.

‎15 - Naming Lines in CSS Grid/naming-lines-FINISHED.html

+2-5
Original file line numberDiff line numberDiff line change
@@ -5,7 +5,7 @@
55
<meta charset="UTF-8">
66
<meta name="viewport" content="width=device-width, initial-scale=1.0">
77
<link rel="stylesheet" href="../assets/style.css">
8-
<title>Explicit Line Names</title>
8+
<title>Naming Lines in CSS Grid!</title>
99
</head>
1010

1111
<body>
@@ -46,8 +46,7 @@
4646
.container {
4747
display: grid;
4848
grid-gap: 20px;
49-
grid-template-columns:
50-
[sidebar-start site-left] 1fr [sidebar-end content-start] 500px [content-end] 1fr [site-right];
49+
grid-template-columns: [sidebar-start site-left] 1fr [sidebar-end content-start] 500px [content-end] 1fr [site-right];
5150
grid-template-rows: [content-top] repeat(10, auto) [content-bottom];
5251
}
5352

@@ -57,8 +56,6 @@
5756
grid-row: content-top / content-bottom;
5857
/* grid-row: 1 / span 10; */
5958
}
60-
61-
6259
</style>
6360
</body>
6461

‎15 - Naming Lines in CSS Grid/naming-lines-START.html

+2-4
Original file line numberDiff line numberDiff line change
@@ -5,7 +5,7 @@
55
<meta charset="UTF-8">
66
<meta name="viewport" content="width=device-width, initial-scale=1.0">
77
<link rel="stylesheet" href="../assets/style.css">
8-
<title>Explicit Line Names</title>
8+
<title>Naming Lines in CSS Grid!</title>
99
</head>
1010

1111
<body>
@@ -49,9 +49,7 @@
4949
grid-template-columns: 1fr 500px 1fr;
5050
grid-template-rows: repeat(10, auto);
5151
}
52-
53-
5452
</style>
5553
</body>
5654

57-
</html>
55+
</html>

0 commit comments

Comments
 (0)