Skip to content

Commit

Permalink
style(junior): optimize challenge page to avoid scrolling
Browse files Browse the repository at this point in the history
  • Loading branch information
aurelie-crouillebois committed Dec 16, 2024
1 parent 8cdcdf5 commit 0cb87a4
Show file tree
Hide file tree
Showing 6 changed files with 25 additions and 13 deletions.
2 changes: 1 addition & 1 deletion junior/app/components/robot-dialog.gjs
Original file line number Diff line number Diff line change
Expand Up @@ -4,7 +4,7 @@ import { tracked } from '@glimmer/tracking';

import didRender from '../modifiers/did-render';

const ROBOT_IMAGE_OFFSET = 76;
const ROBOT_IMAGE_OFFSET = 68;

export default class RobotDialog extends Component {
@tracked resizeObserver;
Expand Down
2 changes: 1 addition & 1 deletion junior/app/styles/app.scss
Original file line number Diff line number Diff line change
Expand Up @@ -48,7 +48,7 @@ b {
max-width: 1730px;

@include device-is('tablet') {
margin: 32px;
margin: 24px;
}

@include device-is('desktop') {
Expand Down
11 changes: 8 additions & 3 deletions junior/app/styles/components/bubble.scss
Original file line number Diff line number Diff line change
@@ -1,6 +1,6 @@
.bubble-container {
display: flex;
margin-bottom: 16px;
margin-bottom: 8px;
}

.bubble {
Expand All @@ -9,8 +9,13 @@
height: fit-content;
margin-right: 16px;
margin-left: 8px;
padding: 12px 24px;
font-size: 1.5rem;
padding: 8px 20px;
font-size: 1.4rem;

@include device-is('tablet') {
font-size: 1.25rem;
}

text-align: left;
background-color: var(--pix-primary-100);
border-radius: 16px 16px 16px 0;
Expand Down
8 changes: 4 additions & 4 deletions junior/app/styles/components/challenge/challenge-item.scss
Original file line number Diff line number Diff line change
@@ -1,19 +1,19 @@
.challenge-item {
display: flex;
align-content: center;
margin: 35px 140px 0;
margin: 16px 140px 0;
transition: all 0.4s;

@include device-is('tablet') {
margin: 35px 120px 0;
margin: 16px 120px 0;
}

&--single-display {
flex-direction: column;
}

&__media {
width: 60%;
width: 50%;
height: fit-content;
margin-right: var(--pix-spacing-6x);
padding: var(--pix-spacing-4x);
Expand All @@ -28,7 +28,7 @@
}

&__proposals {
width: 40%;
width: 50%;

&--single-display {
width: unset;
Expand Down
14 changes: 10 additions & 4 deletions junior/app/styles/components/robot-dialog.scss
Original file line number Diff line number Diff line change
@@ -1,26 +1,32 @@
.robot-speaking {
display: flex;
width: 100%;
margin-top: 30px;
margin-top: 24px;

@include device-is('tablet') {
margin-top: 12px;
}

.bubbles {
display: flex;
flex-direction: column;
justify-content: start;
max-width: 80%;
margin-left: 130px;
margin-left: 140px;

@include device-is('tablet') {
margin-left: 120px;
}
}

&__logo {
position: absolute;
width: 128px;
margin-top: -57px;
margin-right: var(--pix-spacing-3x);

@include device-is('tablet') {
width: 106px;
margin-top: -37px;
margin-right: var(--pix-spacing-4x);
}
}
}
Expand Down
1 change: 1 addition & 0 deletions junior/app/styles/pages/identified/missions/mission.scss
Original file line number Diff line number Diff line change
@@ -1,6 +1,7 @@
.mission-page {
&__body {
display: flex;
margin-top: 16px;
margin-left: 145px;

@include device-is('tablet') {
Expand Down

0 comments on commit 0cb87a4

Please sign in to comment.