Skip to content

Commit 95c2e46

Browse files
committed
hero p3
1 parent 38870fe commit 95c2e46

File tree

2 files changed

+52
-2
lines changed

2 files changed

+52
-2
lines changed

starter/07-Omnifood-Desktop/css/style.css

Lines changed: 33 additions & 2 deletions
Original file line numberDiff line numberDiff line change
@@ -15,7 +15,7 @@ Default: 1
1515
1616
- Primary: #e67e22
1717
- Tints: #fdf2e9
18-
- Shades:
18+
- Shades: #cf711f
1919
- Accents:
2020
- Greys:
2121
#555
@@ -44,7 +44,7 @@ html {
4444
}
4545

4646
body {
47-
font-family: sans-serif;
47+
font-family: "Rubik", sans-serif;
4848
line-height: 1;
4949
font-weight: 400;
5050
color: #555;
@@ -82,6 +82,7 @@ body {
8282
.btn:visited {
8383
display: inline-block;
8484
font-size: 2rem;
85+
font-weight: 600;
8586
text-decoration: none;
8687
padding: 1.6rem 3.2rem;
8788
border-radius: 9px;
@@ -121,3 +122,33 @@ body {
121122
.margin-right-sm {
122123
margin-right: 1.6rem !important;
123124
}
125+
126+
.delivered-meals {
127+
display: flex;
128+
align-items: center;
129+
gap: 1.6rem;
130+
margin-top: 8rem;
131+
}
132+
.delivered-imgs {
133+
display: flex;
134+
}
135+
136+
.delivered-imgs img {
137+
height: 4.8rem;
138+
width: 4.8rem;
139+
border-radius: 50%;
140+
margin-right: -1.6rem;
141+
border: 3px solid #fdf2e9;
142+
}
143+
.delivered-imgs img:last-child {
144+
margin: 0;
145+
}
146+
147+
.delivered-text {
148+
font-size: 1.8rem;
149+
font-weight: 600;
150+
}
151+
.delivered-text span {
152+
color: #cf711f;
153+
font-weight: 700;
154+
}

starter/07-Omnifood-Desktop/index.html

Lines changed: 19 additions & 0 deletions
Original file line numberDiff line numberDiff line change
@@ -5,6 +5,12 @@
55
<meta name="viewport" content="width=device-width, initial-scale=1.0" />
66

77
<link rel="stylesheet" href="css/style.css" />
8+
<link rel="preconnect" href="https://fonts.googleapis.com" />
9+
<link rel="preconnect" href="https://fonts.gstatic.com" crossorigin />
10+
<link
11+
href="https://fonts.googleapis.com/css2?family=Rubik:ital,wght@0,300..900;1,300..900&display=swap"
12+
rel="stylesheet"
13+
/>
814
<title>Omnifood</title>
915
</head>
1016
<body>
@@ -23,6 +29,19 @@ <h1 class="heading-primary">
2329
>Start eating well</a
2430
>
2531
<a href="#" class="btn btn--outline">Lear more &rarr;</a>
32+
<div class="delivered-meals">
33+
<div class="delivered-imgs">
34+
<img src="img/customers/customer-1.jpg" alt="Customer photo" />
35+
<img src="img/customers/customer-2.jpg" alt="Customer photo" />
36+
<img src="img/customers/customer-3.jpg" alt="Customer photo" />
37+
<img src="img/customers/customer-4.jpg" alt="Customer photo" />
38+
<img src="img/customers/customer-5.jpg" alt="Customer photo" />
39+
<img src="img/customers/customer-6.jpg" alt="Customer photo" />
40+
</div>
41+
<p class="delivered-text">
42+
<span>250,000+</span> meals delivered last year!
43+
</p>
44+
</div>
2645
</div>
2746
<div class="hero-img-box">
2847
<img

0 commit comments

Comments
 (0)