forked from shamitagurusu/GOAT-Timor
-
Notifications
You must be signed in to change notification settings - Fork 0
/
Copy patht.html
211 lines (186 loc) · 8.56 KB
/
t.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
207
208
209
210
211
<!DOCTYPE html>
<html>
<head>
<link href='https://fonts.googleapis.com/css?family=Rajdhani' rel='stylesheet'>
<style>
.j{
height:100%;
}
p{
font-family:"rajdhani";
font-size: 40px;
text-align: center;
}
.container {
position: relative;
width: 50%;
}
.m{
font: Black 'Rajdhani';
font-size: 20px;
text-shadow:
-1px -1px 0 #000;
1px -1px 0 #000;
-1px 1px 0 #000;
1px 1px 0 #000;
text-decoration: none;
color:black;
}
.image1 {
display: block;
width: 100%;
height: 100%;
}
.overlay {
position: absolute;
top: 0;
bottom: 0;
left: 0;
right: 0;
height: 100%;
width: 100%;
opacity: 0;
transition: .5s ease;
background-color: #008CBA;
}
.container:hover .overlay {
opacity: 1;
}
.rkt {
color: white;
font-size: 17px;
position: absolute;
top: 50%;
left: 50%;
transform: translate(-50%, -50%);
-ms-transform: translate(-50%, -50%);
text-align: center;
height: 100%;
width: 100%;
}
.container {
position: relative;
/*width: 50%;*/
width: 300px;
height: 450px;
}
</style>
</head>
<body bgcolor="#DCDCDC">
<table bgcolor="#84BDCB" width="100%" height= "70%" align= "center" cell-padding= "0px" class="u">
<tr height="100%"><td>
<center><p class="j">Now that you have calmed down, let us remind you of some successful historical woman who faced the same situations as you.</p></center>
</td></tr>
</table>
<br>
<br>
<br>
<center><b><p>Step 2: Travel back in History to see how woman in history overcame Imposter Syndrome</p></b></center>
<table align="center">
<tr>
<td>
<TABLE border="1">
<TR><td><a href="https://www.famousscientists.org/ada-lovelace/"class="m">
(1) Ada Lovelace (1815-1852)
</a></td>
</TR>
<tr>
<td>
<div class="container">
<img src="https://cdn.20m.es/img2/recortes/2017/06/07/487927-835-1200.jpg"
alt="Avatar" class="image1" align="middle">
<div class="overlay">
<div class="rkt">
</br></br>
(The Prophet of Computer Age)<br><br><br>
Augusta Ada King Noel, Countess of Lovelace was an English mathematician and writer, chiefly known for her work on Charles Babbages proposed mechanical general-purpose computer, the Analytical Engine (which served as a precursor to the modern computer).<br><br>
Ada was not only the first woman engineer and programmer in the field but was also the very first programmer in history.
</div>
</div>
</div>
</td>
</TR>
</TABLE>
</td>
<td>
<TABLE border="1">
<TR>
<td><a href="https://ghc.anitab.org"class="m">
(2) Grace Hopper (1906-1992)
</a></td>
</TR>
<tr>
<td>
<div class="container">
<img src="http://amhistory.si.edu/ogmt/images/upload/women-mathematicians/AHB2012q06025.jpg" class="image1" align="middle">
<div class="overlay">
<div class="rkt">
</br></br>
(The Queen of Software)<br><br><br>
Similar to Ada Lovelace, Grace Hopper helped pioneer computer programming. Her pioneering attitude extended throughout her career. <br><br>She worked on UNIVAC I (the first commercial computer in the US) and is also credited with coining the term computer bug. Today, the Grace Hopper Celebration is the worlds largest gathering of women technologists.
</div>
</div>
</div>
</div>
</div>
</div>
</td>
</TR>
</TABLE>
</td>
<td>
<TABLE border="1">
<TR>
<td><a href="https://www.google.com/url?sa=t&rct=j&q=&esrc=s&source=web&cd=3&cad=rja&uact=8&ved=2ahUKEwjs5fP7wqzdAhWKiCwKHaPPCmAQFjACegQIBxAB&url=https%3A%2F%2Flemelson.mit.edu%2Fresources%2Fradia-perlman&usg=AOvVaw02y4uOdjNf9pbpNPcEUcAG"class="m">
(3) Radia Perlman (1951-)
</a></td>
</TR>
<tr>
<td>
<div class="container">
<img src="http://simplecore.intel.com/newsroom/wp-content/uploads/sites/11/2011/04/Radia-Perlman-244x300.png" class="image1" align="middle">
<div class="overlay">
<div class="rkt">
</br></br>
(The mother of the Internet)<br><br><br>
Radia Perlman created the algorithm behind the Spanning Tree Protocol (STP), which is a crucial part of the internet's underlying foundation. Despite this, she insists the internet was not invented by any individual.
<br><br>
She said, In engineering, the point is to get the job done, and people are happy to help. You should be generous with credit, and you should be happy to help others.
</div>
</div>
</div>
</td>
</TR>
</TABLE>
</td>
<td>
<TABLE border="1">
<TR>
<td><a href="https://www.google.com/url?sa=t&rct=j&q=&esrc=s&source=web&cd=5&cad=rja&uact=8&ved=2ahUKEwjczIOIw6zdAhXBDiwKHW8VCIUQFjAEegQICRAB&url=http%3A%2F%2Fwww.computinghistory.org.uk%2Fdet%2F47364%2FSister-Mary-Kenneth-Keller%2F&usg=AOvVaw2laCipDUz4Ic7gJzqZ2HT_"class="m">
(4) Sister Mary K. Keller (1913-1985)
</a></td>
</TR>
<tr>
<td>
<div class="container">
<img src="http://introductionsnecessary.com/wp-content/uploads/2016/06/6-7-Sister-Keller-205x300.jpg" class="image1" align="middle">
<div class="overlay">
<div class="rkt">
</br></br>
(First Female Computer Science PhD)<br><br><br>
A truly inspirational female role model, Mary Kenneth Keller was the first woman to receive a PhD in Computer Science.
<br><br> She knew that the world was having an information explosion… and information is of no use unless its available, and challenged the menonly rule in choosing to study mathematics and computer science.<br> <br> Indeed, her bold contribution made computer use and the study of STEM subjects more accessible and appealing to women across the US and the world.
</div>
</div>
</div>
</td>
</TR>
</TABLE>
</td></tr>
</table>
<br><br>
<center><a href="y.html"><img src="https://upload.wikimedia.org/wikipedia/commons/thumb/9/90/Next_Arrow.svg/2000px-Next_Arrow.svg.png" height= "100px" width="100px"></a></center>
<br>
<br>
</body>
</html>