옵시디언 - Presentation mode에서 slide down 바 만들기

옵시디언(Obsidian)의 프리젠테이션 모드(Start presentation)에서는 한 페이지 밖에 보이질 않고 다음 페이지로 넘길 수가 없네요.

아래의 CSS snippet를 복사해서 .obsidian -> snippets -> obsidian.css 파일에 넣어주면, 오른쪽에 slide down 할 수 있는 슬라이드 바가 생깁니다.

▶ obsidian.css

/*
CSS snippet that adds scrollbars on Obsidian slideshow slides in cases where content
would normally overflow and be hidden
*/

/* Apply styles to containing divs for slides */
.slides {
/* Set overflows to allow for auto vertical scroll bar and no horizontal scroll bar */
overflow-x: hidden !important;
overflow-y: auto !important;

/* Enable pointer events so users can click and drag on scrollbars */
pointer-events: auto !important;
}

/* Apply styles that apply directly to slides */
.slides > section {
/* Create flex container to arrange auto-generated elements by Obsidian on each slide */
display: flex;
flex-direction: column;
justify-content: center;
align-items: center;
}

/*
Snippet to make slideshow slides take up full height of slides' container div
*/
.slides {
height: 100% !important;
}

/*
Snippet to make slideshow slides take up full height of slides' container div
*/
.slides {
height: 100% !important;
}

/*
Stylesheet to change the color of the slide controls to purple to better match the rest of the interface
*/

/* Change progress bar color to be purple */
.progress span {
background-color: var(--text-accent) !important;
}

/* Change default slide control button colors to purple */
.reveal .controls {
color: var(--text-accent)
}

/* Set control hover color to be a slightly lighter purple */
.reveal .controls:hover {
color: var(--text-accent-hover)
}

.slides-close-btn {
color: #48474494;
}