From c6db93aa04914353c46475d2f3bb8486b5032148 Mon Sep 17 00:00:00 2001 From: Babazade Date: Fri, 16 Dec 2022 12:52:05 +0400 Subject: [PATCH 01/36] feature/zarangul/add-reset-style --- assets/css/style.css | 5 +++++ index.html | 1 + 2 files changed, 6 insertions(+) create mode 100644 assets/css/style.css diff --git a/assets/css/style.css b/assets/css/style.css new file mode 100644 index 0000000..45f760e --- /dev/null +++ b/assets/css/style.css @@ -0,0 +1,5 @@ +* { + margin: 0; + padding: 0; + box-sizing: border-box; +} \ No newline at end of file diff --git a/index.html b/index.html index 4c71f23..509b149 100644 --- a/index.html +++ b/index.html @@ -4,6 +4,7 @@ + Project Alpha From 235735e9e08a1efe3359c582deb6e84abec4b759 Mon Sep 17 00:00:00 2001 From: Babazade Date: Fri, 16 Dec 2022 13:00:36 +0400 Subject: [PATCH 02/36] feature/zarangul/index-html/add-div-tag --- index.html | 2 +- 1 file changed, 1 insertion(+), 1 deletion(-) diff --git a/index.html b/index.html index 509b149..3ea44b7 100644 --- a/index.html +++ b/index.html @@ -8,6 +8,6 @@ Project Alpha - +
\ No newline at end of file From 18f68b5258073264f308b2621f61fe2983b556d5 Mon Sep 17 00:00:00 2001 From: web developer Date: Fri, 16 Dec 2022 04:14:40 -0800 Subject: [PATCH 03/36] adding new file --- new.html | 12 ++++++++++++ 1 file changed, 12 insertions(+) create mode 100644 new.html diff --git a/new.html b/new.html new file mode 100644 index 0000000..a23a941 --- /dev/null +++ b/new.html @@ -0,0 +1,12 @@ + + + + + + + Document + + +

Hello

+ + \ No newline at end of file From 75f879a2b36bb381c5997b724542e277020228ff Mon Sep 17 00:00:00 2001 From: web developer Date: Fri, 16 Dec 2022 09:10:14 -0800 Subject: [PATCH 04/36] . --- new.html | 2 ++ 1 file changed, 2 insertions(+) diff --git a/new.html b/new.html index a23a941..9964d40 100644 --- a/new.html +++ b/new.html @@ -7,6 +7,8 @@ Document +

New

Hello

