Skip to content
New issue

Have a question about this project? Sign up for a free GitHub account to open an issue and contact its maintainers and the community.

By clicking “Sign up for GitHub”, you agree to our terms of service and privacy statement. We’ll occasionally send you account related emails.

Already on GitHub? Sign in to your account

♻️ refactor(alert): bordures en background-image [DS-3360] #742

Merged
merged 1 commit into from
Nov 6, 2023
Merged
Show file tree
Hide file tree
Changes from all commits
Commits
File filter

Filter by extension

Filter by extension

Conversations
Failed to load comments.
Loading
Jump to
Jump to file
Failed to load files.
Loading
Diff view
Diff view
5 changes: 5 additions & 0 deletions src/component/alert/style/_module.scss
Original file line number Diff line number Diff line change
Expand Up @@ -3,11 +3,16 @@
/// @group alert
////

@use 'module/spacing';

#{ns(alert)} {
@include relative();
@include padding(4v 9v 3v 14v);
@include set-title-margin(0 0 1v);
@include set-text-margin(0 0 1v);
background-size: 100% 1px, 1px 100%, 100% 1px, spacing.space(10v) 100%;
background-position: 0 0, 100% 0, 0 100%, 0 0, 100% 100%;
background-repeat: no-repeat, no-repeat no-repeat, no-repeat;
@include icon-size(md, before);
@include icon-style(before) {
@include absolute(0, null, null, 0);
Expand Down
10 changes: 5 additions & 5 deletions src/component/alert/style/_scheme.scss
Original file line number Diff line number Diff line change
Expand Up @@ -7,26 +7,26 @@

@mixin _alert-scheme($legacy: false) {
#{ns(alert)} {
@include color.box-shadow((plain grey) (background flat grey), (legacy:$legacy), all-1-in left-10v-in);
@include color.background-image((border plain grey) (border plain grey) (border plain grey) (border plain grey) (flat grey), (legacy:$legacy));

@include before {
@include color.text(inverted grey, (legacy:$legacy));
}

&--info {
@include color.box-shadow((plain info) (background flat info), (legacy:$legacy), all-1-in left-10v-in);
@include color.background-image((border plain info) (border plain info) (border plain info) (border plain info) (flat info), (legacy:$legacy));
}

&--error {
@include color.box-shadow((plain error) (background flat error), (legacy:$legacy), all-1-in left-10v-in);
@include color.background-image((border plain error) (border plain error) (border plain error) (border plain error) (flat error), (legacy:$legacy));
}

&--success {
@include color.box-shadow((plain success) (background flat success), (legacy:$legacy), all-1-in left-10v-in);
@include color.background-image((border plain success) (border plain success) (border plain success) (border plain success) (flat success), (legacy:$legacy));
}

&--warning {
@include color.box-shadow((plain warning) (background flat warning), (legacy:$legacy), all-1-in left-10v-in);
@include color.background-image((border plain warning) (border plain warning) (border plain warning) (border plain warning) (flat warning), (legacy:$legacy));
}
}
}