From cdce33ac17db5848fc0d6627d6c41dd4c4a1b2cf Mon Sep 17 00:00:00 2001 From: theTrainMan Date: Mon, 30 Nov 2020 18:26:21 +0200 Subject: [PATCH 01/22] First Commit Prepare layout up and until the articles.. --- index.html | 50 ++++++++++++++++++++++++++++++++++++-------------- 1 file changed, 36 insertions(+), 14 deletions(-) diff --git a/index.html b/index.html index 67dfc7f5..286297ff 100644 --- a/index.html +++ b/index.html @@ -1,22 +1,44 @@ - + + - + My Blog - + - - + + + +
+

This is my WebPAge

+

Lorem ipsum dolor sit amet consectetur adipisicing elit. Quaerat ea adipisci earum perferendis officia ex.

+
+

What I sell

+

Lorem ipsum dolor sit amet consectetur adipisicing elit. Sed tempora facere corrupti consectetur ut? Assumenda, maxime dolores. Dolore laborum perspiciatis fugit deleniti laudantium culpa, error, atque magni consectetur nostrum perferendis? +

+ Read more +
+ +
+

Who we Are

+

Lorem ipsum dolor sit amet consectetur adipisicing elit. Sed tempora facere corrupti consectetur ut? Assumenda, maxime dolores. Dolore laborum perspiciatis fugit deleniti laudantium culpa, error, atque magni consectetur nostrum perferendis? +

+ Read more +
+ +
+

Why you must by from us?

+

Lorem ipsum dolor sit amet consectetur adipisicing elit. Sed tempora facere corrupti consectetur ut? Assumenda, maxime dolores. Dolore laborum perspiciatis fugit deleniti laudantium culpa, error, atque magni consectetur nostrum perferendis? +

