From 02d43bc65532ceea5150bcfdb7210f71fc8592b6 Mon Sep 17 00:00:00 2001 From: Zen McMillan Date: Sat, 26 Aug 2023 17:54:52 -0600 Subject: [PATCH 1/6] Add navigation bar to page --- dist/index.html | 24 ++++++++++++++++++++++++ 1 file changed, 24 insertions(+) diff --git a/dist/index.html b/dist/index.html index 630ecfc1c1..4fa2c51c49 100644 --- a/dist/index.html +++ b/dist/index.html @@ -1,11 +1,35 @@ + Whats Cookin

Whats Cookin

+ +

Categories

+ From ad7201452435ae8fba8ca89adb340facbfa2177d Mon Sep 17 00:00:00 2001 From: Zen McMillan Date: Sat, 26 Aug 2023 19:54:53 -0600 Subject: [PATCH 2/6] Create CSS file in dist directory --- dist/bundle.js | 4 ++-- dist/index.html | 7 ++++++- dist/styles.css | 9 +++++++++ src/styles.css | 8 +++++--- 4 files changed, 22 insertions(+), 6 deletions(-) create mode 100644 dist/styles.css diff --git a/dist/bundle.js b/dist/bundle.js index 66bfcbdd3b..081fe10cfd 100644 --- a/dist/bundle.js +++ b/dist/bundle.js @@ -1,8 +1,8 @@ /******/ (() => { // webpackBootstrap - var __webpack_exports__ = {}; - alert('hello') + // var __webpack_exports__ = {}; + // alert('hello') /******/ })() ; \ No newline at end of file diff --git a/dist/index.html b/dist/index.html index 4fa2c51c49..834236b3ef 100644 --- a/dist/index.html +++ b/dist/index.html @@ -1,11 +1,16 @@ - + + + + + Whats Cookin +

Whats Cookin

Categories

diff --git a/dist/styles.css b/dist/styles.css new file mode 100644 index 0000000000..08002945a4 --- /dev/null +++ b/dist/styles.css @@ -0,0 +1,9 @@ +* { + background-color: #E7F1F1; +} + +body { + display: flex; + flex-direction: column; + align-items: center; +} \ No newline at end of file diff --git a/src/styles.css b/src/styles.css index 2c4cbd7128..e40807dd04 100644 --- a/src/styles.css +++ b/src/styles.css @@ -1,3 +1,5 @@ -body { - background-color: blueviolet; -} \ No newline at end of file +* { + background-color: #E7F1F1; + font-size: 35px; +} + From bd3812784c398e44c6eaf11f930590d4e7d7f5ac Mon Sep 17 00:00:00 2001 From: Zen McMillan Date: Sat, 26 Aug 2023 21:44:28 -0600 Subject: [PATCH 3/6] Style the header and navigation bar --- dist/index.html | 60 ++++++++++++++++++++++++++----------------------- dist/styles.css | 52 +++++++++++++++++++++++++++++++++++++++--- 2 files changed, 81 insertions(+), 31 deletions(-) diff --git a/dist/index.html b/dist/index.html index 834236b3ef..80078259b5 100644 --- a/dist/index.html +++ b/dist/index.html @@ -5,37 +5,41 @@ - - - Whats Cookin + + + + + + What's Cookin' - -

Whats Cookin

- -

Categories

- +

Loaded Chocolate Chip Pudding Cookie Cups

+ +

"Maple Dijon Apple Cider Grilled Pork Chops

+ +

Dirty Steve's Original Wing Sauce

+ diff --git a/dist/styles.css b/dist/styles.css index 78ba1c2709..fa70e50a32 100644 --- a/dist/styles.css +++ b/dist/styles.css @@ -62,3 +62,9 @@ nav { background-color: black; } +.image-styling { + margin-top: 20px; + height: 150px; + width: 300px; +} + From 238c129faf4cede5ca1a8c9cf111653579770cf8 Mon Sep 17 00:00:00 2001 From: Zen McMillan Date: Sun, 27 Aug 2023 10:54:07 -0600 Subject: [PATCH 6/6] Move the CSS code to the proper directory --- src/styles.css | 70 ++++++++++++++++++++++++++++++++++++++++++++++++-- 1 file changed, 68 insertions(+), 2 deletions(-) diff --git a/src/styles.css b/src/styles.css index e40807dd04..9ab657127b 100644 --- a/src/styles.css +++ b/src/styles.css @@ -1,5 +1,71 @@ * { - background-color: #E7F1F1; - font-size: 35px; + background-color: #E7F1F1; } +.container { + display: flex; + flex-direction: column; + align-items: center; +} + +h1 { + font-family: 'Eczar', serif; + font-weight: 700; + font-size: 60px; + letter-spacing: 2px; + margin-top: -10px; + margin-bottom: 0px; + +} + +input { + height: 40px; + width: 250px; + border-radius: 10px; + background-color: white; + font-size: 20px; + font-family: 'Radley', serif; +} + +input::placeholder { + font-family: 'Kalam', cursive; +} + +h2 { + font-size: 40px; + letter-spacing: 2px; + margin-top: 20px; + font-family: 'Eczar', serif; + font-weight: 400; +} + +nav { + display: flex; + flex-wrap: wrap; + justify-content: center; + margin-top: -20px; +} + +.nav-link { + margin-right: 55px; + font-size: 20px; + color: black; + line-height: 35px; + text-decoration: none; + border-bottom: 4px solid orange; + text-transform: capitalize; + font-family: 'Eczar', serif; +} + +.nav-link:hover { + color: white; + background-color: black; +} + +.image-styling { + margin-top: 20px; + height: 150px; + width: 300px; +} + +