From 72946cefb49f841192566ef1e4ae42f741357314 Mon Sep 17 00:00:00 2001 From: Art-Invis <151573705+Art-Invis@users.noreply.github.com> Date: Thu, 12 Sep 2024 14:46:56 +0300 Subject: [PATCH 01/23] Create index.html --- index.html | 160 +++++++++++++++++++++++++++++++++++++++++++++++++++++ 1 file changed, 160 insertions(+) create mode 100644 index.html diff --git a/index.html b/index.html new file mode 100644 index 0000000..70c29ce --- /dev/null +++ b/index.html @@ -0,0 +1,160 @@ + + + + + + Landie + + + + + +
+
+
+
+
Landie
+
+ +
+ + +
+
+
+
+
+ + +
+
+

Introduce Your Product Quickly & Effectively

+

Lorem ipsum dolor sit amet, consectetuer adipiscing elit. Aenean commodo + ligula eget dolor. Aenean massa. Cum sociis natoque penatibus et magnis + dis parturient montes, nascetur ridiculus mus.

+

Donec quam felis, ultricies nec, pellentesque eu, pretium quis, sem. + Nulla consequat massa quis enim.

+ +
+
+ Main icon +

Title Goes Here

+

Lorem ipsum dolor sit amet, consectetuer adipiscing elit. Aenean commodo ligula eget dolor.

+
+
+ Main icon +

Title Goes Here

+

Lorem ipsum dolor sit amet, consectetuer adipiscing elit. Aenean commodo ligula eget dolor.

+
+
+ Planshet here +
+
+
+
+ +
+
+

Light, Fast & Powerful

+

Lorem ipsum dolor sit amet, consectetuer adipiscing elit. Aenean commodo + ligula eget dolor. Aenean massa. Cum sociis natoque penatibus et magnis + dis parturient montes, nascetur ridiculus mus.

+

Donec quam felis, ultricies nec, pellentesque eu, pretium quis, sem. + Nulla consequat massa quis enim.

+ +
+
+ Main icon +

Title Goes Here

+

Lorem ipsum dolor sit amet, consectetuer adipiscing elit. Aenean commodo ligula eget dolor.

+
+
+ Main icon +

Title Goes Here

+

Lorem ipsum dolor sit amet, consectetuer adipiscing elit. Aenean commodo ligula eget dolor.

+
+
+ Undrown_mobile_login here +
+
+
+
+ +
+
+

A Price To Suit Everyone

+

Lorem ipsum dolor sit amet, consectetuer adipiscing elit. + Aenean commodo ligula eget dolor. Aenean massa. + Cum sociis natoque penatibus et magnis dis parturient montes, nascetur ridiculus

+
+
+

FREE

+

UI Kit Demo

+

Lorem ipsum dolor sit amet, consectetuer adipiscing elit. + Aenean commodo ligula eget dolor.

+

Aenean massa. + Cum sociis natoque penatibus et magnis dis parturient montes,

+ +
+
+

$40

+

Design Kit

+

Lorem ipsum dolor sit amet, consectetuer adipiscing elit. + Aenean commodo ligula eget dolor.

+

Aenean massa. + Cum sociis natoque penatibus et magnis dis parturient montes,

+ +
+
+

$75

+

Design & Code Package

+

Lorem ipsum dolor sit amet, consectetuer adipiscing elit. + Aenean commodo ligula eget dolor.

+

Aenean massa. + Cum sociis natoque penatibus et magnis dis parturient montes,

