Plan: Convert Paper Entries to Markdown Fenced Divs

Context

Adding a new paper currently requires typing ~8 lines of HTML with four CSS class names to remember (paper-title, paper-authors, paper-venue, paper-links). The goal is to let the user write papers in plain Markdown with standard formatting (**bold**, *italic*, [link](url)), wrapped in a single ::: paper / ::: fenced div block.

The page’s structural layout (two-column sidebar) must stay as raw HTML — there is no Markdown equivalent. Only the paper entries change.

Critical Files

index.qmd — split the single {=html} block; papers become fenced divs
styles.css — replace .paper-title / .paper-authors / .paper-venue / .paper-links selectors with :nth-child equivalents
nav-active.html — update dot-separator JS (no longer uses .paper-links class)
_quarto.yml — add anchor-sections: false

Implementation

1. `_quarto.yml` — disable Quarto anchor icons on headings

format:
  html:
    theme: cosmo
    css: styles.css
    toc: false
    include-after-body: nav-active.html
    anchor-sections: false

2. `index.qmd` — split `{=html}` block; paper entries become Markdown

New file structure (replace entire contents):

---
title: ""
page-layout: custom
toc: false
---

```{=html}
<div class="site-wrap">
  <div class="row g-0">

    <!-- SIDEBAR (never needs editing) -->
    <div class="col-12 col-md-3 sidebar-col">
      <div class="sidebar-inner">
        <img src="photo.png" alt="Jean Oh" class="profile-photo">
        <h1 class="profile-name">Jean Joohyun Oh</h1>
        <p class="profile-subtitle">
          Assistant Professor<br>
          Tepper School of Business<br>
          Carnegie Mellon University
        </p>
        <button class="sidebar-toggle" aria-expanded="false" aria-label="Toggle navigation menu">
          MENU <i class="bi bi-chevron-down"></i>
        </button>
        <div class="sidebar-collapsible">
          <ul class="sidebar-links">
            <li><a href="mailto:jjoh@cmu.edu"><i class="bi bi-envelope"></i> Email</a></li>
            <li><a href="https://www.linkedin.com/in/jeanoh" target="_blank" rel="noopener noreferrer"><i class="bi bi-linkedin"></i> LinkedIn</a></li>
            <li><a href="https://scholar.google.com/citations?user=Y7fv_WwAAAAJ&hl=en" target="_blank" rel="noopener noreferrer"><i class="bi bi-mortarboard"></i> Google Scholar</a></li>
            <li><a href="https://scholars.cmu.edu/26561-jean-joohyun-oh" target="_blank" rel="noopener noreferrer"><i class="bi bi-building"></i> CMU Faculty Page</a></li>
            <li><a href="cv.pdf" target="_blank" rel="noopener noreferrer"><i class="bi bi-file-earmark-pdf"></i> Curriculum Vitae</a></li>
          </ul>
          <nav class="sidebar-nav">
            <a href="#about">About</a>
            <a href="#whats-new">What's New</a>
            <a href="#research">Research</a>
            <a href="#teaching">Teaching</a>
          </nav>
        </div>
      </div>
    </div>

    <!-- MAIN CONTENT -->
    <div class="col-12 col-md-9 main-col">
      <div class="main-inner">
```

## About {#about}

I am an Assistant Professor...

I received my PhD...

## What's New {#whats-new}

```{=html}
<!-- To add an item: copy one <li> block. Most recent first. -->
<ul class="news-list">
  <li>
    <span class="news-date">Mar 2026</span>
    <span>
      Invited seminar talk at Johns Hopkins Carey Business School.<br>
      Invited presentation at the Reversing the Arrow Conference in San Diego.
    </span>
  </li>
</ul>
```

## Research {#research}

```{=html}
<h3 class="research-sub">Publications</h3>
<div class="paper-list">
```

<!-- To add a paper: copy one ::: paper block. Most recent first.
     Format: bold title + year, authors (use [Name](url) for links), *italic venue*, then links.
     Use {.paper-link} on each link so JS opens it in a new tab automatically.

::: paper
**Title of Paper** (YEAR)

Author One, Author Two, Author Three

*Journal Name*

