[LOOM-1284][BpkFlare] Fix class 2 CSS issues for BpkFlare #3389
Conversation
|
Visit https://backpack.github.io/storybook-prs/3389 to see this build running in a browser. |
|
Visit https://backpack.github.io/storybook-prs/3389 to see this build running in a browser. |
|
Visit https://backpack.github.io/storybook-prs/3389 to see this build running in a browser. |
| @@ -28,7 +28,6 @@ | |||
| // https://developer.mozilla.org/en-US/docs/Web/CSS/margin | |||
| // By using `display: flex` we ensure that this container is the nearest block container | |||
| display: flex; | |||
| min-width: 10rem; | |||
There was a problem hiding this comment.
Fixes centering issue when on mobile
| @@ -42,7 +41,8 @@ | |||
| // stylelint-disable-next-line unit-disallowed-list | |||
| bottom: -1px; | |||
| width: 700rem; // required for correct behaviour in IE | |||
| height: tokens.$bpk-flare-height-desktop; | |||
| // stylelint-disable-next-line unit-disallowed-list | |||
| height: calc(tokens.$bpk-flare-height-desktop - 1px); | |||
There was a problem hiding this comment.
Fixes bleeding from the bottom -1px
| @@ -56,20 +56,4 @@ | |||
| height: tokens.$bpk-flare-height-mobile; | |||
| } | |||
| } | |||
|
|
|||
| &__rounded-corner { | |||
There was a problem hiding this comment.
Moved to the bpk-content-bubble scss file
| @@ -44,6 +46,7 @@ | |||
| } | |||
|
|
|||
| &__container { | |||
| position: relative; | |||
There was a problem hiding this comment.
Allows us to use absolute positioning for the rounded-corners.
|
Visit https://backpack.github.io/storybook-prs/3389 to see this build running in a browser. |
| getClassName('bpk-content-bubble__rounded-corner--trailing'), | ||
| ]; | ||
|
|
||
| if (flareProps?.svgClassName) { |
There was a problem hiding this comment.
Maintain existing props for the corner svgs
|
Visit https://backpack.github.io/storybook-prs/3389 to see this build running in a browser. |
Co-authored-by: mungodewar <89925955+mungodewar@users.noreply.github.com>
Co-authored-by: mungodewar <89925955+mungodewar@users.noreply.github.com>
|
Visit https://backpack.github.io/storybook-prs/3389 to see this build running in a browser. |
Remember to include the following changes:
[KOA-123][BpkButton] Updating the colourREADME.md(If you have created a new component)README.md.d.ts) files updated