From a66ad13d087cffa008e35d62baed4d894a07d46a Mon Sep 17 00:00:00 2001 From: Sabella-8 Date: Fri, 29 Sep 2023 11:14:48 +0100 Subject: [PATCH 1/3] Karma Website --- .vscode/settings.json | 3 + How.html | 0 blog.html | 0 {img => css}/first-background.jpg | Bin css/style.css | 144 +++++++++++++- help.html | 0 ...mepage-feature.png => homepage-feature.png | Bin index.html | 177 +++++++++++++++-- log.html | 0 meet.html | 0 ...=> store-image_by-andrew-neel-unsplash.jpg | Bin store.html | 185 ++++++++++++++++++ 12 files changed, 494 insertions(+), 15 deletions(-) create mode 100644 .vscode/settings.json create mode 100644 How.html create mode 100644 blog.html rename {img => css}/first-background.jpg (100%) mode change 100755 => 100644 create mode 100644 help.html rename level-2/homepage-feature.png => homepage-feature.png (100%) create mode 100644 log.html create mode 100644 meet.html rename level-2/store-image_by-andrew-neel-unsplash.jpg => store-image_by-andrew-neel-unsplash.jpg (100%) create mode 100644 store.html diff --git a/.vscode/settings.json b/.vscode/settings.json new file mode 100644 index 000000000..6b665aaa0 --- /dev/null +++ b/.vscode/settings.json @@ -0,0 +1,3 @@ +{ + "liveServer.settings.port": 5501 +} diff --git a/How.html b/How.html new file mode 100644 index 000000000..e69de29bb diff --git a/blog.html b/blog.html new file mode 100644 index 000000000..e69de29bb diff --git a/img/first-background.jpg b/css/first-background.jpg old mode 100755 new mode 100644 similarity index 100% rename from img/first-background.jpg rename to css/first-background.jpg diff --git a/css/style.css b/css/style.css index 5cb025cef..c5cfe5b5d 100755 --- a/css/style.css +++ b/css/style.css @@ -1,9 +1,8 @@ - - /* We are using the 'Roboto' font from Google. This has already been added to your HTML header */ +/* We are using the 'Roboto' font from Google. This has already been added to your HTML header */ body { - font-family: 'Roboto', sans-serif; - -webkit-font-smoothing: antialiased; + font-family: "Roboto", sans-serif; + -webkit-font-smoothing: antialiased; } /** @@ -15,5 +14,142 @@ body { * * - When using Flexbox, remember the items you want to move around need to be inside a parent container set to 'display: flex' */ +.nav { + display: flex; + margin: 20px; + justify-content: space-between; +} +.navigation { + margin-right: 50px; + margin-top: 20px; + display: flex; + text-align: end; + gap: 30px; + justify-content: end; +} + +a { + color: black; + text-decoration: none; +} +a:hover { + color: rgb(250, 107, 55); +} +.first_section { + background-image: url("first-background.jpg"); + padding: 150px; + padding-bottom: 200px; + margin-top: 30px; + text-align: center; + color: white; + font-size: 20px; +} +.first_section h1 { + font-weight: lighter; + font-size: 40px; +} +p { + font-weight: lighter; + font-size: 20px; +} +.dev_cof_ref_ { + height: 150px; + width: 150px; +} +.tw_fa_in_ { + height: 30px; + width: 30px; + padding: 25px; +} +.second_section { + display: flex; + gap: 100px; +} +.second_second { + padding: 50px; +} +#seco1 { + padding-left: 200px; +} +.pic_section { + display: flex; + margin-bottom: 80px; + background-color: rgb(250, 214, 220); + font-weight: lighter; +} +.pic_par { + padding-top: 60px; + padding-left: 100px; + font-size: 42px; + text-align: center; + margin-right: 95px; +} +.button_karma, +.fir_b { + margin-top: 40px; + font-size: 20px; + padding: 10px 15px; + color: white; + background-color: rgb(250, 107, 55); + border-radius: 5px; + border: none; +} +.last_section { + text-align: center; +} +.sec_h1 { + font-weight: lighter; + text-align: center; + margin-top: 80px; +} +.quo { + color: rgb(250, 107, 55); +} +hr { + width: 90%; +} +.inp_all { + margin: 20px; + padding: 20px; +} +form { + margin: 10px; +} +.rad { + display: flex; + gap: 20px; + margin-bottom: 30px; +} +.all_section { + display: flex; +} +.stor_h { + margin-left: 60px; + font-size: 35px; + color: rgb(250, 107, 55); +} +.forname { + display: flex; + gap: 20px; +} +input, +select { + margin-top: 10px; + margin-bottom: 10px; +} +#address, +#address2 { + width: 81%; +} +.post { + margin-left: 20px; +} +.post input { + width: 100px; +} +#city { + padding: 3px; + width: 250px; +} diff --git a/help.html b/help.html new file mode 100644 index 000000000..e69de29bb diff --git a/level-2/homepage-feature.png b/homepage-feature.png similarity index 100% rename from level-2/homepage-feature.png rename to homepage-feature.png diff --git a/index.html b/index.html index 3e742ef04..eaff104d8 100755 --- a/index.html +++ b/index.html @@ -1,19 +1,174 @@ - - - + + + Karma - - - - - - - + + + + + + +
+ +
+
+
+

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

+
+
+
+
+ + +

+ "Wherever I am I just don't worry about my + connection
anymore!" +
- + +

+
+
+ + diff --git a/log.html b/log.html new file mode 100644 index 000000000..e69de29bb diff --git a/meet.html b/meet.html new file mode 100644 index 000000000..e69de29bb diff --git a/level-2/store-image_by-andrew-neel-unsplash.jpg b/store-image_by-andrew-neel-unsplash.jpg similarity index 100% rename from level-2/store-image_by-andrew-neel-unsplash.jpg rename to store-image_by-andrew-neel-unsplash.jpg diff --git a/store.html b/store.html new file mode 100644 index 000000000..73059c473 --- /dev/null +++ b/store.html @@ -0,0 +1,185 @@ + + + + + + Karma + + + + + + + + + +
+ +
+
+
+
+

Order your Karma wifi
device today!

+
+ +
+
+
+
+
+
+ +
+
+ +
+ +
+
+
+
+
+ +
+
+ +
+
+
+
+ +
+
+
+ +
+
+
+ +
+

select a colour

+
+ + +
+ +
+
+
+ +
+
+ + +
+
+ + +
+ +
+ + +
+ +
+ +
+ + + + From 8f2114c3530277c491a22eaf07f688d2863b73ad Mon Sep 17 00:00:00 2001 From: Sabella-8 Date: Sat, 30 Sep 2023 21:49:12 +0100 Subject: [PATCH 2/3] svg to img --- css/style.css | 5 ++++ index.html | 69 ++++----------------------------------------------- store.html | 67 +++---------------------------------------------- 3 files changed, 14 insertions(+), 127 deletions(-) diff --git a/css/style.css b/css/style.css index c5cfe5b5d..ffda570e2 100755 --- a/css/style.css +++ b/css/style.css @@ -153,3 +153,8 @@ select { padding: 3px; width: 250px; } +.footimg img { + width: 30px; + height: 30px; + padding: 20px; +} diff --git a/index.html b/index.html index eaff104d8..273307f62 100755 --- a/index.html +++ b/index.html @@ -23,7 +23,7 @@