created: 20230215183306350
creator: jmh
modified: 20230627165802394
modifier: jmh
tags: [[Type: Macro]] $:/tags/Macro
title: $:/jmh/itemTemplate/cornell-notes

\define cornell-notes(text,bullets,summary)
\define cornell-header(headLevel:"2",headTag,headTitle)
<h$headLevel$ id=<<qualify "#$headTag$">> >
$headTitle$
</h$headLevel$>
\end cornell-header

\define cornell-anchor(anchorTag,anchorTitle)
<a href=<<qualify "##$anchorTag$">> >
$anchorTitle$
</a>
\end cornell-anchor

<style>
.cornell-note-container {
  display: grid;
  grid-template-columns: 3fr 7fr [col-gap];
  grid-template-rows: auto;
  grid-gap: 8px;
  margin-bottom: 0px;
}
.cornell-note-summary,
.cornell-note-cues {
  border: 1px solid <<colour muted-foreground>>;
  border-radius: 4px;
  margin: 0px;
}
.cornell-note-body,
.cornell-note-summary,
.cornell-note-cues 
 {
	padding: 0 10px; 
}
.cornell-note-body p ul,
.cornell-note-summary p ul,
.cornell-note-cues p ul { 
	padding-left: 20px; 
}

.cornell-note-body p ol,
.cornell-note-summary p ol,
.cornell-note-cues p ol { 
	padding-left: 16px; 
}

.cornell-note-body p ol li,
.cornell-note-summary p ol li,
.cornell-note-cues p ol li { 
	padding-left: 5px; 
}

.cornell-note-body p h1, 
.cornell-note-cues p h2 { 
	text-align: center;
}

.cornell-note-body p h1, 
.cornell-note-body p h2, 
.cornell-note-body p h3, 
.cornell-note-body p h4 { 
	color: <<colour primary>>; 
	}

.cornell-note-cues { 
	background-color: <<colour page-background>>; 
}
.cornell-note-summary { 
	grid-column: 1/-1; margin-top: 10px;
}
</style>

<div class="cornell-note-container">
  <div class="cornell-note-cues">
		<p>

    $bullets$

		</p>
  </div>
  <div class="cornell-note-body">
     <p>

			$text$

		</p>
  </div>
  <div class="cornell-note-summary">
     <p>

			$summary$

		</p>
  </div>
</div>
\end

<<cornell-notes
"""
<<cornell-header "2" "hello-1" "Hello There">>

Hello, this is where you would type your notes.

"""
"""

# <<cornell-anchor "hello-1" "Hello There">>
# Goodbye

* Hello, again!

"""
"""
Hello There is a placeholder for demonstration purposes!
"""
>>