layout
title
page
Publications
/* Sidebar Navigation */
.section-nav {
padding-left: 0;
border-left: 1px solid #efefef;
}
.section-nav a {
text-decoration: none;
display: block;
padding: .125rem 0;
color: #ccc;
transition: all 50ms ease-in-out; /* 💡 This small transition makes setting of the active state smooth */
}
.section-nav a:hover,
.section-nav a:focus {
color: #666;
}
/** Poor man's reset **/
{
box-sizing: border-box;
}
html, body {
background: #fff;
}
body {
font-family: -apple-system, BlinkMacSystemFont, "Segoe UI", "Roboto", "Oxygen", "Ubuntu", "Cantarell", "Fira Sans", "Droid Sans", "Helvetica Neue", sans-serif;
}
ul, ol {
list-style: none;
margin: 0;
padding: 0;
}
li {
margin-left: 1rem;
}
h1 {
font-weight: 300;
}
/** page layout **/
main {
display: grid;
grid-template-columns: 800px 300px;
max-width: 1500px;
width: 90%;
margin: 0 auto;
}
/** enlarge the sections for this demo, so that we have a long scrollable page **/
section {
padding-bottom: 10rem;
}
</style>
{% include render_pub_list.liquid variable="category" value="journal" check="==" %}
<section id="Conferences">
Full-length Conference Publications
{% include render_pub_list.liquid variable="category" value="conference" check="==" %}
Workshop and Short Conference Publications
{% include render_pub_list.liquid variable="category" value="workshop" check="==" %}
Journal Conference Workshop and Short Conference
<script>
window.addEventListener('DOMContentLoaded', () => {
const observer = new IntersectionObserver(entries => {
entries.forEach(entry => {
const id = entry.target.getAttribute('id');
if (entry.intersectionRatio > 0) {
document.querySelector(`nav li a[href="#${id}"]`).parentElement.classList.add('active');
} else {
document.querySelector(`nav li a[href="#${id}"]`).parentElement.classList.remove('active');
}
});
});
// Track all sections that have an `id` applied
document.querySelectorAll('section[id]').forEach((section) => {
observer.observe(section);
});
});
</script>