climateconnections=html`<div>${header}<br/>${chords}</div>`
header=html`<div style="max-width: 640px;background-color:${trevacolour};color:white;font-family: 'notesstyle-boldtfregular';"><span style="font-size:64px;height: 48px;display: table-cell;vertical-align: middle;"> t </span><span style="font-size:32px;height: 48px;display: table-cell;vertical-align: middle;">Climate Connections</span></div>`
trevacolour='#2E4B78' // Supplied by Achim
groupcolours=[{oceanic:'#007D8A',terrestrial:'#FF8F1C',atmospheric:'#009CDE'}][0]
fontfile=FileAttachment("notesstyle-bold-updatedtf.woff2") // This is only here to tag the woff2 file as "In use"
//preload=html`<link rel="preload" as="font" href="${fonturl}" type="font/woff2" crossorigin="anonymous">` // Not sure this is needed.
Purpose-built for displays of data
Observable is your go-to platform for exploring data and creating expressive data visualizations. Use reactive JavaScript notebooks for prototyping and a collaborative canvas for visual data exploration and dashboard creation.
