Skip to content

Commit

Permalink
๐Ÿ”ง 231226: Footer๋ฅผ ๊ตฌ์„ฑํ•˜๋Š” ์ปดํฌ๋„ŒํŠธ ํฌ๊ธฐ๊ฐ€ ์ œ๋Œ€๋กœ ์„ค์ •๋˜์ง€์•Š์•„ ๋ถˆํ•„์š”ํ•œ ์Šคํฌ๋กค๋ฐ”๊ฐ€ ์ƒ๊ธฐ๋Š” ๋ฌธ์ œ ์ˆ˜์ •
Browse files Browse the repository at this point in the history
### Footer๋ฅผ ๊ตฌ์„ฑํ•˜๋Š” ์ปดํฌ๋„ŒํŠธ  ํฌ๊ธฐ๊ฐ€ ์ œ๋Œ€๋กœ ์„ค์ •๋˜์ง€์•Š์•„ ๋ถˆํ•„์š”ํ•œ ์Šคํฌ๋กค๋ฐ”๊ฐ€ ์ƒ๊ธฐ๋Š” ๋ฌธ์ œ ์ˆ˜์ • #291
  • Loading branch information
dev-angelo authored Dec 26, 2023
2 parents 0c0d4d8 + dac7fbf commit 5efa068
Showing 1 changed file with 12 additions and 5 deletions.
17 changes: 12 additions & 5 deletions src/components/Footer/Footer.tsx
Original file line number Diff line number Diff line change
Expand Up @@ -162,20 +162,24 @@ const Footer: React.FC = () => {
const FooterWrapper = styled.footer`
display: flex;
background-color: ${({ theme: { color } }) => color.black};
align-items: center;
width: 100%;
@media ${({ theme }) => theme.device.mobile} {
align-items: center;
width: 100%;
height: 30.4rem;
height: 32.8rem;
}
@media ${({ theme }) => theme.device.tablet} {
height: 32.8rem;
}
@media ${({ theme }) => theme.device.desktop} {
justify-content: center;
width: 100%;
min-width: 144rem;
height: 26.6rem;
}
`;

const ContentWrapper = styled.div`
display: flex;
justify-content: space-between;
align-items: center;
color: ${({ theme: { color } }) => color.white};
Expand All @@ -184,14 +188,17 @@ const ContentWrapper = styled.div`
line-height: ${({ theme: { lineHeight } }) => lineHeight.body.xs};
letter-spacing: ${({ theme: { letterSpacing } }) => letterSpacing};
@media ${({ theme }) => theme.device.mobile} {
height: 24.8rem;
padding: 4rem 2.4rem;
}
@media ${({ theme }) => theme.device.tablet} {
height: 24.8rem;
padding: 4rem 8rem;
}
@media ${({ theme }) => theme.device.desktop} {
min-width: 128rem;
padding: 5.6rem 8rem 8rem 8rem;
height: 15.4rem;
padding: 5.6rem 8rem;
}
`;

Expand Down

0 comments on commit 5efa068

Please sign in to comment.