Improve things (#79)

* Add eleventy-plugin-embed-everything

* Update typography styles

.eleventy.js

@@ -5,6 +5,7 @@ const pluginSvgSprite = require("eleventy-plugin-svg-sprite")
 const pluginPageAssets = require("eleventy-plugin-page-assets")
 const markdownIt = require("markdown-it")
 const markdownItFootnote = require("markdown-it-footnote")
+const embedEverything = require("eleventy-plugin-embed-everything")
 
 const lodash = require("lodash")
 const filters = require("./utils/filters.js")
@@ -34,6 +35,7 @@ module.exports = function (config) {
 		assetsMatching: CONTENT_GLOBS.media,
 		silent: true
 	})
+	config.addPlugin(embedEverything)
 
 	// Filters
 	Object.keys(filters).forEach((filterName) => {

package.json

@@ -33,6 +33,7 @@
 		"cssesc": "^3.0.0",
 		"del-cli": "^4.0.1",
 		"dotenv": "^16.1.4",
+		"eleventy-plugin-embed-everything": "^1.18.2",
 		"eleventy-plugin-svg-sprite": "^1.2.2",
 		"focus-trap": "^6.9.4",
 		"focus-visible": "^5.2.0",

src/assets/styles/base/_typography.scss

@@ -12,21 +12,6 @@ h6 {
 }
 
 h1 {
-	font-size: 3.625rem;
-	line-height: 3.9875rem;
-
-	@include mq-down(lg) {
-		font-size: 3.25rem;
-		line-height: 3.575rem;
-	}
-
-	@include mq-down(sm) {
-		font-size: 2.25rem;
-		line-height: 2.475rem;
-	}
-}
-
-h2 {
 	font-size: 3.25rem;
 	line-height: 3.575rem;
 
@@ -41,7 +26,7 @@ h2 {
 	}
 }
 
-h3 {
+h2 {
 	font-size: 2.875rem;
 	line-height: 3.1625rem;
 
@@ -51,21 +36,26 @@ h3 {
 	}
 }
 
-h4 {
+h3 {
 	font-size: 2.25rem;
 	line-height: 2.475rem;
 }
 
-h5 {
+h4 {
 	font-size: 2rem;
 	line-height: 2.2rem;
 }
 
-h6 {
+h5 {
 	font-size: 1.8125rem;
 	line-height: 1.99375rem;
 }
 
+h6 {
+	font-size: 1.25rem;
+	line-height: 1.375rem;
+}
+
 // Subtitle
 p.subtitle {
 	font-size: 1.4375rem;

src/assets/styles/components/_content.scss

@@ -45,7 +45,7 @@
 
 		h2 + *,
 		h3 + * {
-			margin-top: 0 !important;
+			margin-top: 0;
 		}
 
 		p {
@@ -83,7 +83,7 @@
 			margin-top: 2rem;
 			margin-bottom: 1.5rem;
 			border-radius: $border-radius-8;
-    }
+		}
 
 		.footnotes-sep {
 			margin-top: 2.75rem;
@@ -236,5 +236,25 @@
 			clip-path: inset(2px 2px round 8px);
 			background: $white;
 		}
+
+		.eleventy-plugin-embed-twitter {
+			display: flex;
+			justify-content: center;
+
+			blockquote {
+				border: none;
+			}
+		}
+
+		.eleventy-plugin-youtube-embed {
+			border-radius: $border-radius-8;
+			overflow: hidden;
+		}
+
+		.eleventy-plugin-embed-instagram {
+			width: 100%;
+			border-radius: $border-radius-12 !important;
+			border: none !important;
+		}
 	}
 }