Nice scrollbar

This commit is contained in:
Adrian Heine 2020-09-25 20:12:40 +02:00
parent 4495444ec9
commit 6191159414
2 changed files with 11 additions and 4 deletions

View file

@ -159,8 +159,8 @@ export class Display {
<h1>${name}</h1> <h1>${name}</h1>
<p class=desc>${desc}</p> <p class=desc>${desc}</p>
</header> </header>
<div class=fulltext>${text} <div class=fulltext-wrapper><div class=fulltext>${text}
<blockquote>${data.quote || ''}</blockquote></div> <blockquote>${data.quote || ''}</blockquote></div></div>
`) `)
target.appendChild(wrapper) target.appendChild(wrapper)
} }

View file

@ -116,14 +116,21 @@ h1, .desc {
margin-left: 0.5rem; margin-left: 0.5rem;
} }
.fulltext { /* This wrapper is necessary so that the scrollbar doesn't clip out of
* the rounded border */
.fulltext-wrapper {
flex-grow: 1; flex-grow: 1;
background-color: #99d7e9; background-color: #99d7e9;
border-radius: 20px; border-radius: 20px;
border: 3px solid #1a1c1c; border: 3px solid #1a1c1c;
color: #1a1c1c; color: #1a1c1c;
overflow: hidden;
}
.fulltext {
padding: 0 0.5em; padding: 0 0.5em;
overflow: auto; overflow-y: auto;
height: 100%;
} }
.fulltext p { .fulltext p {