Skip to content

C
coopwire-hypothesis
Commit 8c74b212 authored by Lyza Danger Gardner's avatar Lyza Danger Gardner
Browse files
Options

Adjust CSS to render toast messages on full-width layouts

parent 4b8196b1
Show whitespace changes
Inline Side-by-side
Showing with 14 additions and 2 deletions
src/styles/sidebar/components/toast-messages.scss
View file @ 8c74b212
@use "../../mixins/panel"; @use "../../mixins/panel";
@use "../mixins/responsive";
@use "../../variables" as var; @use "../../variables" as var;
.toast-messages { .toast-messages {
position: absolute; position: absolute;
z-index: 1; z-index: 1;
width: 100%;
left: 0; left: 0;
padding: 0 8px; width: 100%;
padding: 0 0.5em;
@include responsive.tablet-and-up {
// When displaying in a wider viewport (desktop/tablet outside of sidebar)
max-width: responsive.$break-tablet;
width: responsive.$break-tablet;
padding-left: 2rem;
padding-right: 2rem;
left: 50%;
margin-left: calc(-0.5 * #{responsive.$break-tablet});
}
} }
.toast-message-container { .toast-message-container {
...@@ -70,6 +81,7 @@ ...@@ -70,6 +81,7 @@
&__message { &__message {
padding: 1em; padding: 1em;
width: 100%;
} }
&__link { &__link {
......
Markdown is supported
0% or
You are about to add 0 people to the discussion. Proceed with caution.
Finish editing this message first!
Please register or to comment