aboutsummaryrefslogtreecommitdiff
path: root/doc/plugins/contrib/monthcalendar.mdwn
blob: c21be0abe29966dd36b8e51398bb4464c8effa62 (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
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
107
108
109
110
111
112
113
114
115
116
117
118
119
120
121
122
123
124
125
126
127
[[!meta author="spalax"]]
[[!template id=plugin name=monthcalendar author="[[Louis|spalax]]"]]

# Monthcalendar

This plugin displays a calendar, containing in each of its day the list of links of pages published on this day. It can be used, for example, to display archives of blog posts, or to announce events.

The difference between this plugin and the [[plugins/calendar]] plugin is that the calendar displayed by this plugin is a big one, containing the full title of every page indexed in it.

## Usage

### Directive

    \[[!monthcalendar type="month" year="2012" month="06" pages="events/*"]]

### Automation

By using the following line in template `calendarmonth.tmpl`, you can have `ikiwiki-calendar` using this plugin to display monthly archives.

    \[[!monthcalendar type="month" year="<TMPL_VAR YEAR>" month="<TMPL_VAR MONTH>" pages="<TMPL_VAR PAGESPEC>"]]

## CSS

Here is an example of CSS properly rendering the calendar produced by this
plugin.
[[!toggle id=css text="CSS"]]
[[!toggleable id=css text="""
    /* Calendar */
    .monthcalendar
    {
        color:#aaa;
        /* font-size:18pt; */
        margin-top:1em;
        margin-bottom:1em;
    		width: 100%;
    }
    
    .monthcalendar table,
    .monthcalendar td,
    .monthcalendar th
    {
    	border: 1px solid #ccc;
    }
    
    #content .monthcalendar td
    {
        padding: 0;
        position: relative;
    }
    
    .monthcalendar td div
    {
        min-height: 10ex;
        height: 100%;
        position: relative;
    }
    
    .monthcalendar th
    {
    	vertical-align: middle;
    }
    
    .monthcalendar td ul
    {
        padding-left: 0.5em;
        list-style: dot;
        list-style-position: inside;
        text-align: left;
        font-size: 8pt;
        position: relative;
        z-index: 10;
        font-weight: bold;
    }
    
    table.monthcalendar
    {
    	table-layout: fixed;
    }
    
    .monthcalendar .selflink
    {
        color:#444444;
    }
    
    .monthcalendar-day-head {
    	text-transform:capitalize;
    }
    
    .monthcalendar-head {
    	text-transform:capitalize;
    }
    
    .monthcalendar-daynumber
    {
        float: left;
        position: absolute;
        display: block;
        font-size: 7ex;
        color: #ccc;
        line-height: 100%;
        z-index: 5;
        padding-top: 0.3ex;
        text-align: right;
        width: 1.8em;
    }
    
    /* List of pages */
    
    .monthcalendar-pagelist {
      display: flex;
      flex-direction: column;
    }
    
    .monthcalendar-item {
      opacity: 0;
      height: 0;
    }
    
    .monthcalendar-item:target {
      opacity: 1;
      height: initial;
    }
"""]]

## Code

Code and documentation can be found here : [[https://atelier.gresille.org/projects/gresille-ikiwiki/wiki/Monthcalendar]].