From 5a0244a305d145a81ff9e6c2cc33f8c08e70b51d Mon Sep 17 00:00:00 2001 From: Maria Carolina Date: Tue, 11 Oct 2022 22:07:45 -0300 Subject: [PATCH] Section 01 --- css/style.css | 101 ++++++++++++++++++++++++++++++-------------------- index.html | 67 +++++++++++++++++++++++++-------- 2 files changed, 113 insertions(+), 55 deletions(-) diff --git a/css/style.css b/css/style.css index 15fe795..a4d556a 100644 --- a/css/style.css +++ b/css/style.css @@ -1,48 +1,69 @@ -*{ - padding: 0; - margin: 0; +@import url("https://fonts.googleapis.com/css2?family=Inter:wght@100;200;300;400;500;600;700;800;900&display=swap"); + +* { + padding: 0; + margin: 0; + font-family: "Inter", sans-serif; } -.header-logo{ - background-color: black; - display: flex; - justify-content: center; +.header-logo { + background-color: black; + display: flex; + justify-content: center; } -.logo{ - width: 12%; - margin-top: 29px; - margin-bottom: 29px; +.logo { + width: 12%; + margin-top: 29px; + margin-bottom: 29px; } -.header-computer{ - width: 100%; +.header-computer { + width: 100%; } -.computers{ - width: 100%; - display: flex; - justify-content: center; - margin-top: 73px; +.computers { + width: 100%; + display: flex; + justify-content: center; + margin-top: 73px; } -.info{ +.info { + text-align: center; + margin: 73px; +} +.image-computer { + width: 17%; + margin-bottom: 3rem; +} +p { + font-size: 16px; + line-height: 24px; + font: weight 400px; + text-align: center; + justify-content: center; +} +.text { + margin-top: 28px; +} +.lorem { + font-size: 32px; + font-weight: 400px; + line-height: 38px; +} +.dolor { + font-size: 48px; + font-weight: 500px; + line-height: 58px; +} +.square{ + box-shadow: 0px 4px 20px #0000003b; text-align: center; - margin: 73px; + padding: 1em; + flex: 1 1 250px; + background-color: white; + padding: 3em 0; + align-items: center; } -.image-computer{ - width: 17%; +.container-3{ + display: flex; + gap: 1em; + flex-wrap: wrap; + padding: 1em; } -p{ - font-size: 16px; - line-height: 24px; - font: weight 400px; -} -.text{ - margin-top: 28px; -} -.lorem{ - font-size: 32px; - font-weight: 400px; - line-height: 38px; -} -.dolor{ - font-size: 48px; - font-weight: 500px; - line-height: 58px; -} \ No newline at end of file diff --git a/index.html b/index.html index fdfcd4c..e483443 100644 --- a/index.html +++ b/index.html @@ -1,33 +1,70 @@ - + + - - - - + + + + challenge-landing-page + +
- + Capa-notebook
+
+
-

LOREM IPSUM

-

DOLOR SIT AMET

-

Lorem ipsum dolor sit amet, consectetur adipiscing elit. Cras euismod enim non dui fringilla interdum.

-

Curabitur ut tortor sed lacus egestas vulputate vel sit amet velit. Nulla suscipit magna dui.

-
- -
-
+

LOREM IPSUM

+

DOLOR SIT AMET

+

+ Lorem ipsum dolor sit amet, consectetur adipiscing elit. Cras + euismod enim non dui fringilla interdum. +

+

+ Curabitur ut tortor sed lacus egestas vulputate vel sit amet velit. + Nulla suscipit magna dui. +

+
+ rede-Computadores +
+ + +
+
+
+ shopp +
+

Lorem ipsum dolor sit amet, consectetur adipiscing elit. Cras euismod enim non dui fringilla + interdum.

+
+
+
+ shopping-bag +
+

Lorem ipsum dolor sit amet, consectetur adipiscing elit. Cras euismod enim non dui fringilla + interdum.

+
+
+
+ money +
+

Lorem ipsum dolor sit amet, consectetur adipiscing elit. Cras euismod enim non dui fringilla + interdum.

+
+
+
+ \ No newline at end of file