dharmapp.github.io/index.html at main · dharmapp/dharmapp.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
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
<!DOCTYPE html>
<html lang="en">
<head>
<meta charset="UTF-8">
<meta name="viewport" content="width=device-width, initial-scale=1.0">
<title>Your Name — Academic Portfolio</title>
<meta name="description" content="Personal academic website of Your Name — research, publications, and contact information.">
<link rel="preconnect" href="https://fonts.googleapis.com">
<link href="https://fonts.googleapis.com/css2?family=Fraunces:wght@400;600;700&family=Inter:wght@400;500;600&family=IBM+Plex+Mono:wght@400;500&display=swap" rel="stylesheet">
<link rel="stylesheet" href="style.css">
</head>
<body>

<!-- ============================================================
     HOW TO EDIT THIS PAGE
     - Replace "Your Name" everywhere with your real name.
     - Replace the bracketed [placeholder] text with your own.
     - To swap a photo: put your image file inside the "images"
       folder, then change the file name in the src="..." part
       of the matching <img> tag below.
     - Do not delete the <!-- comments like this one --> they
       don't show up on the live site, they're just notes for you.
     ============================================================ -->

<header class="site-header">
  <div class="wrap">
    <a href="index.html" class="site-name">Your Name<span>.</span></a>
    <nav class="site-nav">
      <a href="index.html" class="active">Home</a>
      <a href="research.html">Research</a>
      <a href="publications.html">Publications</a>
      <a href="contact.html">Contact</a>
    </nav>
  </div>
</header>

<section class="hero">
  <div class="wrap">
    <div class="hero-text">
      <span class="eyebrow"><!-- Your field / department --> Field of Research · Institution</span>
      <h1>Your Name</h1>
      <p class="hero-role"><!-- Your title --> PhD Candidate / Postdoctoral Researcher / Research Scientist</p>
      <p class="hero-vision">
        <!-- Write 2–4 sentences about your research vision or focus, the way "Vision"
             reads on an academic homepage. Keep it plain and specific: what you
             study, why it matters, and where you're based. -->
        I work on [your research area], focusing on [specific problem or question].
        My work aims to [broader goal or application]. I am based at
        [Department, University].
      </p>
      <div class="hero-buttons">
        <a href="publications.html" class="btn btn-primary">View Publications</a>
        <a href="contact.html" class="btn">Get in Touch</a>
      </div>
    </div>
    <div class="hero-photo">
      <div class="photo-frame">
        <!-- Replace "images/profile-placeholder.svg" with e.g. "images/my-photo.jpg" -->
        <img src="images/profile-placeholder.svg" alt="Photo of Your Name">
      </div>
      <p class="photo-caption">Your Name, [Institution]</p>
    </div>
  </div>
</section>

<section class="block">
  <div class="wrap">
    <div class="section-head">
      <h2>Research Interests</h2>
      <a href="research.html" class="section-link">Full details →</a>
    </div>

    <!-- Duplicate this .research-item block for each additional topic -->
    <div class="research-item">
      <div class="research-figure">
        <img src="images/research-placeholder-1.svg" alt="Research topic 1 figure">
      </div>
      <div class="research-body">
        <h3>Research Topic One</h3>
        <p>One or two sentences describing this research area in plain language — what question it addresses and why it's interesting.</p>
      </div>
    </div>

    <div class="research-item">
      <div class="research-figure">
        <img src="images/research-placeholder-2.svg" alt="Research topic 2 figure">
      </div>
      <div class="research-body">
        <h3>Research Topic Two</h3>
        <p>One or two sentences describing this second research area.</p>
      </div>
    </div>

    <div class="research-item">
      <div class="research-figure">
        <img src="images/research-placeholder-3.svg" alt="Research topic 3 figure">
      </div>
      <div class="research-body">
        <h3>Research Topic Three</h3>
        <p>One or two sentences describing this third research area.</p>
      </div>
    </div>

  </div>
</section>

<section class="block">
  <div class="wrap">
    <div class="section-head">
      <h2>Selected Publications</h2>
      <a href="publications.html" class="section-link">All publications →</a>
    </div>

    <ol class="pub-list">
      <!-- Duplicate this .pub-entry block for each paper you want to preview here.
           Keep this list short (2-4 items) — the full list lives on publications.html -->
      <li class="pub-entry">
        <div class="pub-title">Title of your most notable paper goes here</div>
        <div class="pub-meta">Your Name, Co-Author Name — <em>Journal or Conference Name</em>, 2026</div>
        <div class="pub-tags">
          <a href="#">PDF</a>
          <a href="#">DOI</a>
        </div>
      </li>
      <li class="pub-entry">
        <div class="pub-title">Title of a second paper</div>
        <div class="pub-meta">Your Name, Co-Author Name — <em>Journal or Conference Name</em>, 2025</div>
        <div class="pub-tags">
          <a href="#">PDF</a>
          <a href="#">DOI</a>
        </div>
      </li>
    </ol>
  </div>
</section>

<footer>
  <div class="wrap">
    <p>&copy; 2026 Your Name. Last updated [Month Year].</p>
  </div>
</footer>

</body>
</html>