################################################################################
# Drifting Layout
################################################################################

# Layout Info
################################################################################
layerinfo "type"        = "layout";
layerinfo "name"        = "Drifting";
layerinfo "redist_uniq" = "drifting/layout";
layerinfo "author_name" = "Jennie Griner";
layerinfo "author_email" = "jennielynn1127@livejournal.com";
layerinfo "des"         = "Based on the Drifting v1.0 design at OSWD by Pat Heard";
layerinfo "lang"        = "en";

################################################################################
# Properties
################################################################################

set layout_authors             = [ { "name" => "Jennie Griner"} ];
set layout_resources           = [ { "name" => "OSWD design", "url" => "http://www.oswd.org/design/information/id/1955" } ];

# PRESENTATION
################################################################################
propgroup presentation
{
    property use num_items_recent;
    property use num_items_reading;
    property use num_items_icons;
    property use use_journalstyle_entry_page;
    property use margins_size;
    property use margins_unit;
    property use medium_breakpoint_width;
    property use large_breakpoint_width;
    property use reverse_sortorder_group;
    property use reg_firstdayofweek;
    property use icons_page_sort;
    property use userpics_style_group;
    property use userpics_position;
    property use entry_metadata_position;
    property use use_custom_friend_colors;
    property use use_shared_pic;
    property use userlite_interaction_links;
    property use entry_management_links;
    property use comment_management_links;
    property use entry_datetime_format_group;
    property use comment_datetime_format_group;
    property use all_entrysubjects;
    property use all_commentsubjects;
    property use custom_control_strip_colors;
}

set layout_type            = "two-columns-left";
set userpics_position = "right";
set num_items_recent       = 20;
set num_items_reading      = 20;
set linklist_support       = true;
set entry_management_links = "text";
set comment_management_links = "text";
set userlite_interaction_links = "text";
set custom_colors_template = "%%new%% .friends-color-wrapper {background-color: %%background%%} %%new%% .friends-color-wrapper a {color: %%foreground%%}";


# COLOURS
################################################################################
propgroup colors
{
    property use color_page_background;
    property use color_page_text;
    property use color_page_link;
    property use color_page_border;
    property use color_page_title;

    property use color_header_background;

    property use color_module_border;
    property use color_module_title;
    property use color_page_link_visited;
    property use color_page_link_active;

    property use color_entry_border;
    property use color_entry_background;
    property use color_entry_title;
    property use color_entry_text;

    property use control_strip_bgcolor;
    property use control_strip_fgcolor;
    property use control_strip_bordercolor;
    property use control_strip_linkcolor;

    property Color color_page_subtitle
    {
        des = "Page subtitle color";
    }
}

# IMAGES
################################################################################
propgroup images
{
    property use image_background_page_group;
    property use image_background_header_group;
    property use image_background_header_height;
    property string image_header_left {
        des = "Left header image URL";
    }
    property string image_header_right {
        des = "Right header image URL";
    }
    property string image_module_header_url {
        des = "Module/Entry header image URL";
    }
}

# FONTS
################################################################################
propgroup fonts
{
    property use font_base;
    property use font_fallback;
    property use font_base_size;
    property use font_base_units;
    property use font_journal_title;
    property use font_journal_title_size;
    property use font_journal_title_units;
    property use font_journal_subtitle;
    property use font_journal_subtitle_size;
    property use font_journal_subtitle_units;
    property string font_title_fallback
    {
        des    = "Alternative font for journal title and subtitle";
        values = "sans-serif|Sans-serif|serif|Serif|cursive|Cursive|monospace|Monospaced|none|Use browser's default";
    }
    property use font_entry_title;
    property use font_entry_title_size;
    property use font_entry_title_units;
    property use font_comment_title;
    property use font_comment_title_size;
    property use font_comment_title_units;
    property use font_module_heading;
    property use font_module_heading_size;
    property use font_module_heading_units;
    property use font_module_text;
    property use font_module_text_size;
    property use font_module_text_units;
    property use font_sources;
}

