Skip to content

Commit 66eb689

Browse files
committed
DOM Manipulation using JS
1 parent 4a5723e commit 66eb689

37 files changed

+726
-0
lines changed

.vscode/launch.json

Lines changed: 15 additions & 0 deletions
Original file line numberDiff line numberDiff line change
@@ -0,0 +1,15 @@
1+
{
2+
// Use IntelliSense to learn about possible attributes.
3+
// Hover to view descriptions of existing attributes.
4+
// For more information, visit: https://go.microsoft.com/fwlink/?linkid=830387
5+
"version": "0.2.0",
6+
"configurations": [
7+
{
8+
"type": "chrome",
9+
"request": "launch",
10+
"name": "Launch Chrome against localhost",
11+
"url": "http://localhost:8080",
12+
"webRoot": "${workspaceFolder}"
13+
}
14+
]
15+
}
Binary file not shown.
Binary file not shown.
Lines changed: 179 additions & 0 deletions
Original file line numberDiff line numberDiff line change
@@ -0,0 +1,179 @@
1+
2+
body {
3+
font-family: "Montserrat";
4+
text-align: center;
5+
}
6+
7+
h1, h2, h3, h4, h5, h6 {
8+
font-family: "Montserrat-Bold";
9+
}
10+
11+
p {
12+
color: #8f8f8f;
13+
}
14+
15+
/* Headings */
16+
17+
.big-heading {
18+
font-family: "Montserrat-Black";
19+
font-size: 3.5rem;
20+
line-height: 1.5;
21+
}
22+
23+
.section-heading {
24+
font-size: 3rem;
25+
line-height: 1.5;
26+
}
27+
28+
/* Containers */
29+
30+
.container-fluid{
31+
padding: 7% 15%;
32+
}
33+
34+
/* Sections */
35+
36+
.colored-section {
37+
background-color: #ff4c68;
38+
color: #fff;
39+
}
40+
41+
.white-section {
42+
background-color: #fff;
43+
}
44+
45+
/* Navigation Bar */
46+
47+
.navbar {
48+
padding: 0 0 4.5rem;
49+
}
50+
51+
.navbar-brand {
52+
font-family: "Ubuntu";
53+
font-size: 2.5rem;
54+
font-weight: bold;
55+
}
56+
57+
.nav-item {
58+
padding: 0 18px;
59+
}
60+
61+
.nav-link {
62+
font-size: 1.2rem;
63+
font-family: "Montserrat-Light";
64+
}
65+
66+
/* Buttons */
67+
68+
.download-button {
69+
margin: 5% 3% 5% 0;
70+
}
71+
72+
/* Title Section */
73+
74+
#title {
75+
background-color: #ff4c68;
76+
color: #fff;
77+
text-align: left;
78+
}
79+
80+
#title .container-fluid {
81+
padding: 3% 15% 7%;
82+
}
83+
84+
/* Title Image */
85+
86+
.title-image {
87+
width: 60%;
88+
transform: rotate(25deg);
89+
position: absolute;
90+
right: 30%;
91+
}
92+
93+
/* Features Section */
94+
95+
#features {
96+
position: relative;
97+
}
98+
99+
.feature-title {
100+
font-size: 1.5rem;
101+
}
102+
103+
.feature-box {
104+
padding: 4.5%;
105+
}
106+
107+
.icon {
108+
color: #ef8172;
109+
margin-bottom: 1rem;
110+
}
111+
112+
.icon:hover {
113+
color: #ff4c68;
114+
}
115+
116+
/* Testimonial Section */
117+
118+
#testimonials {
119+
background-color: #ef8172;
120+
}
121+
122+
.testimonial-text {
123+
font-size: 3rem;
124+
line-height: 1.5;
125+
}
126+
127+
.testimonial-image {
128+
width: 10%;
129+
border-radius: 100%;
130+
margin: 20px;
131+
}
132+
133+
134+
#press {
135+
background-color: #ef8172;
136+
padding-bottom: 3%;
137+
}
138+
139+
.press-logo {
140+
width: 15%;
141+
margin: 20px 20px 50px;
142+
}
143+
144+
/* Pricing Section */
145+
146+
#pricing {
147+
padding: 100px;
148+
}
149+
150+
.price-text {
151+
font-size: 3rem;
152+
line-height: 1.5;
153+
}
154+
155+
.pricing-column {
156+
padding: 3% 2%;
157+
}
158+
159+
/* CTA Section */
160+
161+
162+
/* Footer Section */
163+
164+
165+
.social-icon {
166+
margin: 20px 10px;
167+
}
168+
169+
@media (max-width: 1028px) {
170+
171+
#title {
172+
text-align: center;
173+
}
174+
175+
.title-image {
176+
position: static;
177+
transform: rotate(0);
178+
}
179+
}
Binary file not shown.
980 KB
Loading
10.7 KB
Loading
16.5 KB
Loading
13.7 KB
Loading
23 KB
Loading

0 commit comments

Comments
 (0)