-
Notifications
You must be signed in to change notification settings - Fork 0
/
Copy pathindex.html
147 lines (132 loc) · 7.52 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
107
108
109
110
111
112
113
114
115
116
117
118
119
120
121
122
123
124
125
126
127
128
129
130
131
132
133
134
135
136
137
138
139
140
141
142
143
144
145
146
147
<!DOCTYPE html>
<html lang="es">
<head>
<meta charset="UTF-8">
<meta http-equiv="X-UA-Compatible" content="IE=edge">
<meta name="viewport" content="width=device-width, initial-scale=1.0">
<link rel="stylesheet" href="./main.css">
<link rel="preload" href="./assets/fonts/BrandonText-Regular.woff2" as="font" type="font/woff2" crossorigin>
<title>Portal del paciente</title>
</head>
<body>
<header class="header__container--between">
<div class="header__logo">
<img src="./assets/img/andes-marca-portal.png" width="120" alt="logo del portal de pacientes">
</div>
<div class="header__botonera">
<i role="button" class="header__button--icon adi adi-logo-whatsapp icon icon--24"></i>
<i role="button" class="header__button--icon adi adi-mail icon icon--24"></i>
<i role="button" class="header__button--icon adi adi-logo-facebook icon icon--24"></i>
<i role="button" class="header__button--icon adi adi-logo-youtube icon icon--24"></i>
</div>
</header>
<main class="layout__container">
<i class="icon--absolute icon--absolute--vh40 icon--absolute--vw60 adi adi-clinica"></i>
<i class="icon--absolute icon--absolute--vh110 icon--absolute--vw5 adi adi-madre-hijo"></i>
<!--<i class="icon--absolute icon--absolute--vh180 icon--absolute--vw60 adi adi-clinica"></i>-->
<section id="primerScroll">
<div class="card card__wrapper--between card__wrapper--v">
<h1 class="card__title">
¿Qué encuentro en <br> mi portal?
</h1>
<h4 class="card__subtitle">
Mi portal de Salud es un espacio seguro que brinda acceso 24 hs vía conexión a internet a tu
información
personal. En él tendrás mayor control y participación en los procesos de cuidado de tu salud.
</h4>
<section class="btn__container--evenly">
<div class="btn__wrapper btn__wrapper--v">
<small class="btn__prefix">ingreso por primera vez</small>
<a href="https://jsantarelli.github.io/portal-paciente/">
<button class="btn btn--rounded btn--colorTerciario">registrarme</button>
</a>
</div>
<div class="btn__wrapper btn__wrapper--v">
<small class="btn__prefix">ya tengo usuario</small>
<a href="https://jsantarelli.github.io/portal-paciente/">
<button class="btn btn--rounded btn--colorTerciario">ingresar</button>
</a>
</div>
</section>
</div>
</section>
<section id="segundoScroll">
<div class="card__container card__container--fill">
<div selectable class="card card__wrapper--v card--transparent">
<i class="icon icon--60 icon--white adi adi-corona"></i>
<h3 class="card__title">Vacunación Covid-19</h3>
<h5 class="card__subtitle">Lorem ipsum sonnet mer linger...</h5>
<button class="btn btn--transparent">ver más</button>
</div>
<div selectable class="card card__wrapper--v card--transparent">
<i class="icon icon--60 icon--white adi adi-mano-corazon"></i>
<h3 class="card__title">Donación de sangre</h3>
<h5 class="card__subtitle">Lorem ipsum sonnet mer linger...</h5>
<button class="btn btn--transparent">ver más</button>
</div>
<div selectable class="card card__wrapper--v card--transparent">
<i class="icon icon--60 icon--white adi adi-vacuna"></i>
<h3 class="card__title">Vacunación antigripal</h3>
<h5 class="card__subtitle">Lorem ipsum sonnet mer linger...</h5>
<button class="btn btn--transparent">ver más</button>
</div>
<div selectable class="card card__wrapper--v card--transparent">
<i class="icon icon--60 icon--white adi adi-paciente-mujer"></i>
<h3 class="card__title">Vacunación Covid-19</h3>
<h5 class="card__subtitle">Lorem ipsum sonnet mer linger...</h5>
<button class="btn btn--transparent">ver más</button>
</div>
<div selectable class="card card__wrapper--v card--transparent">
<i class="icon icon--60 icon--white adi adi-trastorno"></i>
<h3 class="card__title">Donación de sangre</h3>
<h5 class="card__subtitle">Lorem ipsum sonnet mer linger...</h5>
<button class="btn btn--transparent">ver más</button>
</div>
<div selectable class="card card__wrapper--v card--transparent">
<i class="icon icon--60 icon--white adi adi-face"></i>
<h3 class="card__title">Vacunación antigripal</h3>
<h5 class="card__subtitle">Lorem ipsum sonnet mer linger...</h5>
<button class="btn btn--transparent">ver más</button>
</div>
</div>
</section>
<section id="tercerScroll" class="">
<div class="img__overlay__wrapper">
<img class="img img--h50 img--cover" src="./assets/img/img--001.jpg" alt="">
<div class="img__mask"></div>
<span class="img__overlay">
<!-- Card -->
<div class="card card__wrapper--v card--transparent">
<h3 class="card__title card__title--colorTerciario">Novedades en el portal móvil</h3>
<h5 class="card__subtitle card__subtitle--uppercase">Ahora podés gestionar más cuentas</h5>
<button class="btn btn--transparent">ver más</button>
</div>
</span>
</div>
<div class="img__overlay__wrapper">
<img class="img img--h50 img--cover" src="./assets/img/img--002.png" alt="">
<div class="img__mask"></div>
<span class="img__overlay">
<!-- Card -->
<div class="card card__wrapper--v card--transparent">
<h3 class="card__title card__title--colorTerciario">Nuevo centro de salud</h3>
<h5 class="card__subtitle card__subtitle--uppercase">Huinganco inaugura su nuevo espacio</h5>
<button class="btn btn--transparent">ver más</button>
</div>
</span>
</div>
<div class="img__overlay__wrapper">
<img class="img img--h50 img--cover" src="./assets/img/img--003.png" alt="">
<div class="img__mask"></div>
<span class="img__overlay">
<!-- Card -->
<div class="card card__wrapper--v card--transparent">
<h3 class="card__title card__title--colorTerciario">Segunda dosis de vacunas</h3>
<h5 class="card__subtitle card__subtitle--uppercase">Disponibles a partir de...</h5>
<button class="btn btn--transparent">ver más</button>
</div>
</span>
</div>
</section>
</main>
</body>