-
Notifications
You must be signed in to change notification settings - Fork 0
/
index.css
106 lines (89 loc) · 2.05 KB
/
index.css
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
32
33
34
35
36
37
38
39
40
41
42
43
44
45
46
47
48
49
50
51
52
53
54
55
56
57
58
59
60
61
62
63
64
65
66
67
68
69
70
71
72
73
74
75
76
77
78
79
80
81
82
83
84
85
86
87
88
89
90
91
92
93
94
95
96
97
98
99
100
101
102
103
104
105
106
@import "https://cdn.jsdelivr.net/npm/[email protected]/css/bulma.min.css";
h3 {
margin-top: 30px;
margin-bottom: 30px;
}
#desc-popup {
display: none;
position: absolute;
width: 400px;
height: 500px;
padding: 50px;
}
.hero {
background-color: rgb(110, 70, 150);
}
/*
.hero-head {
position: fixed;
background-color: rgb(110, 70, 150);
z-index: 2000;
} */
/*
.hero-head .navbar{
position: fixed;
z-index: 2000;
background-color: rgb(110, 70, 150);
}
.hero-head .container {
position: fixed;
left: 50%;
transform: translate(-50%, 0%);
background-color: rgb(110, 70, 150);
} */
#scrollable-container {
overflow-x: scroll;
overflow-y: hidden;
white-space: nowrap;
justify-items: center;
height: 300px
}
.scrollable-month-container {
display: grid;
grid-template-columns: repeat(60, 100px);
}
.scrollable-item-container {
display: grid;
grid-template-columns: repeat(60, 100px);
}
.scrollable-item {
height: 30px; /* Set the height for each item */
background-color: #3273dc; /* Background color */
color: #fff; /* Text color */
padding-left: 10px;
text-align: start; /* Center text horizontally */
line-height: 35px; /* Center text vertically */
border-radius: 5px; /* Optional: rounded corners */
}
.scrollable-item:hover {
box-shadow: 0px 0px 8px #b2b2b2;
}
.scrollable-item-month {
width: 100px; /* Set the width for each item */
height: 50px; /* Set the height for each item */
color: #fff; /* Text color */
text-align: center; /* Center text horizontally */
line-height: 50px; /* Center text vertically */
}
.has-background-skyblue {
background-color: #46AAF2;
}
.has-background-blue {
background-color: #4F46F2;
}
.has-background-blueberry {
background-color: #4F74F2;
}
.has-background-lightblue {
background-color: #46E1F2;
}
.has-background-purple {
background-color: #8746F2;
}
.has-background-cottonblue {
background-color: #7998ee;
}
ul {
list-style: circle;
list-style-type: disc;
}