Skip to content
This repository was archived by the owner on Feb 27, 2023. It is now read-only.

Commit 90a2a17

Browse files
authored
Merge pull request #19 from CodeYourFuture/syllabus_alignment
Align the exercises with updates for scotland's HTML/CSS syllabus
2 parents dd494a9 + 6e7a452 commit 90a2a17

File tree

130 files changed

+391
-223
lines changed

Some content is hidden

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

130 files changed

+391
-223
lines changed

css/week1-conflicting-styles.css

+4
Original file line numberDiff line numberDiff line change
@@ -0,0 +1,4 @@
1+
/** Conflicting styles that require advanced CSS selectors to override */
2+
p {
3+
color: #000;
4+
}

css/week1-pagination.css

+27
Original file line numberDiff line numberDiff line change
@@ -0,0 +1,27 @@
1+
.countries {
2+
margin: 0;
3+
padding: 1rem;
4+
list-style: none;
5+
border-bottom: 1px solid #bbb;
6+
}
7+
8+
.country {
9+
margin: 1px 0;
10+
padding: 0.5rem;
11+
background: #fff;
12+
border: 1px solid rgba(0,0,0,0.2);
13+
}
14+
15+
.pages {
16+
margin-left: 0.5rem;
17+
}
18+
19+
.pages__page {
20+
text-decoration: none;
21+
}
22+
23+
.pages__showing {
24+
display: inline-block;
25+
padding: 1rem;
26+
float: right;
27+
}

css/week1.css

