Marc Mintel
5397309103
Some checks failed
Build & Deploy / 🔍 Prepare (push) Successful in 20s
Build & Deploy / 🧪 QA (push) Failing after 34s
Build & Deploy / 🏗️ Build (push) Has started running
Build & Deploy / 🚀 Deploy (push) Has been cancelled
Build & Deploy / 🧪 Smoke Test (push) Has been cancelled
Build & Deploy / ⚡ Lighthouse (push) Has been cancelled
Build & Deploy / 🔔 Notify (push) Has been cancelled
75 lines
1.4 KiB
Plaintext
75 lines
1.4 KiB
Plaintext
@import '../../scss/styles.scss';
|
|
|
|
@layer payload-default {
|
|
.banner {
|
|
font-size: 1rem;
|
|
line-height: base(1);
|
|
border: 0;
|
|
vertical-align: middle;
|
|
background: var(--theme-elevation-100);
|
|
color: var(--theme-elevation-800);
|
|
border-radius: $style-radius-m;
|
|
padding: base(0.5);
|
|
margin-bottom: $baseline;
|
|
|
|
&--has-action {
|
|
cursor: pointer;
|
|
text-decoration: none;
|
|
}
|
|
|
|
&--has-icon {
|
|
display: flex;
|
|
|
|
svg {
|
|
display: block;
|
|
}
|
|
}
|
|
|
|
&--type-default {
|
|
&.button--has-action {
|
|
&:hover {
|
|
background: var(--theme-elevation-900);
|
|
}
|
|
|
|
&:active {
|
|
background: var(--theme-elevation-950);
|
|
}
|
|
}
|
|
}
|
|
|
|
&--type-error {
|
|
background: var(--theme-error-100);
|
|
color: var(--theme-error-600);
|
|
|
|
svg {
|
|
@include color-svg(var(--theme-error-600));
|
|
}
|
|
|
|
&.button--has-action {
|
|
&:hover {
|
|
background: var(--theme-error-200);
|
|
}
|
|
|
|
&:active {
|
|
background: var(--theme-error-300);
|
|
}
|
|
}
|
|
}
|
|
|
|
&--type-success {
|
|
background: var(--theme-success-100);
|
|
color: var(--theme-success-600);
|
|
|
|
&.button--has-action {
|
|
&:hover {
|
|
background: var(--theme-success-200);
|
|
}
|
|
|
|
&:active {
|
|
background: var(--theme-success-200);
|
|
}
|
|
}
|
|
}
|
|
}
|
|
}
|