set font_base         = "Arial";
set font_fallback     = "sans-serif";
set font_base_size  = "1";
set font_base_units = "em";
set font_journal_title  = "'Times New Roman'";
set font_journal_title_size  = "2.8";
set font_journal_title_units = "em";
set font_entry_title_size = "1.2";
set font_entry_title_units = "em";
set font_module_heading_size = "1.1";
set font_module_heading_units = "em";
set font_module_text_size = ".9";
set font_module_text_units = "em";
set font_title_fallback = "serif";

# MODULES
################################################################################
propgroup modules
{
    property use module_navlinks_group;
    property use module_customtext_group;
    property use module_pagesummary_group;
    property use module_links_group;
    property use module_calendar_group;
    property use module_active_group;
    property use module_poweredby_group;
    property use module_tags_group;
    property use module_syndicate_group;
    property use module_userprofile_group;
    property use module_time_group;
    property use module_credit_group;
    property use module_search_group;
    property use module_cuttagcontrols_group;
    property use module_subscriptionfilters_group;
}

set module_layout_sections     = "none|(none)|one|Sidebar|two|Footer";

set module_navlinks_section    = "one";
set module_customtext_section  = "one";
set module_pagesummary_section = "one";
set module_links_section       = "one";
set module_calendar_section    = "one";
set module_poweredby_section   = "two";
set module_tags_section        = "none";
set module_syndicate_section   = "none";
set module_userprofile_section = "none";
set module_time_section        = "none";
set module_credit_section      = "one";

set module_calendar_order      = 1;
set module_navlinks_order      = 2;
set module_links_order         = 3;

# TEXT
################################################################################
propgroup text
{

    property use text_module_userprofile;
    property use text_module_links;
    property use text_module_syndicate;
    property use text_module_tags;
    property use text_module_popular_tags;
    property use text_module_pagesummary;
    property use text_module_active_entries;
    property use text_module_customtext;
    property use text_module_customtext_url;
    property use text_module_customtext_content;
    property use text_module_credit;
    property use text_module_search;
    property use text_module_cuttagcontrols;
    property use text_module_subscriptionfilters;

    property use text_view_recent;
    property use text_view_friends;
    property use text_view_network;
    property use text_view_friends_comm;
    property use text_view_friends_filter;
    property use text_view_archive;
    property use text_view_userinfo;
    property use text_view_memories;

    property use text_post_comment;
    property use text_max_comments;
    property use text_read_comments;
    property use text_post_comment_friends;
    property use text_read_comments_friends;
    property use text_read_comments_screened_visible;
    property use text_read_comments_screened;

    property use text_skiplinks_back;
    property use text_skiplinks_forward;
    property use text_meta_music;
    property use text_meta_mood;
    property use text_meta_location;
    property use text_meta_xpost;
    property use text_tags;

    property use text_entry_prev;
    property use text_entry_next;
    property use text_edit_entry;
    property use text_edit_tags;
    property use text_tell_friend;
    property use text_mem_add;
    property use text_watch_comments;
    property use text_unwatch_comments;
    property use text_permalink;
    property use text_stickyentry_subject;

    property string text_navigation_header
    {
        des = "Text for the navigation header";
    }

    property use text_module_customtext;
    property use text_module_customtext_content;
    property use text_module_customtext_url;
}

set text_navigation_header = "Navigation";
set text_comment_from      = "";
set text_comment_date      = "";
set text_posting_in        = "";


# CUSTOM CSS
################################################################################
propgroup customcss
{
    property use external_stylesheet;
    property use include_default_stylesheet;
    property use linked_stylesheet;
    property use custom_css;
}

################################################################################
# Functions
################################################################################

