Skip to content

Commit

Permalink
Merge pull request #60 from MargoMarm/fix/LogoLink
Browse files Browse the repository at this point in the history 
fix redirect while clicking on logo
  • Loading branch information
@MargoMarm
MargoMarm committed Sep 21, 2023
2 parents 35182e5 + e850625 commit 69c8703
Show file tree
Hide file tree
Showing 19 changed files with 296 additions and 5,135 deletions.
4,881 changes: 1 addition & 4,880 deletions package-lock.json
View file

Large diffs are not rendered by default.

22 changes: 10 additions & 12 deletions src/components/ParamsBar/ParamsBar.styled.jsx
View file
Original file line number Diff line number Diff line change
Expand Up @@ -2,25 +2,23 @@ import styled from '@emotion/styled';
import { mq } from '../../utils';

export const ProgressBar = styled.div`
${mq.smallMobile} {
display: flex;
justify-content: space-around;
width: 178px;
height: 4px;
}
display: flex;
justify-content: space-around;
width: 178px;
height: 4px;
${mq.tablet} {
width: 268px;
}
`;

export const BarItem = styled.div`
${mq.smallMobile} {
width: 50px;
height: 4px;
border-radius: 2px;
width: 50px;
height: 4px;
border-radius: 2px;
background: #303030;
background: #303030;
}
${mq.tablet} {
width: 80px;
}
Expand Down
147 changes: 64 additions & 83 deletions src/components/ParamsBlockСard/ParamsBlockCard.styled.jsx
View file
Original file line number Diff line number Diff line change
Expand Up @@ -2,20 +2,18 @@ import styled from '@emotion/styled';
import { mq, colors } from '../../utils';

export const GreyCard = styled.div`
${mq.smallMobile} {
position: absolute;
top: ${props => (props.step === '2' ? 534 : 474)}px;
left: ${props => (props.step === '2' ? 154 : 101)}px;
display: flex;
justify-content: center;
align-items: center;
width: 146px;
height: 66px;
background: #303030;
border-radius: 12px;
}
position: absolute;
top: ${props => (props.step === '2' ? 534 : 474)}px;
left: ${props => (props.step === '2' ? 154 : 101)}px;
display: flex;
justify-content: center;
align-items: center;
width: 146px;
height: 66px;
background: #303030;
border-radius: 12px;
${mq.tablet} {
top: 630px;
Expand All @@ -32,18 +30,16 @@ export const GreyCard = styled.div`
`;

export const GreySvgWrapper = styled.div`
${mq.smallMobile} {
display: flex;
justify-content: center;
align-items: center;
width: 30px;
height: 30px;
margin-right: 8px;
display: flex;
justify-content: center;
align-items: center;
width: 30px;
height: 30px;
margin-right: 8px;
background: ${colors.orangeSecondary};
background: ${colors.orangeSecondary};
border-radius: 50%;
}
border-radius: 50%;
${mq.tablet} {
width: 40px;
Expand All @@ -53,11 +49,9 @@ export const GreySvgWrapper = styled.div`
`;

export const GreySvg = styled.svg`
${mq.smallMobile} {
width: 12px;
height: 12px;
fill: ${colors.white};
}
width: 12px;
height: 12px;
fill: ${colors.white};
${mq.tablet} {
width: 20px;
Expand All @@ -68,15 +62,13 @@ export const GreySvg = styled.svg`
export const GreyTextWrapper = styled.div``;

export const GreyDynamicText = styled.p`
${mq.smallMobile} {
margin-bottom: 4px;
margin-bottom: 4px;
font-size: 16px;
font-weight: 700;
line-height: 112.5%;
font-size: 16px;
font-weight: 700;
line-height: 112.5%;
color: ${colors.white};
}
color: ${colors.white};
${mq.tablet} {
margin-bottom: 8px;
Expand All @@ -86,13 +78,11 @@ export const GreyDynamicText = styled.p`
`;

export const GreyStaticText = styled.p`
${mq.smallMobile} {
font-size: 12px;
font-weight: 400;
line-height: 133.3%;
font-size: 12px;
font-weight: 400;
line-height: 133.3%;
color: rgba(239, 237, 232, 0.65);
}
color: rgba(239, 237, 232, 0.65);
${mq.tablet} {
font-size: 16px;
Expand All @@ -102,17 +92,16 @@ export const GreyStaticText = styled.p`
`;

export const OrangeCard = styled.div`
${mq.smallMobile} {
position: absolute;
top: 625px;
right: 0;
width: 119px;
height: 76px;
padding: 14px 18px;
border-radius: 12px;
background: ${colors.orangeSecondary};
}
position: absolute;
top: 625px;
right: 0;
width: 119px;
height: 76px;
padding: 14px 18px;
border-radius: 12px;
background: ${colors.orangeSecondary};
${mq.tablet} {
top: 782px;
Expand All @@ -126,19 +115,17 @@ export const OrangeCard = styled.div`
`;

export const OrangeSvgWrapper = styled.div`
${mq.smallMobile} {
display: flex;
justify-content: center;
align-items: center;
display: flex;
justify-content: center;
align-items: center;
width: 20px;
height: 20px;
margin-bottom: 4px;
width: 20px;
height: 20px;
margin-bottom: 4px;
background-color: #efa082;
background-color: #efa082;
border-radius: 50%;
}
border-radius: 50%;
${mq.tablet} {
margin-bottom: 8px;
Expand All @@ -149,11 +136,9 @@ export const OrangeSvgWrapper = styled.div`
`;

export const OrangeSvg = styled.svg`
${mq.smallMobile} {
width: 12px;
height: 12px;
fill: ${colors.white};
}
width: 12px;
height: 12px;
fill: ${colors.white};
${mq.tablet} {
width: 16px;
Expand All @@ -167,18 +152,16 @@ export const OrangeTextWrapper = styled.div`
`;

export const OrangeDynamicText = styled.p`
${mq.smallMobile} {
margin-right: 8px;
margin-right: 8px;
font-size: 24px;
font-size: 24px;
font-weight: 700;
line-height: 100%;
letter-spacing: -1px;
text-transform: uppercase;
font-weight: 700;
line-height: 100%;
letter-spacing: -1px;
text-transform: uppercase;
color: ${colors.white};
}
color: ${colors.white};
${mq.tablet} {
margin-right: 11px;
Expand All @@ -189,13 +172,11 @@ export const OrangeDynamicText = styled.p`
`;

export const OrangeStaticText = styled.p`
${mq.mobile} {
font-size: 12px;
font-weight: 700;
line-height: 133.33%;
font-size: 12px;
font-weight: 700;
line-height: 133.33%;
color: rgba(239, 237, 232, 0.65);
}
color: rgba(239, 237, 232, 0.65);
${mq.tablet} {
font-size: 16px;
Expand Down
64 changes: 31 additions & 33 deletions src/components/ParamsBtn/ParamsBtn.styled.jsx
View file
Original file line number Diff line number Diff line change
Expand Up @@ -3,39 +3,37 @@ import styled from '@emotion/styled';
import { mq, colors } from '../../utils';

export const BtnNav = styled.button`
${mq.smallMobile} {
display: inline-flex;
justify-content: center;
align-items: center;
padding-top: 0;
padding-bottom: 0;
font-size: 14px;
font-weight: 400;
line-height: 128%;
color: ${colors.white};
background: transparent;
border: none;
outline: none;
transition:
color 250ms cubic-bezier(0.4, 0, 0.2, 1),
transform 250ms cubic-bezier(0.4, 0, 0.2, 1);
&:hover {
color: ${colors.orange};
transform: scale(1.1);
}
&:focus {
color: ${colors.orange};
transform: scale(1.1);
}
${mq.tablet} {
font-size: 16px;
line-height: 150%;
}
display: inline-flex;
justify-content: center;
align-items: center;
padding-top: 0;
padding-bottom: 0;
font-size: 14px;
font-weight: 400;
line-height: 128%;
color: ${colors.white};
background: transparent;
border: none;
outline: none;
transition:
color 250ms cubic-bezier(0.4, 0, 0.2, 1),
transform 250ms cubic-bezier(0.4, 0, 0.2, 1);
&:hover {
color: ${colors.orange};
transform: scale(1.1);
}
&:focus {
color: ${colors.orange};
transform: scale(1.1);
}
${mq.tablet} {
font-size: 16px;
line-height: 150%;
}
`;

Expand Down

0 comments on commit 69c8703

Please sign in to comment.