+ Read more +
+ + +
- - + + + \ No newline at end of file From 90a0f6b53c23b2b6accbbcc8268726d8a01c8a2c Mon Sep 17 00:00:00 2001 From: theTrainMan Date: Mon, 30 Nov 2020 18:26:58 +0200 Subject: [PATCH 02/22] ReadMe File Updated this a little to remind me where I am --- README.md | 2 ++ 1 file changed, 2 insertions(+) diff --git a/README.md b/README.md index 61644f44..347615a7 100644 --- a/README.md +++ b/README.md @@ -15,6 +15,8 @@ It should include the following elements: - The `.html` page and a linked `.css` file applies a consistent color scheme to links and text on your page. - A page header with a title and description for the site. - An articles section with three articles, each including a title, summary and a link. + + - A page footer containing info about you or the site. - Proper use of the semantic HTML tags we discussed. - Research the `:first-child` pseudo-class and use it to style the first article so that it stands out from the others. From c92bcfbb6c078e3f7290843a213b3dcf610bce75 Mon Sep 17 00:00:00 2001 From: theTrainMan Date: Mon, 30 Nov 2020 18:33:01 +0200 Subject: [PATCH 03/22] Layout Changes Completed footer and updated the page with a section div for the the 3 articles --- README.md | 5 +++-- index.html | 14 +++++++++++--- 2 files changed, 14 insertions(+), 5 deletions(-) diff --git a/README.md b/README.md index 347615a7..624824eb 100644 --- a/README.md +++ b/README.md @@ -15,12 +15,13 @@ It should include the following elements: - The `.html` page and a linked `.css` file applies a consistent color scheme to links and text on your page. - A page header with a title and description for the site. - An articles section with three articles, each including a title, summary and a link. +- A page footer containing info about you or the site. -- A page footer containing info about you or the site. -- Proper use of the semantic HTML tags we discussed. - Research the `:first-child` pseudo-class and use it to style the first article so that it stands out from the others. - Use this website [Lorem Ipsum](http://www.lipsum.com/) to generate random blocks of contents to fill your website. + +- Proper use of the semantic HTML tags we discussed. - **Commit often (with good meaningful commit messages), and Push to Github regularly.** - Use the sketch below to guide you towards the layout and content you are trying to achieve. _Please note that this is just a sketch - you can choose the colours, fonts and images that you want to use in the page._ diff --git a/index.html b/index.html index 286297ff..6f581c6f 100644 --- a/index.html +++ b/index.html @@ -14,6 +14,9 @@

This is my WebPAge

Lorem ipsum dolor sit amet consectetur adipisicing elit. Quaerat ea adipisci earum perferendis officia ex.

+
+
+

What I sell

Lorem ipsum dolor sit amet consectetur adipisicing elit. Sed tempora facere corrupti consectetur ut? Assumenda, maxime dolores. Dolore laborum perspiciatis fugit deleniti laudantium culpa, error, atque magni consectetur nostrum perferendis? @@ -27,16 +30,21 @@

Who we Are

Read more
- +

Why you must by from us?

Lorem ipsum dolor sit amet consectetur adipisicing elit. Sed tempora facere corrupti consectetur ut? Assumenda, maxime dolores. Dolore laborum perspiciatis fugit deleniti laudantium culpa, error, atque magni consectetur nostrum perferendis?

Read more
- + +
+
+
+ theTrainMan +
+ - From 53d6a43a4a9a57d712cb0acc44f0a9ec92a5fd94 Mon Sep 17 00:00:00 2001 From: theTrainMan Date: Tue, 1 Dec 2020 07:22:59 +0200 Subject: [PATCH 04/22] Third Save Completed footer and some of the article headers as well as the css for article --- README.md | 3 --- css/style.css | 16 +++++++++++++++- index.html | 10 ++++++---- package-lock.json | 3 +++ 4 files changed, 24 insertions(+), 8 deletions(-) create mode 100644 package-lock.json diff --git a/README.md b/README.md index 624824eb..6b20e29f 100644 --- a/README.md +++ b/README.md @@ -16,11 +16,8 @@ It should include the following elements: - A page header with a title and description for the site. - An articles section with three articles, each including a title, summary and a link. - A page footer containing info about you or the site. - - - Research the `:first-child` pseudo-class and use it to style the first article so that it stands out from the others. - Use this website [Lorem Ipsum](http://www.lipsum.com/) to generate random blocks of contents to fill your website. - - Proper use of the semantic HTML tags we discussed. - **Commit often (with good meaningful commit messages), and Push to Github regularly.** - Use the sketch below to guide you towards the layout and content you are trying to achieve. _Please note that this is just a sketch - you can choose the colours, fonts and images that you want to use in the page._ diff --git a/css/style.css b/css/style.css index 75e9841e..4c3175ae 100644 --- a/css/style.css +++ b/css/style.css @@ -1,3 +1,17 @@ +body { + margin: 0; + padding: 0; + text-align: center; + line-height: 1.2; + font-family: 'Trebuchet MS', 'Lucida Sans Unicode', 'Lucida Grande', 'Lucida Sans', Arial, sans-serif; +} + +article:first-child { + background-color: antiquewhite; + padding: 10px; +} + + /** * Add your custom styles below * @@ -5,4 +19,4 @@ * - Be organised, use comments and separate your styles into meaningful chunks * for example: General styles, Navigation styles, Hero styles, Footer etc. * - */ + */ \ No newline at end of file diff --git a/index.html b/index.html index 6f581c6f..66261a22 100644 --- a/index.html +++ b/index.html @@ -12,11 +12,11 @@
-

This is my WebPAge

-

Lorem ipsum dolor sit amet consectetur adipisicing elit. Quaerat ea adipisci earum perferendis officia ex.

+

This is my WebPAge

+

Lorem ipsum dolor sit amet consectetur adipisicing elit. Quaerat ea adipisci earum perferendis officia ex.

-
+

What I sell

Lorem ipsum dolor sit amet consectetur adipisicing elit. Sed tempora facere corrupti consectetur ut? Assumenda, maxime dolores. Dolore laborum perspiciatis fugit deleniti laudantium culpa, error, atque magni consectetur nostrum perferendis? @@ -38,7 +38,9 @@

Why you must by from us?

Read more
-
+ + +