One-line calendar

[orexisbella]

Is it at all possible to tweak an Expressive layout (using either CSS or a theme layer) to display a calendar in a single bar at the top of the page, just like Nebula?

Comments

[av8rmike]

Sure, it's possible, but it's definitely a theme layer change and it wouldn't look exactly like it does in Nebula.

[orexisbella]

I don't really want it to look exactly like Nebula, anyway. :) I just want to get it all in one row like that, then I figure I can customise the way it looks with CSS.

What do I have to put in a theme layer to get it to display in a single row?

[av8rmike]

Hey, I wanted to let you know that I haven't forgotten about you! Just been a little busy with a variety of project, but I plan to get to it in the next few days.

[orexisbella]

Hey Mike, no problem. :) I really appreciate you taking the time to help!

[av8rmike]

This was an interesting challenge, but I basically just ended up copying the code from the Nebula layer. The calendar goes above the header image, which I hope is where you want it. I even changed the month heading into a link to the proper Month page, but you can take that out if you don't like it. I'll post the CSS in a separate comment so I don't hit the comment limit.
function Page::lay_print_header_links() {
# Print Nebula-style linear calendar above the header
var string calendar = "";
var YearMonth m = $this->get_latest_month();
var string month = $m->month_format();
if($m.has_entries) {
$calendar = """

$month  
""";
var YearWeek[] theWeeks = $m.weeks;
foreach var YearWeek w ($theWeeks) {
var YearDay[] theDays = $w.days;
var int start = $w.pre_empty;
foreach var YearDay d ($theDays) {
$start = $start + 1;
$calendar = $calendar + "\n """ + $d.day->zeropad(2) + "";

[orexisbella]

Hey Mike,

It's put the calendar up there (yay!), but to my consternation it seems to have wreaked havoc on my custom CSS. If you look at my journal, you'll see that the content has gotten shoved way over to the right side for no reason that I can fathom. :(

Here's my theme layer with css (which is compiling error-free), and here's the preview of what my layout used to look like.

Thanks again for your help! :)

[av8rmike]

Try adding set use_vox_base = false; to your theme layer code. I think the base style sheets will screw up grrliz's code if you don't disable them.

[orexisbella]

It's working perfectly now! Thank you so much, it looks fabulous :)

[av8rmike]

Here's the CSS that you can tweak to make the colors suit your theme (I think they came from the default Nebula theme). Don't hesitate to let me know if something doesn't work right or if you want to change something else.

.MiniCalContainer { background:#8381DA; border:2px solid #000000; }
.MiniCalDayPosts { font-weight:bold;}
td.MiniCalWeekend { background-color:#3C38C0;}
td.MiniCalDay, td.MiniCalDayPosts { color:#FFFFFF; font-family:Trebuchet,Verdana,sans-serif; font-size:0.95em; }
.MiniCalDay a, .MiniCalDay a:active, .MiniCalDayPosts a, .MiniCalDayPosts a:active { color:#000000; }
.MiniCalDay a:visited, .MiniCalDayPosts a:visited { color:#000000; }