From 8db59b2ad68b16364294329813d402ea192c5cf5 Mon Sep 17 00:00:00 2001 From: BEKIRKSU <113244972+BEKIRKSU@users.noreply.github.com> Date: Sun, 5 Feb 2023 17:13:14 +0000 Subject: [PATCH 1/9] Updated HTML and CSS --- index.html | 30 ++++++++++++++++++++++++++++-- style.css | 5 ++++- 2 files changed, 32 insertions(+), 3 deletions(-) diff --git a/index.html b/index.html index 60b1afe13..b8c2b782b 100644 --- a/index.html +++ b/index.html @@ -6,11 +6,37 @@ Responsive Cake webpage - + - + + Cake site + +
+

Header

+
+ + + +
+

Content Section

+

Lorem ipsum dolor sit amet, consectetur adipiscing elit. Sed auctor, libero at commodo luctus, sapien enim tempor libero, vel congue nisi nisi id dui. Fusce euismod quis sapien vel malesuada. Aliquam tincidunt sapien at ipsum rhoncus, vitae bibendum magna blandit.

+
+ + + + \ No newline at end of file diff --git a/style.css b/style.css index 6de1b3567..5fd087015 100644 --- a/style.css +++ b/style.css @@ -1 +1,4 @@ -/* Add your styling here */ +.Cake-image { + height: 250px; + width: 250px; +} \ No newline at end of file From 4d94777176c23818924f5014c9495e29de90899a Mon Sep 17 00:00:00 2001 From: BEKIRKSU <113244972+BEKIRKSU@users.noreply.github.com> Date: Sun, 5 Feb 2023 18:32:13 +0000 Subject: [PATCH 2/9] Updated HTML and CSS --- index.html | 18 +++++++++--------- style.css | 48 +++++++++++++++++++++++++++++++++++++++++++++++- 2 files changed, 56 insertions(+), 10 deletions(-) diff --git a/index.html b/index.html index b8c2b782b..d16bc128d 100644 --- a/index.html +++ b/index.html @@ -12,21 +12,21 @@ Cake site - +

Header

- +

This is a website about cakes. YES, about cakes. kldajklsajdlkasjdklasjdklasjlkdjsalkdjlksajdlkasjdlksajdlksa.

+ +

Content Section

Lorem ipsum dolor sit amet, consectetur adipiscing elit. Sed auctor, libero at commodo luctus, sapien enim tempor libero, vel congue nisi nisi id dui. Fusce euismod quis sapien vel malesuada. Aliquam tincidunt sapien at ipsum rhoncus, vitae bibendum magna blandit.

diff --git a/style.css b/style.css index 5fd087015..758c2bc57 100644 --- a/style.css +++ b/style.css @@ -1,4 +1,50 @@ .Cake-image { height: 250px; width: 250px; -} \ No newline at end of file + float: left; + padding: 10px; +} + +header { + background-color: bisque; + color: black; + font-family: 'Segoe UI', Tahoma, Geneva, Verdana, sans-serif; +} + +.div1 { + background-color: cornflowerblue; + height: 350px; +} + + +nav { + + color: black; + font-family: 'Segoe UI', Tahoma, Geneva, Verdana, sans-serif; +} + +.site-info { + color: black; + position:absolute; + bottom:600px; + right:10px; + +} + +li { + display: inline; + float: right; + padding: 5px; +} + +.list button { + border: solid; + color: black; + padding: 20px 35px; + text-align: left; + text-decoration: none; + display: inline-block; + font-size: 16px; + height: 20px; + width: 30px; + } From f9a9d7176461ab38044098c692a1f3984207583e Mon Sep 17 00:00:00 2001 From: BEKIRKSU <113244972+BEKIRKSU@users.noreply.github.com> Date: Sun, 5 Feb 2023 20:02:09 +0000 Subject: [PATCH 3/9] Update HTML --- index.html | 36 +++++++++++++++++++++++++++--------- 1 file changed, 27 insertions(+), 9 deletions(-) diff --git a/index.html b/index.html index d16bc128d..346c94d8f 100644 --- a/index.html +++ b/index.html @@ -14,7 +14,7 @@ Cake site
-

Header

+

Cake Site

+
-

Content Section

-

Lorem ipsum dolor sit amet, consectetur adipiscing elit. Sed auctor, libero at commodo luctus, sapien enim tempor libero, vel congue nisi nisi id dui. Fusce euismod quis sapien vel malesuada. Aliquam tincidunt sapien at ipsum rhoncus, vitae bibendum magna blandit.

