diff --git a/.vscode/settings.json b/.vscode/settings.json new file mode 100644 index 000000000..4c7ff40f6 --- /dev/null +++ b/.vscode/settings.json @@ -0,0 +1,3 @@ +{ + "liveServer.settings.port": 5502 +} diff --git a/gallery.css b/gallery.css new file mode 100644 index 000000000..399345963 --- /dev/null +++ b/gallery.css @@ -0,0 +1,31 @@ +.container { + width: 24rem; + margin: 4rem; + padding: 2rem; + background-color: white; + } + + .icon { + font-size: 3rem; + padding-left: 1rem; + } + + h3 { + margin: 0; + } + + p { + margin: 5px 0 0; + } + + .item { + padding: 0 0 1.4rem 0; + } + + /* Generic Styles End */ + + .container { + display: grid; + grid-template-columns: 1fr auto; + } + \ No newline at end of file diff --git a/git_commands.txt b/git_commands.txt new file mode 100644 index 000000000..26221f9bb --- /dev/null +++ b/git_commands.txt @@ -0,0 +1,11 @@ + history 10 + 16 git config --add user.name afsoon + 17 git config --list + 18 git config --add user.email afsoonewss@gmail.com + 19 git config --get user.email + + 21 git remote + 22 git remote -v + 23 git push origin + 24 history 10 + 25 history 10 > git_commands.txt diff --git a/git_lazy.sh b/git_lazy.sh new file mode 100755 index 000000000..ba35b9e8a --- /dev/null +++ b/git_lazy.sh @@ -0,0 +1,4 @@ +#!bin/bash +git status +git add . +git commit -m "lazy" diff --git a/images/pexels-felicity-tai-7966522.jpg b/images/pexels-felicity-tai-7966522.jpg new file mode 100644 index 000000000..e55efeeb4 Binary files /dev/null and b/images/pexels-felicity-tai-7966522.jpg differ diff --git a/images/pranjall-kumar-lRAApjOIaFs-unsplash.jpg b/images/pranjall-kumar-lRAApjOIaFs-unsplash.jpg new file mode 100644 index 000000000..baaa26c0a Binary files /dev/null and b/images/pranjall-kumar-lRAApjOIaFs-unsplash.jpg differ diff --git a/images/slashio-photography-XxWxPGXwDU0-unsplash.jpg b/images/slashio-photography-XxWxPGXwDU0-unsplash.jpg new file mode 100644 index 000000000..864234a00 Binary files /dev/null and b/images/slashio-photography-XxWxPGXwDU0-unsplash.jpg differ diff --git a/index.html b/index.html index 60b1afe13..58cad8c53 100644 --- a/index.html +++ b/index.html @@ -1,16 +1,107 @@ - Responsive Cake webpage + - +
+
+
+ + +
+
+
+
+
+

Welcome

+

Love at First Bite

+

The best cakes in town delivered to your door

+

OUR COLLECTION

+
+
+
+ +

French cake

+

French cake, also known as "gateau," is a delectable culinary + delight renowned for its intricate designs, rich flavors, and + delicate textures. From classic pastries like croquembouche and + tarte Tatin to indulgent creations like the decadent opera cake, + French cakes showcase the artistry and culinary expertise that + France is famous for. + +

+
+ + + + +
+

Italian cake

+

Italian cake, also known as "torta," is renowned for its decadent + flavors and rich textures, often incorporating ingredients like creamy + mascarpone, fragrant citrus, and velvety chocolate. From classic + tiramisu to luscious ricotta-filled cannoli, Italian cakes showcase + the country's passion for indulgent and delightful desserts.

+
+ + + - \ No newline at end of file +
+

Classic cake

+

+ Classic cake is a timeless dessert loved by people of all ages, featuring + a tender and moist texture paired with a delectable combination of flavors. + Its traditional appeal and versatile nature make it a delightful treat for + any occasion. +

+
+ + + + + +
+ +
+ + + + \ No newline at end of file diff --git a/style.css b/style.css index 6de1b3567..b5e006385 100644 --- a/style.css +++ b/style.css @@ -1 +1,151 @@ /* Add your styling here */ +body { + background-color: #e5e8ea; + color: #333; + font-size: 0.9rem; + line-height: 1.2; + } + + .container { + width: 24rem; + margin: 4rem; + padding: 2rem; + background-color: rgb(236, 237, 238); + } + + .icon { + font-size: 3rem; + padding-left: 1rem; + width: 100px; + } + + h3 { + margin: 0; + } + + p { + margin: 5px 0 0; + } + + .item { + padding: 0 0 1.4rem 0; + } + + /* Generic Styles End */ + + .container { + display: grid; + grid-template-columns: 1fr auto; + } + +@import url('https://fonts.googleapis.com/css2?family=Roboto&display=swap'); +body { + font-family: roboto; + } + + .wrapper2 { + padding: 3rem; + text-align: center; + color: #333; + background-color: #DDD6FE; + } + + .menu { + background-color: white; + padding: 0.5rem; + border-radius: 2rem; + } + + .menu a { + background-color: #EFF6FF; + padding: 0.6rem 1.5rem; + border-radius: 2rem; + color: black; + text-decoration: none; + font-size: 0.9rem; + } + + .menu a.active { + background-color: #949aa3; + color: white; + } + + /* Generic Styles End */ + + .menu { + display: flex; + justify-content: space-between; + } + + +body { + background-color: #F1F5F9; + } + + p { + text-align: center; + margin-top: 40px; + } + + ul { + padding: 0; + list-style-type: none; + width: 300px; + margin: 30px auto; + background-color: rgba(203, 201, 201, 0.521); + display: flex; + flex-direction: row; + } + + ul li { + padding: 20px; + text-align: center; + transition: flex; + transition-duration: 0.2s; + } + + ul li:hover { + cursor: pointer; + border-bottom: solid 3px #2DD4BF; + } + @media screen and (min-width: 320px) { + body { + background: lightgrey + } + } + @media screen and (max-width: 540px) { + body { + background: #0077b6; + } + } + .container { + width: 24rem; + margin: 4rem; + padding: 2rem; + background-color: white; + } + + .icon { + font-size: 3rem; + padding-left: 1rem; + } + + h3 { + margin: 0; + } + + p { + margin: 5px 0 0; + } + + .item { + padding: 0 0 1.4rem 0; + } + + /* Generic Styles End */ + + .container { + display: grid; + grid-template-columns: 1fr auto; + } + \ No newline at end of file