This commit is contained in:
Garry Ing 2021-03-29 22:13:11 -04:00
parent ada87a46bf
commit 0d2a99b372
No known key found for this signature in database
GPG Key ID: 3B379B1F2193CC3E
2 changed files with 35 additions and 29 deletions

View File

@ -3,8 +3,8 @@ layout: default
---
<div class="flex">
<article class="w-50 pa3 pr0">
<div class="container bg-white sha pa3 br4">
<header class="mb2 b--washed-green">
<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">
{% if page.date_created %}
<time class="code dib f7 pb2 flex" datetime="{{ page.date_created | date_to_xmlschema }}">{% if page.type != 'pages' %}
@ -17,16 +17,17 @@ layout: default
{% endif %}
</time>
</div>
<h1 class="normal work-sans-light f-6 lh-solid">{{ page.title }}</h1>
<h1 class="normal work-sans-light f-6 mb4 lh-solid">{{ page.title }}</h1>
</header>
<div id="notes-entry-container">
<div id="notes-entry-container" class="flex-auto">
<div class="note-contents f6 lh-copy">
{{ content }}
</div>
</div>
<aside class="bt b--moon-gray mt5">
<h3 class="normal f1 mv5 work-sans-light">Notes mentioning this note</h3>
<aside class="bt b--washed-green bw1 nl3 nr3 ph3 mt5">
<h3 class="normal f1 mt5 work-sans-light mb4">Notes mentioning this note</h3>
{% if page.backlinks.size > 0 %}
<div class="flex">
{% for backlink in page.backlinks %}
@ -45,7 +46,6 @@ layout: default
{% endif %}
</aside>
</div>
</div>
</article>
<div class="fixed top-0 right-0 w-50 vh-100">

View File

@ -47,6 +47,12 @@
width: 20rem;
}
// Height Helper
.min-vh-100-header-comp {
min-height: calc(100vh - 6rem);
}
// Extended cursors
.grab:hover {
@ -129,7 +135,7 @@
.note-contents {
blockquote {
margin: 0 0 0 0.5em;
padding: 0.05em 0.5em;
padding: 0 0.5em;
border-left: 2px solid rgba($accent-color, 0.5);
}
@ -159,10 +165,10 @@
display: block;
position: absolute;
z-index: 1;
bottom: .5rem;
bottom: 0;
right: 0;
pointer-events: none;
background-image: linear-gradient(to right, rgba(#fff, 0), rgba(#fff, 1) 50%);
width: 150px;
height: 1rem;
background-image: linear-gradient(rgba(#fff, 0), rgba(#fff, 1));
width: 100%;
height: 2rem;
}