+6-4
Original file line numberDiff line numberDiff line change
@@ -31,18 +31,15 @@ html {
3131

3232
/* Site title and top navigation */
3333
.site-header {
34-
display: flex;
35-
justify-content: space-between;
36-
align-items: center;
3734
padding: 0.5rem 1rem;
38-
color: rgba(255,255,255,0.9);
3935
background: #4491db;
4036
border-top-left-radius: 3px;
4137
border-top-right-radius: 3px;
4238
}
4339

4440
.site-header__title {
4541
margin: 0;
42+
color: rgba(255,255,255,0.9);
4643
font-size: 18px;
4744
font-weight: 700;
4845
}
@@ -75,3 +72,8 @@ html {
7572
box-shadow: 0 2px 2px rgba(0,0,0,0.1);
7673
background: #fff;
7774
}
75+
76+
/* Site footer area */
77+
.site-footer {
78+
padding: 0.5rem 1rem;
79+
}

css/week2-nav-menu.css

+78
Original file line numberDiff line numberDiff line change
@@ -0,0 +1,78 @@
1+
body,
2+
html {
3+
background: #25262f;
4+
font-family: -apple-system, BlinkMacSystemFont, "Segoe UI", "Roboto", "Oxygen-Sans", "Ubuntu", "Cantarell", "Helvetica Neue", sans-serif;
5+
font-size: 16px;
6+
line-height: 1.5em;
7+
}
8+
9+
.site-wrapper {
10+
max-width: 1200px;
11+
width: 90%;
12+
margin-top: 2vh;
13+
margin-left: auto;
14+
margin-right: auto;
15+
background: #fff;
16+
border-radius: 3px;
17+
box-shadow: 0 2px 2px rgba(0,0,0,0.1);
18+
}
19+
20+
.site-header {
21+
position: relative;
22+
top: -1px;
23+
padding-top: 1px;
24+
}
25+
26+
.site-header__logo {
27+
display: block;
28+
margin: 1rem;
29+
width: 50px;
30+
height: auto;
31+
}
32+
33+
.site-header__nav {
34+
margin: 1rem 0.5rem;
35+
}
36+
37+
.site-header__navItem {
38+
display: block;
39+
padding: 0.25em 0.5em;
40+
font-weight: bold;
41+
text-decoration: none;
42+
text-transform: uppercase;
43+
color: #007ab2;
44+
border: 1px solid transparent;
45+
border-radius: 3px;
46+
}
47+
48+
.site-header__navItem:focus,
49+
.site-header__navItem:hover {
50+
border: 1px solid #007ab2;
51+
outline: 0;
52+
}
53+
54+
.site-header__navItem--highlighted {
55+
color: #d00a6c;
56+
}
57+
58+
.site-header__navItem--highlighted:hover,
59+
.site-header__navItem--highlighted:focus {
60+
border-color: #d00a6c;
61+
}
62+
63+
.site-header__checkout {
64+
display: inline-block;
65+
margin: 0.5rem;
66+
padding: 0.5em 1em;
67+
border: 1px solid #007ab2;
68+
border-radius: 3px;
69+
background: #007ab2;
70+
color: #fff;
71+
text-decoration: none;
72+
}
73+
74+
.site-header__checkout:focus,
75+
.site-header__checkout:hover {
76+
background: #009cd4;
77+
outline: 0;
78+
}

images/10/solution-1.png

-4.09 KB
Binary file not shown.

images/10/solution-2.png

-5.97 KB
Binary file not shown.

images/10/solution-3.png

-6 KB
Binary file not shown.
File renamed without changes.
File renamed without changes.

images/11/solution-1.png

99 Bytes

images/11/solution-2.png

2.32 KB

images/11/solution-3.png

-827 Bytes

images/11/solution-4.png

-6.78 KB
Binary file not shown.
File renamed without changes.
File renamed without changes.

images/12/solution-1.png

-1.9 KB

images/12/solution-2.png

-2.15 KB

images/12/solution-3.png

-458 Bytes

images/12/solution-4.png

-1.14 KB
File renamed without changes.
File renamed without changes.

images/13/solution-1.png

1.89 KB

images/13/solution-2.png

1.78 KB

images/13/solution-3.png

3.21 KB

images/13/solution-4.png

7.92 KB
File renamed without changes.

images/14/solution-1.png

-7 KB

images/14/solution-2.png

-2.75 KB

images/14/solution-3.png

-2.67 KB

images/14/solution-4.png

-7.41 KB
Binary file not shown.
File renamed without changes.

images/15/solution-1.png

5.05 KB

images/15/solution-2.png

867 Bytes

images/15/solution-3.png

357 Bytes

images/15/solution-4.png

-190 Bytes

images/16/solution-1.png

5.95 KB

images/16/solution-2.png

5.92 KB

images/16/solution-3.png

6.37 KB

images/16/solution-4.png

7.6 KB
File renamed without changes.

images/17/solution.gif

2.05 MB
File renamed without changes.
File renamed without changes.
File renamed without changes.
File renamed without changes.
File renamed without changes.
File renamed without changes.
File renamed without changes.
File renamed without changes.
File renamed without changes.
File renamed without changes.
File renamed without changes.
File renamed without changes.
File renamed without changes.
File renamed without changes.

images/7-box-model.png

-9.45 KB
Binary file not shown.

images/7-position.png

-13.9 KB
Binary file not shown.

images/7/countries.png

5.38 KB

images/8/solution.png

26.4 KB
File renamed without changes.

images/sample-logo.png

3.5 KB

package.json

+20-19
Original file line numberDiff line numberDiff line change
@@ -12,25 +12,26 @@
1212
"5": "live-server --open=week-1/5-css-selectors",
1313
"6": "live-server --open=week-1/6-css-properties",
1414
"7": "live-server --open=week-1/7-css-box",
15-
"8": "live-server --open=week-1/8-git-branch",
16-
"9": "live-server --open=week-2/9-media-queries",
17-
"10": "live-server --open=week-2/10-flexbox",
18-
"11": "live-server --open=week-2/11-justify-content",
19-
"12": "live-server --open=week-2/12-align-items",
20-
"13": "live-server --open=week-2/13-order",
21-
"14": "live-server --open=week-2/14-align-self",
22-
"15": "live-server --open=week-2/15-more-flexbox",
23-
"16": "live-server --open=week-2/16-git-merge",
24-
"17": "live-server --open=week-3/17-search",
25-
"18": "live-server --open=week-3/18-labels",
26-
"19": "live-server --open=week-3/19-buttons",
27-
"20": "live-server --open=week-3/20-checkout",
28-
"21": "live-server --open=week-3/21-comments",
29-
"22": "live-server --open=week-3/22-dietary",
30-
"23": "live-server --open=week-3/23-shirt-size",
31-
"24": "live-server --open=week-3/24-checkout-groups",
32-
"25": "live-server --open=week-3/25-attributes",
33-
"27": "live-server --open=week-3/27-user-experience",
15+
"8": "live-server --open=week-1/8-advanced-selectors",
16+
"9": "live-server --open=week-1/9-git-branch",
17+
"10": "live-server --open=week-2/10-media-queries",
18+
"11": "live-server --open=week-2/11-flexbox",
19+
"12": "live-server --open=week-2/12-justify-content",
20+
"13": "live-server --open=week-2/13-align-items",
21+
"14": "live-server --open=week-2/14-order",
22+
"15": "live-server --open=week-2/15-align-self",
23+
"16": "live-server --open=week-2/16-more-flexbox",
24+
"17": "live-server --open=week-2/17-nav-menu",
25+
"18": "live-server --open=week-2/18-git-merge",
26+
"19": "live-server --open=week-3/19-search",
27+
"20": "live-server --open=week-3/20-labels",
28+
"21": "live-server --open=week-3/21-buttons",
29+
"22": "live-server --open=week-3/22-checkout",
30+
"23": "live-server --open=week-3/23-comments",
31+
"24": "live-server --open=week-3/24-dietary",
32+
"25": "live-server --open=week-3/25-shirt-size",
33+
"26": "live-server --open=week-3/26-checkout-groups",
34+
"27": "live-server --open=week-3/27-attributes",
3435
"28": "live-server --open=week-3/28-git-conflict",
3536
"29": "live-server --open=week-3/29-combined-skills",
3637
"serve": "live-server"

readme.md

+1-1

week-1/1-parent-child/index.html

+1
Original file line numberDiff line numberDiff line change
@@ -4,6 +4,7 @@
44
<head>
55
<meta charset="utf-8">
66
<title>1. Parent-Child Relationships - HTML, CSS and Git Exercises</title>
7+
<meta name="viewport" content="width=device-width, initial-scale=1">
78
<link rel="stylesheet" href="/css/normalize.css">
89
<link rel="stylesheet" href="/css/week1.css">
910
<link rel="stylesheet" href="/css/message-child-selectors.css">

week-1/1-parent-child/readme.md

-45

week-1/2-html-attributes/index.html

+1
Original file line numberDiff line numberDiff line change
@@ -4,6 +4,7 @@
44
<head>
55
<meta charset="utf-8">
66
<title>2. HTML Attributes - HTML, CSS and Git Exercises</title>
7+
<meta name="viewport" content="width=device-width, initial-scale=1">
78
<link rel="stylesheet" href="/css/normalize.css">
89
<link rel="stylesheet" href="/css/week1.css">
910
<link rel="stylesheet" href="/css/message.css">

week-1/3-semantic-html/index.html

+1
Original file line numberDiff line numberDiff line change
@@ -4,6 +4,7 @@
44
<head>
55
<meta charset="utf-8">
66
<title>3. Semantic HTML - HTML, CSS and Git Exercises</title>
7+
<meta name="viewport" content="width=device-width, initial-scale=1">
78
<link rel="stylesheet" href="/css/normalize.css">
89
<link rel="stylesheet" href="/css/week1.css">
910
<link rel="stylesheet" href="/css/message.css">

week-1/3-semantic-html/readme.md

+1-1

week-1/4-links-scripts/index.html

+1
Original file line numberDiff line numberDiff line change
@@ -4,6 +4,7 @@
44
<head>
55
<meta charset="utf-8">
66
<title>4. Adding Links and Scripts - HTML, CSS and Git Exercises</title>
7+
<meta name="viewport" content="width=device-width, initial-scale=1">
78
</head>
89

910
<body>

week-1/5-css-selectors/index.html

+2
Original file line numberDiff line numberDiff line change
@@ -4,10 +4,12 @@
44
<head>
55
<meta charset="utf-8">
66
<title>5. CSS Selectors - HTML, CSS and Git Exercises</title>
7+
<meta name="viewport" content="width=device-width, initial-scale=1">
78
<link rel="stylesheet" href="/css/normalize.css">
89
<link rel="stylesheet" href="/css/week1.css">
910
<link rel="stylesheet" href="/css/message.css">
1011
<link rel="stylesheet" href="/css/message-css-selectors.css">
12+
<link rel="stylesheet" href="message-backgrounds.css">
1113
</head>
1214

1315
<body>

week-1/6-css-properties/index.html

+1
Original file line numberDiff line numberDiff line change
@@ -4,6 +4,7 @@
44
<head>
55
<meta charset="utf-8">
66
<title>6. CSS Properties - HTML, CSS and Git Exercises</title>
7+
<meta name="viewport" content="width=device-width, initial-scale=1">
78
<link rel="stylesheet" href="/css/normalize.css">
89
<link rel="stylesheet" href="/css/week1.css">
910
<link rel="stylesheet" href="/css/message.css">

week-1/7-css-box/index.html

+23-41
Original file line numberDiff line numberDiff line change
@@ -2,53 +2,35 @@
22
<html lang="en">
33

44
<head>
5-
<meta charset="utf-8">
6-
<title>7. CSS Box Model - HTML, CSS and Git Exercises</title>
7-
<link rel="stylesheet" href="/css/normalize.css">
5+
<meta charset="utf-8">
6+
<title>7. CSS Box Model - HTML, CSS and Git Exercises</title>
7+
<link rel="stylesheet" href="/css/normalize.css">
88
<link rel="stylesheet" href="/css/week1.css">
9-
<link rel="stylesheet" href="/css/message.css">
9+
<link rel="stylesheet" href="/css/week1-pagination.css">
1010
<link rel="stylesheet" href="styles.css">
1111
</head>
1212

1313
<body>
14-
<div class="site-wrapper">
15-
<div class="site-header">
16-
<div class="site-header__title">Messages</div>
17-
</div>
18-
<div class="numbers">
19-
<div class="number">1</div>
20-
<div class="number">2</div>
21-
<div class="number">3</div>
22-
<div class="number">4</div>
23-
</div>
24-
<div class="messages">
25-
<div class="message">
26-
<div class="message__author">Won</div>
27-
<p class="message__content">
28-
Where should we meet tomorrrow?
29-
</p>
30-
<time class="message__time message__time--old">Yesterday, 7:25pm</time>
31-
</div>
32-
<div class="message">
33-
<div class="message__author">Luke</div>
34-
<p class="message__content">
35-
Let's meet at the iCafe in Merchant City.
36-
<a href="https://goo.gl/maps/aza4h9nUBhn" class="link link--map">
37-
https://goo.gl/maps/aza4h9nUBhn
38-
</a>
39-
</p>
40-
<time class="message__time">7:35pm</time>
41-
</div>
42-
<div class="message message--unread">
43-
<div class="message__author">Won</div>
44-
<p class="message__content">
45-
Ok!
46-
<a href="https://media.giphy.com/media/l41K4KlVE8dgozf8I/giphy.gif" class="link link--gif">https://media.giphy.com/media/l41K4KlVE8dgozf8I/giphy.gif</a>
47-
</p>
48-
<time class="message__time">7:38pm</time>
49-
</div>
14+
<div class="site-wrapper">
15+
<div class="site-header">
16+
<div class="site-header__title">Countries</div>
5017
</div>
51-
</div>
18+
<ul class="countries">
19+
<li class="country">Afghanistan</li>
20+
<li class="country">Albania</li>
21+
<li class="country">Algeria</li>
22+
<li class="country">Andorra</li>
23+
<li class="country">Angola</li>
24+
</ul>
25+
<div class="pages">
26+
<a href="#" class="pages__page">1</a>
27+
<a href="#" class="pages__page">2</a>
28+
<a href="#" class="pages__page">3</a>
29+
<span class="pages__separator">...</span>
30+
<a href="#" class="pages__page">38</a>
31+
<span class="pages__showing">Showing 5 of 190</span>
32+
</div>
33+
</divc>
5234
</body>
5335

5436
</html>

0 commit comments

Comments
 (0)