diff --git a/src/components/Scheduler.tsx b/src/components/Scheduler.tsx index e2d3cc7..b1b4919 100644 --- a/src/components/Scheduler.tsx +++ b/src/components/Scheduler.tsx @@ -5,7 +5,6 @@ import { days, hours } from '../constants/index'; import styled from 'styled-components/macro'; const SchedulerWrapper = styled.div` - margin-top: 20px; border-collapse: collapse; flex-grow: 1; `; @@ -18,7 +17,6 @@ const TableBody = styled.div` const TableRow = styled.div` display: flex; - flex-direction: row; `; const TableHead = styled.div` @@ -33,8 +31,11 @@ interface TableCellProps { const TableCell = styled.div` height: ${({ height }) => height}px; border: 1px solid #ddd; - text-align: center; + display: flex; + align-items: center; + justify-content: center; flex: 1; + font-size: 24px; `; const T = styled.table` diff --git a/src/components/SchedulerRow.tsx b/src/components/SchedulerRow.tsx index 126bdd7..5df6fa7 100644 --- a/src/components/SchedulerRow.tsx +++ b/src/components/SchedulerRow.tsx @@ -13,7 +13,7 @@ const SchedulerEvent = styled.div` position: absolute; top: ${({ cellTop }) => cellTop}px; left: ${({ cellWidth, eventIndex }) => cellWidth + 5 + cellWidth * eventIndex}px; - width: ${({ cellWidth }) => (cellWidth * 2) / 3}px; + width: ${({ cellWidth }) => (cellWidth * 2.5) / 3}px; height: ${({ cellHeight }) => (cellHeight * 2 * 3) / 4}px; background-color: lightblue; z-index: 2; diff --git a/src/constants/index.ts b/src/constants/index.ts index ad14654..cd6753a 100644 --- a/src/constants/index.ts +++ b/src/constants/index.ts @@ -1,10 +1,10 @@ export const days = [ "", - "poniedziałek", - "wtorek", - "środa", - "czwartek", - "piątek", + "Poniedziałek", + "Wtorek", + "Środa", + "Czwartek", + "Piątek", ]; export const hours = [ "8:00",