UI timeline

https://github.com/mins01/ui-timeline

--max-grow:365 (day of year)

1월
2월
3월
4월
5월
6월
7월
8월
9월
10월
11월
12월
A
1-12 메세지메세지 메세지
B
-2/28
메세지메세지 메세지
D
아무 설정 없음(전체)
2-3
한라인에 여러개
4월
4월 전체
4-5
겹침

--max-grow:366 (day of leapyear)(2월 이후 하루씩 틀어짐)

1월
2월
3월
4월
5월
6월
7월
8월
9월
10월
11월
12월
A
1-12 메세지메세지 메세지
B
-2/28
메세지메세지 메세지
D
아무 설정 없음(전체)
2-3
한라인에 여러개
4월
4월 전체
4-5
겹침

--max-grow:12 (month of year)(소수점도 사용)

1월
2월
3월
4월
5월
6월
7월
8월
9월
10월
11월
12월
A
1-12 메세지메세지 메세지
B
-2/28
메세지메세지 메세지
D
아무 설정 없음(전체)
2-3
한라인에 여러개
4월
4월 전체
4-5
겹침

--max-grow:12 (month of year)(소수점도 사용)(분기)

1분기
2분기
3분기
4분기
A
1-12 메세지메세지 메세지
B
-2/28
메세지메세지 메세지
D
아무 설정 없음(전체)
2-3
한라인에 여러개
4월
4월 전체
4-5
겹침

--max-grow:4 (quarter of year)(소수점도 사용)(분기)

1분기
2분기
3분기
4분기
A
A 프로젝트 일정
B
B 프로젝트 일정
예정 없음
D
아무 설정 없음(전체)
XX
XX팀 1분기
XX
XX팀 3분기
XX
XX팀 4분기

--max-grow:31 (day of month)

1
2
3
4
5
6
7
8
9
10
11
12
13
14
15
16
17
18
19
20
21
22
23
24
25
26
27
28
29
30
31
A
1-30
B
8-15

--max-grow:7 (day of week)

월
화
수
목
금
토
일
A
메세지메세지 메세지
B
화요일
C
메세지메세지 메세지
D
메세지메세지 메세지

--max-grow:24 (hour of day)

0
1
2
3
4
5
6
7
8
9
10
11
12
13
14
15
16
17
18
19
20
21
22
23
A
메세지메세지 메세지
B
9시-14시
C
메세지메세지 메세지
D
메세지메세지 메세지

--max-grow:10

1
2
3
4
5
6
7
8
9
10
A
1-10
B
2-8

--max-grow:15 , flex-grow:6

1
2
3
4
5-10, flex-grow:6
11
12
13
14
15
부트스트랩 스타일로 line-bar를 구성할 경우
부트스트랩 스타일로
line-bar를 구성할 경우
Warning
Danger