1 layerinfo type = "layout";
2 layerinfo name = "Negatives";
3 layerinfo redist_uniq = "negatives/layout";
4 layerinfo author_name = "phoenix";
5 layerinfo des = "Highly customisable div-based layout";
8 set layout_authors = [ { "name" => "phoenix", "type" => "user" } ];
10 ##===============================
11 ## Display settings - general
12 ##===============================
14 propgroup presentation {
15 property use num_items_recent;
16 property use num_items_reading;
17 property use use_journalstyle_entry_page;
18 property use layout_type;
19 property use margins_size;
20 property use margins_unit;
21 property use tags_page_type;
22 property use userpics_style_group;
23 property use userpics_position;
24 property use entry_metadata_position;
25 property use use_custom_friend_colors;
26 property use use_shared_pic;
27 property use userlite_interaction_links;
28 property use entry_management_links;
29 property use comment_management_links;
30 property use reg_firstdayofweek;
31 property use entry_datetime_format_group;
32 property use comment_datetime_format_group;
35 set userpics_position = "right";
36 set layout_type = "two-columns-right";
37 set custom_colors_template = "%%new%% div.footer, %%new%% div.footer ul, %%new%% div.footer ul a {background-color: %%background%%} %%new%% {border: 5px solid %%background%%;} %%new%% div.footer a, %%new%% div.footer {color: %%foreground%%;}";
39 ##===============================
40 ## Journal style - colors
41 ##===============================
45 property use color_page_background;
46 property use color_page_text;
47 property use color_page_link;
48 property use color_page_link_hover;
49 property use color_page_link_active;
50 property use color_page_link_visited;
52 property use color_header_background;
53 property use color_header_link;
54 property use color_header_link_hover;
55 property use color_header_link_active;
56 property use color_header_link_visited;
58 property use color_footer_background;
59 property use color_footer_link;
60 property use color_footer_link_hover;
61 property use color_footer_link_active;
62 property use color_footer_link_visited;
64 property use color_module_background;
65 property use color_module_text;
66 property use color_module_border;
67 property use color_module_link;
68 property use color_module_link_hover;
69 property use color_module_link_active;
70 property use color_module_link_visited;
71 property use color_module_title;
73 property use color_entry_link;
74 property use color_entry_link_hover;
75 property use color_entry_link_active;
76 property use color_entry_link_visited;
77 property use color_entry_border;
78 property use color_entry_background;
79 property use color_entry_text;
80 property use color_entry_title;
82 property use color_entry_interaction_links_background;
83 property use color_entry_interaction_links;
84 property use color_entry_interaction_links_hover;
85 property use color_entry_interaction_links_active;
86 property use color_entry_interaction_links_visited;
91 ##===============================
92 ## Journal style - images
93 ##===============================
96 property use font_base;
97 property use font_fallback;
98 property use font_base_size;
99 property use font_base_units;
100 property use font_entry_title;
101 property use font_entry_title_size;
102 property use font_entry_title_units;
103 property use font_comment_title;
104 property use font_comment_title_size;
105 property use font_comment_title_units;
106 property use font_module_heading;
107 property use font_module_heading_units;
108 property use font_module_heading_size;
109 property use font_module_text;
110 property use font_module_text_size;
111 property use font_module_text_units;
114 set font_base = "Georgia";
115 set font_fallback = "serif";
116 set font_base_size = "1";
117 set font_base_units = "em";
118 set font_module_heading_size = "1.1";
119 set font_module_heading_units = "em";
120 set font_entry_title_size = "1.1";
121 set font_entry_title_units = "em";
123 ##===============================
124 ## Journal style - images
125 ##===============================
128 property use image_background_page_group;
129 property use image_background_header_group;
130 property use image_background_header_height;
131 property use image_background_entry_group;
132 property use image_background_module_group;
135 ##===============================
136 ## Display settings - modules
137 ##===============================
140 property use module_userprofile_group;
141 property use module_navlinks_group;
142 property use module_customtext_group;
143 property use module_calendar_group;
144 property use module_pagesummary_group;
145 property use module_active_group;
146 property use module_tags_group;
147 property use module_links_group;
148 property use module_syndicate_group;
149 property use module_time_group;
150 property use module_poweredby_group;
151 property use module_credit_group;
152 property use module_search_group;
153 property use module_cuttagcontrols_group;
157 set module_layout_sections = "none|(none)|one|Main Module Section|two|Header|three|Footer";
159 set module_navlinks_section = "two";
161 set module_userprofile_section = "one";
162 set module_customtext_section = "one";
163 set module_pagesummary_section = "one";
164 set module_tags_section = "one";
165 set module_links_section = "one";
166 set module_syndicate_section = "one";
167 set module_credit_section = "one";
169 set module_calendar_section = "three";
170 set module_calendar_opts_type = "horizontal";
172 set module_time_section = "none";
173 set module_poweredby_section = "one";
175 ##===============================
177 ##===============================
179 propgroup customcss {
180 property use external_stylesheet;
181 property use include_default_stylesheet;
182 property use linked_stylesheet;
183 property use custom_css;
188 ##===============================
189 ## Text - main navigation
190 ##===============================
192 property use text_view_archive;
193 property use text_view_userinfo;
194 property use text_view_memories;
195 property use text_view_tags;
197 ##===============================
198 ## Text - entry comment-related
199 ##===============================
201 property use text_view_recent;
202 property use text_view_friends;
203 property use text_view_network;
204 property use text_view_friends_comm;
205 property use text_view_friends_filter;
206 property use text_view_archive;
207 property use text_view_userinfo;
208 property use text_view_memories;
210 property use text_post_comment;
211 property use text_max_comments;
212 property use text_read_comments;
213 property use text_post_comment_friends;
214 property use text_read_comments_friends;
216 property use text_skiplinks_back;
217 property use text_skiplinks_forward;
218 property use text_meta_music;
219 property use text_meta_mood;
220 property use text_meta_location;
221 property use text_meta_xpost;
222 property use text_tags;
224 property use text_entry_prev;
225 property use text_entry_next;
226 property use text_edit_entry;
227 property use text_edit_tags;
228 property use text_tell_friend;
229 property use text_mem_add;
230 property use text_watch_comments;
231 property use text_unwatch_comments;
232 property use text_permalink;
233 property use text_stickyentry_subject;
235 property use text_module_customtext;
236 property use text_module_customtext_content;
237 property use text_module_customtext_url;
240 set entry_management_links = "text";
241 set comment_management_links = "text";
243 #######################
245 #######################
247 ########################
248 #Initialize some properties with fallback values
250 if ( not defined $*color_entry_interaction_links_background ) {
251 $*color_entry_interaction_links_background = $*color_page_background;
255 ########################
256 #Prints the stylesheet
257 function Page::print_default_stylesheet()
259 var string page_background = generate_background_css($*image_background_page_url,$*image_background_page_repeat,$*image_background_page_position,$*color_page_background);
260 var string header_background = generate_background_css($*image_background_header_url, $*image_background_header_repeat, $*image_background_header_position, $*color_header_background);
261 var string footer_background = generate_background_css( "", "", "", $*color_footer_background );
262 var string entry_background = generate_background_css ($*image_background_entry_url, $*image_background_entry_repeat, $*image_background_entry_position,$*color_entry_background);
263 var string module_background = generate_background_css ($*image_background_module_url, $*image_background_module_repeat, $*image_background_module_position,$*color_module_background);
264 if ($*image_background_header_height > 0) {
265 $header_background = $header_background + "\n height: " + $*image_background_header_height + "px;";
267 var string page_font = generate_font_css("", $*font_base, $*font_fallback, $*font_base_size, $*font_base_units);
268 var string entry_title_font = generate_font_css($*font_entry_title, $*font_base, $*font_fallback, $*font_entry_title_size, $*font_entry_title_units);
269 var string comment_title_font = generate_font_css($*font_comment_title, $*font_base, $*font_fallback, $*font_comment_title_size, $*font_comment_title_units);
270 var string module_font = generate_font_css($*font_module_text, $*font_base, $*font_fallback, $*font_module_text_size, $*font_module_text_units);
271 var string module_title_font = generate_font_css($*font_module_heading, $*font_base, $*font_fallback, $*font_module_heading_size, $*font_module_heading_units);
273 var string userpic_css = "";
274 if ($*userpics_position == "left") {
283 elseif ($*userpics_position == "right") {
298 color:$*color_page_text;
302 margin-left: $*margins_size$*margins_unit;
303 margin-right: $*margins_size$*margins_unit;
307 text-decoration: none;
309 color: $*color_page_link;
313 color: $*color_page_link_visited;
316 color: $*color_page_link_hover;
319 color: $*color_entry_link_active;
324 q { font-style: italic;
327 border-top: 0!important;
328 border-bottom: 5px double $*color_module_border;
332 color: $*color_header_link;
335 color: $*color_header_link_active;
338 color: $*color_header_link_visited;
341 color: $*color_header_link_hover;
343 .module-section-two {
345 .module-section-three {
346 border-bottom: 0!important;
347 border-top: 5px double $*color_module_border;
354 color: $*color_footer_link;
357 color: $*color_footer_link_active;
360 color: $*color_footer_link_visited;
363 color: $*color_footer_link_hover;
371 border-left:5px double $*color_module_border;
372 border-right:5px double $*color_module_border;
380 padding-bottom: 10px;
383 color: $*color_module_text;
386 .one-column #secondary {
387 border-left: 5px double $*color_module_border;
388 border-right: 5px double $*color_module_border;
391 .one-column-split #secondary {
392 border-left: 5px double $*color_module_border;
393 border-right: 5px double $*color_module_border;
397 color:$*color_module_link;
401 #secondary a:visited {
402 color:$*color_module_link_visited;
405 color:$*color_module_link_hover;
407 #secondary a:active {
408 color:$*color_module_link_active;
410 #secondary .module-header {
411 border-bottom:1px solid $*color_module_border;
415 .two-columns-right #secondary .module-header {
418 #secondary .module-header a {
419 color: $*color_module_title;
439 .module-tags_cloud li, .tags_cloud li {
441 list-style-type: none;
444 .entry, .entry-wrapper, .comment, .comment-wrapper {
446 border:5px solid $*color_entry_border;
449 color: $*color_entry_text;
451 .comment-wrapper.partial , .partial .comment {
461 font-weight: inherit;
465 .partial .comment-title {
469 .partial .comment-title h4 {
472 .partial .comment-poster:before {
475 .entry a, .comment a {
476 color: $*color_entry_link;
478 .entry a:visited, .comment a:visited {
479 color: $*color_entry_link_visited;
481 .entry a:hover, .comment a:hover {
482 color: $*color_entry_link_hover;
484 .entry a:active, .comment a:active {
485 color: $*color_entry_link_active;
487 .tag { margin: 10px 0; }
488 .tag ul { display: inline; margin: 0; padding: 0; }
489 .tag li { display: inline; }
490 .bottomcomment, .comments-message {
491 border: 15px double $*color_entry_border;
494 background-color: $*color_entry_background;
495 color: $*color_entry_text;
497 .entry-wrapper .footer {
498 background-color: $*color_entry_interaction_links_background;
500 .comment-poster .anonymous {
503 .comment-management-links {
507 .entry-title, .userlite-interaction-links.icon-links li,
508 .entry-management-links li, .entry-interaction-links li,
509 .comment-interaction-links li, .comment-management-links li {
514 color: $*color_entry_title;
516 .entry-title a:hover {
517 color: $*color_entry_link_hover;
520 /* To prevent overlapping when icon's on the left */
521 /* and list is the first thing in content */
523 .comment-content li {
524 list-style-position: inside;
532 .entry-management-links, .entry-management-links a,
533 .entry-interaction-links, .entry-interaction-links a,
534 .comment-interaction-links, .comment-interaction-links a{
535 background-color: $*color_entry_interaction_links_background;
536 color: $*color_entry_interaction_links;
541 .entry-management-links a:visited, .comment-management-links a:visited,
542 .entry-interaction-links a:visited, .comment-interaction-links a:visited{
543 color: $*color_entry_interaction_links_visited;
545 .entry-management-links a:hover, .comment-management-links a:hover,
546 .entry-interaction-links a:hover, .comment-interaction-links a:hover{
547 color: $*color_entry_interaction_links_hover;
549 .entry-management-links a:active, .comment-management-links a:active,
550 .entry-interaction-links a:active, .comment-interaction-links a:active{
551 color: $*color_entry_interaction_links_active;
554 .userlite-interaction-links.icon-links, .entry-management-links ul, .comment-management-links ul {
561 color: $*color_entry_text;
568 font-weight: bold !important;
569 margin: 0 !important;
570 padding-bottom: 10px !important;
574 .tags-container .ljtaglist {
575 padding-bottom: 5px !important;
579 color: $*color_entry_link !important;
581 .tags-container a:visited {
582 color: $*color_entry_link_visited !important;
584 .tags-container a:hover {
585 color: $*color_entry_link_hover !important;
587 .tags-container a:active {
588 color: $*color_entry_link_active !important;
591 /*--- Icons Page ---*/
594 color: $*color_entry_text;
600 .icons-container h2 {
601 font-weight: bold !important;
602 margin: 0 !important;
603 padding-bottom: 10px !important;
608 color: $*color_entry_link !important;
611 .icons-container a:visited {
612 color: $*color_entry_link_visited !important;
615 .icons-container a:hover {
616 color: $*color_entry_link_hover !important;
619 .icons-container a:active {
620 color: $*color_entry_link_active !important;
623 .sorting-options ul {
627 .sorting-options ul li {
632 .page-icons .comment {
645 margin-bottom: .25em;
658 .icon-info .default {
659 text-decoration: underline;
662 .icon-info .keywords ul {
667 .icon-info .keywords ul li {
670 padding: 0 .25em 0 0;
673 .module-section-two .module,
674 .module-section-three .module {
679 .module-navlinks ul {
683 .module-navlinks ul, .module-navlinks li {
686 .module-section-three .module-navlinks ul,
687 .module-section-three .module-navlinks li,
688 .module-section-two .module-navlinks ul,
689 .module-section-two .module-navlinks li {
691 padding: .2em 1em .2em .5em;
693 .two-columns-left .module-section-two .module-navlinks {
696 .module-section-one .module-navlinks {
701 list-style-position: inside;
703 .module-section-one ul { padding-left: 0.3em }
704 .navigation ul { padding-left: 0em; list-style-type: none; }
705 .navigation li { padding-left: 0.3em; display: inline; }
710 .subject, .subject a, .subject a:visited, .subject a:hover, .subject a:active {
717 .two-columns-right .module-section-one .module-userprofile .userpic {
721 .module-section-two .module-calendar,
722 .module-section-three .module-calendar {
726 margin: 0px 190px 0px 100px;
728 .module-calendar table {
729 letter-spacing: 0.2em;
733 color: $*color_module_text;
736 color: $*color_module_link;
738 .module-calendar a:hover{
739 color: $*color_module_link_hover;
741 /* wrap long content, particularly openid usernames */
742 .module-pagesummary .ljuser {
743 white-space: normal !important;
745 .module-pagesummary .module-content {
746 word-wrap: break-word;
748 .module-credit dt, .module-credit dd {
768 .entry h3 { display: inline; }
772 padding: 5px 1em 5px 5px;
776 .one-column #primary,
777 .one-column #secondary {
781 .two-columns-left #primary {float: right;}
782 .two-columns-left #secondary { float: right; }
783 .two-columns-right #primary { float: left; }
784 .two-columns-right #secondary {float: left;}
785 .two-columns-left #primary { right: 10%; width: 70%; }
786 .two-columns-left #secondary { right: 10%; width: 15%; }
787 .two-columns-right #primary {left: 10%; width: 70%;}
788 .two-columns-right #secondary {left: 10%; width: 15%;}
796 function Page::print_entry (Entry e)
798 $e->print_wrapper_start();
799 print "<div class=\"header\">";
801 print "<div class=\"subject\">»";
802 $e->print_metatypes();
805 print "<div class=\"datetime\">(";
812 if ($*entry_metadata_position == "top") { $e->print_metadata(); }
814 if ($*entry_metadata_position == "bottom") { $e->print_metadata(); }
816 println "<div class=\"footer\">";
817 $e->print_interaction_links( "topcomment" );
818 $e->print_management_links();
820 $this->print_reply_container({"target" => "topcomment" });
821 $e->print_wrapper_end();
824 #######################################
826 function YearPage::print_body()
828 println "<div class=\"entry\">";
830 "<div class=\"subject\">";
831 $this->print_year_links();
835 foreach var YearMonth m ($.months) {
836 $this->print_month($m);
843 function YearPage::print_month(YearMonth m) {
844 if (not $m.has_entries) { return; }
845 """<br /><div class="entry"><table summary="Monthly calendar with links to each day's entries" style="width: 100%; border-collapse: collapse;">\n
846 <tr><th class="comments" colspan="7" style="text-align: center;">""";
847 print $m->month_format();
849 foreach var int d (weekdays()) {
850 "<th>"+$*lang_dayname_short[$d]+"</th>\n";
853 foreach var YearWeek w ($m.weeks) {
856 """<tr><td class="comments" colspan="7" style="text-align: center;">
857 « <a href="$m.url">$*text_view_month</a> »</td></tr>\n""";
863 function YearWeek::print() {
864 """<tr valign="top" style="height: 2em;">\n""";
865 if ($.pre_empty > 0) {
866 """<td class="emptyday" colspan="$.pre_empty"> </td>\n""";
868 foreach var YearDay d ($.days) {
869 """<td class="entry" width="14%">\n""";
870 """<div style="text-align: right;">$d.day</div>\n""";
871 if ($d.num_entries > 0) {
872 """<div style="text-align: center;"><a href="$d.url">$d.num_entries</a></div>\n""";
876 if ($.post_empty > 0) {
877 """<td colspan="$.post_empty"> </td>\n""";
884 function MonthPage::print_body
886 println "<div class=\"entry\">";
887 println "<div class=\"subject\">" + $.date->date_format($*lang_fmt_month_long) + "</div>";
888 "<form method='post' action='$.redir.url'><center>";
889 $.redir->print_hiddens();
890 if ($.prev_url != "") { "[<a href='$.prev_url'><<<</a>]\n"; }
891 if (size $.months > 1) {
892 "<select name='redir_key'>\n";
893 foreach var MonthEntryInfo mei ($.months)
896 if ($mei.date.year == $.date.year and $mei.date.month == $.date.month) {
897 $sel = " selected='selected'";
899 println "<option value='$mei.redir_key'$sel>" + $mei.date->date_format($*lang_fmt_month_long) + "</option>";
901 println "</select>\n<input type='submit' value='View' />";
903 if ($.next_url != "") { "\n[<a href='$.next_url'>>>></a>]\n"; }
905 foreach var MonthDay d ($.days) {
906 if ($d.has_entries) {
907 println "<div class='subject'>";
908 println "<a href=\"$d.url\">" + lang_ordinal($d.day) + " " + $.date->date_format($*lang_fmt_month_long) + "</a></div>";
909 println "<div style='margin-left: 20px;'>";
910 $d->print_subjectlist();
911 println "</div>\n<br />\n";
917 function DayPage::print_body()
919 if (not $.has_entries) {
920 println $*text_noentries_day;
922 foreach var Entry e ($.entries) {
923 $this->print_entry($e);
928 #####################################
931 function EntryPage::print_comment (Comment c)
933 $c->print_wrapper_start();
935 println "<div class='datetime'><a href='$c.permalink_url' title='Permalink'>";
940 if ($this.multiform_on)
942 """<span class="multiform-checkbox">""";
943 println "<label for='ljcomsel_$c.talkid'>$*text_multiform_check</label>";
944 $c->print_multiform_check();
948 $c->print_management_links();
951 $c->print_metadata();
956 $c->print_metatypes();
963 println "<div class=\"footer\">";
964 $c->print_interaction_links();
967 $c->print_reply_container();
968 $c->print_wrapper_end();
971 ####################################
973 function Page::print()
975 println """<!DOCTYPE html PUBLIC "-//W3C//DTD XHTML 1.0 Transitional//EN" "http://www.w3.org/TR/xhtml1/DTD/xhtml1-transitional.dtd">
976 <html xmlns="http://www.w3.org/1999/xhtml" xml:lang="en" lang="en">
979 $this->print_stylesheets();
980 $this->print_head_title();
983 $this->print_wrapper_start();
984 $this->print_control_strip();
985 println "<div id=\"header\">";
986 $this->print_module_section("two");
988 if ($*layout_type == "one-column-split") {
989 println "<div id=\"secondary\">";
990 if ($this.view != "archive" and $this.view != "month"){
991 println "<div id='page-navigation-top' class='page-navigation'>";
992 $this->print_navigation();
995 $this->print_module_section("one");
998 println "<div id=\"primary\">";
1000 println "<div class=\"floatclear\">.</div>";
1002 if ($*layout_type != "one-column-split") {
1003 println "<div id=\"secondary\">";
1004 if ($this.view != "archive" and $this.view != "month"){
1005 println "<div id='page-navigation-top' class='page-navigation'>";
1006 $this->print_navigation();
1009 $this->print_module_section("one");
1012 println "<div id=\"footer\">";
1013 $this->print_module_section("three");
1016 println "<div id=\"body-footer\">";
1017 print safe """<div class="page-top"><a href="#">$*text_page_top</a></div>""";
1020 $this->print_wrapper_end();