# Prints out the stylesheet for Drifting
################################################################################
function Page::print_default_stylesheet()
{
    var string medium_media_query = generate_medium_media_query();
    var string large_media_query = generate_large_media_query();

    var string image_header_left_url = generate_image_url ($*image_header_left);
    var string image_header_right_url = generate_image_url ($*image_header_right);
    var string page_background = generate_background_css ($*image_background_page_url, $*image_background_page_repeat, $*image_background_page_position, $*color_page_background);
    var string header_background = generate_background_css ($*image_background_header_url, $*image_background_header_repeat, $*image_background_header_position, $*color_header_background);
    if ($*image_background_header_height > 0) {
        $header_background = """
            $header_background
            height: """ + $*image_background_header_height + """px;""";
    }
    var string module_header_background = generate_background_css ($*image_module_header_url,"no-repeat","bottom right",$*color_page_background);

    var string canvas_colors = generate_color_css(new Color, $*color_entry_background, $*color_page_border);
    var string module_header_colors = generate_color_css($*color_module_title, new Color, $*color_module_border);
    var string module_footer_colors = generate_color_css(new Color, $*color_page_background, $*color_module_border);
    var string navigation_colors = generate_color_css(new Color, $*color_page_background, $*color_module_border);

    var string page_link_colors = generate_color_css($*color_page_link, new Color, new Color);
    var string page_link_active_colors = generate_color_css($*color_page_link_active, new Color, new Color);
    var string page_link_visited_colors = generate_color_css($*color_page_link_visited, new Color, new Color);

    var string base_font_string = "";
    var string title_font_string  = "";

    # Determine the font strings to use in the CSS
    var string page_font = generate_font_css("", $*font_base, $*font_fallback, $*font_base_size, $*font_base_units);
    var string page_title_font = generate_font_css($*font_journal_title, $*font_base, $*font_title_fallback, $*font_journal_title_size, $*font_journal_title_units);
    var string page_subtitle_font = generate_font_css($*font_journal_subtitle, $*font_base, $*font_title_fallback, $*font_journal_subtitle_size, $*font_journal_subtitle_units);
    var string entry_title_font = generate_font_css($*font_entry_title, $*font_base, $*font_fallback, $*font_entry_title_size, $*font_entry_title_units);
    var string comment_title_font = generate_font_css($*font_comment_title, $*font_base, $*font_fallback, $*font_comment_title_size, $*font_comment_title_units);
    var string module_font = generate_font_css($*font_module_text, $*font_base, $*font_fallback, $*font_module_text_size, $*font_module_text_units);
    var string module_title_font = generate_font_css($*font_module_heading, $*font_base, $*font_fallback, $*font_module_heading_size, $*font_module_heading_units);

    var string userpic_css = "";
    if ($*userpics_position == "left") {
        $userpic_css = """
        .friends-color-wrapper,
        .comment-userpic {
            float: left;
            margin-left: 0;
            }
        .comment-userpic {
            margin-left: 10px;
            margin-right: 10px;
            }
        """;
    }
    elseif ($*userpics_position == "right") {
        $userpic_css = """
        .friends-color-wrapper,
        .comment-userpic {
            float: right;
            margin-right: -5px;
            }
        .comment-userpic {
            margin-right: 0px;
            }
        .datetime-container {
            margin-top: -10px;
            }
        """;
    }

    print_custom_control_strip_css();

    """
    /* Main layout
    ***************************************************************************/
    body {
        $page_font
        color: $*color_page_text;
        $page_background
    }

    html body {
        margin-left: $*margins_size$*margins_unit;
        margin-right: $*margins_size$*margins_unit;
    }

    #canvas {
        padding: 10px;
        margin: 30px;
        overflow: auto;
        $canvas_colors
    }

    #secondary {
        margin: 0px 0px 0px 0px;
        text-align: left;
    }

    /* reorder so that #primary appears on top of #secondary on mobile views */
    #canvas { display: table; }
    #header { display: table-header-group; }
    #secondary { display: table-footer-group; }
    #primary { display: table-row-group; }

    @media $medium_media_query {
        #canvas, #header, #secondary, #primary { display: block; }
        #primary {
            margin: 10px 0 0 235px;
            border-left: 1px solid $*color_page_border;
        }

        #secondary {
            float: left;
            width: 225px;
            border-right: 1px solid $*color_module_border;
        }

        #secondary .module-wrapper .separator-after {
            float: left;
            clear: left;
            width: 224px;
            height: 1.5em;
            margin-top: .5em;
            $module_footer_colors
        }
    }
    /* Lists
    ***************************************************************************/

    ul {
        margin-left: 0px;
        padding-left: 40px;
    }

    /* Typography
    ***************************************************************************/

    a { $page_link_colors }
    a:visited { $page_link_visited_colors }
    a:hover { text-decoration: none; }
    a:active { $page_link_active_colors }

    q { font-style: italic; }

    h2 {
        font-size: 1em;
        color: $*color_module_title;
        font-weight: bold;
    }

    h2.module-header {
        $module_header_colors
        $module_header_background
        border-right: none;
        padding: 3px;
        padding-left: 10px;
        margin-top: 0px;
        $module_title_font
    }

    .day-title,
    .month-title {
        border: 1px solid $*color_module_border;
        background: $*color_page_background;
        padding: 3px;
        padding-left: 10px;
        font-size: 1.2em;
    }

    .module-content {
        $module_font
    }

    /* Header
    ***************************************************************************/
    #header {
        margin-bottom: 10px;
        border: 1px solid $*color_module_border;
        $header_background
    }

    #header:after {
      content: "";
      display: table;
      clear: both;
    }

    .header-left {
        background-image: url($image_header_left_url);
        background-position: 0 100%;
        background-repeat: no-repeat;
        min-height: 4.7em;
    }

    #header h1#title, #header h1#title a {
        color: $*color_page_title;
        text-decoration: none;
    }

    #header h1#title {
        $page_title_font
        font-weight: bold;
        font-style: italic;
        line-height: 0.9em;
        width: 100%;
        margin: 0;
        text-align: center;
    }

    #header h2#subtitle {
        $page_subtitle_font
        color: $*color_page_subtitle;
        width: 100%;
    }

    @media $medium_media_query {
        #header h1#title {
            margin: 0px 0px 0px 235px;
            text-align: left;
        }

        #header h2#subtitle {
            margin: 5px 0px 0px 335px;
        }

        .header-left {
            float: left;
            width: 60%;
        }
    }

    @media $large_media_query {
        .header-right {
            background-image: url($image_header_right_url);
            background-position: 0 100%;
            height: 4.7em;
            float: right;
            width: 250px;
        }
    }

    /* Navigation
    ***************************************************************************/
    .navigation {
        padding: 3px 15px 3px 10px;
        margin-bottom: 15px;
        $navigation_colors
        clear: right;
        text-align: right;
    }

    .navigation ul {
        display: inline;
        padding: 0px;
    }

    .navigation ul li {
        display: inline;
        padding-right: 10px;
    }

    .navigation ul li a {
        text-decoration: none;
    }

    .navigation ul li.active {
        font-weight: bold;
    }

    /* Module Lists
    ***************************************************************************/
    #secondary .userlite-interaction-links,
    #secondary .module-list {
        list-style: none;
        padding-left: 20px;
        padding-right: 5px;
    }

    .userlite-interaction-links.icon-links {
        padding: 0;
        text-align: center;
        }

    .userlite-interaction-links.icon-links li {
        display: inline;
        }

    #secondary .manage-link {
        margin-bottom: 1em;
        text-align: center;
    }

    /* Userpics
    ***************************************************************************/
    .module-userprofile .userpic {
        border: 1px solid $*color_module_border;
        border-bottom: none;
        margin: 0 auto;
        padding: 10px 10px 0;
        width: 100px;
    }

    .module-userprofile .journal-name {
        border: 1px solid $*color_module_border;
        border-top: none;
        text-align: center;
        margin: 0 auto;
        width: 120px;
    }

    .friends-color-wrapper,
    .comment-userpic {
        padding: 10px;
        padding-bottom: 7px;
        margin: 10px;
        margin-top: -5px;
        background: $*color_page_background;
        margin-bottom: 5px;
        border: 1px solid $*color_module_border;
        text-align: center;
    }

    .friends-color-wrapper .poster,
    .comment-userpic .poster {
       display: block;
       width: auto;
       font-size: .9em;
    }

    .userpic img {
        border: none;
        margin: 0px;
        padding: 0px;
    }

    .friends-color-wrapper .ljuser, .comment-userpic .ljuser {
        display: block;
    }
    /* Calendar
    ***************************************************************************/
    .module-calendar {
        padding: 0px 0px 5px 0px;
        margin-bottom: 15px;
    }

    .module-calendar .module-content table {
        margin: 0px 5px 0px 5px;
    }

    .module-calendar th {
        display: none;
    }

    .module-calendar td {
        width: 24px;
        margin: 1px;
        text-align: center;
        border: 1px solid $*color_module_border;
    }

    .module-calendar td.empty-day,
    .module-calendar td.entry-day {
        border-right: 1px solid $*color_module_border;
        border-bottom: 1px solid $*color_module_border;
    }

    /* Credit
    ***************************************************************************/
    .module-credit .category-title {
        font-weight: bold;
    }

    /* Page Summary
    ***************************************************************************/
    /* wrap long content, particularly openid usernames */
    .module-pagesummary .ljuser {
        white-space: normal !important;
    }
    .module-pagesummary .module-content {
        word-wrap: break-word;
    }

    /* Search Module
    ***************************************************************************/
    .search-box { max-width: 100%; }
	
	.search-form .search-box-item, 
    .search-form .search-button-item {
        display: block
    }
    .search-form .comment_search_checkbox_item {
        display: inline
    }
	
	#footer .module-search .search-form .search-box-item,
    #footer .module-search .search-form .comment_search_label,
    #footer .module-search .search-form .search-button-item {
        display: inline;
    }

    /* Tag Module
    ***************************************************************************/
    .module-tags_cloud .module-list {
        margin-bottom: 0.5em;
    }

    .module-tags_cloud li, .tags_cloud li {
        display: inline;
    }

    /* Reply
    ***************************************************************************/
    #reply h2 {
        border: 1px solid $*color_entry_border;
        background: $*color_page_background;
        padding: 3px;
        padding-left: 10px;
        font-weight: bold;
    }

    #reply .reply-form {
        padding-left: 20px;
        padding-bottom: 20px;
    }

    /* Entry
    ***************************************************************************/
    .entry {
        padding: 0px 5px 5px 10px;
        font-size: .9em;
        overflow: auto;
    }

    .entry-content {
        margin-bottom: 20px;
        color: $*color_entry_text;
    }

    /* ensure comment content stretches out horizontally so it's readable */
    .comment-content:before {
        content: "";
        display: block;
        overflow: hidden;
        width: 10em;
    }
    .comment-content { border-top: 1px transparent solid; } /* for firefox */

    /* To prevent overlapping when icon's on the left */
    /* and list is the first thing in content */
    .entry-content li,
    .comment-content li {
        list-style-position: inside;
        }

    /* To constrain the width and prevent layout breaking */
    .entry-content img, .comment-content img {
        max-width: 100%;
        height: auto;
    }

    @media $large_media_query {
        .entry-content img, .comment-content img { max-width: none; }
    }

    .entry .subject {
        padding: 3px;
        border: 1px solid $*color_entry_border;
        $module_header_background
        font-size: 1.2em;
        font-weight: bold;
        padding-left: 10px;
        margin: 0px -5px 15px -10px;
    }

    .entry .subject a {
        text-decoration: none;
    }

    .entry h3.entry-title {
        padding: 0px;
        margin: 0px;
        display: inline;
        color: $*color_entry_title;
        $entry_title_font
    }

    /* Set padding to restore height to the decorative header */
    /* Use standard H3 font size or custom size if set */
    .no-subject .entry .entry-title {
        padding: 1.17em;
        padding: $*font_entry_title_size$*font_entry_title_units;
    }

    .entry .trust-filter {
        padding-left: 10px;
    }

    .datetime-container {
        margin-bottom: 10px;
    }

    .datetime {
        font-weight: bold;
    }

    .datetime a {
        text-decoration: none;
        color: $*color_page_text;
    }

    .tag {
        font-weight: bold;
        margin-top: 10px;
        margin-bottom: 10px;
        margin-left: 0px;
    }

    .tag ul li {
        display: inline;
        font-weight: normal;
        font-size: 1.2em;
    }

    .tag ul {
        display: inline;
        margin 0px;
        padding: 0px;
        padding-left: 0;
    }

    .entry-management-links,
    .entry-interaction-links {
        padding: 0px;
        margin-left: 0px;
        font-size: 1.1em;
        display: inline;
    }

    .entry-management-links li,
    .entry-interaction-links li {
        display: inline;
        padding-right: 5px;
        margin: 0px;
    }

    .metadata ul {
        list-style: none;
        padding: 0px;
    }

    /* Comment
    ***************************************************************************/
    .comment {
        overflow: auto;
    }

    .comment-posted {
        font-weight:bold;
    }

    .full .comment .poster {
       display: block;
       width: auto;
       text-align: center;
       font-size: .9em;
    }

    .comment-interaction-links,
    .comment-management-links {
        display: inline;
        padding-left: 0px;
    }

    .comment-interaction-links li,
    .comment-management-links li {
        display: inline;
        padding-right: 10px;
    }

    .comment-thread .separator-after {
        border-bottom: 1px solid $*color_entry_border;
    }

    .comment-title {
        $comment_title_font
        margin: 0;
        }

    .comment .subject {
        border: 1px solid $*color_entry_border;
        background: $*color_page_background;
        padding: 3px;
        padding-left: 10px;
        min-height: 1em;
        margin: 0.83em 0;
    }

    .comment .subject a {
        font-weight: bold;
        text-decoration: none;
    }

    .comment-subjecticon { margin: 0; }

    .comment-content {
        padding-left: 10px;
        color: $*color_entry_text;
    }

    .comment-content .comment-text .comment-content {
        padding-left: 0px;
    }

    .comment .comment-content .datetime-container {
        padding-top: 10px;
    }

    .comment .comment-content .poster-ip {
        font-style: italic;
        display: block;
        margin-bottom: 10px;
    }

    .comment-wrapper {
        min-width: 15em;
    }

    .talkform textarea {
        width: 500px; /* will cause scrolling without this in IE7 */
    }

    /* Mass Actions, Comments Message
    ***************************************************************************/
    .bottomcomment, .comments-message {
        margin: 1em;
    }

    /* Archive
    ***************************************************************************/
    .day-entries {
        font-size: .9em;
    }

    .day-entries .subjectlist {
        padding-left: 10px;
    }

    .day-entries .time {
        font-weight: bold;
    }

    .day-entries .entry-title {
        padding-left: 30px;
        margin: 0px;
        margin-top: 3px;
    }

    .month {
        width: 280px;
        margin: 0 auto;
        text-align: center;
        padding-bottom: 10px;
    }

    .month-table td {
        padding: 3px;
        font-size: .9em;
        width: 30px;
        height: 40px;
        border-right: 1px solid $*color_entry_border;
        border-bottom: 1px solid $*color_entry_border;
        vertical-align: top;
        text-align: right;
    }

    .month-table th {
        padding: 3px;
        font-size: .9em;
        width: 30px;
        height: 30px;
        border-right: 1px solid $*color_entry_border;
        border-bottom: 1px solid $*color_entry_border;
    }

    .month-table td.day p {
        display: block;
        padding: 0px;
        margin: 0px;
        text-align: center;
    }

    .month-entries .day-title {
        border: none;
        background: none;
    }

    .month-entries .day-entries .subjectlist {
        padding-left: 40px;
        font-weight: normal;
    }

    .month-entries .day-entries .subjectlist span {
        font-weight: normal;
        display: inline;
    }

    .month-entries .day-entries .subjectlist h3 {
        font-weight: normal;
        font-size: 1.1em;
        display: inline;
        padding-left: 10px;
    }

    .month-entries .day-entries .subjectlist .access-filter,
    .month-entries .day-entries .subjectlist .restrictions {
        margin-left: 5px;
    }

    .month-entries .day-entries .subjectlist .access-filter img,
    .month-entries .day-entries .subjectlist .restrictions img {
        margin-bottom: -3px;
    }

    .subjectlist .tag {
        padding-left: 60px;
    }

    /* Tags Page
    ***************************************************************************/
    .tags-container h2 {
        background: $*color_page_background;
        color: $*color_page_text;
        border: 1px solid $*color_entry_border;
        padding: 3px;
        padding-left: 10px;
    }

    .ljtaglist {
        list-style: none;
        padding-left: 10px;
    }

    /* Icons Page
    ***************************************************************************/

    .icons-container .contents,
    .icons-container .footer {
        padding: 0 5px 5px 10px;
    }

    .icons-container h2 {
        background: $*color_page_background;
        color: $*color_page_text;
        border: 1px solid $*color_entry_border;
        padding: 3px;
        padding-left: 10px;
    }

    .sorting-options ul {
        padding-left: 0;
        text-align: right;
    }

    .sorting-options ul li {
        display: inline;
    }

    .icons-container .icon {
        margin: 1em 0;
    }

    .icon-image {
        display: inline-block;
        margin-bottom: .25em;
        min-width: 100px;
    }

    .icon-info {
        display: inline-block;
        vertical-align: top;
        width: 80%;
    }

    .icon-info span {
        font-weight: bold;
    }

    .icon-info .default {
        text-decoration: underline;
    }

    .icon-keywords ul {
        display: inline;
        margin 0;
        padding-left: 0;
    }

    .icon-keywords ul li {
        display: inline;
    }

    /* Footer
    ***************************************************************************/
    #footer {
        font-size: .8em;
        font-weight: normal;
        border: 1px solid $*color_module_border;
        background: $*color_page_background;
        padding: 3px;
        padding-left: 10px;
    }

    /* Page Footer
    ***************************************************************************/
    .page-top {
        font-size: .8em;
        padding-top: 10px;
        text-align: center;
    }

    /* (left border)
    ***************************************************************************/
    @media $medium_media_query {
        .day-title, .month-title,
        #footer, .navigation, #reply h2,
        .entry .subject, .comment .subject,
        .tags-container h2, .icons-container h2 {
            border-left: none;
        }
    }

$userpic_css

""";
}

