From 4c16311276a86d91221d4c2b3ef9acefa67c35d4 Mon Sep 17 00:00:00 2001 From: Dawid Tokarz Date: Sun, 23 Feb 2025 21:42:34 +0100 Subject: [PATCH] html and css structure added --- .vscode/settings.json | 3 + index.html | 134 +++++++++++++++++++++++++++ style.css | 205 ++++++++++++++++++++++++++++++++++++++++++ 3 files changed, 342 insertions(+) create mode 100644 .vscode/settings.json create mode 100644 index.html create mode 100644 style.css diff --git a/.vscode/settings.json b/.vscode/settings.json new file mode 100644 index 00000000..6f3a2913 --- /dev/null +++ b/.vscode/settings.json @@ -0,0 +1,3 @@ +{ + "liveServer.settings.port": 5501 +} \ No newline at end of file diff --git a/index.html b/index.html new file mode 100644 index 00000000..26408c21 --- /dev/null +++ b/index.html @@ -0,0 +1,134 @@ + + + + + + Document + + + + +
+ +
+
+
+

Beautiful Free Nova template

+

A top notch premium quality template for your next web project

+ +
+
+ screen +
+
+
+
+
+
+
+
+

Features

+
+
+
+ responsive +

Fully Responsive

+

Lorem ipsum dolor sit amet, consectetur adipisicing elit. Quisquam dolores illo, consectetur aspernatur ipsam, nemo maiores eos

+
+
+ responsive +

Customizable

+

Lorem ipsum dolor sit amet, consectetur adipisicing elit. Quisquam dolores illo, consectetur aspernatur ipsam, nemo maiores eos

+
+
+ responsive +

Slick and beautiful design

+

Lorem ipsum dolor sit amet, consectetur adipisicing elit. Quisquam dolores illo, consectetur aspernatur ipsam, nemo maiores eos

+
+
+
+
+ +
+
+
+ imac +
+
+

SIMPLE AND BEAUTIFUL

+

Use Nova theme for your next web project. It is completely cusotmiazable so you can chagne any of the sections to fit your needs. Noova Theme is free for any kind of use, personal and commercial. Have fun and good luck!

+
+
+
+
+

CHOOSE YOUR PRICING PLAN

+

Pick any of our super affordable pricing plans

+
+
+
+

BASIC

+

15$

+

Up to 7 projects
2 Additional Developers

+ +
+
+

BASIC

+

55$

+

Up to 25 Projects
2 Additional Developers
Unlimited Support

+ +
+
+

BASIC

+

75$

+

Up to 25 projects
2 Additional Developers
Unlimited Support
1.5GB Disk Space

+ +
+
+
+
+
+

THE TEAM

+
+
+
+ CTO +

CTO

+

Johnny B Good

+

The brains behind the whole operation

+ twitter + facebook +
+
+ CEO +

CEO

+

Roll Over Beethoven

+

The one that puts it all together

+ twitter + facebook +
+
+ CFO +

CFO

+

Chuck Berry

+

The guy with his hand on the wallet

+ twitter + facebook +
+
+
+
+ + + diff --git a/style.css b/style.css new file mode 100644 index 00000000..b3dcec2d --- /dev/null +++ b/style.css @@ -0,0 +1,205 @@ +html, body { + margin: 0; + padding: 0; + font-family: helvetica, Montserrat ; +} + +.header { + background: radial-gradient(rgb(194, 74, 126), rgb(105, 86, 235)); + width: 100%; +} + +.navbar { + display: flex; + justify-content: space-between; +} + +.header__logo { + margin-left: 20px; +} + +.header__menu { + display: flex; + margin-bottom: 50px; +} + +.list__item { + list-style: none; + +} + + +.item__text { + margin-right: 70px; + text-decoration: none; + color: white; +} + +.div__text { + +} + +.text__all { + display: flex; + justify-content: space-between; + align-items: center; +} + +.text__h1 { + margin-left: 80px; + color: white; +} + +.img__container { + margin-right: 70px; +} + + +.template__img { + transform: scale(0.8) rotate(-10deg); +} + +.button__header { + background-color: #25f18b; + border-radius: 10px; + width: 150px; + height: 40px; + border-style: none; + color: white; + cursor: pointer; +} + + +.features { + background-color: #000000; +} + +.features__container { + color: white; +} + +.features__h2--text { + text-align: center; + margin: 0; + padding-top: 100px; + padding-bottom: 50px; +} + +.features__items { + display: flex; +} + +.features__container--items { + display: flex; + align-items: center; + text-align: center; + padding-bottom: 80px; +} + +.banner__container { + width: 100%; + background-color: #f9fafa; +} + +.banners { + padding: 40px 0; + text-align: center; + background-color: #f9fafa; + +} + +.banner__container img { + max-width: 100%; + height: auto; +} + +.imac-article { + display: flex; +} + +.imac__section-img { + transform: scale(0.8); +} + +.imac__text { + text-align: center; + margin-top: 90px; +} + +.pricing { + background-color: #f8f9f9; +} + +.pricing__title { + text-align: center; + padding: 5px; + +} + +.pricing__items { + display: flex; + align-items: center; + justify-content: center; + gap: 300px; +} + +.pricing_item { + text-align: center; + margin-bottom: 50px; +} + +.pricing__price { + font-size: 26px; + font-weight: bold; +} + +.pricing__button{ + background-color: #0abceb; + color: white; + border-radius: 10px; + height: 50px; + width: 130px; + border: none; +} + + +.pricing_item:hover { + border: 1px solid white; + box-shadow: 0 0 5px rgb(224, 218, 218); + transition: 0.3s; + transform: scale(1.2); +} + +/* Section TEAM */ + +.team__container { + display: flex; + text-align: center; + justify-content: center; + gap: 200px; + margin-top: 50px; + margin-bottom: 50px; +} + +.team__h2 { + margin-left: 20px; + margin-bottom: 50px; + text-align: center; +} + +.team__paragraph { + font-size: 16px; + font-weight: bold; +} + + + +/* footer */ + +.footer { + display: flex; + justify-content: center; + gap: 10px; + color: white; + background-color: #464646; +} \ No newline at end of file