diff options
| author | Mark Otto <markdotto@gmail.com> | 2020-09-22 00:15:15 +0300 |
|---|---|---|
| committer | Mark Otto <otto@github.com> | 2020-09-23 23:30:11 +0300 |
| commit | 18f8601d29ba4ccb11eb1d040eedb093ad48849b (patch) | |
| tree | 33e444606399d9d63c0f678ab7ceaf740bc76c21 /site/assets | |
| parent | 5280771883561065a1641f46f2ee56a4eaafae4f (diff) | |
Updates responsive embeds with new class names and CSS variables
- Renames .embed-responsive-XbyY classes to .embed-responsive-XxY
- Simplifies the Sass map to just be key and value, ratio and percentage
- Builds .embed-responsive-* modifiers with CSS variables
- Updates docs to show power of CSS variables
- Add notes to the Migration guide
Diffstat (limited to 'site/assets')
| -rw-r--r-- | site/assets/scss/_component-examples.scss | 13 |
1 files changed, 13 insertions, 0 deletions
diff --git a/site/assets/scss/_component-examples.scss b/site/assets/scss/_component-examples.scss index 87dcd15652..2c8f7e2e03 100644 --- a/site/assets/scss/_component-examples.scss +++ b/site/assets/scss/_component-examples.scss @@ -164,6 +164,19 @@ margin-top: .5rem; margin-bottom: .5rem; } + + // Responsive embed helpers + .embed-responsive { + display: inline-block; + color: $gray-600; + background-color: $gray-100; + border: $border-width solid $border-color; + } + .embed-responsive-item { + display: flex; + align-items: center; + justify-content: center; + } } .bd-example-modal { |