diff --git a/package-lock.json b/package-lock.json index b15084556..8e15d45d4 100644 --- a/package-lock.json +++ b/package-lock.json @@ -768,7 +768,8 @@ "ansi-regex": { "version": "2.1.1", "bundled": true, - "dev": true + "dev": true, + "optional": true }, "aproba": { "version": "1.2.0", @@ -789,12 +790,14 @@ "balanced-match": { "version": "1.0.0", "bundled": true, - "dev": true + "dev": true, + "optional": true }, "brace-expansion": { "version": "1.1.11", "bundled": true, "dev": true, + "optional": true, "requires": { "balanced-match": "^1.0.0", "concat-map": "0.0.1" @@ -809,17 +812,20 @@ "code-point-at": { "version": "1.1.0", "bundled": true, - "dev": true + "dev": true, + "optional": true }, "concat-map": { "version": "0.0.1", "bundled": true, - "dev": true + "dev": true, + "optional": true }, "console-control-strings": { "version": "1.1.0", "bundled": true, - "dev": true + "dev": true, + "optional": true }, "core-util-is": { "version": "1.0.2", @@ -936,7 +942,8 @@ "inherits": { "version": "2.0.3", "bundled": true, - "dev": true + "dev": true, + "optional": true }, "ini": { "version": "1.3.5", @@ -948,6 +955,7 @@ "version": "1.0.0", "bundled": true, "dev": true, + "optional": true, "requires": { "number-is-nan": "^1.0.0" } @@ -962,6 +970,7 @@ "version": "3.0.4", "bundled": true, "dev": true, + "optional": true, "requires": { "brace-expansion": "^1.1.7" } @@ -969,12 +978,14 @@ "minimist": { "version": "0.0.8", "bundled": true, - "dev": true + "dev": true, + "optional": true }, "minipass": { "version": "2.2.4", "bundled": true, "dev": true, + "optional": true, "requires": { "safe-buffer": "^5.1.1", "yallist": "^3.0.0" @@ -993,6 +1004,7 @@ "version": "0.5.1", "bundled": true, "dev": true, + "optional": true, "requires": { "minimist": "0.0.8" } @@ -1073,7 +1085,8 @@ "number-is-nan": { "version": "1.0.1", "bundled": true, - "dev": true + "dev": true, + "optional": true }, "object-assign": { "version": "4.1.1", @@ -1085,6 +1098,7 @@ "version": "1.4.0", "bundled": true, "dev": true, + "optional": true, "requires": { "wrappy": "1" } @@ -1170,7 +1184,8 @@ "safe-buffer": { "version": "5.1.1", "bundled": true, - "dev": true + "dev": true, + "optional": true }, "safer-buffer": { "version": "2.1.2", @@ -1206,6 +1221,7 @@ "version": "1.0.2", "bundled": true, "dev": true, + "optional": true, "requires": { "code-point-at": "^1.0.0", "is-fullwidth-code-point": "^1.0.0", @@ -1225,6 +1241,7 @@ "version": "3.0.1", "bundled": true, "dev": true, + "optional": true, "requires": { "ansi-regex": "^2.0.0" } @@ -1268,12 +1285,14 @@ "wrappy": { "version": "1.0.2", "bundled": true, - "dev": true + "dev": true, + "optional": true }, "yallist": { "version": "3.0.2", "bundled": true, - "dev": true + "dev": true, + "optional": true } } }, diff --git a/week-1/1-parent-child/index.html b/week-1/1-parent-child/index.html index 458a4cb21..b2b0061ed 100644 --- a/week-1/1-parent-child/index.html +++ b/week-1/1-parent-child/index.html @@ -8,7 +8,6 @@ -
Habiba

I can meet on Tuesday and Wednesday after 4.

+
diff --git a/week-1/2-html-attributes/index.html b/week-1/2-html-attributes/index.html index dc861fa4f..f12141a4f 100644 --- a/week-1/2-html-attributes/index.html +++ b/week-1/2-html-attributes/index.html @@ -2,39 +2,43 @@ - 2. HTML Attributes - HTML, CSS and Git Exercises + 3. Semantic HTML - HTML, CSS and Git Exercises + -
- -
-
+ + +
+
Won

Where should we meet later?

- 7:25pm -
-
+ + +
Luke

- Let's meet at the iCafe in Merchant City. https://goo.gl/maps/aza4h9nUBhn + Let's meet at the iCafe in Merchant City.

- 7:35pm -
-
+ + +
Won

- Ok! https://media.giphy.com/media/l41K4KlVE8dgozf8I/giphy.gif + Ok!

- 7:38pm -
+ +
+
+ diff --git a/week-1/3-semantic-html/index.html b/week-1/3-semantic-html/index.html index 3640deaff..9215a6d33 100644 --- a/week-1/3-semantic-html/index.html +++ b/week-1/3-semantic-html/index.html @@ -12,29 +12,30 @@
- -
-
+
+
Won

Where should we meet later?

- Mar 25, 2018 7:25pm -
-
+ + +
Luke

Let's meet at the iCafe in Merchant City. https://goo.gl/maps/aza4h9nUBhn

- Mar 25, 2018 7:35pm -
-
+ + +
Won

Ok! https://media.giphy.com/media/l41K4KlVE8dgozf8I/giphy.gif

- Mar 25, 2018 7:38pm -
+ +
diff --git a/week-1/4-links-scripts/index.html b/week-1/4-links-scripts/index.html index 303c7fbd2..a8221d3dc 100644 --- a/week-1/4-links-scripts/index.html +++ b/week-1/4-links-scripts/index.html @@ -4,6 +4,7 @@ 4. Adding Links and Scripts - HTML, CSS and Git Exercises + @@ -33,5 +34,6 @@ + diff --git a/week-1/5-css-selectors/message-backgrounds.css b/week-1/5-css-selectors/message-backgrounds.css index ffe483325..a8f3a711c 100644 --- a/week-1/5-css-selectors/message-backgrounds.css +++ b/week-1/5-css-selectors/message-backgrounds.css @@ -1 +1,10 @@ /* Add your CSS code below */ +#first-message { + background-color: red; +} +article { + background-color: cadetblue; +} +.message--latest { + background-color: yellow; +} diff --git a/week-1/6-css-properties/styles.css b/week-1/6-css-properties/styles.css index ffe483325..446103d1c 100644 --- a/week-1/6-css-properties/styles.css +++ b/week-1/6-css-properties/styles.css @@ -1 +1,20 @@ /* Add your CSS code below */ +a { + color: red; + font-weight: bold; + text-decoration: none; +} + +.message__time { + font-size: 0.9rem; +} +.message { + opacity: 0.3; +} +.p { + line-height: 200%; +} +.message--unread { + border-left: 5px solid blue; + opacity: 1; +} diff --git a/week-1/7-css-box/styles.css b/week-1/7-css-box/styles.css index 013b94f1e..5b1cc302b 100644 --- a/week-1/7-css-box/styles.css +++ b/week-1/7-css-box/styles.css @@ -1,6 +1,10 @@ /* Try different box model properties below */ .pages__page { - border: 1px solid #4491db; - border-radius: 4px; + border: 1px solid gray; + border-radius: 46px; background: #fff; + width: 300npx; + line-height: 55px; + border: 1px solid red; + padding: 15px 220px; } diff --git a/week-1/8-advanced-selectors/styles.css b/week-1/8-advanced-selectors/styles.css index d35c3c371..e63bf3e29 100644 --- a/week-1/8-advanced-selectors/styles.css +++ b/week-1/8-advanced-selectors/styles.css @@ -1 +1,12 @@ /* Try different box model properties below */ +.site-header p { + color: white; + margin-bottom: 0; +} +.site-footer { + font-size: 12px; + text-align: center; +} +.message--unread { + box-shadow: 4px 4px 0 #dba944; +} diff --git a/week-1/9-git-branch/styles.css b/week-1/9-git-branch/styles.css index 0051cdbaf..bc4104b39 100644 --- a/week-1/9-git-branch/styles.css +++ b/week-1/9-git-branch/styles.css @@ -1,6 +1,6 @@ /* Add your own CSS code below */ .link { - color: #4491db; + color: green; font-weight: 700; text-decoration: none; } diff --git a/week-2/10-media-queries/columns.css b/week-2/10-media-queries/columns.css index 43e80d23c..ab45821df 100644 --- a/week-2/10-media-queries/columns.css +++ b/week-2/10-media-queries/columns.css @@ -1 +1,12 @@ /* Add your own CSS code below */ +@media screen and (min-width: 768px) { + .countries { + columns: 2; + } +} + +@media screen and (min-width: 1200px) { + .countries { + columns: 3; + } +} diff --git a/week-2/11-flexbox/flexbox.css b/week-2/11-flexbox/flexbox.css index 43e80d23c..68b9ec2d9 100644 --- a/week-2/11-flexbox/flexbox.css +++ b/week-2/11-flexbox/flexbox.css @@ -1 +1,10 @@ /* Add your own CSS code below */ +.countries--first { + display: flex; + flex-direction: row; + justify-content: flex-end; +} +.countries--second { + display: flex; + flex-direction: column; +} diff --git a/week-2/12-justify-content/flexbox.css b/week-2/12-justify-content/flexbox.css index 3c4c7ff18..b0bd640a6 100644 --- a/week-2/12-justify-content/flexbox.css +++ b/week-2/12-justify-content/flexbox.css @@ -1,9 +1,29 @@ .countries { display: flex; -} - -.countries--second .country { - padding: 0.5em; + font-family: Arial, Helvetica, sans-serif; } /* Add your own CSS code below */ + +.countries--first { + padding: 15px 15px 15px 0px; + justify-content: flex-end; +} +.countries--second { + padding: 25px 25px 25px 25px; + justify-content: space-around; + flex-direction: row; +} +.countries--third { + padding: 15px 15px 15px 15px; + display: flex; + flex-direction: column; + width: 500px; + align-items: stretch; +} +.countries--fourth { + padding: 30px 20px 30px 20px; + flex-direction: column-reverse; + justify-content: space-between; + width: 500px; +} diff --git a/week-2/13-align-items/flexbox.css b/week-2/13-align-items/flexbox.css index 3675a0df3..24245f487 100644 --- a/week-2/13-align-items/flexbox.css +++ b/week-2/13-align-items/flexbox.css @@ -1,4 +1,29 @@ .countries { display: flex; + font-family: Arial, Helvetica, sans-serif; + font-weight: lighter; } /* Add your own CSS code below */ + +.countries--first { + align-items: center; + padding: 30px 50px 30px 20px; + width: 500px; +} +.countries--second { + align-items: flex-end; + padding: 15px 15px 15px 60px; + flex-direction: row-reverse; + width: 500px; +} +.countries--third { + align-items: flex-end; + flex-direction: column; + justify-content: baseline; + width: 500px; +} +.countries--fourth { + align-items: center; + flex-direction: column-reverse; + width: 500px; +} diff --git a/week-2/14-order/flexbox.css b/week-2/14-order/flexbox.css index ed621b793..4c93a1a75 100644 --- a/week-2/14-order/flexbox.css +++ b/week-2/14-order/flexbox.css @@ -1,5 +1,57 @@ .countries { display: flex; + font-family: Arial, Helvetica, sans-serif; } /* Add your own CSS code below */ + +.countries--first { + flex-direction: row; +} +.countries--first .country--brazil { + order: 4; +} +.countries--first .country--croatia { + order: 0; +} +.countries--first .country--ethiopia { + order: 0; +} +.countries--first .country--laos { + order: 0; +} +.countries--first.country--uganda { + order: 0; +} + +.countries--second .country--brazil { + order: 3; +} +.countries--second .country--croatia { + order: 0; +} +.countries--second .country--ethiopia { + order: 0; +} +.countries--second .country--laos { + order: 0; +} +.countries--second .country--uganda { + order: 4; +} + +.countries--third .country--brazil { + order: 5; +} +.countries--third .country--croatia { + order: 4; +} +.countries--third .country--ethiopia { + order: 3; +} +.countries--third .country--laos { + order: 2; +} +.countries--third .country--uganda { + order: 0; +} diff --git a/week-2/15-align-self/flexbox.css b/week-2/15-align-self/flexbox.css index ed621b793..a7c7fffc3 100644 --- a/week-2/15-align-self/flexbox.css +++ b/week-2/15-align-self/flexbox.css @@ -1,5 +1,43 @@ .countries { display: flex; + font-family: Arial, Helvetica, sans-serif; } /* Add your own CSS code below */ + +.countries--first .country--ethiopia { + align-self: flex-end; +} +.countries--first { + width: 500px; +} + +.countries--second { + width: 500px; + flex-direction: row; + align-items: center; +} + +.countries--second .country--ethiopia { + align-self: flex-end; +} + +.countries--third { + width: 500px; + flex-direction: row; + align-items: flex-end; +} +.countries--third .country--brazil { + align-self: flex-start; +} +.countries--third .country--uganda { + align-self: flex-start; +} +.countries--fourth { + width: 550px; + flex-direction: column; + align-items: flex-start; +} +.countries--fourth .country--uganda { + align-self: center; +} diff --git a/week-2/16-more-flexbox/flexbox.css b/week-2/16-more-flexbox/flexbox.css index ed621b793..d9f540cdd 100644 --- a/week-2/16-more-flexbox/flexbox.css +++ b/week-2/16-more-flexbox/flexbox.css @@ -1,5 +1,72 @@ .countries { display: flex; + font-family: Arial, Helvetica, sans-serif; } /* Add your own CSS code below */ + +.countries--first { + flex-direction: row; + align-items: flex-end; + justify-content: flex-end; + width: 68%; +} +.countries--second { + flex-direction: row; + align-items: flex-end; + justify-content: center; + width: 68%; +} +.countries--second .country--brazil { + order: 5; +} +.countries--second .country--croatia { + order: 4; +} +.countries--second .country--ethiopia { + order: 3; +} +.countries--second .country--laos { + order: 1; +} + +.countries--third { + flex-direction: row; + align-items: flex-start; + justify-content: center; + width: 68%; +} +.countries--third .country--brazil { + align-self: flex-end; +} + +.countries--fourth { + flex-direction: column; + align-items: flex-end; + justify-content: center; + width: 565px; +} +.countries--fourth .country--ethiopia { + align-self: center; +} +.countries--fourth .country--laos { + align-self: center; +} +.countries--fifth { + flex-direction: column; + align-items: flex-end; + justify-content: space-between; + width: 565px; +} +.countries--fifth .country--brazil { + order: 5; +} +.countries--fifth .country--croatia { + order: 4; +} +.countries--fifth .country--ethiopia { + order: 3; +} +.countries--fifth .country--uganda { + align-self: center; +} diff --git a/week-2/18-git-merge/styles.css b/week-2/18-git-merge/styles.css index 0051cdbaf..af46a4f77 100644 --- a/week-2/18-git-merge/styles.css +++ b/week-2/18-git-merge/styles.css @@ -1,6 +1,6 @@ /* Add your own CSS code below */ .link { - color: #4491db; + color: orangered; font-weight: 700; text-decoration: none; }