atraydixit.github.io/about.html at main · asncd/atraydixit.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
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
<!DOCTYPE html>
<html lang="en">
<head>

<!-- Google tag (gtag.js) -->
<script async src="https://www.googletagmanager.com/gtag/js?id=G-SZGFS13KK4"></script>
<script>
  window.dataLayer = window.dataLayer || [];
  function gtag(){dataLayer.push(arguments);}
  gtag('js', new Date());

  gtag('config', 'G-SZGFS13KK4');
</script>

  <meta charset="UTF-8">
  <meta name="viewport" content="width=device-width, initial-scale=1.0">

<!-- Favicon -->
  <link rel="apple-touch-icon" href="img/favicon/favicon-180px.png">
  <link rel="icon" type="image/png" sizes="32x32" href="img/favicon/favicon-32px.png">
  <link rel="icon" type="image/png" sizes="96x96" href="img/favicon/favicon-96px.png">
  <link rel="icon" type="image/png" sizes="144x144" href="img/favicon/favicon-144px.png">


  <title>About</title>
  <link rel="stylesheet" href="styles.css">
  <link rel="stylesheet" href="https://unpkg.com/aos@next/dist/aos.css" />
  <script src="https://cdn.tailwindcss.com"></script>
  <link href='https://fonts.googleapis.com/css?family=Poppins' rel='stylesheet'>

</head>

<body>

<nav class="bg-sky-600/95 w-full fixed top-0 left-0 z-50 p-4">
  <div class="flex items-center justify-between text-xl">
    <a href="https://www.oncko.com" class="h-auto">
      <img src="img/logo_white.png" alt="onckologo" class="h-12 w-auto">
    </a>    <button
      id="menuToggle"
      class="text-white md:hidden focus:outline-none"
      onclick="toggleMenu()"
    >
      ☰
    </button>


  <!-- Navbar -->
  <nav id="mainNavbar" class="bg-[#00c8ff] w-full md:fixed md:top-32 left-0 z-40 p-4 md:flex hidden justify-evenly">
    <ul class="flex w-full justify-evenly text-2xl font-bold">
      <li><a href="https://www.oncko.com" class="text-black font-bold px-4 py-2 hover:bg-white focus:bg-white active:bg-white rounded-lg">Home</a></li>

    <li class="relative group">
      <a href="https://www.oncko.com/team" class="text-black font-bold px-4 py-2 hover:bg-white rounded-lg">Us ▾</a>
      <ul class="absolute hidden group-hover:block bg-white shadow-lg rounded-lg mt-1 w-40 z-50">
        <li><a href="#team-section" class="block px-4 py-2 text-black hover:bg-gray-100 rounded-lg">Team</a></li>
        <li><a href="#advisors-section" class="block px-4 py-2 text-black hover:bg-gray-100 rounded-lg">Advisors</a></li>
      </ul>
    </li>


      <li><a href="https://www.oncko.com/publications" class="text-black font-bold px-4 py-2 hover:bg-white rounded-lg">Publications</a></li>
      <li><a href="https://www.oncko.com/contact" class="text-black font-bold px-4 py-2 hover:bg-white rounded-lg">Contact</a></li>
    </ul>
  </nav>


  <ul id="mobileMenu" class="hidden flex-col space-y-2 mt-4 md:hidden">
    <li><a href="https://www.oncko.com" class="text-white text-lg px-2 py-2 rounded-lg hover:bg-gray-700 hover:border hover:border-gray-500 transition duration-300">Home</a></li>
    <li><a href="https://www.oncko.com/about" class="text-white text-lg px-2 py-2 rounded-lg hover:bg-gray-700 hover:border hover:border-gray-500 transition duration-300">About</a></li>
    <li><a href="https://www.oncko.com/team" class="text-white text-lg px-2 py-2 rounded-lg hover:bg-gray-700 hover:border hover:border-gray-500 transition duration-300">Team</a></li>
    <li><a href="https://www.oncko.com/publications" class="text-white text-lg px-2 py-2 rounded-lg hover:bg-gray-700 hover:border hover:border-gray-500 transition duration-300">Publications</a></li>
    <li><a href="https://www.oncko.com/contact" class="text-white text-lg px-2 py-2 rounded-lg hover:bg-gray-700 hover:border hover:border-gray-500 transition duration-300">Contact</a></li>
  </ul>
</nav>

<style>
  #starCanvas {
    position: fixed;
    top: 0;
    left: 0;
    z-index: -10; /* Behind content */
    width: 100%;
    height: 100%;
  }
</style>


<canvas class="filter brightness-100" id="starCanvas"></canvas>
  <div class="content">
    <div style = "background-color: rgba(0, 0, 0, 0.5);" class="font-semibold">
  <h1>Stay tuned...</h1>
  </div>
  </div>

  <script src="script.js"></script>
  <!-- JavaScript function -->
  <script>
    function toggleMenu() {
      const mobileMenu = document.getElementById('mobileMenu');
      mobileMenu.classList.toggle('hidden');
    }
  </script>
</body>
</html>