blob: 6f146513f49cf9d7ed269085962a56d35b7e49bc (
plain)
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
|
<!DOCTYPE html>
<html lang="fr">
<head>
<meta charset="utf-8" />
<title>fullcalendar</title>
<script src='js/fullcalendar/packages/core/index.global.min.js'></script>
<script src='js/fullcalendar/packages/daygrid/index.global.min.js'></script>
<script src='js/fullcalendar/packages/timegrid/index.global.min.js'></script>
<script src='js/fullcalendar/packages/list/index.global.min.js'></script>
<script src='js/fullcalendar/packages/interaction/index.global.min.js'></script>
<script src='js/fullcalendar/packages/core/locales/fr.global.min.js'></script>
<!-- <link rel='stylesheet' href='https://cdn.jsdelivr.net/npm/fullcalendar/main.min.css' /> -->
<script src="js/calendar.js"></script>
<style>
#calendar_zone{
display: flex;
max-width: 1000px;
}
#calendar{
width: -moz-available;
}
.event_title_box{
display: flex;
align-items: center;
justify-content: space-between;
}
.event_close_button{
height: fit-content;
}
.fc-toolbar-title{
font-size: x-large !important;
}
.fc-button{
padding: 0.2em 0.4em !important;
}
td .fc-timegrid-axis{
font-size: small;
text-align: center;
}
.fc-day-other{
background-color: #f0f0f0;
}
.fc-daygrid-day-top{
justify-content: center;
}
.fc-day-today .fc-daygrid-day-number{ /* vue mois */
color: white;
background-color: #00679e;
border-radius: 5px;
height: 27px;
aspect-ratio: 1 / 1;
text-align: center;
}
.fc-day-today .fc-col-header-cell-cushion{ /* vue semaine */
color: white;
background-color: #00679e;
border-radius: 5px;
}
</style>
</head>
<body>
<div id="calendar_zone">
<div id="calendar"></div>
<!-- si admin -->
<aside id="event_modal" class="modal"></aside>
</div>
</body>
</html>
|