forked from AEKoller/MADAIN
-
Notifications
You must be signed in to change notification settings - Fork 0
/
Copy pathindex.html
206 lines (184 loc) · 13.3 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
148
149
150
151
152
153
154
155
156
157
158
159
160
161
162
163
164
165
166
167
168
169
170
171
172
173
174
175
176
177
178
179
180
181
182
183
184
185
186
187
188
189
190
191
192
193
194
195
196
197
198
199
200
201
202
203
204
205
206
<!DOCTYPE html>
<html lang="en">
<head>
<!-- Bootstrap CSS for styling and responsiveness -->
<link rel="stylesheet" href="https://maxcdn.bootstrapcdn.com/bootstrap/4.5.2/css/bootstrap.min.css">
<!-- Required meta tags for proper HTML5 document and responsive behavior -->
<meta charset="UTF-8">
<meta name="viewport" content="width=device-width, initial-scale=1.0">
<!-- Page title updated to MADAIN -->
<title>MADAIN</title>
<!-- Custom CSS for additional styling -->
<link rel="stylesheet" href="static/css/style.css">
<!-- Google Fonts for typography enhancement -->
<link href="https://fonts.googleapis.com/css2?family=Forum&family=Goudy+Bookletter+1911&family=IM+Fell+Great+Primer:ital@0;1&display=swap" rel="stylesheet">
<!-- Favicon for the website -->
<link rel="icon" type="image/png" href="static/images/favicon/ak.png">
<style>
.overlay-text {
position: absolute;
top: 50%;
left: 50%;
transform: translate(-50%, -50%);
color: red;
font-size: 40px;
z-index: 10;
}
.iframe-container {
position: relative;
text-align: center;
}
</style>
</head>
<body class="project-body">
<!-- Page Header -->
<div class="container mt-5">
<h1 class="text-center">Commit to Skin Health: Raise Awareness About Skin Cancer</h1>
<p class="lead text-center">Join us in fighting the most common form of cancer through education, prevention, and early detection.</p>
</div>
<!-- Call-to-Action at the top of the page -->
<div class="container">
<div class="row">
<div class="col-12 text-center">
<!-- Link to find a dermatologist -->
<a href="https://www.skincancer.org/treatment-resources/find-a-dermatologist/" class="btn btn-primary" target="_blank">Find a Dermatologist Today!</a>
</div>
</div>
</div>
<!-- Navigation area -->
<div class="navigation-container">
<!-- Previous arrow -->
<a class="prev" onclick="plusSlides(-1)">❮</a>
<!-- Dot navigation -->
<div class="dot-container">
<span class="dot" onclick="currentSlide(1)"></span>
<span class="dot" onclick="currentSlide(2)"></span>
<span class="dot" onclick="currentSlide(3)"></span>
<span class="dot" onclick="currentSlide(4)"></span>
</div>
<!-- Next arrow -->
<a class="next" onclick="plusSlides(1)">❯</a>
</div>
<!-- Sliding content starts here -->
<div class="slideshow-container">
<div class="slide active">
<div class="row mb-4">
<div class="text-box">
<h3>Why Skin Cancer Awareness Matters</h3>
<p>May is designated as Skin Cancer Awareness Month, a critical time to spotlight the most common type of cancer—skin cancer. This month serves as a vital period for promoting awareness, education, and preventive measures. Here’s why it's crucial:</p>
<ul>
<li><strong>Increasing Rates:</strong> Skin cancer rates are climbing, particularly among young adults and women. More than 5 million cases are diagnosed each year, making it the most common form of cancer in the United States.</li>
<li><strong>The Importance of Early Detection:</strong> Early detection dramatically increases the chances of successful treatment. For melanoma, the deadliest form of skin cancer, the 5-year survival rate is 99% when detected early.</li>
<li><strong>Regular Check-Ups:</strong> Regular visits to a dermatologist can save lives by making early detection possible. Dermatologists are trained to spot potential problems that might not be visible to the untrained eye.</li>
<li><strong>Education and Prevention:</strong> Awareness leads to preventative behaviors such as using sunscreen and avoiding peak sun hours. Educating the public about skin cancer symptoms and risk factors is crucial for reducing rates of the disease.</li>
<li><strong>Impact of UV Exposure:</strong> Up to 90% of skin cancers are caused by exposure to the sun's ultraviolet (UV) rays. Awareness campaigns emphasize the importance of protecting skin from excessive sun exposure, which is a preventable risk factor.</li>
</ul>
<p>Understanding these aspects can help you take proactive steps towards skin health, not just in May but year-round. Remember, protecting your skin from the sun and regular skin screenings are simple yet effective ways to combat skin cancer.</p>
</div>
<div class="col-md-6">
<div class="image-box">
<img src="static/images/projects/image (4).png" alt="Skin Cancer Awareness" class="img-fluid">
</div>
</div>
</div>
</div>
<div class="slide">
<div class="row mb-4">
<div class="col-md-6">
<div class="content-box">
<h3>The Lifesaving Benefits of Early Detection</h3>
<p>Early detection of skin cancer significantly improves treatment outcomes and increases survival rates. Here’s a concise overview of its critical benefits:</p>
<h4>Increased Survival Rates</h4>
<p><strong>Improves Outcomes:</strong> Early diagnosis of melanoma and other skin cancers can lead to high cure rates.</p>
<h4>Less Invasive Treatment</h4>
<p><strong>Minimizes Severity:</strong> Catches skin cancers when they can be treated with less invasive methods, enhancing recovery and cosmetic outcomes.</p>
<h4>Cost-Effective</h4>
<p><strong>Reduces Costs:</strong> Early treatment is generally less expensive, avoiding the extensive costs of advanced care.</p>
<h4>Reduced Risk of Spread</h4>
<p><strong>Lowers Complications:</strong> Early detection prevents cancer from spreading to other parts of the body, simplifying treatment and improving prognosis.</p>
<h4>Community Awareness</h4>
<p><strong>Promotes Health Education:</strong> Raises awareness about the importance of regular skin checks, encouraging proactive health practices.</p>
<p>Notice any unusual changes in your skin? Consulting a dermatologist promptly can be lifesaving.</p>
</div>
</div>
<div class="col-md-6">
<div class="image-box text-right">
<img src="static/images/projects/image (7).png" alt="Benefits of Early Detection of Skin Cancer" class="img-fluid">
</div>
</div>
</div>
</div>
<div class="slide">
<div class="row mb-4">
<div class="col-md-6">
<div class="text-box">
<h3>Join The Big See: Your Monthly Check-Up Against Skin Cancer</h3>
<p>Regular self-examinations can play a crucial role in early detection, which is often linked to higher survival rates and less invasive treatment options.</p>
<h4>What to Look For</h4>
<ul>
<li><strong>NEW:</strong> Look for new moles or blemishes that have appeared since your last check. Familiarize yourself with your skin's baseline appearance to better spot new growths.</li>
<li><strong>CHANGING:</strong> Notice any changes in the color, shape, size, or texture of existing spots. Changes can be a sign of malignancy, especially in moles that were previously stable.</li>
<li><strong>UNUSUAL:</strong> Be aware of any spots that itch, hurt, crust, or bleed for more than three weeks. Unusual sensations or prolonged healing can indicate skin abnormalities.</li>
</ul>
<h4>How to Conduct Self-Checks</h4>
<ul>
<li><strong>TOOLS:</strong> Use a mirror for hard-to-see areas and consider documenting moles with photographs to track changes over time.</li>
<li><strong>TECHNIQUE:</strong> Follow a systematic approach during your checks—start at your head and work your way down, making sure to check all areas including the palms, soles, scalp, ears, nails, and back.</li>
<li><strong>FREQUENCY:</strong> Conduct your self-examinations monthly. Choose a specific day that's easy to remember, such as the first day of the month.</li>
</ul>
<p>Consult a dermatologist if you notice any suspicious changes. Professional evaluations are crucial for accurate diagnosis and appropriate management.</p>
</div>
</div>
<div class="col-md-6">
<div class="image-box text-right">
<img src="static/images/projects/image (6).png" alt="Skin Check-Up" class="img-fluid">
</div>
</div>
</div>
</div>
<div class="slide">
<div class="row mb-4">
<div class="col-md-6">
<div class="content-box">
<h3>Sun-Safe Practices to Reduce Skin Cancer Risk</h3>
<p>Practicing sun safety is essential not only for preventing sunburn but also for reducing the risk of skin cancer. Effective sun protection strategies can shield you from harmful UV radiation, which is a significant risk factor for most skin cancers. Importantly, sun protection is necessary year-round, as harmful UV rays can penetrate clouds and reflect off snow, sand, and water, increasing exposure even on cloudy or cold days.</p>
<ul>
<li><strong>Avoid Peak Sun Hours:</strong> Limit your sun exposure between 10 AM and 4 PM, when the sun's rays are strongest. This reduces your risk of skin damage and subsequent skin cancer.</li>
<li><strong>Wear Protective Clothing:</strong> Clothing can be your first line of defense against UV radiation. Wear long-sleeved shirts, pants, wide-brimmed hats, and sunglasses to protect your skin and eyes.</li>
<li><strong>Use Broad-Spectrum Sunscreen:</strong> Regularly apply a broad-spectrum sunscreen with an SPF of 30 or higher. Reapply every two hours, or more often if you are swimming or sweating, to maintain effective protection. Remember, sunscreen is important even on overcast days, as up to 80% of UV rays can still reach your skin.</li>
<li><strong>Seek Shade:</strong> Whenever possible, stay under shade when outdoors. Shade provides a physical barrier that reduces your exposure to direct sunlight.</li>
<li><strong>Avoid Tanning Beds:</strong> Tanning beds are known to significantly increase the risk of skin cancer. Avoiding these can lower your risk of developing skin cancer and prevent early skin aging.</li>
</ul>
<p>By adopting these sun-safe practices consistently throughout the year, you can significantly lower your risk of developing skin cancer, while also protecting against harmful UV radiation and promoting overall skin health.</p>
</div>
</div>
<!-- Image Column -->
<div class="col-md-6">
<div class="image-box text-right">
<img src="static/images/projects/image (5).png" alt="Sun-Safe Practices" class="img-fluid">
</div>
</div>
</div>
</div>
</div>
<!-- App iframe with overlay text -->
<div class="container mt-4 iframe-container">
<h3 class="overlay-text">MADAIN Web App Coming Soon</h3>
<iframe src="http://192.168.1.13:8501" width="800" height="600"></iframe>
</div>
<!-- Disclaimer at the bottom of the page -->
<div class="container mt-4">
<div class="row">
<div class="col-12">
<p class="disclaimer alert alert-warning">
Disclaimer: The content on this website is for informational purposes only and is not intended to serve as professional medical advice, diagnosis, or treatment. Always seek the advice of your physician or other qualified health provider with any questions you may have regarding a medical condition.
</p>
<div class="text-center">
<a href="https://www.skincancer.org/treatment-resources/find-a-dermatologist/" class="btn btn-primary" target="_blank">Find a Dermatologist Today!</a>
</div>
</div>
</div>
</div>
<script src="static/js/slideshow.js"></script>
</body>
</html>