diff options
author | Mark Otto <markdotto@gmail.com> | 2020-09-23 02:38:58 +0300 |
---|---|---|
committer | Mark Otto <otto@github.com> | 2020-09-23 23:30:11 +0300 |
commit | 73e56404050fc13a5da3bb031fba0980406e7e6c (patch) | |
tree | de2daa0e021ad71f9366977a8a47c724c49cf7b5 /site/assets | |
parent | 3b8c17029f605726bdb65bd277ac142aec0d37ae (diff) |
Add example of responsive behavior for aspect ratios
Diffstat (limited to 'site/assets')
-rw-r--r-- | site/assets/scss/_component-examples.scss | 9 |
1 files changed, 9 insertions, 0 deletions
diff --git a/site/assets/scss/_component-examples.scss b/site/assets/scss/_component-examples.scss index 18b2c192e7..5ced393519 100644 --- a/site/assets/scss/_component-examples.scss +++ b/site/assets/scss/_component-examples.scss @@ -181,6 +181,15 @@ justify-content: center; } } +.bd-example-ratios-breakpoint { + .ratio-4x3 { + width: 16rem; + + @include media-breakpoint-up(md) { + --aspect-ratio: 50%; // 2x1 + } + } +} .bd-example-modal { background-color: #fafafa; |