Set event list to scroll

  • Resolved jcdflowers

    (@jcdflowers)


    9 years, 7 months ago

    Can the mini calendar event list be limited in the length of items displayed when used in the sidebar? Several weekly events makes for a long page. The ability to scroll the list is preferred.

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

    (@i4nd90)

    9 years, 7 months ago

    The simplest way for you to achieve this is to edit your instance template to wrap your events into their own scrollable container:

    <div class="event-listing">
	<div class="event-listing-title">Events</div>
	<div style="max-height:300px;overflow-y:scroll">
		/* [Events loop] */
	</div>
</div>
    Thread Starter jcdflowers

    (@jcdflowers)

    9 years, 7 months ago

    Got what I wanted with css edit – add height and overflow.

    .clndr-holder.clndr_mini-calendar .event-listing {
    margin-top:1em;
    font-size:1.1em;
    height: 150px;
    overflow: scroll;
    }

    Thread Starter jcdflowers

    (@jcdflowers)

    9 years, 7 months ago

    THANKS. Yours is a much better fix.

    lemonart

    (@lemonart)

    9 years, 6 months ago

    ////ALREADY SOLVED///

    Hi there! I’m very new to coding and I’d love the events list to loop on the mini and the full size calendar, tried the code you shared replacing 

    <div class="event-listing">
	<div class="event-listing-title">Events</div>

    with this

    <div class="event-listing">
	<div class="event-listing-title">Events</div>
	<div style="max-height:300px;overflow-y:scroll">
		/* [Events loop] */
	</div>
</div>

    But I loose the format of all the events in the list and no scroll whatsoever…can you give me a hand with more detailed instructions?

    Thank you for your time and patience

    • This reply was modified 9 years, 6 months ago by lemonart.
Viewing 4 replies - 1 through 4 (of 4 total)

The topic ‘Set event list to scroll’ is closed to new replies.