-
Notifications
You must be signed in to change notification settings - Fork 0
/
Copy pathindex.html
106 lines (87 loc) · 6.94 KB
/
index.html
1
2
3
4
5
6
7
8
9
10
11
12
13
14
15
16
17
18
19
20
21
22
23
24
25
26
27
28
29
30
31
32
33
34
35
36
37
38
39
40
41
42
43
44
45
46
47
48
49
50
51
52
53
54
55
56
57
58
59
60
61
62
63
64
65
66
67
68
69
70
71
72
73
74
75
76
77
78
79
80
81
82
83
84
85
86
87
88
89
90
91
92
93
94
95
96
97
98
99
100
101
102
103
104
105
106
<!DOCTYPE html>
<html lang="es">
<head>
<meta charset="UTF-8">
<meta name="viewport" content="width=device-width, initial-scale=1.0">
<link rel="icon" type="image/png" sizes="32x32" href="./assets/favicon-32x32.png">
<link rel="preconnect" href="https://fonts.googleapis.com">
<link rel="preconnect" href="https://fonts.gstatic.com" crossorigin>
<link href="https://fonts.googleapis.com/css2?family=Red+Hat+Display:ital,wght@0,300..900;1,300..900&display=swap" rel="stylesheet">
<title>Meet landing page</title>
<link rel="stylesheet" href="./css/mobile.css">
</head>
<body>
<header>
<nav class="nav-logo-container">
<img src="./assets/logo.svg" alt="Logo Meet" class="logo">
</nav>
<section class="header-faces-container">
<div class="faces-left">
<img src="./assets/desktop/image-hero-left.png" alt="Imagenes de rostros">
</div>
<div class="faces-info--container">
<h1>Group Chat<br>for Everyone</h1>
<p>Meet makes it easy to connect with others face-to-face virtually and collaborate across any device.</p>
<div class="main-button--container">
<button class="main-dl-button">Download <span>v1.3</span></button>
<button class="main-info-button">What is it?</button>
</div>
</div>
<div class="faces-right">
<img src="./assets/desktop/image-hero-right.png" alt="">
</div>
</section>
<section class="main-info-section">
<div class="main-info--container">
<h1>Group Chat<br>for Everyone</h1>
<p>Meet makes it easy to connect with others face-to-face virtually and collaborate across any device.</p>
<div class="main-button--container">
<button class="main-dl-button">Download <span>v1.3</span></button>
<button class="main-info-button">What is it?</button>
</div>
</div>
</section>
</header>
<main class="main-container">
<div class="icon-container">
<svg width="57" height="136" viewBox="0 0 57 136" fill="none" xmlns="http://www.w3.org/2000/svg">
<rect x="28" width="1" height="80" fill="#D1D1DF"/>
<rect x="1" y="80.5" width="55" height="55" rx="27.5" fill="#FAFAFA"/>
<rect x="1" y="80.5" width="55" height="55" rx="27.5" stroke="#D1D1DF"/>
<path d="M25.052 114.176C24.0387 114.176 23.148 113.936 22.38 113.456C21.6227 112.976 21.0307 112.304 20.604 111.44C20.188 110.565 19.98 109.552 19.98 108.4C19.98 107.237 20.188 106.224 20.604 105.36C21.0307 104.496 21.6227 103.824 22.38 103.344C23.148 102.864 24.0387 102.624 25.052 102.624C26.0653 102.624 26.9507 102.864 27.708 103.344C28.476 103.824 29.068 104.496 29.484 105.36C29.9107 106.224 30.124 107.237 30.124 108.4C30.124 109.552 29.9107 110.565 29.484 111.44C29.068 112.304 28.476 112.976 27.708 113.456C26.9507 113.936 26.0653 114.176 25.052 114.176ZM25.052 111.936C25.5747 111.936 26.0227 111.797 26.396 111.52C26.78 111.232 27.0733 110.821 27.276 110.288C27.4893 109.755 27.596 109.125 27.596 108.4C27.596 107.664 27.4893 107.035 27.276 106.512C27.0733 105.979 26.78 105.573 26.396 105.296C26.0227 105.008 25.5747 104.864 25.052 104.864C24.5293 104.864 24.076 105.008 23.692 105.296C23.3187 105.573 23.0253 105.979 22.812 106.512C22.6093 107.035 22.508 107.664 22.508 108.4C22.508 109.125 22.6093 109.755 22.812 110.288C23.0253 110.821 23.3187 111.232 23.692 111.52C24.076 111.797 24.5293 111.936 25.052 111.936ZM33.2174 114V105.424L30.8974 106.352V104.112L34.1774 102.8H35.8094V114H33.2174Z" fill="#87879D"/>
</svg>
</div>
<section class="main-gallery-cotainer">
<div class="gallery-pic">
<img src="./assets/desktop/image-woman-in-videocall.jpg" alt="Galeria de fotos de usuarios">
</div>
<div class="gallery-pic">
<img src="./assets/desktop/image-man-texting.jpg" alt="Galeria de fotos de usuarios">
</div>
<div class="gallery-pic">
<img src="./assets/desktop/image-women-videochatting.jpg" alt="Galeria de fotos de usuarios">
</div>
<div class="gallery-pic">
<img src="./assets/desktop/image-men-in-meeting.jpg" alt="Galeria de fotos de usuarios">
</div>
</section>
<section class="text-info-container">
<h3>BUILT FOR MODERN USE</h3>
<h2>Smarter meetings, <br>all in one place</h2>
<p>Send messages, share files, show your screen, and record your meetings — all in one
workspace. Control who can join with invite-only team access, data encryption, and data export.</p>
</section>
</main>
<footer>
<svg width="57" height="136" viewBox="0 0 57 136" fill="none" xmlns="http://www.w3.org/2000/svg">
<rect x="28" width="1" height="80" fill="#D1D1DF"/>
<rect x="1" y="80.5" width="55" height="55" rx="27.5" fill="#FAFAFA"/>
<rect x="1" y="80.5" width="55" height="55" rx="27.5" stroke="#D1D1DF"/>
<path d="M23.552 114.176C22.5387 114.176 21.648 113.936 20.88 113.456C20.1227 112.976 19.5307 112.304 19.104 111.44C18.688 110.565 18.48 109.552 18.48 108.4C18.48 107.237 18.688 106.224 19.104 105.36C19.5307 104.496 20.1227 103.824 20.88 103.344C21.648 102.864 22.5387 102.624 23.552 102.624C24.5653 102.624 25.4507 102.864 26.208 103.344C26.976 103.824 27.568 104.496 27.984 105.36C28.4107 106.224 28.624 107.237 28.624 108.4C28.624 109.552 28.4107 110.565 27.984 111.44C27.568 112.304 26.976 112.976 26.208 113.456C25.4507 113.936 24.5653 114.176 23.552 114.176ZM23.552 111.936C24.0747 111.936 24.5227 111.797 24.896 111.52C25.28 111.232 25.5733 110.821 25.776 110.288C25.9893 109.755 26.096 109.125 26.096 108.4C26.096 107.664 25.9893 107.035 25.776 106.512C25.5733 105.979 25.28 105.573 24.896 105.296C24.5227 105.008 24.0747 104.864 23.552 104.864C23.0293 104.864 22.576 105.008 22.192 105.296C21.8187 105.573 21.5253 105.979 21.312 106.512C21.1093 107.035 21.008 107.664 21.008 108.4C21.008 109.125 21.1093 109.755 21.312 110.288C21.5253 110.821 21.8187 111.232 22.192 111.52C22.576 111.797 23.0293 111.936 23.552 111.936ZM29.6434 114V112.24L34.3794 107.552C34.5607 107.381 34.7047 107.216 34.8114 107.056C34.918 106.885 34.998 106.715 35.0514 106.544C35.1047 106.373 35.1314 106.203 35.1314 106.032C35.1314 105.669 34.9714 105.371 34.6514 105.136C34.342 104.891 33.9527 104.768 33.4834 104.768C32.982 104.768 32.5127 104.875 32.0754 105.088C31.638 105.291 31.1634 105.643 30.6514 106.144L29.2754 104.464C29.9154 103.856 30.5927 103.397 31.3074 103.088C32.0327 102.779 32.7847 102.624 33.5634 102.624C34.3634 102.624 35.0567 102.763 35.6434 103.04C36.2407 103.307 36.7047 103.685 37.0354 104.176C37.366 104.656 37.5314 105.221 37.5314 105.872C37.5314 106.224 37.478 106.565 37.3714 106.896C37.2754 107.216 37.1207 107.531 36.9074 107.84C36.694 108.149 36.4167 108.469 36.0754 108.8L32.8434 111.92L37.6914 111.904V114H29.6434Z" fill="#87879D"/>
</svg>
<h3>Experience more together</h3>
<p>Stay connected with reliable HD meetings and unlimited one-on-one and group video sessions.</p>
<button>Download <span>v1.3</span></button>
</footer>
</body>
</html>