-
+

WELCOME

+

Lorem ipsum dolor sit amet, consectetur adipiscing elit. Sed auctor, libero at commodo luctus, sapien enim tempor libero, vel congue nisi nisi id dui. Fusce euismod quis sapien vel malesuada. Aliquam tincidunt sapien at ipsum rhoncus, vitae bibendum magna blandit. + Lorem ipsum dolor sit amet, consectetur adipiscing elit. Sed auctor, libero at commodo luctus, sapien enim tempor libero, vel congue nisi nisi id dui. Fusce euismod quis sapien vel malesuada. Aliquam tincidunt sapien at ipsum rhoncus, vitae bibendum magna blandit. + Lorem ipsum dolor sit amet, consectetur adipiscing elit. Sed auctor, libero at commodo luctus, sapien enim tempor libero, vel congue nisi nisi id dui. Fusce euismod quis sapien vel malesuada. Aliquam tincidunt sapien at ipsum rhoncus, vitae bibendum magna blandit. +

+ Image 2 of cake +
+ +
+
+ +
+
+ - + + - - - \ No newline at end of file From 7f5b6475f5f7e978c047c9e5800bb11552af7a67 Mon Sep 17 00:00:00 2001 From: BEKIRKSU <113244972+BEKIRKSU@users.noreply.github.com> Date: Sun, 5 Feb 2023 20:02:42 +0000 Subject: [PATCH 4/9] Updated CSS --- style.css | 67 ++++++++++++++++++++++++++++++++++++++++++++++--------- 1 file changed, 56 insertions(+), 11 deletions(-) diff --git a/style.css b/style.css index 758c2bc57..6bf99159d 100644 --- a/style.css +++ b/style.css @@ -28,7 +28,8 @@ nav { position:absolute; bottom:600px; right:10px; - + text-align: right; + height: 50px; } li { @@ -37,14 +38,58 @@ li { padding: 5px; } -.list button { - border: solid; - color: black; - padding: 20px 35px; - text-align: left; - text-decoration: none; - display: inline-block; - font-size: 16px; - height: 20px; - width: 30px; +.list li { + border: none; + color: white; + padding: 10px 25px; + text-align: center; + text-decoration: none; + display: inline-block; + font-size: 16px; + margin: 4px 2px; + cursor: pointer; + } + + main { + background-color: white; + } + + .welcome { + text-align: center; + padding-bottom: 50px; + font-size: 40px; + font-weight: 27px; + font-family: Georgia, 'Times New Roman', Times, serif; +} + +.p2 { + text-align: center; +} + + .list2 { + display: inline; + } + + .cake-image2 { + height: 500px; + width: 500px; + margin-left: 700px; } + +.cake-image3 { + height: 500px; + width: 500px; + margin-right: 200px; +} +.cake-image4 { + height: 500px; + width: 500px; + margin-right: 200px; +} + + +footer { + margin-top: 1000px; + background-color:blue; + height: 200px; +} From 762edd2e54b819f21cf18d309b1fa5aed1e8dc73 Mon Sep 17 00:00:00 2001 From: BEKIRKSU <113244972+BEKIRKSU@users.noreply.github.com> Date: Sun, 5 Feb 2023 20:29:10 +0000 Subject: [PATCH 5/9] Updated HTML --- index.html | 2 +- 1 file changed, 1 insertion(+), 1 deletion(-) diff --git a/index.html b/index.html index 346c94d8f..2f8dc5520 100644 --- a/index.html +++ b/index.html @@ -51,7 +51,7 @@

WELCOME

From 271cb19b1351370599eb12cd4f43090677e9e0bb Mon Sep 17 00:00:00 2001 From: BEKIRKSU <113244972+BEKIRKSU@users.noreply.github.com> Date: Sun, 5 Feb 2023 20:29:42 +0000 Subject: [PATCH 6/9] Updated CSS --- style.css | 12 ++++++++++-- 1 file changed, 10 insertions(+), 2 deletions(-) diff --git a/style.css b/style.css index 6bf99159d..d738d8984 100644 --- a/style.css +++ b/style.css @@ -41,7 +41,7 @@ li { .list li { border: none; color: white; - padding: 10px 25px; + padding: 2px 10px; text-align: center; text-decoration: none; display: inline-block; @@ -50,6 +50,14 @@ li { cursor: pointer; } + button { + height: 50px; + width: 70px; + font-size: 16px; + font-weight: bold; + padding-left: 2px; + } + main { background-color: white; } @@ -90,6 +98,6 @@ li { footer { margin-top: 1000px; - background-color:blue; + background-color:#bbe4e9; height: 200px; } From 2a2739f83779ed7f6c4d4b03a275ad5fb0d95cf6 Mon Sep 17 00:00:00 2001 From: BEKIRKSU <113244972+BEKIRKSU@users.noreply.github.com> Date: Mon, 13 Feb 2023 19:04:35 +0000 Subject: [PATCH 7/9] CSS updated --- style.css | 119 +++++++++++++++++++++++++++++++++++++++++++++++++++++- 1 file changed, 118 insertions(+), 1 deletion(-) diff --git a/style.css b/style.css index d738d8984..512ed54b1 100644 --- a/style.css +++ b/style.css @@ -1,10 +1,16 @@ -.Cake-image { +@media (max-width: 540px) { + header { + background-color: blue; + + } + .Cake-image { height: 250px; width: 250px; float: left; padding: 10px; } + header { background-color: bisque; color: black; @@ -101,3 +107,114 @@ footer { background-color:#bbe4e9; height: 200px; } +} + + +@media (min-height: 940px) { + +.Cake-image { + height: 250px; + width: 250px; + float: left; + padding: 10px; +} + + +header { + background-color: bisque; + color: black; + font-family: 'Segoe UI', Tahoma, Geneva, Verdana, sans-serif; +} + +.div1 { + background-color: cornflowerblue; + height: 350px; +} + + +nav { + + color: black; + font-family: 'Segoe UI', Tahoma, Geneva, Verdana, sans-serif; +} + +.site-info { + color: black; + position:absolute; + bottom:600px; + right:10px; + text-align: right; + height: 50px; +} + +li { + display: inline; + float: right; + padding: 5px; +} + +.list li { + border: none; + color: white; + padding: 2px 10px; + text-align: center; + text-decoration: none; + display: inline-block; + font-size: 16px; + margin: 4px 2px; + cursor: pointer; + } + + button { + height: 50px; + width: 70px; + font-size: 16px; + font-weight: bold; + padding-left: 2px; + } + + main { + background-color: grey; + } + + .welcome { + text-align: center; + padding-bottom: 50px; + font-size: 40px; + font-weight: 27px; + font-family: Georgia, 'Times New Roman', Times, serif; +} + +.p2 { + text-align: right; +} + + /* .list2 { + display: inline; + } */ + + .cake-image2 { + height: 500px; + width: 500px; + margin-left: 200px; + } + +.cake-image3 { + height: 200px; + width: 200px; + margin-right: 100px; +} +.cake-image4 { + height: 200px; + width: 200px; + margin-right: 100px; +} + + +footer { + margin-top: 350px; + background-color:#bbe4e9; + height: 200px; +} + +} From 14e873492a058f59f0ccbc2b771cf5750575386b Mon Sep 17 00:00:00 2001 From: BEKIRKSU <113244972+BEKIRKSU@users.noreply.github.com> Date: Sun, 19 Feb 2023 17:53:47 +0000 Subject: [PATCH 8/9] HTML updated --- index.html | 9 +++++---- 1 file changed, 5 insertions(+), 4 deletions(-) diff --git a/index.html b/index.html index 2f8dc5520..f53e5f454 100644 --- a/index.html +++ b/index.html @@ -29,19 +29,20 @@

Cake Site

+

WELCOME

Lorem ipsum dolor sit amet, consectetur adipiscing elit. Sed auctor, libero at commodo luctus, sapien enim tempor libero, vel congue nisi nisi id dui. Fusce euismod quis sapien vel malesuada. Aliquam tincidunt sapien at ipsum rhoncus, vitae bibendum magna blandit. Lorem ipsum dolor sit amet, consectetur adipiscing elit. Sed auctor, libero at commodo luctus, sapien enim tempor libero, vel congue nisi nisi id dui. Fusce euismod quis sapien vel malesuada. Aliquam tincidunt sapien at ipsum rhoncus, vitae bibendum magna blandit. Lorem ipsum dolor sit amet, consectetur adipiscing elit. Sed auctor, libero at commodo luctus, sapien enim tempor libero, vel congue nisi nisi id dui. Fusce euismod quis sapien vel malesuada. Aliquam tincidunt sapien at ipsum rhoncus, vitae bibendum magna blandit.

Image 2 of cake -
-
    +
+
+
  • Image 3 of cake
  • Image 4 of cake
-
-
+
  • Image 3 of cake
  • Image 4 of cake
    • From b32f9fa759524a998a923f97ba336070a8a989f2 Mon Sep 17 00:00:00 2001 From: BEKIRKSU <113244972+BEKIRKSU@users.noreply.github.com> Date: Sun, 19 Feb 2023 17:53:56 +0000 Subject: [PATCH 9/9] CSS updated --- style.css | 177 ++++++++++++++++++++++++++++++++++++++++++++++++------ 1 file changed, 159 insertions(+), 18 deletions(-) diff --git a/style.css b/style.css index 512ed54b1..e2841245f 100644 --- a/style.css +++ b/style.css @@ -1,6 +1,9 @@ -@media (max-width: 540px) { +body { + font-family: 'Shantell Sans', cursive; +} header { - background-color: blue; + background-color: rgb(21, 255, 0); + font-family: 'Shantell Sans', cursive; } .Cake-image { @@ -107,23 +110,32 @@ footer { background-color:#bbe4e9; height: 200px; } -} -@media (min-height: 940px) { -.Cake-image { + + + + + + + + +@media screen and (min-width: 900px) { + + + /* .Cake-image { height: 250px; width: 250px; float: left; padding: 10px; -} +} */ header { - background-color: bisque; + background-color: rgb(196, 197, 255); color: black; - font-family: 'Segoe UI', Tahoma, Geneva, Verdana, sans-serif; + font-family: 'Shantell Sans', cursive; } .div1 { @@ -135,7 +147,7 @@ header { nav { color: black; - font-family: 'Segoe UI', Tahoma, Geneva, Verdana, sans-serif; + font-family: 'Shantell Sans', cursive; } .site-info { @@ -173,20 +185,151 @@ li { padding-left: 2px; } - main { - background-color: grey; - } .welcome { text-align: center; padding-bottom: 50px; font-size: 40px; font-weight: 27px; - font-family: Georgia, 'Times New Roman', Times, serif; + font-family: 'Shantell Sans', cursive; +} + +.p2 { + text-align: right; + width: 800px; + margin-left: 600px; + font-family: 'Shantell Sans', cursive; + font-size: 1.3em; +} + +.first-div { + height: 400px; + width: 80%; + margin-left: 100px; +} + + .cake-image2 { + height: 250px; + width: 250px; + margin-left: 100px; + margin-bottom: 800px; + margin-top: 0px; + position: relative; + top: -250px; + } +.cake-line { + height: 300px; + background-color: rgb(107, 107, 143); + +} +.cake-image3 { + height: 200px; + width: 200px; + +} +.cake-image4 { + height: 200px; + width: 200px; +} + +footer { + margin-top: 0px; + background-color:#bbe4e9; + height: 200px; +} + +} + + + + + + + + + + + +@media screen and (min-width: 540px){ + +} +@media screen and (max-width: 900px) { + .Cake-image { + height: 250px; + width: 250px; + float: left; + padding: 10px; +} + + +header { + background-color: #fcff82; + font-family: 'Shantell Sans', cursive; + color: #0c005a; +} + +.div1 { + background-color: cornflowerblue; + height: 350px; +} + + +nav { + + color: black; + font-family: 'Shantell Sans', cursive; +} + +.site-info { + color: black; + position:absolute; + bottom:600px; + right:10px; + text-align: right; + height: 50px; + width: 300px; + padding-right: 150px; +} + +li { + display: inline; + float: right; + padding: 5px; +} + +.list li { + border: none; + color: white; + padding: 2px 10px; + text-align: center; + text-decoration: none; + display: inline-block; + font-size: 16px; + margin: 4px 2px; + cursor: pointer; + } + + button { + height: 50px; + width: 70px; + font-size: 16px; + font-weight: bold; + padding-left: 2px; + } + + + .welcome { + text-align: left; + padding-bottom: 10px; + font-size: 40px; + font-weight: 27px; + font-family: 'Shantell Sans', cursive; } .p2 { text-align: right; + padding-left: 20px; + padding-right: 20px; } /* .list2 { @@ -196,7 +339,7 @@ li { .cake-image2 { height: 500px; width: 500px; - margin-left: 200px; + margin-left: 160px; } .cake-image3 { @@ -210,11 +353,9 @@ li { margin-right: 100px; } - footer { - margin-top: 350px; + margin-top: 450px; background-color:#bbe4e9; height: 200px; } - -} +} \ No newline at end of file