Initial commit

.gitignore

@@ -0,0 +1 @@
+node_modules/

css/markdown.css

@@ -0,0 +1,223 @@
+@import url('https://fonts.googleapis.com/css2?family=Lato:wght@300;400;700&display=swap');
+
+:root {
+	--background: #ecf0f1;
+	--detail: #bdc3c7;
+	--subtitle: #6A6C6E;
+	--color: #e67e22;
+	--text: #252323;
+}
+
+.marq-bold-text {
+	font-family: 'Lato', sans-serif;
+	font-weight: 700;
+}
+
+.link {
+	font-weight: 400;
+}
+
+.marq-p {
+	color: var(--subtitle);
+	font-size: 1.1rem;
+	font-family: 'Lato', sans-serif;
+	font-weight: 300;
+}
+
+.marq-centered-text {
+	text-align: center;
+}
+
+.marq-inline-code {
+	color: var(--color);
+}
+
+.marq-block-code {
+	color: var(--text);
+	font-family: 'Roboto Mono', monospace;
+}
+
+.marq-code-container {
+	background-color: var(--detail);
+	padding: 1rem;
+	font-family: 'Roboto Mono', monospace;
+	width: 0;
+	max-width: 100%;
+	min-width: 100%;
+}
+
+.marq-shoutout {
+	border: solid 0.2rem var(--text);
+	border-radius: 1rem;
+	padding: 1rem;
+	margin: 0rem;
+}
+
+.marq-shoutout-title {
+	color: var(--color);
+	font-size: 1.3rem;
+	padding-bottom: 0rem;
+	margin-bottom: 0rem;
+	font-family: 'Lato', sans-serif;
+}
+
+.marq-shoutout-text {
+	color: var(--subtitle);
+	font-size: 1.2rem;
+	margin: 0rem;
+	font-family: 'Lato', sans-serif;
+	font-weight: 300;
+}
+
+.marq-blockquote {
+	font-family: 'Lato', sans-serif;
+	font-style: italic;
+	color: var(--text);
+	font-size: 1.5rem;
+	margin-left: 2rem;
+	padding-left: 0.5rem;
+	border-left: 0.1rem solid;
+	border-left-color: var(--text);
+}
+
+.marq-content-img {
+	display: block;
+	margin: 0 auto;
+	max-width: 100%;
+	max-height: 30rem;
+	background-size: contain;
+	object-fit: contain;
+	background-repeat: no-repeat;
+	background-position: 50% 50%;
+}
+
+.img-subtitle {
+	padding-top: 0.5rem;
+	text-align: center;
+	font-size: 0.8rem;
+	font-style: italic;
+	color: var(--subtitle);
+}
+
+.table-align-left {
+	text-align: left
+}
+
+.table-align-center {
+	text-align: center
+}
+
+.table-align-right {
+	text-align: right
+}
+
+.marq-youtube-embedded {
+	display: block;
+	margin: 0 auto;
+	max-width: 100%;
+	height: 30rem;
+	max-height: 30rem;
+}
+
+th {
+	padding: 0 0.5rem;
+}
+
+td {
+	padding: 0 0.5rem;
+	font-family: 'Lato', sans-serif;
+	font-weight: 300;
+}
+
+/* slideshow */
+/* slideshow container */
+.marq-markdown-slideshow-container {
+	box-sizing: border-box;
+	max-width: 98%;
+	position: relative;
+	margin: auto;
+}
+
+/* hide the images by default */
+.marq-markdown-slideshow-slide {
+	box-sizing: border-box;
+	display: none;
+}
+
+/* next & previous buttons */
+.marq-markdown-slideshow-prev, .marq-markdown-slideshow-next {
+	box-sizing: border-box;
+	cursor: pointer;
+	position: absolute;
+	top: 50%;
+	width: auto;
+	margin-top: -1.375rem;
+	padding: 1rem;
+	color: black;
+	font-weight: bold;
+	font-size: 1.125rem;
+	transition: 0.6s ease;
+	border-radius: 0 0.188rem 0.188rem 0;
+	user-select: none;
+}
+
+/* position the next button to the right */
+.marq-markdown-slideshow-next {
+	box-sizing: border-box;
+	right: 0;
+	border-radius: 0.188rem 0 0 0.188rem;
+}
+
+/* on hover, add a black background color with a little bit see-through */
+.marq-markdown-slideshow-prev:hover, .marq-markdown-slideshow-next:hover {
+	background-color: rgba(0,0,0,0.8);
+	color: white;
+	text-decoration: none !important;
+}
+
+/* caption text */
+.marq-markdown-slideshow-slide-caption {
+	box-sizing: border-box;
+	color: black;
+	font-size: 0.938rem;
+	padding: 0.5rem 0.75rem;
+	position: absolute;
+	bottom: 0.5rem;
+	width: 100%;
+	text-align: center;
+}
+
+/* the dots indicators (current slide indicator) */
+.marq-markdown-slideshow-dot {
+	box-sizing: border-box;
+	cursor: pointer;
+	height: 0.5rem;
+	width: 0.5rem;
+	margin: 0 0.125rem;
+	background-color: #bbb;
+	border-radius: 50%;
+	display: inline-block;
+	transition: background-color 0.6s ease;
+}
+
+.marq-markdown-slideshow-active-slide, .marq-markdown-slideshow-dot:hover {
+	background-color: #717171;
+}
+
+/* fading animation */
+.fade {
+	-webkit-animation-name: fade;
+	-webkit-animation-duration: 1.5s;
+	animation-name: fade;
+	animation-duration: 1.5s;
+}
+
+@-webkit-keyframes fade {
+	from {opacity: .4}
+	to {opacity: 1}
+}
+
+@keyframes fade {
+	from {opacity: .4}
+	to {opacity: 1}
+}