Browse Source

Nice scrollbar

master
Adrian Heine 4 years ago
parent
commit
6191159414
  1. 4
      src/display.js
  2. 11
      style.css

4
src/display.js

@ -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}
<blockquote>${data.quote || ''}</blockquote></div>
<div class=fulltext-wrapper><div class=fulltext>${text}
<blockquote>${data.quote || ''}</blockquote></div></div>
`) `)
target.appendChild(wrapper) target.appendChild(wrapper)
} }

11
style.css

@ -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 {

Loading…
Cancel
Save