5861f9a811
fix: adapt modal header to look like design * fix: adapt modal header to look like design Approved-by: Chuma Mcphoy (We Ahead) Approved-by: Matilda Landström
40 lines
757 B
CSS
40 lines
757 B
CSS
.modalContent {
|
|
display: flex;
|
|
flex-direction: column;
|
|
gap: var(--Space-x2);
|
|
width: 100%;
|
|
padding: var(--Space-x1) var(--Space-x2) var(--Space-x4) var(--Space-x2);
|
|
}
|
|
|
|
.header {
|
|
display: flex;
|
|
flex-direction: column;
|
|
gap: var(--Space-x1);
|
|
padding: 0 var(--Space-x2);
|
|
}
|
|
|
|
.points {
|
|
display: flex;
|
|
align-items: center;
|
|
gap: var(--Space-x15);
|
|
}
|
|
|
|
.pointsText {
|
|
color: var(--Text-Brand-OnAccent-Heading);
|
|
}
|
|
|
|
.pointsNumber {
|
|
color: var(--Text-Brand-OnPrimary-1-Accent);
|
|
}
|
|
|
|
@media screen and (min-width: 768px) {
|
|
.modalContent {
|
|
padding: var(--Space-x1) var(--Space-x3) var(--Space-x3);
|
|
width: 560px; /* From figma design */
|
|
}
|
|
|
|
.button {
|
|
padding: var(--Space-x15) var(--Space-x2) var(--Space-x15) var(--Space-x3);
|
|
}
|
|
}
|