# NavLinks Module, Need to override this so the title gets printed.
################################################################################
function print_module_navlinks()
{
    var Page p = get_page();
    open_module("navlinks", $*text_navigation_header, "");
    var string[] links = [];
    foreach var string k ($p.views_order)
    {
        $links[size $links] = """<a href="$p.view_url{$k}">"""+lang_viewname($k)+"""</a>""";
    }
    print_module_list($links);
    close_module();
}


# Main layout
################################################################################
function Page::print()
{
    """<!DOCTYPE html>
    <html lang="en">
    <head>""";
        $this->print_meta_tags();
        $this->print_head();
        $this->print_stylesheets();
        $this->print_head_title();
    println "</head>";

    $this->print_wrapper_start();
        $this->print_control_strip();

        println "<div id=\"canvas\">";
            println "<div id=\"header\">";
            println "<div class=\"header-left\">";
                $this->print_global_title();
                $this->print_global_subtitle();
            println "</div><div class=\"header-right\"></div>";
            println "</div>";

            println "<div id=\"secondary\">";
                $this->print_module_section("one");
            println "</div>";

            println "<div id=\"primary\">";
                $this->print_body();
                println "<div id=\"footer\">";
                    $this->print_module_section("two");
                println "</div>";
            println "</div>";

            println "<div id=\"canvas-footer\">";
                    print safe """<div class="page-top"><a href="#">$*text_page_top</a></div>""";
            println "</div>";

        println "</div>";

    $this->print_wrapper_end();
    println "</html>";
}


