redrockjs/fire-exam
1
0
Fork 0
Code Issues Pull Requests Actions Packages Projects Releases Wiki Activity

fix: convert px to rem

Browse Source
This commit is contained in:
Valery Grunenko
2025-06-05 11:31:49 +03:00
parent 0ba1538520
commit 6c653aa196
13 changed files with 160 additions and 139 deletions
Download Patch File Download Diff File Expand all files Collapse all files

71
src/views/home/ui/offer/offer.module.scss
View File

@@ -1,51 +1,51 @@
.Offer {
background: $color-lightgray;
border-radius: 28px;
padding: 160px;
border-radius: rem(28px);
padding: rem(160px);
.Title {
font-family: $font-open-sans;
font-weight: $font-semi-bold;
font-size: 60px;
font-size: rem(60px);
line-height: 100%;
color: $color-text;
max-width: 1330px;
margin-bottom: 80px;
max-width: rem(1330px);
margin-bottom: rem(80px);
}
.Text {
font-family: $font-open-sans;
font-weight: $font-regular;
font-size: 32px;
font-size: rem(32px);
line-height: 100%;
color: $color-text;
margin-bottom: 20px;
margin-bottom: rem(20px);
}
.List {
display: flex;
flex-direction: column;
align-items: flex-start;
max-width: 1330px;
margin-bottom: 60px;
max-width: rem(1330px);
margin-bottom: rem(60px);
.ListItem {
font-family: $font-open-sans;
font-weight: $font-regular;
font-size: 32px;
font-size: rem(32px);
line-height: 160%;
color: $color-text;
list-style-type: decimal;
margin-left: 40px;
margin-left: rem(40px);
}
}
.RowForm {
display: flex;
flex-direction: row;
gap: 40px;
gap: rem(40px);
justify-content: center;
margin-bottom: 80px;
margin-bottom: rem(80px);
}
.Inner {
@@ -53,15 +53,15 @@
flex-direction: column;
align-items: flex-start;
background-color: $color-white;
border-radius: 28px;
padding: 80px 40px;
margin-bottom: 130px;
border-radius: rem(28px);
padding: rem(80px) rem(40px);
margin-bottom: rem(130px);
.Title {
font-family: $font-open-sans;
font-weight: $font-semi-bold;
font-size: 60px;
line-height: 1;
font-size: rem(60px);
line-height: 100%;
color: $color-text;
}
@@ -69,15 +69,15 @@
display: grid;
grid-template-rows: repeat(2, 1fr);
grid-template-columns: repeat(3, 1fr);
gap: 40px;
padding: 40px 0;
gap: rem(40px);
padding: rem(40px) 0;
}
.Tile {
position: relative;
padding: 25px;
height: 352px;
border-radius: 28px;
padding: rem(25px);
height: rem(352px);
border-radius: rem(28px);
overflow: hidden;
&:after {
@@ -121,7 +121,7 @@
z-index: 2;
font-family: $font-open-sans;
font-weight: $font-regular;
font-size: 42px;
font-size: rem(42px);
line-height: 100%;
color: $color-white;
}
@@ -132,7 +132,7 @@
display: none;
font-family: $font-open-sans;
font-weight: $font-regular;
font-size: 24px;
font-size: rem(24px);
line-height: 130%;
color: $color-white;
}
@@ -140,10 +140,10 @@
.Arrow {
position: absolute;
z-index: 2;
right: 25px;
bottom: 25px;
width: 64px;
height: 64px;
right: rem(25px);
bottom: rem(25px);
width: rem(64px);
height: rem(64px);
transform: rotate(-135deg);
transition: transform 250ms ease-in-out;
}
@@ -152,9 +152,9 @@
.Form {
position: relative;
padding: 40px 60px;
padding: rem(40px) rem(60px);
background: #292E3D;
border-radius: 28px;
border-radius: rem(28px);
overflow: hidden;
display: grid;
grid-template-columns: 1fr 1fr;
@@ -182,6 +182,7 @@
display: flex;
flex-direction: column;
}
.PanelRight {
width: 100%;
place-self: end end;
@@ -192,10 +193,10 @@
z-index: 2;
font-family: $font-open-sans;
font-weight: $font-light;
font-size: 30px;
font-size: rem(30px);
line-height: 100%;
color: $color-white;
margin-bottom: 16px;
margin-bottom: rem(16px);
}
.Title {
@@ -203,10 +204,10 @@
z-index: 2;
font-family: $font-open-sans;
font-weight: $font-regular;
font-size: 48px;
font-size: rem(48px);
line-height: 130%;
color: $color-white;
max-width: 660px;
max-width: rem(660px);
margin: 0;
}
}