Soumya Snigdha Kundu

1:style.css

2:index.html

1  * {
2      margin: 0;
3      padding: 0;
4      box-sizing: border-box;
5  }
6
7  html {
8      scrollbar-width: none;
9  }
10
11 html::-webkit-scrollbar {
12     display: none;
13 }
14
15 body {
16     min-height: 100vh;
17     display: flex;
18     flex-direction: column;
19     align-items: center;
20 }

1  // Updates rendering
2  let updates = [];
3
4  function renderUpdates(category) {
5      const list = document.getElementById('updates-list');
6      const filtered = category === 'all'
7          ? updates
8          : updates.filter(u => u.category === category);
9      list.innerHTML = filtered.map(u =>
10         `<div class="update-item">...</div>`
11     ).join('');
12 }
13
14 // Load updates from JSON
15 fetch('updates.json')
16     .then(response => response.json())
17     .then(data => {
18         updates = data;
19         renderUpdates('all');
20     });

1  [
2    {
3      "date": "Dec 2024",
4      "category": "publishing",
5      "description": "Paper accepted"
6    },
7    {
8      "date": "Nov 2024",
9      "category": "teaching",
10     "description": "TA for ML"
11   },
12   {
13     "date": "Oct 2024",
14     "category": "reviewing",
15     "description": "MICCAI reviewer"
16   }
17 ]

1  <!DOCTYPE html>
2  <html lang="en">
3  <head>
4      <meta charset="UTF-8">
5      <title>Soumya Snigdha Kundu</title>
6      <link rel="stylesheet" href="style.css">
7  </head>
8  <body>
9      <nav class="header">
10         <div class="nav-links">
11             <a href="#home">Home</a>
12             <a href="#about">About</a>
13         </div>
14     </nav>
15 </body>
16 </html>

1  <!DOCTYPE html>
2  <html lang="en">
3  <head>
4      <meta charset="UTF-8">
5      <meta name="viewport" content="width=device-width">
6      <title>Soumya Snigdha Kundu</title>
7      <link rel="stylesheet" href="style.css">
8  </head>
9  <body>
10     <nav class="header">
11         <div class="nav-links">
12             <a href="#home">Home</a>
13             <a href="#about">About</a>
14             <a href="#research">Research</a>
15             <a href="#news">News</a>
16         </div>
17     </nav>
18 </body>
19 </html>

1  * {
2      margin: 0;
3      padding: 0;
4      box-sizing: border-box;
5  }
6
7  html {
8      scrollbar-width: none;
9  }
10
11 body {
12     min-height: 100vh;
13     display: flex;
14     flex-direction: column;
15     align-items: center;
16     padding: 180px 20px 20px;
17     gap: 120px;
18 }

1  // Tab click handlers
2  document.querySelectorAll('.tab').forEach(tab => {
3      tab.addEventListener('click', () => {
4          document.querySelectorAll('.tab')
5              .forEach(t => t.classList.remove('active'));
6          tab.classList.add('active');
7          renderUpdates(tab.dataset.category);
8      });
9  });
10
11 // Name click handler
12 document.querySelector('.name-link')
13     .addEventListener('click', () => {
14         const el = document.getElementById('pronunciation');
15         el.classList.toggle('visible');
16     });

1  [
2    {
3      "date": "Dec 2024",
4      "category": "publishing",
5      "description": "Paper accepted at MICCAI"
6    },
7    {
8      "date": "Nov 2024",
9      "category": "teaching",
10     "description": "Started TA for ML course"
11   },
12   {
13     "date": "Oct 2024",
14     "category": "misc",
15     "description": "Joined Cosine as intern"
16   }
17 ]