Formatting Calendar View

  • Resolved cihomewood

    (@cihomewood)


    4 years, 11 months ago

    Hi

    I have been trying to alter the format of the calendar view, to remove the bullet points and left justify the text so it uses the entire column. I can’t find the bit of css which controls this and need some help please.

    Although still in development, the page is now accessible and I have put a link to it.

    Thanks

    Ian

    The page I need help with: [log in to see the link]

Viewing 4 replies - 1 through 4 (of 4 total)
  • Plugin Author Franky

    (@liedekef)

    4 years, 11 months ago

    The link you posted is not a valid url. Can you correct that?

    Thread Starter cihomewood

    (@cihomewood)

    4 years, 11 months ago

    Sorry, not sure what happened. Hopefully this one works.

    Calendar page

    Plugin Author Franky

    (@liedekef)

    4 years, 11 months ago

    Ok, now do ctrl-U to see the source (or use your event css debug tool). An extract:

    <div class='eme-calendar-full' id='eme-calendar-167'><table class='eme-calendar-table fullcalendar'>
<thead><tr><th class='month_name' colspan='7'><a class='prev-month eme-cal-prev-month' href='#' data-full='1' data-htmltable='1' data-htmldiv='0' data-long_events='' data-month='05' data-year='2021' data-category='0' data-author='' data-contact_person='' data-location_id='' data-notcategory='0' data-template_id='0' data-holiday_id='0' data-weekdays='' data-language='' data-calendar_divid='eme-calendar-167'><<</a> June 2021 <a class='next-month eme-cal-next-month' href="#" data-full='1' data-htmltable='1' data-htmldiv='0' data-long_events='' data-month='07' data-year='2021' data-category='0' data-author='' data-contact_person='' data-location_id='' data-notcategory='0' data-template_id='0' data-holiday_id='0' data-weekdays='' data-language='' data-calendar_divid='eme-calendar-167'>>></a></th>
</tr></thead>
<tr class='days-names'><td class='Mon_header'>Mon</td><td class='Tue_header'>Tue</td><td class='Wed_header'>Wed</td><td class='Thu_header'>Thu</td><td class='Fri_header'>Fri</td><td class='Sat_header'>Sat</td><td class='Sun_header'>Sun</td></tr>
<tr><td class='Mon eventful-pre event-day-31'><span class='span-eme-calday span-eme-calday-31'><a title='Short Mat Bowling, Ukulele 2' href='https://southportu3a.live-website.com/eme-events/2021-05-31/' >31</a></span><ul class='eme-calendar-day-event'><li><a href='https://southportu3a.live-website.com/eme-events/short-mat-bowling-712/' title='Short Mat Bowling'>Short Mat Bowling</a></li><li><a href='https://southportu3a.live-website.com/eme-events/ukulele-55/' title='Ukulele 2'>Ukulele 2</a></li></ul></td>
<td class='Tue eventful event-day-1'><span class='span-eme-calday span-eme-calday-1'><a title='Ukulele 1, Ukulele 1, Badminton Group 1, Line Dancing Weekly Meeting, Table Tennis 2' href='https://southportu3a.live-website.com/eme-events/2021-06-01/' >1</a></span><ul class='eme-calendar-day-event'><li><a href='https://southportu3a.live-website.com/eme-events/ukulele-1/' title='Ukulele 1'>Ukulele 1</a></li><li><a href='https://southportu3a.live-website.com/eme-events/ukulele-104/' title='Ukulele 1'>Ukulele 1</a></li><li><a href='https://southportu3a.live-website.com/eme-events/badminton-group-1/' title='Badminton Group 1'>Badminton Group 1</a></li><li><a href='https://southportu3a.live-website.com/eme-events/line-dancing-weekly-meeting/' title='Line Dancing Weekly Meeting'>Line Dancing Weekly Meeting</a></li><li><a href='https://southportu3a.live-website.com/eme-events/table-tennis-2/' title='Table Tennis 2'>Table Tennis 2</a></li></ul></td>
<td class='Wed eventful event-day-2'><span class='span-eme-calday span-eme-calday-2'><a title='Short Mat Bowling' href='https://southportu3a.live-website.com/eme-events/2021-06-02/' >2</a></span><ul class='eme-calendar-day-event'><li><a href='https://southportu3a.live-website.com/eme-events/short-mat-bowling-817/' title='Short Mat Bowling'>Short Mat Bowling</a></li></ul></td>
<td class='Thu eventful event-day-3'><span class='span-eme-calday span-eme-calday-3'><a title='Table Tennis 6, Badminton Group 2, John Dempsey, on the Sefton Coast' href='https://southportu3a.live-website.com/eme-events/2021-06-03/' >3</a></span><ul class='eme-calendar-day-event'><li><a href='https://southportu3a.live-website.com/eme-events/table-tennis-56/' title='Table Tennis 6'>Table Tennis 6</a></li><li><a href='https://southportu3a.live-website.com/eme-events/badminton-group-56/' title='Badminton Group 2'>Badminton Group 2</a></li><li><a href='https://southportu3a.live-website.com/eme-events/john-dempsey-on-the-sefton-coast/' title='John Dempsey, on the Sefton Coast'>John Dempsey, on the Sefton Coast</a></li></ul></td>
<td class='Fri eventless'><span class='span-eme-calday span-eme-calday-4'>4</td>
<td class='Sat eventless'><span class='span-eme-calday span-eme-calday-5'>5</td>
<td class='Sun eventless'><span class='span-eme-calday span-eme-calday-6'>6</td>
</tr>
<tr><td class='Mon eventful event-day-7'><span class='span-eme-calday span-eme-calday-7'><a title='Short Mat Bowling, Ukulele 2, Photo Group 1 Monthly Meeting, Tai Chi 4' href='https://southportu3a.live-website.com/eme-events/2021-06-07/' >7</a></span><ul class='eme-calendar-day-event'><li><a href='https://southportu3a.live-website.com/eme-events/short-mat-bowling-713/' title='Short Mat Bowling'>Short Mat Bowling</a></li><li><a href='https://southportu3a.live-website.com/eme-events/ukulele-56/' title='Ukulele 2'>Ukulele 2</a></li><li><a href='https://southportu3a.live-website.com/eme-events/photo-group-1-monthly-meeting/' title='Photo Group 1 Monthly Meeting'>Photo Group 1 Monthly Meeting</a></li><li><a href='https://southportu3a.live-website.com/eme-events/tai-chi-182/' title='Tai Chi 4'>Tai Chi 4</a></li></ul></td>
<td class='Tue eventful-today event-day-8'><span class='span-eme-calday span-eme-calday-8'><a title='Ukulele 1, Badminton Group 1, Line Dancing Weekly Meeting, Table Tennis 2' href='https://southportu3a.live-website.com/eme-events/2021-06-08/' >8</a></span><ul class='eme-calendar-day-event'><li><a href='https://southportu3a.live-website.com/eme-events/ukulele-2/' title='Ukulele 1'>Ukulele 1</a></li><li><a href='https://southportu3a.live-website.com/eme-events/badminton-group-2/' title='Badminton Group 1'>Badminton Group 1</a></li><li><a href='https://southportu3a.live-website.com/eme-events/line-dancing-weekly-meeting-2/' title='Line Dancing Weekly Meeting'>Line Dancing Weekly Meeting</a></li><li><a href='https://southportu3a.live-website.com/eme-events/table-tennis-3/' title='Table Tennis 2'>Table Tennis 2</a></li></ul></td>
<td class='Wed eventful event-day-9'><span class='span-eme-calday span-eme-calday-9'><a title='Short Mat Bowling, Gardening Monthly Meeting' href='https://southportu3a.live-website.com/eme-events/2021-06-09/' >9</a></span><ul class='eme-calendar-day-event'><li><a href='https://southportu3a.live-website.com/eme-events/short-mat-bowling-818/' title='Short Mat Bowling'>Short Mat Bowling</a></li><li><a href='https://southportu3a.live-website.com/eme-events/gardening-monthly-meeting/' title='Gardening Monthly Meeting'>Gardening Monthly Meeting</a></li></ul></td>
<td class='Thu eventful event-day-10'><span class='span-eme-calday span-eme-calday-10'><a title='Tai Chi 1, Southport u3a Coffee Morning, Tai Chi 2, Tai Chi 3, Table Tennis 6, Badminton Group 2' href='https://southportu3a.live-website.com/eme-events/2021-06-10/' >10</a></span><ul class='eme-calendar-day-event'><li><a href='https://southportu3a.live-website.com/eme-events/tai-chi-1/' title='Tai Chi 1'>Tai Chi 1</a></li><li><a href='https://southportu3a.live-website.com/eme-events/southport-u3a-coffee-morning/' title='Southport u3a Coffee Morning'>Southport u3a Coffee Morning</a></li><li><a href='https://southportu3a.live-website.com/eme-events/tai-chi-76/' title='Tai Chi 2'>Tai Chi 2</a></li><li><a href='https://southportu3a.live-website.com/eme-events/tai-chi-129/' title='Tai Chi 3'>Tai Chi 3</a></li><li><a href='https://southportu3a.live-website.com/eme-events/table-tennis-57/' title='Table Tennis 6'>Table Tennis 6</a></li><li><a href='https://southportu3a.live-website.com/eme-events/badminton-group-57/' title='Badminton Group 2'>Badminton Group 2</a></li></ul></td>
<td class='Fri eventful event-day-11'><span class='span-eme-calday span-eme-calday-11'><a title='Tai Chi 5' href='https://southportu3a.live-website.com/eme-events/2021-06-11/' >11</a></span><ul class='eme-calendar-day-event'><li><a href='https://southportu3a.live-website.com/eme-events/tai-chi-235/' title='Tai Chi 5'>Tai Chi 5</a></li></ul></td>
<td class='Sat eventless'><span class='span-eme-calday span-eme-calday-12'>12</td>
<td class='Sun eventless'><span class='span-eme-calday span-eme-calday-13'>13</td>
</tr>

    So you have css classes for the td, for the calendar numbers, for the names, for the ul-list per day, etc …
    For the ul-list to go to the left, override the margin that your main.css file sets by default. To remove the bullet points, set list-style to none. For the rest I refer to the EME css documentation (personally I refrain from giving css support as I’m not the greatest css expert): https://www.e-dynamics.be/wordpress/category/documentation/9-changing-the-layout-css/

    Thread Starter cihomewood

    (@cihomewood)

    4 years, 11 months ago

    Thanks Franky

    Ian

Viewing 4 replies - 1 through 4 (of 4 total)

The topic ‘Formatting Calendar View’ is closed to new replies.