diff options
Diffstat (limited to 'src/ui/Discussion.js')
| -rw-r--r-- | src/ui/Discussion.js | 35 |
1 files changed, 29 insertions, 6 deletions
diff --git a/src/ui/Discussion.js b/src/ui/Discussion.js index b0cdb4f..5fef693 100644 --- a/src/ui/Discussion.js +++ b/src/ui/Discussion.js @@ -7,24 +7,44 @@ import { Note } from './Note'; css` article { - display: flex; - flex-direction: column; + position: absolute; + inset: 0; overflow: auto; - flex: 1 1 auto; - padding: 0 2rem; } article > h1 { - flex: 0 0 auto; + display: flex; + align-items: baseline; + + position: sticky; + inset: 0; + bottom: auto; + z-index: 200; + + margin: 0; + padding: 0.75rem 1.5rem; + background: var(--theme-title-bg); + color: var(--theme-title-fg); +} +article > h1 > span { overflow: hidden; white-space: nowrap; text-overflow: ellipsis; } +article > h1 .back { + font-size: 0.8em; + color: inherit; + opacity: 0.5; + + margin-left: 1em; +} + article > div { position: relative; + margin: 2rem 2rem 6rem; } `; @@ -53,7 +73,10 @@ export const Discussion = ({ return ( <article> - <h1>{name}</h1> + <h1> + <span>{name}</span> + <a class="back" href="?">back</a> + </h1> <div> <Links width={width} height={height} links={links} /> <div> |