varora24.github.io/anika.html at master · varora24/varora24.github.io · GitHub

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
<html lang="en">
    <head>
        <meta charset="UTF-8">
        <meta name="viewport" content="width=device-width, initial-scale=1.0">
        <link rel="stylesheet" href="styles.css">
        <title>Anika Castellino</title>
        <link type="text/vcard" href="contactinfo.vcf">
        <link type="text/x-vcard" href="contactios.vcf">
        <link rel="icon" type="image/png" href="assets/favicon.ico"/>
        <link rel="manifest" href="assets/site.webmanifest" crossorigin="use-credentials">
        <link rel="stylesheet" href="https://maxcdn.bootstrapcdn.com/font-awesome/4.4.0/css/font-awesome.min.css">
    </head>
    <body style="background: rgb(98, 36, 241);background: linear-gradient(151deg, purple 19%, #0C2340 100%);color: black;font-family: 'Open Sans', sans-serif;font-size: 15px;
    letter-spacing: 2px;
    margin-bottom: 20vh;">
        <!-- The Modal -->
        <div1 id="myModal" class="modal">
            <!-- Modal content -->
            <div class="modal-content">
                <span class="close">&times;</span>
                <a href="iulfiles/contactinfo.vcf" class="links"> Android </a>
                <a href="iulfiles/contactios.vcf" class="links"> iPhone </a>
            </div>
        </div1>

        <center>
        <div style="background-color: white ;width: fit-content;height: fit-content;border-radius: 20px;margin-left: 5%;margin-top: 5%;">
        <!-- Profile picture-->
            <br>
            <img src="https://media-exp1.licdn.com/dms/image/C4E03AQEPW8BO-9Ww5g/profile-displayphoto-shrink_400_400/0/1597005534675?e=1655942400&v=beta&t=jEMiUesSuAtYoujNBKHXXfwwFG-cXq8CWLbPP0-O5cg" class="profile-picture">
            <!-- Profile name-->
        <h1 class="profile name"><a target="_blank" class="profile name">Anika Castellino</a></h1>
        <!-- Profile motto-->
        <h2 class="profile motto">
            Finance & Economics Student at<br>
            University of Notre Dame, 23'
        </h2>
        <!-- Links and Headers-->
            <a class="links" id="myBtn" onclick="myFunction()"> Save Contact </a>
            <a href="https://www.linkedin.com/in/anika-castellino-50ba331b0/" target="_blank" class="links">LinkedIn</a>
            <a href="https://drive.google.com/file/d/1zfx7DXIA7WtwS0RchE5pJD_0DC5khwD1/view?usp=sharing" target="_blank" class="links">Resume</a>
            <a href="mailto:acastel4@nd.edu" target="_blank" class="links">Gmail</a>
            <a href="https://venmo.com/code?user_id=2823028509507584988&created=1650304201.560576&printed=1" target="_blank" class="links">Venmo</a>
            <br>
        </div>
        </center>
    </body>

</html>

<script>
// Get the modal
var modal = document.getElementById("myModal");

// Get the button that opens the modal
var btn = document.getElementById("myBtn");

// Get the <span> element that closes the modal
var span = document.getElementsByClassName("close")[0];

// When the user clicks the button, open the modal
btn.onclick = function() {
  modal.style.display = "block";
}

// When the user clicks on <span> (x), close the modal
span.onclick = function() {
  modal.style.display = "none";
}

// When the user clicks anywhere outside of the modal, close it
window.onclick = function(event) {
  if (event.target == modal) {
    modal.style.display = "none";
  }
}
</script>