[Paper](https://url){.paper-link} [Other Link](https://url){.paper-link}
:::
-->

::: paper
**Climate Change Framing and Innovator Attention: Evidence from an Email Field Experiment** (2023)

[Jorge Guzman](https://www.jorgeguzman.co/), Jean Joohyun Oh, [Ananya Sen](https://sites.google.com/view/ananyasen/home) (equal authorship)

*Proceedings of the National Academy of Sciences (PNAS)*

[Paper](https://www.pnas.org/doi/abs/10.1073/pnas.2213627120){.paper-link}
:::

::: paper
**Mapping the Class Ceiling: The Social Class Disadvantage for Attaining Management Positions** (2022)

[Paul Ingram](https://business.columbia.edu/faculty/people/paul-ingram), Jean Joohyun Oh

*Academy of Management Discoveries*

[Paper](https://journals.aom.org/doi/abs/10.5465/amd.2020.0030){.paper-link} [Harvard Business Review](https://hbr.org/2021/01/the-forgotten-dimension-of-diversity){.paper-link}
:::

::: paper
**What Motivates Innovative Entrepreneurs? Evidence from a Global Field Experiment** (2020)

[Jorge Guzman](https://www.jorgeguzman.co/), Jean Joohyun Oh, [Ananya Sen](https://sites.google.com/view/ananyasen/home) (equal authorship)

*Management Science*

[Paper](https://pubsonline.informs.org/doi/abs/10.1287/mnsc.2020.3612){.paper-link} [TechCrunch](https://techcrunch.com/2020/06/02/what-motivates-innovative-entrepreneurs-money-or-altruism/){.paper-link} [Scientific American](https://www.scientificamerican.com/article/saving-the-world-inspires-more-female-founders/){.paper-link} [Forbes](https://www.forbes.com/sites/adigaskell/2021/05/13/what-motivates-social-entrepreneurs/?sh=606871293e0f){.paper-link}
:::

```{=html}
</div>

<h3 class="research-sub">Working Papers</h3>
<div class="paper-list">
</div>
```

## Teaching {#teaching}

```{=html}
<!-- Carnegie Mellon -->
<h3 class="teaching-sub">Carnegie Mellon University</h3>
<ul class="course-list">
  <li>
    <span class="course-num">47-889</span>
    <span class="course-name">Proseminar in Organizational Research</span>
    <span class="course-level">PhD</span>
    <span class="course-terms">Spr 2026</span>
  </li>
  <li>
    <span class="course-num">70-415</span>
    <span class="course-name">Introduction to Entrepreneurship</span>
    <span class="course-level">Undergrad</span>
    <span class="course-terms">Fall 2025 · Fall 2024</span>
  </li>
</ul>

<!-- Columbia (Teaching Assistant) -->
<h3 class="teaching-sub">Columbia Business School <span class="teaching-role">(Teaching Assistant)</span></h3>
<ul class="course-list">
  <li>
    <span class="course-name">Technology Strategy</span>
    <span class="course-terms">Spr 2020 · Fall 2019</span>
  </li>
  <li>
    <span class="course-name">Business Ethics and Corporate Governance</span>
    <span class="course-terms">Spr 2019</span>
  </li>
</ul>
```

```{=html}
      </div>
    </div><!-- /main -->

  </div>

  <footer class="site-footer">
    <p>&copy; 2026 Jean Joohyun Oh</p>
  </footer>
</div>
```

3. `styles.css` — replace named paragraph classes with positional selectors

Remove these selectors (or replace): - .paper-title → .paper > p:first-child - .paper-authors, .paper-venue (shared block) → .paper > p:nth-child(2) and .paper > p:nth-child(3) - .paper-authors { margin-bottom: 0.1rem } → .paper > p:nth-child(2) { margin-bottom: 0.1rem } - .paper-venue { margin-bottom: 0.35rem } → .paper > p:nth-child(3) { margin-bottom: 0.35rem } - .paper-links → .paper > p:has(a.paper-link)

All other paper CSS stays unchanged (.paper, .paper-link, .paper-sep, .paper-list).

4. `nav-active.html` — update dot-separator to find link containers by content

Replace the current .paper-links query:

// Inject dot separators between paper links
var seen = new Set();
document.querySelectorAll('a.paper-link').forEach(function (a) {
  var container = a.parentElement;
  if (!seen.has(container)) {
    seen.add(container);
    Array.from(container.querySelectorAll('a.paper-link')).forEach(function (link, i) {
      if (i > 0) {
        var sep = document.createElement('span');
        sep.className = 'paper-sep';
        sep.textContent = '·';
        container.insertBefore(sep, link);
      }
    });
  }
});

What the user types to add a new paper

::: paper
**Paper Title Here** (2024)

Author One, [Author Two](https://their-url.com), Jean Joohyun Oh

*Journal Name*

[Paper](https://doi-url){.paper-link} [Media Outlet](https://url){.paper-link}
:::

No HTML tags. No CSS class names to remember on paragraphs. Only {.paper-link} on links (so JS auto-opens in new tab and injects dot separators).

Verification

quarto preview — check papers render with correct typography
Confirm paper numbering ([1], [2], [3]) continues across Publications → Working Papers
Confirm dot separators appear between paper links, no underline on dots
Confirm scroll-spy works (nav highlights as sections scroll into view)
Confirm mobile menu toggle still works