not expander

This commit is contained in:
Garry Ing 2021-04-03 20:24:54 -04:00
parent 5b60973e4f
commit d8dc299bae
No known key found for this signature in database
GPG Key ID: 62E12D2F8C30C493
4 changed files with 15 additions and 3 deletions

View File

@ -1,4 +1,4 @@
<header id="header" class="f5 pa3 flex bb b--dark-green bg-washed-green justify-between sticky top-0 w-100 items-baseline z-1">
<header id="header" class="f5 pa3 flex bb b--dark-green bg-washed-green justify-between sticky top-0 w-100 items-baseline z-3">
{%- assign default_paths = site.pages | map: "path" -%}
{%- assign page_paths = site.header_pages | default: default_paths -%}
{%- assign titles_size = site.pages | map: 'title' | join: '' | size -%}

View File

@ -1,6 +1,6 @@
<!-- That file is not particularly elegant. This will need a refactor at some point. -->
<div class="hide-child links-dark-green">
<div id='tooltip-wrapper' class="bg-white br4 shadow-solid-accent lh-copy dn o-0 pa3 w6 f6 absolute child">
<div id='tooltip-wrapper' class="bg-white br4 shadow-solid-accent lh-copy dn o-0 pa3 w6 f6 absolute z-2 child">
<div id='tooltip-content' class="relative overflow-hidden note-contents">
</div>
<div id="tooltip-source" class="f7 light-silver"></div>

View File

@ -2,7 +2,7 @@
layout: default
---
<div class="flex">
<article class="w-50 pa3 pr0">
<article id="note-container" class="w-50 pa3 pr0 relative z-1">
<div class="container bg-white min-vh-100-header-comp pa3 br4 flex flex-column justify-between">
<header>
<div class="note-meta flex justify-between">
@ -49,6 +49,7 @@ layout: default
{% endif %}
</aside>
</div>
<button id="note-expand" class="absolute top-1 pointer nr4 right-0 bg-washed-green button-reset bn dark-green o-50"></button>
</article>
<div class="fixed top-0 right-0 w-50 vh-100">

View File

@ -368,3 +368,14 @@ if (typeof window.graphData !== 'undefined') {
return str.substr(0, str.lastIndexOf(separator, maxLen)) + '...'
}
}
// Note expander
const noteExpander = document.querySelector('#note-expand')
if (noteExpander) {
noteExpander.addEventListener('click', (event) => {
document.querySelector('#note-container').classList.toggle('w-two-thirds')
event.target.classList.toggle('rotate-180')
})
}