<div
	id="notion"
	class="window projectwindow"
	style="width: 50%; position: absolute; left: 10%; top: 10%; display: none; max-height: 820px; min-width: 400px;"
>
	<div id="notionheader" class="title-bar">
		<div class="title-bar-text">Notion Canvas</div>
		<div class="title-bar-controls">
			<button class="close" aria-label="Minimize"></button>
			<button class="close" aria-label="Close"></button>
		</div>
	</div>
	<div class="window-body" style="height: 100%;">
		<div class="field-row-stacked" style="height: 100%;">
			<!-- prettier-ignore -->
			<div
        id="text206"
        style="font-size: 22px; resize: none; padding: 10px; height:90%; overflow-y: hidden; padding-top: 0px; padding-bottom: 20px;"
        >
		<a href="https://github.com/S1monlol/notionCanvas"><h1 style="width: fit-content;"><i><u><b>Notion Canvas</b></u></i></h1></a>

		<h2>
			This project allows for integration between a Canvas calendar and a Notion database. It makes it easy to import assignments into your notion assignment database

		</h2>

		<video id="vid" controls="true" src="/demo.mov" style="object-fit: fill; display: block;"></video>
	</div>
		</div>
	</div>
</div>

<script>
	// if document is phone size, hide video
	if (window.innerWidth < 900) {
		document.getElementById("vid").style.display = "none";
	}
</script>