+ \ No newline at end of file From 37d42846d2e939236e7c7c580f66d04ac740c1d2 Mon Sep 17 00:00:00 2001 From: Babazade Date: Sat, 17 Dec 2022 13:50:37 +0400 Subject: [PATCH 05/36] feature/zarangul/home-page/cards --- assets/css/home.css | 90 +++++++++++++++++++++++++++++++++++++++++++++ home.html | 83 +++++++++++++++++++++++++++++++++++++++++ 2 files changed, 173 insertions(+) create mode 100644 assets/css/home.css create mode 100644 home.html diff --git a/assets/css/home.css b/assets/css/home.css new file mode 100644 index 0000000..086cfb6 --- /dev/null +++ b/assets/css/home.css @@ -0,0 +1,90 @@ +* { + margin: 0; + padding: 0; + box-sizing: border-box; +} +.card { + width: 32%; + height: 33vh; + border-radius: 10px; + display: flex; + justify-content: space-between; + overflow: hidden; + position: relative; + +} +.card-img { + position: absolute; + width: 100%; + height: 100%; + z-index: 0; +} +.card-img img { + max-width: 130%; + height: 100%; +} +.card-body { + width: 100%; + height: 100%; + padding: 35px 30px 0; + position: absolute; + z-index: 1; +} +.card-body h5.gr-1, +.card-body h5.rd-3 + { + color:#fbb127; +} +h5.card-title { + color: white; + margin: 0 0 10px; + font-size: 14px; + font-family: 'Jost', sans-serif; + font-weight: bold; +} +h4.card-title { + color: white; + margin: 0 0 10px; + font-size: 24px; + font-family: 'Quicksand', sans-serif; + font-weight: bold; +} +.card-text { + color: white; + margin: 20px 0 0; + font-size: 16px; + font-family: 'Jost', sans-serif; +} +@media (max-width:991px) { + .container-md { + height: 80vh; + flex-wrap: wrap; + justify-content: space-between; + } + .card { + + width: 48%; + height: 36vh; + } +} +@media (max-width:767px) { + .container-md { + height: 114vh; + flex-direction: column; + justify-content: space-between; + align-items: center; + padding: 0% !important; + + } + .card { + width: 90%; + height: 34vh; + background-color: red; + } + .card-img img { + width: 110% !important; + height: 100%; + object-fit: cover; + } + +} \ No newline at end of file diff --git a/home.html b/home.html new file mode 100644 index 0000000..ac6206b --- /dev/null +++ b/home.html @@ -0,0 +1,83 @@ + + + + + + + + + + + + + + + + + + Document + + +
+
+ +
+ card-img-1 +
+
+
TOP OFFERS
+

+ Eat Green +
+ Best For Family +

+

Free Shipping 05km

+
+ +
+
+ +
+ card-img-2 +
+
+
WEEKEND DEALS
+

+ Fresh Food +
+ Restore Health +

+
+ +
+
+ +
+ card-img-3 +
+
+
TOP SELLERS
+

+ Healthy +
+ Fresh Free Bread +

+

Limited Time: Online Only!

+
+ +
+
+ + \ No newline at end of file From 6708506a7cc74b2a0ac8bbc168e15aa7bde22e7f Mon Sep 17 00:00:00 2001 From: Babazade Date: Sun, 18 Dec 2022 21:05:05 +0400 Subject: [PATCH 06/36] feature/zarangul/home-page/blog-cards --- assets/css/home.css | 120 ++++++++++++++--- home.html | 304 +++++++++++++++++++++++++++++++++++++++++--- 2 files changed, 387 insertions(+), 37 deletions(-) diff --git a/assets/css/home.css b/assets/css/home.css index 086cfb6..3f973ac 100644 --- a/assets/css/home.css +++ b/assets/css/home.css @@ -3,7 +3,7 @@ padding: 0; box-sizing: border-box; } -.card { +.sec-6-card { width: 32%; height: 33vh; border-radius: 10px; @@ -11,64 +11,63 @@ justify-content: space-between; overflow: hidden; position: relative; - } -.card-img { +.sec-6-card-img { position: absolute; width: 100%; height: 100%; z-index: 0; } -.card-img img { +.sec-6-card-img img { max-width: 130%; height: 100%; } -.card-body { +.sec-6-card-body { width: 100%; height: 100%; padding: 35px 30px 0; position: absolute; z-index: 1; } -.card-body h5.gr-1, -.card-body h5.rd-3 +.sec-6-card-body h5.gr-1, +.sec-6-card-body h5.rd-3 { color:#fbb127; } -h5.card-title { +h5.sec-6-card-title { color: white; margin: 0 0 10px; font-size: 14px; font-family: 'Jost', sans-serif; font-weight: bold; } -h4.card-title { +h4.sec-6-card-title { color: white; margin: 0 0 10px; font-size: 24px; font-family: 'Quicksand', sans-serif; font-weight: bold; } -.card-text { +.sec-6-card-text { color: white; margin: 20px 0 0; font-size: 16px; font-family: 'Jost', sans-serif; } @media (max-width:991px) { - .container-md { + .sec-6-card-cont { height: 80vh; flex-wrap: wrap; justify-content: space-between; } - .card { + .sec-6-card { width: 48%; height: 36vh; } } @media (max-width:767px) { - .container-md { + .sec-6-card-cont { height: 114vh; flex-direction: column; justify-content: space-between; @@ -76,15 +75,104 @@ h4.card-title { padding: 0% !important; } - .card { + .sec-6-card{ width: 90%; height: 34vh; background-color: red; } - .card-img img { + .sec-6-card-img img { width: 110% !important; height: 100%; object-fit: cover; } - +} +/* home section 11 cards */ +.sec-11-bl-card { + box-shadow: none; +} +.sec-11-bl-card-body { + padding: 0 0.6rem; +} +.sec-11-bl-card-body .sp-details, +.sec-11-bl-card-body .sp-author, +.sec-11-bl-card-body .sp-date { + font-family: 'Jost', sans-serif; + font-weight: 600; + font-size: 9px; + text-transform: uppercase; + background: transparent; + display: inline-block; + margin-bottom: 8px; +} +.sec-11-bl-card-body .sp-details, +.sec-11-bl-card-body .sp-author { + position: relative; + padding-right: 0.5rem; +} +.sec-11-bl-card-body .sp-details::after, +.sec-11-bl-card-body .sp-author::after { + content: ""; + position: absolute; + width: 0.15rem; + height: 0.15rem; + background-color: #CFD4DE; + border-radius: 50%; + top: 50%; + transform: translateY(-50%); + right: 0; +} +.sec-11-bl-card-body .sp-details a{ + color: #96ae00; +} +.sec-11-bl-card-body .sp-author a, +.sec-11-bl-card-body .sp-date a { + color: #81869c; +} +.sec-11-bl-card-body .sp-author:hover a, +.sec-11-bl-card-body .sp-date:hover a { + transition: all .3s; + color: #96ae00; +} +.sec-11-bl-card-body .sec-11-bl-card-title { + font-family: 'Quicksand', sans-serif; + font-weight: 700; + font-size: 16px; + text-overflow: ellipsis; + margin-bottom: 1rem; +} +.sec-11-bl-card-body .sec-11-bl-card-title a { + color: #2d2a6e; +} +.sec-11-bl-card-body .sec-11-bl-card-title a:hover { + transition: all .3s; + color: #96ae00; +} +.sec-11-bl-card-body .sec-11-bl-card-text { + font-family: 'Quicksand', sans-serif; + font-size: 12px; + line-height: 1rem; + color: #5e6581; +} +.sec-11-bl-card-body .sec-11-bl-card-link { + color: #96ae00; + font-family: 'Jost', sans-serif; + letter-spacing: 1px; + font-size: 10px; + font-weight: 600; +} +.sec-11-bl-card-body .sec-11-bl-card-link i { + display: none; +} +.sec-11-bl-card-body .sec-11-bl-card-link:hover i { + font-size: 9px; + display: inline-block; +} +.sec-11-bl-card-body .sp-details a::selection, +.sec-11-bl-card-body .sp-author a::selection, +.sec-11-bl-card-body .sp-date a::selection, +.sec-11-bl-card-body .card-title a::selection, +.sec-11-bl-card-body .card-text::selection, +.sec-11-bl-card-body .card-link::selection { + background-color: black; + color: white; } \ No newline at end of file diff --git a/home.html b/home.html index ac6206b..0d49479 100644 --- a/home.html +++ b/home.html @@ -30,31 +30,31 @@ Document -
-
- -
+
+
+ +
card-img-1
-
-
TOP OFFERS
-

+
+
TOP OFFERS
+

Eat Green
Best For Family

-

Free Shipping 05km

+

Free Shipping 05km

-
- -
+
+ +
card-img-2
-
-
WEEKEND DEALS
-

+
+
WEEKEND DEALS
+

Fresh Food
Restore Health @@ -62,22 +62,284 @@

-
- -
+
+ +
card-img-3
-
-
TOP SELLERS
-

+
+
TOP SELLERS
+

Healthy
Fresh Free Bread

-

Limited Time: Online Only!

+

Limited Time: Online Only!

+ + +
+ + blog-bg-4 + +
+ + LIFESTYLE + + + ADMIN + + + SEP 15. 2022 + +

+ + Avocado Grilled Salmon, Rich In Nutrients For The Body + +

+ +

+ These are the people who make your life easier. Egestas is tristique + vestibulum... +

+ CONTINUE READING +
+
+ +
+ + blog-bg-2 + +
+ + ORGANICS + + + ADMIN + + + SEP 15. 2022 + +

+ + The Best Great Benefits Of Fresh Beef For Women's Health + +

+ +

+ These are the people who make your life easier. Egestas is tristique + vestibulum... +

+ CONTINUE READING +
+
+ +
+ + blog-bg-3 + +
+ + ORGANICS + + + ADMIN + + + SEP 15. 2022 + +

+ Ways To Choose Fruits & Seafoods Good For Pregnancy +

+

+ These are the people who make your life easier. Egestas is tristique + vestibulum... +

+ CONTINUE READING +
+
+ +
+ + blog-bg-4 + +
+ + LIFESTYLE + + + ADMIN + + + SEP 15. 2022 + +

+ + Summer Breakfast For The Healthy Morning With Tomatoes + +

+ +

+ These are the people who make your life easier. Egestas is tristique + vestibulum... +

+ CONTINUE READING +
+
+ +
+ + blog-bg-5 + +
+ + FOODS + + + ADMIN + + + SEP 15. 2022 + +

+ + Popular Reasons You Must Drinks Juice Everyday Juice Everyday + +

+

+ These are the people who make your life easier. Egestas is tristique + vestibulum... +

+ CONTINUE READING +
+
+ +
+ + blog-bg-6 + +
+ + LIFESTYLE + + + ADMIN + + + SEP 15. 2022 + +

+ Perfect Quality Reasonable Price For Your Family +

+

+ These are the people who make your life easier. Egestas is tristique + vestibulum... +

+ CONTINUE READING +
+
+ +
+ + blog-bg-7 + +
+ + DAIRY FARM + + + ADMIN + + + SEP 15. 2022 + +

+ Ways To Choose Fruits Seafoods Good For Pregnancy +

+

+ These are the people who make your life easier. Egestas is tristique + vestibulum... +

+ CONTINUE READING +
+
+ +
+ + blog-bg-8 + +
+ + ORGANICS + + + ADMIN + + + SEP 15. 2022 + +

+ + The Best Great Benefits Of Fresh Beef For Women's Health + +

+

+ These are the people who make your life easier. Egestas is tristique + vestibulum... +

+ CONTINUE READING +
+
\ No newline at end of file From 996a03d72ce18832afd63c0e9e40bffb8c3dda3f Mon Sep 17 00:00:00 2001 From: Babazade Date: Sun, 18 Dec 2022 23:08:06 +0400 Subject: [PATCH 07/36] feature/zarangul/home-page/products-weekly-offers --- assets/css/home.css | 153 +++++++++++++++ home.html | 443 ++++++++++++++++++++++++++++++++++++++++++++ 2 files changed, 596 insertions(+) diff --git a/assets/css/home.css b/assets/css/home.css index 3f973ac..bdf6438 100644 --- a/assets/css/home.css +++ b/assets/css/home.css @@ -3,6 +3,159 @@ padding: 0; box-sizing: border-box; } +body { + background-color: #f2f2f6; +} +/* section 4 */ +.sec-4-card { + box-shadow: none; + border: 1px solid white; +} +.sec-4-card-h { + position: relative; +} +.sec-4-c-discount-hot-prod { + font-weight: 500; + font-size: 9px; + font-family: 'Jost', sans-serif; + position: absolute; + top: 0.5rem; + left: 0.5rem; +} +.sec-4-c-discount-hot-prod .sec-4-pr-discount, +.sec-4-c-discount-hot-prod .sec-4-pr-hot { + display: inline-block; + border-radius: 2px; + padding: 0.1rem 0.2rem; +} +.sec-4-c-discount-hot-prod .sec-4-pr-discount { + background-color: #12b7ce; + color: #fff; +} +.sec-4-c-discount-hot-prod .sec-4-pr-hot { + background-color: #facfd4; + color: #ea0d42; +} +.sec-4-div-pr-shop-icons { + position: absolute; + top: 0.5rem; + right: 0.5rem; +} +.sec-4-div-pr-shop-icons a i { + font-size: 10px; + height: 26px; + width: 26px; + text-align: center; + line-height: 26px; + background-color: #fff; + color: #5e6581; + border: 1px solid #e6ebf0; + border-radius: 50%; + margin-bottom: 5px; + display: none; +} +.sec-4-div-pr-shop-icons a:hover i { + background-color: #859A00; + border: 1px solid #859A00; + color: white; +} +.sec-4-card-body { + padding: 0 0.5rem; + background-color: #f7f7f9; + border-radius: 8px; +} +.sec-4-pr-subtitle { + font-family: 'Jost', sans-serif; + font-size: 11px; + display: block; +} +.sec-4-pr-subtitle a { + color: #79819c; +} +.sec-4-pr-subtitle:hover a { + text-decoration: underline; +} +.sec-4-pr-card-title { + font-family: 'Jost', sans-serif; + font-size: 13px; + font-weight: 400; + text-overflow: ellipsis; + overflow: hidden; + margin-bottom: 0.125rem; +} +.sec-4-pr-card-title a { + color: #2d2a6e; +} +.sec-4-pr-card-title:hover a { + transition: all .3s; + color: #96ae00; +} +.sec-4-div-star-icons a i { + margin-right: -2px; + font-size: 10px; + color: #ffb800; +} +.sec-4-div-price { + font-family: 'Jost', sans-serif; +} +.sec-4-div-price span { + font-size: 16px; + color: #ea0d42; + font-weight: 500; +} +.sec-4-div-price del { + font-size: 12px; + font-weight: 400; +} +.sec-4-card-h .sec-4-img-2 { + display: none; +} +.sec-4-card:hover .sec-4-card-h .sec-4-img-1 { + display: none; +} +.sec-4-card:hover .sec-4-card-h .sec-4-img-2 { + display: block; +} +.sec-4-card:hover .sec-4-div-pr-shop-icons a i { + display: block; +} +.sec-4-div-hover { + display: none; +} +.sec-4-card:hover .sec-4-div-hover { + display: block; +} +.sec-4-div-card-link { + display: flex; + justify-content: center; + align-items: center; +} +.sec-4-card-link { + text-align: center; + padding: 0.5rem 1rem; + background-color: #96ae00; + color: #fff; + display: inline-block; + text-align: center; + font-family: 'Jost', sans-serif; + font-weight: 600; + font-size: 10px; + border-radius: 50px; +} +.sec-4-card-link:hover { + transition: all .3s; + background-color: #859A00; + color: #fff; +} +.sec-4-ul { + margin: 0.5rem 0; + padding: 0 1rem; +} +.sec-4-ul li { + font-size: 9px; + color: #79819c; +} +/* section 6 */ .sec-6-card { width: 32%; height: 33vh; diff --git a/home.html b/home.html index 0d49479..3d0c85b 100644 --- a/home.html +++ b/home.html @@ -30,6 +30,449 @@ Document + + +
+
+ + products4-min + + + products23-min + +
+ + -10% + +
+
+ + + + + + + + + +
+
+
+ + + Vegetables + + +

+ + HOT - Lettuce Fresh Produce Fruit Vegetables + +

+
+ + + + + + + + + + + + + + + +
+
+ $56.00 + $19.00 +
+
+
+ ADD TO CART +
+
+
    +
  • Type: Organic
    • +
  • MFG: August 4.2021
    • +
  • LIFE: 60 days
    • +
+
+
+
+
+ +
+
+ + products27-min + + + products14-min + +
+ + -90% + + + HOT + +
+
+ + + + + + + + + +
+
+
+ + + Fresh Fruits + + +

+ + Pure Irish Organic Beef Quarter Pounder Burgers + +

+
+ + + + + + + + + + + + + + + +
+
+ $56.00 + $19.00 +
+
+
+ ADD TO CART +
+
+
    +
  • Type: Organic
    • +
  • MFG: August 4.2021
    • +
  • LIFE: 60 days
    • +
+
+
+
+
+ +
+
+ + products16-min + + + products11-min + +
+ + -50% + +
+
+ + + + + + + + + +
+
+
+ + + Fresh Fruits, Vegetables + + +

+ + Ginger Fresh, Whole, Organic - 250gram + +

+
+ + + + + + + + + + + + + + + +
+
+ $56.00 + $19.00 +
+
+
+ ADD TO CART +
+
+
    +
  • Type: Organic
    • +
  • MFG: August 4.2021
    • +
  • LIFE: 60 days
    • +
+
+
+
+
+ +
+
+ + products17-min + + + products37-min + +
+ + -40% + + + HOT + +
+
+ + + + + + + + + +
+
+
+ + + Fresh Fruits + + +

+ + Laffy Taffy Laff Bites Gone Bananas - 4 Packs + +

+
+ + + + + + + + + + + + + + + +
+
+ $56.00 + $19.00 +
+
+
+ ADD TO CART +
+
+
    +
  • Type: Organic
    • +
  • MFG: August 4.2021
    • +
  • LIFE: 60 days
    • +
+
+
+
+
+ +
+
+ + products21-min + + + products1-min + +
+ + -50% + + + HOT + +
+
+ + + + + + + + + +
+
+
+ + + Fresh Fruits, Vegetables + + +

+ + Mangosteen Organic Farm VietNamese + +

+
+ + + + + + + + + + + + + + + +
+
+ $56.00 + $19.00 +
+
+
+ ADD TO CART +
+
+
    +
  • Type: Organic
    • +
  • MFG: August 4.2021
    • +
  • LIFE: 60 days
    • +
+
+
+
+
+ +
+
+ + products22-min + + + products11-min + +
+ + -40% + +
+
+ + + + + + + + + +
+
+
+ + + Fresh Fruits + + +

+ + Soda Sparkling Water Maker (Rose Gold) + +

+
+ + + + + + + + + + + + + + + +
+
+ $56.00 + $19.00 +
+
+
+ ADD TO CART +
+
+
    +
  • Type: Organic
    • +
  • MFG: August 4.2021
    • +
  • LIFE: 60 days
    • +
+
+
+
+
+
From 2d734e665b3fe9c019fc8b902748eafc498e12e6 Mon Sep 17 00:00:00 2001 From: Babazade Date: Mon, 19 Dec 2022 00:47:11 +0400 Subject: [PATCH 08/36] feature/zarangul/home-page/category-cards --- assets/css/home.css | 58 +++++++++++++++++ home.html | 153 ++++++++++++++++++++++++++++++++++++++++++++ 2 files changed, 211 insertions(+) diff --git a/assets/css/home.css b/assets/css/home.css index bdf6438..f725103 100644 --- a/assets/css/home.css +++ b/assets/css/home.css @@ -6,6 +6,64 @@ body { background-color: #f2f2f6; } +/* section 2 */ +.sec-2-card { + box-shadow: none; +} +.sec-2-c-b-img { + position: relative; + width: 4rem; + height: 4rem; + background-color: red; + border-radius: 50%; + overflow: hidden; +} +.sec-2-c-b-img-h { + position: absolute; + top: 0; + left: 0; + width: 100%; + height: 100%; + background-color: transparent; + transform: scale(0); +} +.sec-2-c-b-img a img { + position: absolute; + top: 0; + left: 0; + width: 100%; + height: 100%; +} +.sec-2-c-b-img-h i { + font-size: 2.5rem; + color: transparent; +} +.sec-2-card:hover .sec-2-c-b-img-h { + transition: all .3s; + transform: scale(1); + background-color: rgba(0, 0, 0, 0.363); +} +.sec-2-card:hover .sec-2-c-b-img-h i { + color: white; +} +.sec-2-card-title { + font-size: 13px; + font-family: 'Jost', sans-serif; + font-weight: 500; +} +.sec-2-card-title .sec-2-card-link { + color: #2d2a6e; +} +.sec-2-card-title:hover .sec-2-card-link { + transition: all .3s; + color: #96ae00; +} +.sec-2-card-subtitle-count { + font-size: 10px; + font-family: 'Jost', sans-serif; + font-weight: 400; + color: #4d5574; +} /* section 4 */ .sec-4-card { box-shadow: none; diff --git a/home.html b/home.html index 3d0c85b..92ddc85 100644 --- a/home.html +++ b/home.html @@ -30,6 +30,159 @@ Document + + +
+
+
+ + category-1 + +
+ +
+
+
+ + Vegetables + +
+
05 items
+
+
+ +
+
+
+ + category-2 + +
+ +
+
+
+ + Fresh Fruits + +
+
06 items
+
+
+ +
+
+
+ + category-3 + +
+ +
+
+
+ + Fruit Drink + +
+
09 items
+
+
+ +
+
+
+ + category-4 + +
+ +
+
+
+ + Fresh Bakery + +
+
11 items
+
+
+ +
+
+
+ + category-5 + +
+ +
+
+
+ + Biscuits Snack + +
+
02 items
+
+
+ +
+
+
+ + category-6 + +
+ +
+
+
+ + Fresh Meat + +
+
16 items
+
+
+ +
+
+
+ + category-7 + +
+ +
+
+
+ + Fresh Milk + +
+
10 items
+
+
+ +
+
+
+ + category-8 + +
+ +
+
+
+ + Sea Foods + +
+
11 items
+
+
From caa6282ddecb843eb2feec9a1374fbb52c042103 Mon Sep 17 00:00:00 2001 From: Babazade Date: Mon, 19 Dec 2022 16:45:18 +0400 Subject: [PATCH 09/36] feature/zarangul/home-page/top-seller-slide --- assets/css/home.css | 121 ++++++++++++++++++++++++++++++++++++++++++ home.html | 126 ++++++++++++++++++++++++++++++++++++++++++++ 2 files changed, 247 insertions(+) diff --git a/assets/css/home.css b/assets/css/home.css index f725103..fe03801 100644 --- a/assets/css/home.css +++ b/assets/css/home.css @@ -6,6 +6,127 @@ body { background-color: #f2f2f6; } +/* section 1 */ +.sec-1-container { + max-width: 1400px; + width: 100%; + height: 100vh; + background-image: url('https://weblearnbd.net/tphtml/orfarm/assets/img/slider/shape-bg.jpg'); + background-size: cover; + background-repeat: no-repeat; + display: flex; + justify-content: center; + align-items: center; +} +.sec-1-img-block { + width: 500px; + height: 53vh; + display: flex; + justify-content: center; + align-items: center; +} +.sec-1-img-block img { + position: relative; + width: 100%; + max-height: 100%; + z-index: 0; +} +.sec-1-img-bl-leaves { + width: 500px; + height: 60vh; + position: absolute; + right: 0; +} +.sec-1-img-bl-leaves img { + position: absolute; + z-index: 1; +} +.sec-1-img-leaf-1 { + transform: scale(0.4); + top: 35%; + left: -60%; +} +.sec-1-img-leaf-2 { + transform: scale(0.5); + top: 50%; + left: 0%; +} +.sec-1-img-leaf-3 { + transform: scale(0.5); + top: -25%; + left: -25%; +} +.sec-1-img-leaf-4 { + transform: scale(0.5); + top: -40%; + left: -25%; +} +.sec-1-img-bl-leaves:hover .sec-1-img-leaf-1{ + transition: all .3s ease; + left: -55%; +} +.sec-1-img-bl-leaves:hover .sec-1-img-leaf-2{ + transition: all .3s ease; + left: 5%; +} +.sec-1-img-bl-leaves:hover .sec-1-img-leaf-3{ + transition: all .3s ease; + left: -20%; +} +.sec-1-img-bl-leaves:hover .sec-1-img-leaf-4{ + transition: all .3s ease; + left: -20%; +} +.sec-1-content { + max-width: 500px; + width: 100%; + height: 53vh; + max-height: 80vh; + display: flex; + flex-direction: column; + justify-content: center; + align-items: flex-start; +} +.sec-1-subtitle { + font-size: 16px; + color: #96ac00; + font-weight: 500; + display: block; + font-family: 'Jost', sans-serif; + margin-bottom: 1rem +} +.sec-1-title { + font-family: 'Quicksand', sans-serif; + font-weight: bold; + font-size: 40px; + color: #2d2a6e; + margin-bottom: 1rem; + line-height: 1em; +} +.sec-1-text { + font-family: 'Jost', sans-serif; + font-weight: 400; + font-size: 16px; + color: #4d5574; + line-height: 1em; +} +.sec-1-btn { + padding: 1.5rem 0; +} +.sec-1-btn .sec-1-btn-link { + background-color: #96ac00; + color: white; + font-family: 'Jost', sans-serif; + font-weight: 600; + font-size: 13px; + padding: 0.8rem 3.4rem; + border-radius: 50px; +} +.sec-1-btn .sec-1-btn-link:hover { + transition: all .3s ease; + background-color: #2d2a6e; + color: white; +} /* section 2 */ .sec-2-card { box-shadow: none; diff --git a/home.html b/home.html index 92ddc85..3fe9bd6 100644 --- a/home.html +++ b/home.html @@ -30,6 +30,132 @@ Document + +
From 03793a9b4c2d64a1308cea3455e16a9ab0d8e1c3 Mon Sep 17 00:00:00 2001 From: Babazade Date: Mon, 19 Dec 2022 17:32:35 +0400 Subject: [PATCH 10/36] bugfix/zarangul/home-page/top-seller-slide-responsive --- assets/css/home.css | 57 ++++++++++++++++++++++++++++++++++++++++++--- 1 file changed, 54 insertions(+), 3 deletions(-) diff --git a/assets/css/home.css b/assets/css/home.css index fe03801..77420fe 100644 --- a/assets/css/home.css +++ b/assets/css/home.css @@ -19,7 +19,7 @@ body { align-items: center; } .sec-1-img-block { - width: 500px; + width: 480px; height: 53vh; display: flex; justify-content: center; @@ -32,7 +32,7 @@ body { z-index: 0; } .sec-1-img-bl-leaves { - width: 500px; + width: 480px; height: 60vh; position: absolute; right: 0; @@ -78,7 +78,7 @@ body { left: -20%; } .sec-1-content { - max-width: 500px; + max-width: 450px; width: 100%; height: 53vh; max-height: 80vh; @@ -127,6 +127,57 @@ body { background-color: #2d2a6e; color: white; } +@media (max-width:991px) { + .sec-1-img-block { + width: 400px; + } + .sec-1-img-bl-leaves { + width: 400px; + } + .sec-1-content { + max-width: 350px; + } +} +@media (max-width:767px) { + .sec-1-img-block { + width: 320px; + } + .sec-1-img-bl-leaves { + display: none; + } + .sec-1-content { + max-width: 220px; + } + .sec-1-subtitle { + font-size: 14px; + } + .sec-1-title { + font-size: 30px; + } + .sec-1-text { + font-size: 14px; + } + .sec-1-btn { + padding: 1rem 0 0; + } + .sec-1-btn .sec-1-btn-link { + font-size: 12px; + padding: 0.7rem 2.7rem; + } +} +@media (max-width:575px) { + .sec-1-container { + flex-direction: column; + height: 120vh; + } + .sec-1-img-block { + width: 90%; + } + + .sec-1-content { + max-width: 90%; + } +} /* section 2 */ .sec-2-card { box-shadow: none; From 05b7e3af5ef1e789c43f0d66f65ff55b7c99866b Mon Sep 17 00:00:00 2001 From: Babazade Date: Mon, 19 Dec 2022 19:00:03 +0400 Subject: [PATCH 11/36] feature/zarangul/home-page/category-cards-slide --- assets/css/home.css | 16 +++ home.html | 315 ++++++++++++++++++++++++-------------------- 2 files changed, 188 insertions(+), 143 deletions(-) diff --git a/assets/css/home.css b/assets/css/home.css index 77420fe..13841f0 100644 --- a/assets/css/home.css +++ b/assets/css/home.css @@ -179,6 +179,22 @@ body { } } /* section 2 */ +.sec-2-carousel { + width: 100%; + height: 10rem; + display: flex; + justify-content: center; +} +.sec-2-carousel-inner { + height: 10rem; + width: 75%; + background-color: blue; +} +.sec-2-carousel-item { + width: 14rem; + background-color: red; +} +/* section 2 */ .sec-2-card { box-shadow: none; } diff --git a/home.html b/home.html index 3fe9bd6..b080f85 100644 --- a/home.html +++ b/home.html @@ -157,157 +157,186 @@

- -
-
-
- - category-1 - -
- -
-
-
- - Vegetables - -
-
05 items
-
-
- -
-
-
- - category-2 - -
- -
-
-
- - Fresh Fruits - -
-
06 items
+