+
+
+
+
+Introducing Karma
+Bring WiFi with you, everywhere you go.
+ + +Everyone needs a little Karma
+ +
+ 
+ 
+ 
+
+
+
+
+
+
+
+Internet for all devices
+Boost your productivity
+Pay as You Go
+
+
+
+
+
+Karma Mobility, Ink ©
+ From 4b962e5c481d5b5cbf825e0e6722c73a9471ea08 Mon Sep 17 00:00:00 2001 From: Innapoliakova <113248050+Innapoliakova@users.noreply.github.com> Date: Fri, 4 Nov 2022 23:02:13 +0000 Subject: [PATCH 2/3] Added Store page --- css/store.css | 0 css/style.css | 129 +++++++++++++++++++++++++++++++++++++++++++++++-- index.html | 20 ++++++-- store.html | 130 ++++++++++++++++++++++++++++++++++++++++++++++++++ 4 files changed, 271 insertions(+), 8 deletions(-) create mode 100644 css/store.css create mode 100644 store.html diff --git a/css/store.css b/css/store.css new file mode 100644 index 000000000..e69de29bb diff --git a/css/style.css b/css/style.css index 6fa48563b..578868938 100755 --- a/css/style.css +++ b/css/style.css @@ -42,10 +42,6 @@ float:left; } -body { - font-family: 'Roboto', sans-serif; - -webkit-font-smoothing: antialiased; -} p, h2 { text-align: center; @@ -121,9 +117,132 @@ p, h2 { color: #50525a; } +.new { + display: grid; + grid-template-columns: 1fr 1.5fr; + grid-template-rows: auto; + +} + +.picture { + grid-column: 1/2; + +} + +.text { + grid-column: 2/3; + font-style: italic; + text-align: center; + font-size: 42px; + line-height: 49.22px; + align-items: center; +width: 548px; +height: 141px; + display: block; + padding-top: 96px; + padding-bottom: 202px; + padding-left: 156px; + padding-right: 137px; + background: rgba(224, 99, 58, 0.1); +} + + +.text button { + +display: flex; +font-family: 'Roboto'; +font-style: normal; +font-weight: 400; +font-size: 24px; +line-height: 28px; +text-align: center; +margin-left: auto; +margin-right: auto; +margin-top: 50px; +padding-left: 20px; +padding-right: 20px; +padding-top: 10px; +padding-bottom: 10px; +color: white; +background-color: #e0633a; +border: none; +border-radius: 2.5px; +} + +.main-form button { + + display: flex; + font-family: 'Roboto'; + font-style: normal; + font-weight: 400; + font-size: 24px; + line-height: 28px; + margin-top: 30px; + padding-left: 20px; + padding-right: 20px; + padding-top: 10px; + padding-bottom: 10px; + color: white; + background-color: #e0633a; + border: none; + border-radius: 2.5px; + text-align: left; + } + + .term-agree { + margin-bottom: 70px; + } + +.main-form { + display: grid; + grid-template-columns: 1fr 1fr; + grid-template-rows: auto; + grid-template-areas: "c p"; + + +} + +.main-form p { + font-size: medium; +} + +.main-container { + grid-area: c; + grid-column: 1/2; + margin-left: 200px; + margin-right: 200px; + margin-top: 100px; + margin-bottom: 70px; + +} + +.picture-form { + grid-area: p; + grid-column: 2/3; + background-image: url(file:///C:/Users/%D0%98%D0%BD%D0%BD%D0%B0/Desktop/CYF_Folder/HTML-CSS-Module-Project/level-2/store-image_by-andrew-neel-unsplash.jpg); + height: 700px; + width: 300px; + color:white; +} + +.heading-form { + color: + #DE6E49; + font-size: 20px; +} + + + +select { + color: #666666 + font-family'Roboto'; +font-style: italic; +line-height: 25px; +} + #line { border-bottom: 1px solid #C9C4C4; - ; + } .join { display: flex; diff --git a/index.html b/index.html index 7611941e7..bef0ae981 100755 --- a/index.html +++ b/index.html @@ -18,9 +18,9 @@ - -
-
-
-
-
-
-Order your Karma wifi device today!
- - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - -Select a colour
- - - - - - - - - - - - - -
+
+
+
+