cainamilech/m3-academy-template-checkout-caina-milech
1
0
Fork 0
forked from M3-Academy/m3-academy-template-checkout
Code Issues Pull Requests Packages Projects Releases Wiki Activity

feat: Adiciona header telas maiores que 2500

Browse Source
This commit is contained in:
Cainã Milech 2022-12-10 18:28:33 -03:00
parent 96710d1a57
commit 0af450897f
2 changed files with 45 additions and 1 deletions
Show Stats Download Patch File Download Diff File Expand all files Collapse all files

45
checkout/src/arquivos/sass/partials/_header.scss
View File

@ -13,6 +13,10 @@
width: 15.2829%; width: 15.2829%;
margin: 29px 0; margin: 29px 0;
@include mq(xxl, min) {
width: 19.2161%;
}
img { img {
width: 100%; width: 100%;
} }
@ -25,6 +29,12 @@
width: 12px; width: 12px;
height: 15px; height: 15px;
margin-right: 8px; margin-right: 8px;
@include mq(xxl, min) {
width: 29.47px;
height: 41.46px;
margin-right: 7.9px;
}
} }
span { span {
align-items: center; align-items: center;
@ -36,6 +46,11 @@
font-size: 12px; font-size: 12px;
line-height: 16px; line-height: 16px;
color: $color-black; color: $color-black;
@include mq(xxl, min) {
font-size: 24px;
line-height: 33px;
}
} }
i { i {
@ -46,8 +61,11 @@
.progress-bar { .progress-bar {
width: 446px; width: 446px;
@include mq(xxl, min) {
width: 1078.86px;
}
ul { ul {
border: 1px solid red;
list-style: none; list-style: none;
display: flex; display: flex;
align-items: center; align-items: center;
@ -82,6 +100,12 @@
font-size: 12px; font-size: 12px;
line-height: 14px; line-height: 14px;
margin-bottom: 9px; margin-bottom: 9px;
@include mq(xxl, min) {
font-size: 24px;
line-height: 28px;
margin-bottom: 15px;
}
} }
.progress-bar-line-left, .progress-bar-line-left,
@ -91,16 +115,30 @@
bottom: 5px; bottom: 5px;
height: 1px; height: 1px;
border-top: 1px solid $color-black-500; border-top: 1px solid $color-black-500;
@include mq(xxl, min) {
bottom: 11px;
}
} }
.progress-bar-line-left { .progress-bar-line-left {
left: 26%; left: 26%;
width: 96%; width: 96%;
@include mq(xxl, min) {
left: 21.2%;
width: 434px;
}
} }
.progress-bar-line-right { .progress-bar-line-right {
right: 21%; right: 21%;
width: 100%; width: 100%;
@include mq(xxl, min) {
right: 17.5%;
width: 450px;
}
} }
.active { .active {
@ -115,6 +153,11 @@
height: 12px; height: 12px;
border: 1px solid $color-black-500; border: 1px solid $color-black-500;
border-radius: 50%; border-radius: 50%;
@include mq(xxl, min) {
width: 24px;
height: 24px;
}
} }
} }
} }

1
checkout/src/arquivos/sass/utils/_variaveis.scss
View File

@ -28,6 +28,7 @@ $grid-breakpoints: (
md: 768px, md: 768px,
lg: 992px, lg: 992px,
xl: 1200px, xl: 1200px,
xxl: 2500px,
) !default; ) !default;
$z-index: ( $z-index: (