diff --git a/frontend/src/components/dashboard/ProcessBoard/style.ts b/frontend/src/components/dashboard/ProcessBoard/style.ts index 9a3247ff..4473bcc1 100644 --- a/frontend/src/components/dashboard/ProcessBoard/style.ts +++ b/frontend/src/components/dashboard/ProcessBoard/style.ts @@ -3,6 +3,11 @@ import styled from '@emotion/styled'; const Container = styled.div` display: flex; flex-direction: column; + + overflow-x: scroll; + overflow-y: visible; + + height: 100%; `; const ColumnWrapper = styled.div` @@ -10,12 +15,9 @@ const ColumnWrapper = styled.div` height: 100%; background-color: white; display: flex; - gap: 2.4rem; + gap: 2rem; padding-bottom: 1.2rem; - - overflow-x: scroll; - overflow-y: visible; `; const S = { diff --git a/frontend/src/components/dashboard/ProcessColumn/style.ts b/frontend/src/components/dashboard/ProcessColumn/style.ts index 85071502..ba2da4b0 100644 --- a/frontend/src/components/dashboard/ProcessColumn/style.ts +++ b/frontend/src/components/dashboard/ProcessColumn/style.ts @@ -2,21 +2,16 @@ import styled from '@emotion/styled'; import { hideScrollBar } from '@styles/utils'; const ProcessWrapper = styled.section<{ isPassedColumn: boolean }>` - width: 100%; + width: 28rem; min-width: 28rem; - max-width: 28rem; - height: 100%; + /* max-height: 100%; */ padding: 1.2rem; border-radius: 0.8rem; border: 0.1rem solid ${({ theme }) => theme.baseColors.grayscale[400]}; background-color: ${({ theme, isPassedColumn = false }) => isPassedColumn ? '#F9FFF9' : theme.baseColors.grayscale[50]}; - - overflow-y: scroll; - overflow-x: visible; - ${hideScrollBar}; `; const Header = styled.header` @@ -38,11 +33,18 @@ const Title = styled.h2` const ApplicantList = styled.ul` width: 100%; + height: fit-content; + max-height: 85%; + display: flex; flex-direction: column; padding: 0.4rem; gap: 1.2rem; + + overflow-y: scroll; + overflow-x: visible; + ${hideScrollBar}; `; const S = {