Jump to Date: Day 1 Day 2 Day 3 Day 4 Day 5

Day 1

Luke sleeps at night. As you should.

For 4h and 20min, Luke is… (hover me!)

…doing something it seems.

You can control the width (aka duration) of these blocks through a neat trick!

Also, this is a title.

You can add as many details as you would like here. Just watch how chatty Lorem Ipsum can get!


Lorem ipsum dolor sit amet, consectetur adipiscing elit, sed do eiusmod tempor incididunt ut labore et dolore magna aliqua. Ut enim ad minim veniam, quis nostrud exercitation ullamco laboris nisi ut aliquip ex ea commodo consequat. Duis aute irure dolor in reprehenderit in voluptate velit esse cillum dolore eu fugiat nulla pariatur. Excepteur sint occaecat cupidatat non proident, sunt in culpa qui officia deserunt mollit anim id est laborum.

Gravida dictum fusce ut placerat orci nulla pellentesque. Velit dignissim sodales ut eu. Parturient montes nascetur ridiculus mus mauris vitae ultricies leo integer. Mattis ullamcorper velit sed ullamcorper morbi tincidunt. Commodo nulla facilisi nullam vehicula ipsum. Nisl vel pretium lectus quam id leo in vitae. Nec dui nunc mattis enim. Sodales ut eu sem integer vitae justo eget. Donec ultrices tincidunt arcu non sodales neque. Nisi porta lorem mollis aliquam ut porttitor. Urna nunc id cursus metus aliquam eleifend. Nullam vehicula ipsum a arcu cursus vitae. Sem viverra aliquet eget sit.

Varius vel pharetra vel turpis nunc eget lorem. Dapibus ultrices in iaculis nunc sed augue. Egestas fringilla phasellus faucibus scelerisque eleifend. Aliquam id diam maecenas ultricies mi eget. Dui faucibus in ornare quam viverra orci sagittis eu volutpat. Arcu ac tortor dignissim convallis. Dignissim convallis aenean et tortor at risus viverra. Tristique sollicitudin nibh sit amet commodo. Congue eu consequat ac felis donec. Massa placerat duis ultricies lacus sed turpis tincidunt. Platea dictumst vestibulum rhoncus est pellentesque. Erat velit scelerisque in dictum non. Adipiscing commodo elit at imperdiet dui. Ipsum faucibus vitae aliquet nec ullamcorper sit. Nisl tincidunt eget nullam non nisi est sit.

Tincidunt lobortis feugiat vivamus at augue eget arcu dictum. Ullamcorper sit amet risus nullam. Nulla at volutpat diam ut venenatis tellus in. Nisl purus in mollis nunc sed id semper risus in. Suscipit adipiscing bibendum est ultricies integer quis. Suspendisse ultrices gravida dictum fusce. Sit amet massa vitae tortor condimentum lacinia quis vel. Nulla aliquet porttitor lacus luctus accumsan tortor posuere. Nascetur ridiculus mus mauris vitae ultricies. Tellus id interdum velit laoreet id donec. Duis tristique sollicitudin nibh sit amet commodo. Pulvinar pellentesque habitant morbi tristique. Diam maecenas sed enim ut sem viverra. Auctor elit sed vulputate mi sit amet mauris commodo.

Purus gravida quis blandit turpis cursus in. Facilisis volutpat est velit egestas dui. Nullam eget felis eget nunc lobortis. Nisl vel pretium lectus quam id leo in vitae. Sed risus ultricies tristique nulla aliquet. Feugiat nibh sed pulvinar proin gravida hendrerit lectus a. Mauris in aliquam sem fringilla ut. Tempor id eu nisl nunc. Placerat duis ultricies lacus sed. Viverra accumsan in nisl nisi scelerisque eu ultrices. Lectus urna duis convallis convallis tellus id interdum. Tempor orci eu lobortis elementum nibh tellus molestie. Viverra mauris in aliquam sem. Erat velit scelerisque in dictum non. Ipsum dolor sit amet consectetur.

Short events:

Hey! I’m a very short, very specific event taking place at exactly 8:30pm. The center of this circle and the left border of this dialogue box both align with 8:30pm exactly!

And you want to know the best part? You can superimpose a short event and a long event at the same location without messing up anything!

Just make sure to define short events after you defined longer events. Otherwise, the longer events will show up on top of your short events and hide them from view!

Layton also sleeps. He needs it.

All you need to do is set “width:calc(HH*60px + MMpx)” where HH is the number of hours and MM the number of minutes that the activity takes.

Something very special happens exactly now!

Emmy’s a madlad.

SLEEP IS FOR THE WEAK

Activity 1

Activity 2

With this scale, one minute has the length of exactly one pixel (in HTML coding, not always on your screen).

Day 2

Day 3

Day 4

Day 5