-
Notifications
You must be signed in to change notification settings - Fork 1
/
Copy pathaunt_flo.html
103 lines (82 loc) · 3.29 KB
/
aunt_flo.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
<!DOCTYPE html>
<html>
<head>
<link href="https://fonts.googleapis.com/css?family=Rock+Salt|VT323" rel="stylesheet">
<meta charset="UTF-8">
<style>
h1{
font-family: 'Rock Salt', cursive;
}
p1{
font-family: 'Rock Salt', cursive;
}
h2{
font-family: 'VT323', monospace;
}
p2{
font-family: 'VT323', monospace;
}
p3{
font-family: 'VT323', monospace;
}
img {
display: block;
margin-left: auto;
margin-right: auto;
}
body {
background-image: url("gradient.png");
}
#parent {
display: flex;
}
#narrow {
width: 900px;
}
#wide {
flex: 1;
}
#facts {
margin: auto;
width: 60%;
padding: 10px;
}
</style>
<title>aunt flo</title>
</head>
<body>
<h1 style = "color: #e22c5a;"><center><font size = "20">🌸Meet Aunt Flo🌸</font></center></h1>
<img src="pms.png" alt="Aunt Flo" width="500" height="500">
<h2><b><center><font size = "10">TOXIC SHOCK SYNDROME CAN BE FATAL<center></font></b></h2>
<p2><b><center><font size = "6"> What is toxic shock syndrome (TSS)?</center></b></font>
<div id="facts">
<p2><b><font size = "5">☠️</font><font size = "6">TSS is a bacterial infection caused by tampons or IUDs</font></b><br></p2>
<p2><b><font size = "5">☠️</font><font size = "6">Leaving a tampon in for longer
than 8-12 hours can increase risk of infection or TSS</font></b><br></p2>
<p2><b><font size = "5">☠️</font><font size = "6">TSS causes a drastic drop in blood pressure, depriving organs of oxygen and possibly leading to death</font></b><br></p2>
</div>
<h1 style = "color: #e22c5a;"><center><b><font size = "10">Aunt Flo can help!</font></center></b></h1>
<p><font size = "6">Aunt Flo is a SMS chat-bot that reminds you to change your pad/tampon according to the number of hours you respond to her. Wearing a tampon or pad for too long can lead to bacterial infections which may potentially lead to toxic shock syndrome. With Aunt Flo, you are consistently notified to change out your feminine hygiene until your menstrual cycle is over. Not only are you practicing safe hygiene, you are also decreasing your chances of toxic shock syndrome.</p>
<div id="parent">
<div id="narrow">
<p3 style = "color: #e22c5a;"><font size = "7">1) Say hello to Aunt Flo! Send her a text at:</style></p3>
<p3 style = "color: #e22c5a;"><center> +1 (714) 881-0022 </center> </style></p3>
<p3 style = "color: #e22c5a;">2) Let Aunt Flo know how often to remind you to change your sanitary products<br></style></p3>
<p3 style = "color: #e22c5a;">3) Enter "C" when pad/tampon has been changed.<br></style></p3>
<p3 style = "color: #e22c5a;">4) Enter "E" when your cycle is complete.</style><br></p3>
<p3 style = "color: #e22c5a;">5) Aunt Flo will send you data about your cycle via email</style></p3>
</div>
<div id="wide">
<img src="demo.gif" alt="demo" width="200" height="400">
</div>
</div>
<div>
<p2><font size = "5"> Resources: </p2>
<ul>
<li><a href="https://www.usatoday.com/story/news/nation-now/2017/06/03/what-if-leave-tampon-too-long/342305001/"><font size = "5">USA Today Article</a></li>
<li><a href="https://www.webmd.com/women/guide/understanding-toxic-shock-syndrome-basics#1"><font size = "5">WebMD</a></li>
<li><a href="https://my.clevelandclinic.org/health/diseases/15437-toxic-shock-syndrome"><font size = "5">Cleveland Clinic</a></li>
</ul>
</div>
</body>
</html>