# Print an entry, uses friends colours on the friends page, so this is a layout
# specific function that the main Page::print_entry, etc all call.
################################################################################
function Page::print_entry (Entry e)
{
   $e->print_wrapper_start();

        print "<div class=\"subject\">";
            $e->print_subject();
            $e->print_metatypes();
        println "</div>";

        println "<div class='friends-color-wrapper'>";
            $e->print_userpic();
            $e->print_poster();
        println "</div>";

        println "<div class=\"datetime-container\">";
        $e->print_time("long_day", "");
        println "</div>";

        if ($*entry_metadata_position == "top") { $e->print_metadata(); }
        $e->print_text();
        if ($*entry_metadata_position == "bottom") { $e->print_metadata(); }
        $e->print_tags();
        $this->print_entry_footer($e);
    $e->print_wrapper_end();
}

function Page::print_entry_footer(Entry e) {
    $e->print_management_links();
    $e->print_interaction_links();
    $e->print_reply_container({ "target" => $e.dom_id + "-reply" });
}

## Entry Page
################################################################################
function EntryPage::print_comment (Comment c)
{
    $c->print_wrapper_start();

        print "<div class=\"subject\">";
            $c->print_metatypes();
            $c->print_subject();
        print "</div>";

        println "<div class='comment-userpic'>";
            $c->print_userpic();
            $c->print_poster();
        println "</div>";

        println "<div class=\"comment-content\">";
            println "<div class=\"datetime-container\">";
                $c->print_time("long_day", "");
            println "</div>";
             if ( $c.comment_posted ) {
                 print safe "<div class='comment-posted'>$*text_comment_posted</div>";
             }
            $c->print_metadata();

            println "<div class=\"comment-text\">";
            $c->print_text();
            println "</div>";

            $c->print_interaction_links();
            $c->print_management_links();

            if ($this.multiform_on)
            {
                """<span class="multiform-checkbox">""";
                println "<label for='ljcomsel_$c.talkid'>$*text_multiform_check</label>";
                $c->print_multiform_check();
                "</span>";
            }

            $c->print_reply_container();
        println "</div>";

    $c->print_wrapper_end();
}

