slimでiframeをレスポンシブ対応させる方法

最近の勉強で学んだ事を、ノート代わりにまとめていきます。
主に自分の学習の流れを振り返りで残す形なので色々、省いてます。
Webエンジニアの諸先輩方からアドバイスやご指摘を頂けたらありがたいです！

slimでiframeを記述する

slimでiframeを記述する必要がありやってみました。
htmlではこれだからこんな感じかな？とコードを編集しました。

html.slim

iframe src="https://www.youtube.com/embed/9No-FiEInLA" frameborder="0" width="100%" height="100%"

できた笑
コンパクトに記述できました。

レスポンシブ対応もさせたかったので調整しているの良い記事が合ったので
iframeをレスポンシブWebデザインに対応する方法

この記事通り

blog.css

.iframe-parent {
   position: relative;
   height: 0;
   overflow: hidden;
   padding-top: 56.25%;
}
.iframe-parent iframe {
    position: absolute;
    top: 0;
    left: 0;
    width: 100%;
    height: 100%;
}

html.slim

div.iframe-parent
  iframe src="https://www.youtube.com/embed/9No-FiEInLA" frameborder="0" width="100%" height="100%"

上手くレスポンシブ対応もできました！