+ +
+
+
+
+ + + +
+ + From 878b35831fe79230940aa2226003dc59f1a391dd Mon Sep 17 00:00:00 2001 From: Art-Invis <151573705+Art-Invis@users.noreply.github.com> Date: Thu, 12 Sep 2024 14:49:15 +0300 Subject: [PATCH 02/23] Add all files for creating website --- css/footer.css | 111 ++++++++++++++++++++++++++++++++ css/globals.css | 86 +++++++++++++++++++++++++ css/header.css | 92 ++++++++++++++++++++++++++ css/main.css | 78 ++++++++++++++++++++++ css/normalise.min.css | 1 + css/prefooter.css | 64 ++++++++++++++++++ css/styles.css | 12 ++++ images/Facebook.svg | 5 ++ images/Icon.svg | 5 ++ images/Instagram.svg | 5 ++ images/Linkedin.svg | 5 ++ images/Planshet.svg | 99 ++++++++++++++++++++++++++++ images/Twitter.svg | 5 ++ images/Undrown_mobile_login.svg | 58 +++++++++++++++++ images/Youtube.svg | 5 ++ 15 files changed, 631 insertions(+) create mode 100644 css/footer.css create mode 100644 css/globals.css create mode 100644 css/header.css create mode 100644 css/main.css create mode 100644 css/normalise.min.css create mode 100644 css/prefooter.css create mode 100644 css/styles.css create mode 100644 images/Facebook.svg create mode 100644 images/Icon.svg create mode 100644 images/Instagram.svg create mode 100644 images/Linkedin.svg create mode 100644 images/Planshet.svg create mode 100644 images/Twitter.svg create mode 100644 images/Undrown_mobile_login.svg create mode 100644 images/Youtube.svg diff --git a/css/footer.css b/css/footer.css new file mode 100644 index 0000000..12e33ea --- /dev/null +++ b/css/footer.css @@ -0,0 +1,111 @@ +.footer { + background-color: #f8f9fa; + padding: 20px 0; + height: 282px; + width: 100%; + position: relative; + box-sizing: border-box; +} + +.footer__date{ + position: absolute; + top: 37px; + left: 165px; + width: 83px; + height: 24px; + color: #939EA4; + font-size: 14px; + font-weight: 500; + line-height: 24px +} + +.footer__title { + position: absolute; + top: 42px; /* Відстань від верхнього краю футера */ + right: 165px; /* Відстань від правого краю футера */ + font-size: 26px; + color: #37447E; + font-weight: 900; + white-space: nowrap; /* Запобігає переносу тексту */ +} + +.footer__container { + display: flex; + flex-direction: column; + align-items: center; + padding-top: 80px; /* Збільшено відступ зверху для звільнення місця для заголовка і риски */ +} + +.footer__line { + width: 100%; /* Використовує ширину футера */ + max-width: 1110px; /* Максимальна ширина риски */ + border: 1px solid #CDD1D4; + margin-top: 25px; /* Відстань між рискою і кнопкою */ +} + +.footer__button { + background-color: #111B47; + display: flex; + justify-content: center; + align-items: center; + width: 109px; + height: 26px; + color: white; + font-size: 12px; + font-weight: 500; + border: none; + border-radius: 2px; + cursor: pointer; + margin-top: 22px; /* Відступ під кнопкою */ +} + +.footer__button:hover { + background-color: #0056b3; +} + +.footer__text p { + margin: 5px 0; + font-size: 14px; + color: #6c757d; +} + +.footer__links ul { + list-style: none; + padding: 0; + display: flex; + gap: 60px; +} + +.footer__links ul li { + display: inline-block; +} + + +.footer__links ul li a { + color: #929ECC; + text-decoration: none; + font-size: 14px; + transition: color 0.2s ease; +} + +.footer__links ul li a:hover { + color: darkblue; +} + +.footer__social { + margin-bottom: 26px; +} + +.footer__social a { + display: inline-block; + margin-right: 30px; +} + +.footer__social a:last-child { + margin-right: 0; +} + +.footer__social img { + width: 16px; + height: auto; +} diff --git a/css/globals.css b/css/globals.css new file mode 100644 index 0000000..6a8d25b --- /dev/null +++ b/css/globals.css @@ -0,0 +1,86 @@ +body{ + + font-family: "Roboto", "Arial", sans-serif; + color: #37447E; +} + +a{ + text-decoration: none; + color: #37447E; +} + +li{ + display: block; +} + +/* Global clasess */ + +.full-page{ + max-width: 1440px; + height: 2524px; + background: #fff; + +} +.container{ + margin: 0 auto; + max-width: 1110px; + position: relative; + overflow: hidden; +} + +.container1{ + margin: 0 auto; + max-width: 1105px; + height: 702px; +} + +.container2{ + margin: 0 auto; + max-width: 1105px; + height: 738px; +} + +.container3{ + margin: 0 auto; + max-width: 1105px; + height: 770px; + +} + +.footer_container{ + width: 1440px; +} + +.default-button{ + width: 189px; + height: 26px; + flex-shrink: 0; + border-radius: 2px; + background: #111B47; + color: #fff; + color: #FFF; + + text-align: center; + font-size: 12px; + font-style: normal; + font-weight: 500; + line-height: 18px; +} + +.title1{ + color: #091133; + font-size: 36px; + font-style: normal; + font-weight: 500; + line-height: 48px; + margin-bottom: 23px; +} + +.paragraph{ + color: #6F7CB2; + font-size: 16px; + font-style: normal; + font-weight: 400; + line-height: 26px; + +} \ No newline at end of file diff --git a/css/header.css b/css/header.css new file mode 100644 index 0000000..29a511a --- /dev/null +++ b/css/header.css @@ -0,0 +1,92 @@ +.header { + display: flex; + justify-content: space-between; + align-items: center; +} + +.header__title { + font-weight: 900; + font-size: 26px; +} + +.header__right-side { + display: flex; + align-items: center; +} + +.header__nav { + margin-right: 30px; +} + +.header__nav ul { + display: flex; + list-style: none; + margin: 0; + padding: 0; +} + +.header__nav-item { + margin-right: 30px; +} + +.header__nav-item a { + color: #505F98; + font-size: 14px; + line-height: 24px; + font-weight: 400; + padding: 10px; + text-decoration: none; + cursor: pointer; +} + +.header__nav-item a:hover { + color: darkblue; +} + +.header__buttons { + display: flex; + gap: 26px; +} + +.header__buy-now { + background-color: #FFD166; + color: #111B47; + width: 104px; + height: 26px; + border-radius: 2px; + font-size: 12px; + font-weight: 600; + line-height: 18px; + cursor: pointer; + transition: background-color 0.2s ease; + text-align: center; + line-height: 18px; + border: none; +} + +.header__buy-now:hover { + background-color: #FFBF00; +} + +.header__learn-more { + background-color: #111B47; + color: white; + width: 104px; + height: 26px; + border-radius: 2px; + font-size: 12px; + font-weight: 600; + line-height: 18px; + cursor: pointer; + transition: background-color 0.2s ease; + text-align: center; + line-height: 18px; + border: none; +} + +.header__learn-more:hover { + background-color: #0056b3; +} + + + diff --git a/css/main.css b/css/main.css new file mode 100644 index 0000000..532cb6d --- /dev/null +++ b/css/main.css @@ -0,0 +1,78 @@ +.hero__inner{ + position: relative; + width: 540px; + padding-top: 120px; + z-index: 1; +} + +.main__inner{ + position: relative; + width: 540px; + padding-top: 160px; +} + + +.icon-container1 { + display: flex; + justify-content: flex-start; + gap: 30px; + margin-bottom: 259px; + margin-top: 45px; +} + + +.icon-container2 { + display: flex; + justify-content: flex-start; + gap: 30px; + margin-bottom: 259px; + margin-top: 80px; +} + +.icon-item { + text-align: left; + width: 255px; +} + +.icon-item img { + width: 36px; + height: auto; +} + +.icon-title { + color: #091133; + font-size: 16px; + font-style: normal; + font-weight: 500; + line-height: 26px; + margin: 14px 0 6px 0; + +} + +.icon-text { + color: #5D6970; + font-size: 12px; + font-weight: 400; + line-height: 18px; + +} + +.tablet-image-container1 { + position: absolute; + top: 28%; + left: 650px; + width: 1092px; + height: 562px; + overflow: hidden; + z-index: -1; +} + +.tablet-image-container2{ + position: absolute; + top: 165px; + left: 560px; + width: 100%; + height: 100%; + overflow: hidden; + z-index: 0 +} diff --git a/css/normalise.min.css b/css/normalise.min.css new file mode 100644 index 0000000..1854c29 --- /dev/null +++ b/css/normalise.min.css @@ -0,0 +1 @@ +/*! normalize.css v8.0.1 | MIT License | github.com/necolas/normalize.css */html{line-height:1.15;-webkit-text-size-adjust:100%}body{margin:0}main{display:block}h1{font-size:2em;margin:.67em 0}hr{box-sizing:content-box;height:0;overflow:visible}pre{font-family:monospace,monospace;font-size:1em}a{background-color:transparent}abbr[title]{border-bottom:none;text-decoration:underline;text-decoration:underline dotted}b,strong{font-weight:bolder}code,kbd,samp{font-family:monospace,monospace;font-size:1em}small{font-size:80%}sub,sup{font-size:75%;line-height:0;position:relative;vertical-align:baseline}sub{bottom:-.25em}sup{top:-.5em}img{border-style:none}button,input,optgroup,select,textarea{font-family:inherit;font-size:100%;line-height:1.15;margin:0}button,input{overflow:visible}button,select{text-transform:none}[type=button],[type=reset],[type=submit],button{-webkit-appearance:button}[type=button]::-moz-focus-inner,[type=reset]::-moz-focus-inner,[type=submit]::-moz-focus-inner,button::-moz-focus-inner{border-style:none;padding:0}[type=button]:-moz-focusring,[type=reset]:-moz-focusring,[type=submit]:-moz-focusring,button:-moz-focusring{outline:1px dotted ButtonText}fieldset{padding:.35em .75em .625em}legend{box-sizing:border-box;color:inherit;display:table;max-width:100%;padding:0;white-space:normal}progress{vertical-align:baseline}textarea{overflow:auto}[type=checkbox],[type=radio]{box-sizing:border-box;padding:0}[type=number]::-webkit-inner-spin-button,[type=number]::-webkit-outer-spin-button{height:auto}[type=search]{-webkit-appearance:textfield;outline-offset:-2px}[type=search]::-webkit-search-decoration{-webkit-appearance:none}::-webkit-file-upload-button{-webkit-appearance:button;font:inherit}details{display:block}summary{display:list-item}template{display:none}[hidden]{display:none} \ No newline at end of file diff --git a/css/prefooter.css b/css/prefooter.css new file mode 100644 index 0000000..4c7a9b5 --- /dev/null +++ b/css/prefooter.css @@ -0,0 +1,64 @@ +.prefooter { + padding-top: 59px; + margin: 0 auto; +} + +.prefooter__paragraph { + width: 730px; + color: #6F7CB2; + font-size: 16px; + font-weight: 400; + line-height: 26px; + margin-bottom: 88px; +} + +.info { + display: flex; + gap: 30px; +} + +.price__title { + display: flex; + color: #37447E; + font-size: 36px; + font-weight: 500; + line-height: 48px; + width: 350px; + margin: 0 auto; +} + +.info__title { + color: #091133; + font-size: 22px; + font-weight: 500; + line-height: 32px; + margin-top: 16px; + margin-bottom: 8px; +} + +.info__text{ + color: #5D6970; + font-size: 14px; + font-weight: 400; + line-height: 24px; +} + +.info__button { + background-color: #111B47; + width: 189px; + height: 26px; + color: white; + border: none; + font-size: 12px; + font-weight: 500; + border-radius: 2px; + cursor: pointer; + transition: background-color 0.2s ease; + text-align: center; + line-height: 18px; + margin-bottom: 213px; +} + +.info__button:hover { + background-color: #0056b3; +} diff --git a/css/styles.css b/css/styles.css new file mode 100644 index 0000000..6162957 --- /dev/null +++ b/css/styles.css @@ -0,0 +1,12 @@ +@import"./normalize.min.css"; + +@import"./globals.css"; + +@import"./header.css"; + +@import"./main.css"; + +@import"./footer.css"; + +@import"./prefooter.css"; + diff --git a/images/Facebook.svg b/images/Facebook.svg new file mode 100644 index 0000000..6aa0324 --- /dev/null +++ b/images/Facebook.svg @@ -0,0 +1,5 @@ + + + + + diff --git a/images/Icon.svg b/images/Icon.svg new file mode 100644 index 0000000..b6d8027 --- /dev/null +++ b/images/Icon.svg @@ -0,0 +1,5 @@ + + + + + diff --git a/images/Instagram.svg b/images/Instagram.svg new file mode 100644 index 0000000..ccae004 --- /dev/null +++ b/images/Instagram.svg @@ -0,0 +1,5 @@ + + + + + diff --git a/images/Linkedin.svg b/images/Linkedin.svg new file mode 100644 index 0000000..2a779d4 --- /dev/null +++ b/images/Linkedin.svg @@ -0,0 +1,5 @@ + + + + + diff --git a/images/Planshet.svg b/images/Planshet.svg new file mode 100644 index 0000000..c223b75 --- /dev/null +++ b/images/Planshet.svg @@ -0,0 +1,99 @@ + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + diff --git a/images/Twitter.svg b/images/Twitter.svg new file mode 100644 index 0000000..ea600e8 --- /dev/null +++ b/images/Twitter.svg @@ -0,0 +1,5 @@ + + + + + diff --git a/images/Undrown_mobile_login.svg b/images/Undrown_mobile_login.svg new file mode 100644 index 0000000..102e920 --- /dev/null +++ b/images/Undrown_mobile_login.svg @@ -0,0 +1,58 @@ + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + diff --git a/images/Youtube.svg b/images/Youtube.svg new file mode 100644 index 0000000..de8ce70 --- /dev/null +++ b/images/Youtube.svg @@ -0,0 +1,5 @@ + + + + + From 6aba09b4cceea1c1df3b2452697a1b4b0fa8c319 Mon Sep 17 00:00:00 2001 From: Art-Invis <151573705+Art-Invis@users.noreply.github.com> Date: Thu, 12 Sep 2024 14:51:47 +0300 Subject: [PATCH 03/23] Changing name of css' file --- css/{main.css => hero-and-main.css} | 0 1 file changed, 0 insertions(+), 0 deletions(-) rename css/{main.css => hero-and-main.css} (100%) diff --git a/css/main.css b/css/hero-and-main.css similarity index 100% rename from css/main.css rename to css/hero-and-main.css From 33d215b2a72fd0079fe6ae2b8ae5b28cf640073e Mon Sep 17 00:00:00 2001 From: Art-Invis <151573705+Art-Invis@users.noreply.github.com> Date: Thu, 12 Sep 2024 17:03:23 +0300 Subject: [PATCH 04/23] Update footer.css --- css/footer.css | 18 +++++++++--------- 1 file changed, 9 insertions(+), 9 deletions(-) diff --git a/css/footer.css b/css/footer.css index 12e33ea..238fc05 100644 --- a/css/footer.css +++ b/css/footer.css @@ -1,5 +1,5 @@ .footer { - background-color: #f8f9fa; + background-color: #E7ECFF; padding: 20px 0; height: 282px; width: 100%; @@ -21,26 +21,26 @@ .footer__title { position: absolute; - top: 42px; /* Відстань від верхнього краю футера */ - right: 165px; /* Відстань від правого краю футера */ + top: 42px; + right: 165px; font-size: 26px; color: #37447E; font-weight: 900; - white-space: nowrap; /* Запобігає переносу тексту */ + white-space: nowrap; } .footer__container { display: flex; flex-direction: column; align-items: center; - padding-top: 80px; /* Збільшено відступ зверху для звільнення місця для заголовка і риски */ + padding-top: 80px; } .footer__line { - width: 100%; /* Використовує ширину футера */ - max-width: 1110px; /* Максимальна ширина риски */ + width: 100%; + max-width: 1110px; border: 1px solid #CDD1D4; - margin-top: 25px; /* Відстань між рискою і кнопкою */ + margin-top: 25px; } .footer__button { @@ -56,7 +56,7 @@ border: none; border-radius: 2px; cursor: pointer; - margin-top: 22px; /* Відступ під кнопкою */ + margin-top: 22px; } .footer__button:hover { From 077ccf9a852b4b3ddae45e200ba810666d168169 Mon Sep 17 00:00:00 2001 From: Art-Invis <151573705+Art-Invis@users.noreply.github.com> Date: Thu, 12 Sep 2024 20:16:29 +0300 Subject: [PATCH 05/23] Small changes --- css/footer.css | 38 +++++++++++++++++++------------------- css/globals.css | 5 ++--- css/prefooter.css | 2 +- 3 files changed, 22 insertions(+), 23 deletions(-) diff --git a/css/footer.css b/css/footer.css index 238fc05..17ef555 100644 --- a/css/footer.css +++ b/css/footer.css @@ -7,7 +7,7 @@ box-sizing: border-box; } -.footer__date{ +.footer__date { position: absolute; top: 37px; left: 165px; @@ -16,31 +16,31 @@ color: #939EA4; font-size: 14px; font-weight: 500; - line-height: 24px + line-height: 24px; } .footer__title { position: absolute; - top: 42px; - right: 165px; + top: 42px; + right: 165px; font-size: 26px; color: #37447E; font-weight: 900; - white-space: nowrap; + white-space: nowrap; } .footer__container { display: flex; flex-direction: column; align-items: center; - padding-top: 80px; + padding-top: 80px; } .footer__line { - width: 100%; - max-width: 1110px; + width: 100%; + max-width: 1110px; border: 1px solid #CDD1D4; - margin-top: 25px; + margin-top: 25px; } .footer__button { @@ -56,7 +56,7 @@ border: none; border-radius: 2px; cursor: pointer; - margin-top: 22px; + margin-top: 22px; } .footer__button:hover { @@ -80,25 +80,25 @@ display: inline-block; } - .footer__links ul li a { - color: #929ECC; - text-decoration: none; + color: #929ECC; + text-decoration: none; font-size: 14px; - transition: color 0.2s ease; + transition: color 0.2s ease; + margin-bottom: 26px; } .footer__links ul li a:hover { - color: darkblue; + color: darkblue; } .footer__social { - margin-bottom: 26px; + margin-top: 10px; /* Відстань між соцмережами і навігацією */ } .footer__social a { display: inline-block; - margin-right: 30px; + margin-right: 30px; } .footer__social a:last-child { @@ -106,6 +106,6 @@ } .footer__social img { - width: 16px; - height: auto; + width: 16px; + height: 16px; } diff --git a/css/globals.css b/css/globals.css index 6a8d25b..69291ea 100644 --- a/css/globals.css +++ b/css/globals.css @@ -5,7 +5,6 @@ body{ } a{ - text-decoration: none; color: #37447E; } @@ -25,7 +24,7 @@ li{ margin: 0 auto; max-width: 1110px; position: relative; - overflow: hidden; + } .container1{ @@ -67,7 +66,7 @@ li{ line-height: 18px; } -.title1{ +.title{ color: #091133; font-size: 36px; font-style: normal; diff --git a/css/prefooter.css b/css/prefooter.css index 4c7a9b5..9d2397a 100644 --- a/css/prefooter.css +++ b/css/prefooter.css @@ -56,7 +56,7 @@ transition: background-color 0.2s ease; text-align: center; line-height: 18px; - margin-bottom: 213px; + margin-top: 20px; } .info__button:hover { From 12fefa9efd017e36ca5cae7b23569ae828733de5 Mon Sep 17 00:00:00 2001 From: Art-Invis <151573705+Art-Invis@users.noreply.github.com> Date: Thu, 12 Sep 2024 20:59:12 +0300 Subject: [PATCH 06/23] Update styles.css --- css/styles.css | 2 +- 1 file changed, 1 insertion(+), 1 deletion(-) diff --git a/css/styles.css b/css/styles.css index 6162957..8c6344b 100644 --- a/css/styles.css +++ b/css/styles.css @@ -4,7 +4,7 @@ @import"./header.css"; -@import"./main.css"; +@import"./hero-and-main.css"; @import"./footer.css"; From d34a76138ed93244c9fb29db2fd2a3526a34ef45 Mon Sep 17 00:00:00 2001 From: Art-Invis <151573705+Art-Invis@users.noreply.github.com> Date: Thu, 12 Sep 2024 21:09:45 +0300 Subject: [PATCH 07/23] Update index.html --- index.html | 6 +++--- 1 file changed, 3 insertions(+), 3 deletions(-) diff --git a/index.html b/index.html index 70c29ce..dfb731e 100644 --- a/index.html +++ b/index.html @@ -40,7 +40,7 @@
-

Introduce Your Product Quickly & Effectively

+

Introduce Your Product Quickly & Effectively

Lorem ipsum dolor sit amet, consectetuer adipiscing elit. Aenean commodo ligula eget dolor. Aenean massa. Cum sociis natoque penatibus et magnis dis parturient montes, nascetur ridiculus mus.

@@ -67,7 +67,7 @@

Title Goes Here

-

Light, Fast & Powerful

+

Light, Fast & Powerful

Lorem ipsum dolor sit amet, consectetuer adipiscing elit. Aenean commodo ligula eget dolor. Aenean massa. Cum sociis natoque penatibus et magnis dis parturient montes, nascetur ridiculus mus.

@@ -94,7 +94,7 @@

Title Goes Here

-

A Price To Suit Everyone

+

A Price To Suit Everyone

Lorem ipsum dolor sit amet, consectetuer adipiscing elit. Aenean commodo ligula eget dolor. Aenean massa. Cum sociis natoque penatibus et magnis dis parturient montes, nascetur ridiculus

From c86c07978e3a2883519491e373572df407b9a2a7 Mon Sep 17 00:00:00 2001 From: Art-Invis <151573705+Art-Invis@users.noreply.github.com> Date: Thu, 12 Sep 2024 21:15:44 +0300 Subject: [PATCH 08/23] Update footer.css --- css/footer.css | 4 ---- 1 file changed, 4 deletions(-) diff --git a/css/footer.css b/css/footer.css index 17ef555..798be18 100644 --- a/css/footer.css +++ b/css/footer.css @@ -76,9 +76,6 @@ gap: 60px; } -.footer__links ul li { - display: inline-block; -} .footer__links ul li a { color: #929ECC; @@ -97,7 +94,6 @@ } .footer__social a { - display: inline-block; margin-right: 30px; } From e21fc496192b49a5724ece3e35de9c19c17213e5 Mon Sep 17 00:00:00 2001 From: Art-Invis <151573705+Art-Invis@users.noreply.github.com> Date: Thu, 12 Sep 2024 22:05:17 +0300 Subject: [PATCH 09/23] Update footer.css --- css/footer.css | 23 ++++++++++++++++++++--- 1 file changed, 20 insertions(+), 3 deletions(-) diff --git a/css/footer.css b/css/footer.css index 798be18..aedc8bd 100644 --- a/css/footer.css +++ b/css/footer.css @@ -5,6 +5,7 @@ width: 100%; position: relative; box-sizing: border-box; + width: 1440px; } .footer__date { @@ -56,7 +57,7 @@ border: none; border-radius: 2px; cursor: pointer; - margin-top: 22px; + margin-top: 15px; } .footer__button:hover { @@ -69,19 +70,32 @@ color: #6c757d; } +.footer__links { + margin: 0 auto; + display: flex; + justify-content: center; + +} + .footer__links ul { - list-style: none; padding: 0; display: flex; gap: 60px; + margin: 0 auto; } +.footer__links ul li { + display: inline-block; + margin-top: 22px; +} .footer__links ul li a { + margin: 0 auto; color: #929ECC; text-decoration: none; font-size: 14px; transition: color 0.2s ease; + flex-shrink: 0; margin-bottom: 26px; } @@ -90,11 +104,14 @@ } .footer__social { - margin-top: 10px; /* Відстань між соцмережами і навігацією */ + margin: 0 auto; + } .footer__social a { + display: inline-block; margin-right: 30px; + margin-top: 26px; } .footer__social a:last-child { From 5988507ef7b116ee93d984f6592fd762cf3efdb6 Mon Sep 17 00:00:00 2001 From: Art-Invis <151573705+Art-Invis@users.noreply.github.com> Date: Fri, 13 Sep 2024 15:54:46 +0300 Subject: [PATCH 10/23] Update index.html --- index.html | 58 +++++++++++++++++++++++++++++------------------------- 1 file changed, 31 insertions(+), 27 deletions(-) diff --git a/index.html b/index.html index dfb731e..611a2d7 100644 --- a/index.html +++ b/index.html @@ -29,8 +29,8 @@
- - + Learn more + Buy Now
@@ -39,30 +39,34 @@
-
-

Introduce Your Product Quickly & Effectively

-

Lorem ipsum dolor sit amet, consectetuer adipiscing elit. Aenean commodo - ligula eget dolor. Aenean massa. Cum sociis natoque penatibus et magnis - dis parturient montes, nascetur ridiculus mus.

-

Donec quam felis, ultricies nec, pellentesque eu, pretium quis, sem. - Nulla consequat massa quis enim.

- -
-
- Main icon -

Title Goes Here

-

Lorem ipsum dolor sit amet, consectetuer adipiscing elit. Aenean commodo ligula eget dolor.

-
-
- Main icon -

Title Goes Here

-

Lorem ipsum dolor sit amet, consectetuer adipiscing elit. Aenean commodo ligula eget dolor.

+
+
+

Introduce Your Product Quickly & Effectively

+

Lorem ipsum dolor sit amet, consectetuer adipiscing elit. Aenean commodo + ligula eget dolor. Aenean massa. Cum sociis natoque penatibus et magnis + dis parturient montes, nascetur ridiculus mus.

+

Donec quam felis, ultricies nec, pellentesque eu, pretium quis, sem. + Nulla consequat massa quis enim.

+ +
+
+ Main icon +

Title Goes Here

+

Lorem ipsum dolor sit amet, consectetuer adipiscing elit. Aenean commodo ligula eget dolor.

+
+
+ Main icon +

Title Goes Here

+

Lorem ipsum dolor sit amet, consectetuer adipiscing elit. Aenean commodo ligula eget dolor.

+
-
- Planshet here -
+ +
+ Planshet here +
+
@@ -106,7 +110,7 @@

UI Kit Demo

Aenean commodo ligula eget dolor.

Aenean massa. Cum sociis natoque penatibus et magnis dis parturient montes,

- + Purchase Now

$40

@@ -115,7 +119,7 @@

Design Kit

Aenean commodo ligula eget dolor.

Aenean massa. Cum sociis natoque penatibus et magnis dis parturient montes,

- + Purchase Design Kit

$75

@@ -124,7 +128,7 @@

Design & Code Package

Aenean commodo ligula eget dolor.

Aenean massa. Cum sociis natoque penatibus et magnis dis parturient montes,

- + Purchase Package
@@ -136,7 +140,7 @@

Design & Code Package