function EntryPage::print_entry_footer(Entry e) {
    $e->print_management_links();
    $e->print_interaction_links("topcomment");
    $this->print_reply_container({ "target" => "topcomment" });
}

## Reply Page
################################################################################
function ReplyPage::print_body
{
    if ($.replyto isa Entry)
    {
        var Entry e = $.replyto as Entry;
        $this->print_entry($e);
    }
    elseif ($.replyto isa Comment)
    {

        var Comment c = $.replyto as Comment;
        $this->print_comment($c);
    }

    println "<div id=\"reply\">";
        println "<h2>Reply</h2>";
        println "<div class=\"reply-form\">";
        if ($.entry.comments.enabled)
        {
            $.form->print();
        }
        else
        {
             print "Comments have been disabled for this post";
        }
        println "</div>";
    println "</div>";
}

function ReplyPage::print_comment (Comment c)
{
    $c->print_wrapper_start();

        print "<div class=\"subject\">";
            $c->print_metatypes();
            $c->print_subject();
        print "</div>";

        println "<div class='comment-userpic'>";
            $c->print_userpic();
            $c->print_poster();
        println "</div>";

        println "<div class=\"comment-content\">";
            println "<div class=\"datetime-container\">";
                $c->print_time("long_day", "");
            println "</div>";

            $c->print_metadata();

            println "<div class=\"comment-text\">";
            $c->print_text();
            println "</div>";

            $c->print_interaction_links();
        println "</div>";

    $c->print_wrapper_end();
}

