Remove youtube embed

conedevelopment · Mar 2, 2024 · bfdad3a · bfdad3a
1 parent 608870c
commit bfdad3a
Show file tree

Hide file tree

Showing 3 changed files with 16 additions and 1 deletion.
diff --git a/src/css/main.css b/src/css/main.css
@@ -3333,6 +3333,12 @@ pre[class*=language-] {
   position: absolute;
   text-transform: uppercase;
 }
+.post-content a[href*=youtube] img {
+  aspect-ratio: 16/9;
+  inline-size: 100%;
+  object-fit: cover;
+  object-position: center;
+}
 
 .cta {
   background-color: var(--spruce-footer-color-background);

diff --git a/src/docs/getting-started/internationalization.md b/src/docs/getting-started/internationalization.md
@@ -13,7 +13,7 @@ The simplest example is the right-to-left (RTL) writing mode used by Arabic and
 
 For more information, check out this excellent introductory video from [Moriel Schottlender](https://twitter.com/mooeypoo) hosted by [Jason Lengstorf](https://www.jason.af/):
 
-<iframe width="600" height="400" src="https://www.youtube.com/embed/OHF2h1_fBCM" title="Right-to Left (RTL) Support for Websites (with Moriel Schottlender) — Learn With Jason" frameBorder="0" allow="accelerometer; autoplay; clipboard-write; encrypted-media; gyroscope; picture-in-picture" allowFullScreen></iframe>
+[![Right-to Left (RTL) Support for Websites (with Moriel Schottlender) — Learn With Jason](https://img.youtube.com/vi/OHF2h1_fBCM/hqdefault.jpg)](https://www.youtube.com/watch?v=OHF2h1_fBCM)
 
 ## Logical Properties and Values
 

diff --git a/src/scss/section/_post-content.scss b/src/scss/section/_post-content.scss
@@ -57,4 +57,13 @@
       text-transform: uppercase;
     }
   }
+
+  a[href*='youtube'] {
+    img {
+      aspect-ratio: 16 / 9;
+      inline-size: 100%;
+      object-fit: cover;
+      object-position: center;
+    }
+  }
 }