## Day Page
################################################################################
function DayPage::print_body() {
var Entry[] entries = $*reverse_sortorder_day ? reverse $.entries : $.entries;

    $this->print_navigation();

    println "<h2 class=\"day-title\">" + $.date->date_format("long") + "</h2>";

    if ($.has_entries)
    {
        foreach var Entry e ($entries)
        {
            $this->print_entry($e);
        }
    }
    else
    {
        println $*text_noentries_day;
    }

    $this->print_navigation();
}

## Year Page
################################################################################
function YearPage::print_body {
var YearMonth[] months = $*reverse_sortorder_year ? reverse $.months : $.months;

    $this->print_navigation();

    foreach var YearMonth m ($months)
    {
        $this->print_month($m);
    }
}

function YearPage::print_month(YearMonth m)
{
    if (not $m.has_entries) { return; }

    println "<h2 class=\"month-title\"><a href='$m.url'>";
    print $m->month_format();
    println "</a></h2>";

    println "<div class='month'>";
    println "<table summary=\"Monthly calendar with links to each day's entries\" class=\"month-table\"><thead>";
    foreach var int d (weekdays())
    {
        "<th>" + $*lang_dayname_short[$d] + "</th>";
    }
    println "</thead>";
    println "<tbody>";

    foreach var YearWeek w ($m.weeks)
    {
        $w->print();
    }

    println "</tbody>";
    println "</table>";
    println "</div>";
}

## Month Page
################################################################################
function MonthPage::print_body {
var MonthDay[] days = $*reverse_sortorder_month ? reverse $.days : $.days;

    $this->print_navigation();

    println "<h2 class=\"month-title\">" + $.date->date_format($*lang_fmt_month_long) + "</h2>";

    println "<div class=\"month-entries\">";
        foreach var MonthDay d ($days)
        {
            if ($d.has_entries)
            {
                println "<div class=\"day-entries\">";
                    println "<h2 class=\"day-title\"><a href='$d.url'>";
                    println lang_ordinal($d.day);
                    println "</a></h2>";
                    println "<div class=\"subjectlist\">";
                        $d->print_subjectlist();
                    println "</div>";
                println "</div>";
            }
        }
    println "</div>";

    $this->print_navigation();
}