mourningdove/styles/skittlishdreams/layout.s2
2026-05-24 01:03:05 +00:00

1246 lines
46 KiB
Text

layerinfo "type" = "layout";
layerinfo "name" = "Skittlish Dreams";
layerinfo "des" = "A Dreamwidth port of Skittlish. Candy-coloured theme which comes in several flavors";
layerinfo "redist_uniq" = "skittlishdreams/layout";
layerinfo "author_name" = "Kaigou";
layerinfo "lang" = "en";
set layout_authors = [ { "name" => "Kaigou" } ];
set layout_resources = [ { "name" => "Circular Icons", "url" => "http://prothemedesign.com/circular-icons/" } ];
##===============================
## Presentation
##===============================
propgroup presentation {
property use layout_type;
property use num_items_recent;
property use num_items_reading;
property use margins_size;
property use margins_unit;
property use sidebar_width;
property use medium_breakpoint_width;
property use large_breakpoint_width;
property use use_custom_friend_colors;
property use use_shared_pic;
property use use_journalstyle_entry_page;
property use custom_control_strip_colors;
property use reverse_sortorder_group;
property use reg_firstdayofweek;
property use tags_page_type;
property use num_items_icons;
property use icons_page_sort;
property use all_entrysubjects;
property use all_commentsubjects;
property use entry_datetime_format_group;
property use comment_datetime_format_group;
property use userpics_style_group;
property string entryicons_position {
des = "Place icons on the same side or opposite the sidebar";
values = "none|None (don't show)|same|Same side as sidebar|opposite|Opposite the sidebar";
}
property use entry_metadata_position;
property use userlite_interaction_links;
property use entry_management_links;
property use comment_management_links;
property bool use_action_links_images {
des = "Theme has images for the entry/comment links";
noui = 1;
}
}
set layout_type = "two-columns-right";
set sidebar_width = "300px";
set tags_page_type = "";
set all_commentsubjects = true;
set entryicons_position = "same";
set entry_management_links = "text";
set comment_management_links = "text";
set use_action_links_images = true;
set custom_colors_template = "%%new%% .userpic a {background-color: %%background%%; border: solid 1px %%foreground%%;}";
##===============================
## Colors
##===============================
propgroup colors {
property use color_page_background;
property use color_page_text;
property use color_page_link;
property use color_page_link_hover;
property use color_page_link_visited;
property Color color_page_border { des = "Main border color for the page, and various elements"; }
property use color_page_details_text;
property use color_module_background;
property use color_module_text;
property use color_module_link;
property use color_module_title;
property use color_header_background;
property use color_header_link;
property use color_header_link_active;
property Color color_header_link_hover_background { des = "Page header hover background color"; }
property use color_header_link_hover;
property use color_header_link_visited;
property use color_page_title;
property use color_footer_background;
property Color color_footer_text { des = "Page footer text color"; }
property use color_footer_link;
property use color_footer_link_active;
property Color color_footer_link_hover_background { des = "Page footer hover background color"; }
property use color_footer_link_hover;
property use color_footer_link_visited;
property use color_entry_background;
property use color_entry_text;
property use color_entry_title;
property use color_entry_title_background;
property Color color_entry_title_border { des = "Entry title border color"; }
property Color color_entry_title_border_alt { des = "Alternate entry title border color"; }
property Color color_entry_metadata_text { des = "Entry metadata color"; }
property use control_strip_bgcolor;
property use control_strip_fgcolor;
property use control_strip_bordercolor;
property use control_strip_linkcolor;
}
##===============================
## Fonts
##===============================
propgroup fonts {
property use font_base;
property use font_fallback;
property use font_base_size;
property use font_base_units;
property use font_module_heading_size;
property use font_module_heading;
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_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 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_sources;
}
set font_base = "Tahoma, Verdana, Arial";
set font_fallback = "sans-serif";
set font_base_size = "1";
set font_base_units = "em";
set font_module_heading_size = "1.1";
set font_module_heading_units = "em";
set font_journal_title_size = "2";
set font_journal_title_units = "em";
##===============================
## Images
##===============================
propgroup images {
property use image_background_page_group;
property string[] image_background_container_group {
des = "Main body background image";
grouptype = "image";
}
set image_background_container_group = [ "image_background_container_url", "image_background_container_repeat", "image_background_container_position" ];
property string image_background_container_url {
grouped = 1;
}
property string image_background_container_repeat {
values = "repeat|tile image|no-repeat|don't tile|repeat-x|tile horizontally|repeat-y|tile vertically";
grouped = 1;
}
property string image_background_container_position {
values = "top left|top left|top center|top center|top right|top right|center left|center left|center center|center|center right|center right|bottom left|bottom left|bottom center|bottom center|bottom right|bottom right";
grouped = 1;
allow_other = 1;
}
property use image_background_module_group;
property string[] image_background_navigation_group {
des = "Navigation background image";
grouptype = "image";
}
set image_background_navigation_group = [ "image_background_navigation_url", "image_background_navigation_repeat", "image_background_navigation_position" ];
property string image_background_navigation_url {
grouped = 1;
}
property string image_background_navigation_repeat {
values = "repeat|tile image|no-repeat|don't tile|repeat-x|tile horizontally|repeat-y|tile vertically";
grouped = 1;
}
property string image_background_navigation_position {
values = "top left|top left|top center|top center|top right|top right|center left|center left|center center|center|center right|center right|bottom left|bottom left|bottom center|bottom center|bottom right|bottom right";
grouped = 1;
allow_other = 1;
}
property use image_background_header_group;
property use image_background_header_height;
property string[] image_background_footer_group {
des = "Footer background image";
grouptype = "image";
}
set image_background_footer_group = [ "image_background_footer_url", "image_background_footer_repeat", "image_background_footer_position" ];
property string image_background_footer_url {
grouped = 1;
}
property string image_background_footer_repeat {
values = "repeat|tile image|no-repeat|don't tile|repeat-x|tile horizontally|repeat-y|tile vertically";
grouped = 1;
}
property string image_background_footer_position {
values = "top left|top left|top center|top center|top right|top right|center left|center left|center center|center|center right|center right|bottom left|bottom left|bottom center|bottom center|bottom right|bottom right";
grouped = 1;
allow_other = 1;
}
property use image_background_entry_group;
}
set image_background_page_position = "top left";
set image_background_page_repeat = "repeat-x";
set image_background_container_position = "top right";
set image_background_container_repeat = "repeat-y";
set image_background_module_position = "top left";
set image_background_module_repeat = "no-repeat";
set image_background_navigation_position = "top right";
set image_background_navigation_repeat = "no-repeat";
set image_background_header_height = 100;
set image_background_header_position = "top left";
set image_background_header_repeat = "repeat-x";
set image_background_footer_position = "top left";
set image_background_footer_repeat = "repeat-x";
set image_background_entry_repeat = "repeat-y";
set image_background_entry_position = "top right";
##===============================
## Modules
##===============================
propgroup modules {
property use module_userprofile_group;
property use module_navlinks_group;
property string module_navlinks_section_override {
values = "none|(none)|one|Header|two|Sidebar";
grouped = 1;
}
property use module_calendar_group;
property use module_links_group;
property use module_syndicate_group;
property use module_tags_group;
property use module_pagesummary_group;
property use module_active_group;
property use module_time_group;
property string module_time_section_override {
values = "none|(none)|two|Sidebar|three|Footer";
grouped = 1;
}
property use module_poweredby_group;
property string module_poweredby_section_override {
values = "none|(none)|two|Sidebar|three|Footer";
grouped = 1;
}
property use module_customtext_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)|two|Sidebar";
set grouped_property_override = { "module_navlinks_section" => "module_navlinks_section_override",
"module_poweredby_section" => "module_poweredby_section_override",
"module_time_section" => "module_time_section_override",
};
set module_userprofile_section = "two";
set module_navlinks_section = "one";
set module_calendar_section = "two";
set module_links_section = "two";
set module_syndicate_section = "two";
set module_tags_section = "two";
set module_pagesummary_section = "two";
set module_active_section = "two";
set module_time_section = "none";
set module_poweredby_section = "three";
set module_customtext_section = "two";
set module_credit_section = "two";
set module_search_section = "two";
set module_cuttagcontrols_section = "two";
##===============================
## Text
##===============================
propgroup text {
property use text_module_customtext;
property use text_module_customtext_url;
property use text_module_customtext_content;
property use text_module_subscriptionfilters;
property use text_view_recent;
property use text_view_archive;
property use text_view_friends;
property use text_view_friends_comm;
property use text_view_friends_filter;
property use text_view_network;
property use text_view_tags;
property use text_view_memories;
property use text_view_userinfo;
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_read_comments;
property use text_read_comments_friends;
property use text_read_comments_screened_visible;
property use text_read_comments_screened;
property use text_post_comment;
property use text_post_comment_friends;
property use text_meta_location;
property use text_meta_mood;
property use text_meta_music;
property use text_meta_xpost;
property use text_tags;
property use text_stickyentry_subject;
property use text_max_comments;
property use text_skiplinks_back;
property use text_skiplinks_forward;
}
set text_entry_prev = "Previous";
set text_entry_next = "Next";
set text_tell_friend = "Share";
set text_mem_add = "Memory";
set text_watch_comments = "Track";
set text_unwatch_comments = "Untrack";
set text_post_comment = "Reply";
set text_post_comment_friends = "Reply";
##===============================
## Custom CSS
##===============================
propgroup customcss {
property use external_stylesheet;
property use include_default_stylesheet;
property use linked_stylesheet;
property use custom_css;
}
function prop_init() {
if ( $*entryicons_position == "none" ) {
$*userpics_position = "none";
}
}
function Page::print()
{
"""
<!DOCTYPE html>
<html>
<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();
"""
<div id="container">
<div id="header">
<div class="inner">
<div id="titles-wrap">
""";
$this->print_global_title();
$this->print_global_subtitle();
"""
</div>
""";
$this->print_module_section("one");
"""
</div><!-- end header>inner -->
</div><!-- end header -->
<div id="wrap">
<div id="content">
""";
$this->print_body();
"""
</div>
""";
$this->print_module_section("two");
"""
</div><div style="clear:both;"></div>
</div>
<div id="footer"><div class="inner">
""";
$this->print_module_section("three");
print safe """<div class="page-top"><a href="#">$*text_page_top</a></div>""";
"""
</div></div>
""";
$this->print_wrapper_end();
"""
</html>
""";
}
# so that the decorative background image will show up
function TagsPage::print_navigation( string{} opts ) {
"""
<div class="navigation $opts{"class"}">
<div class="inner">
</div><!-- navigation>inner -->
</div><!-- navigation -->
""";
}
function TagsPage::print_body
{
$this->print_navigation( { "class" => "topnav" } );
"""<div class='tags-container'>\n<div class="inner">\n""";
"""<div class="header">\n<div class="inner">\n""";
print safe "<h2>$*text_tags_page_header</h2>";
"</div>\n</div>\n";
"""<div class="contents">\n<div class="inner">\n""";
if ($*tags_page_type == "multi") {
print_multilevel_tags($.tags, { "list-class" => "ljtaglist tags_multilevel", "print_uses" => $*tags_page_count_type });
}
elseif ($*tags_page_type == "cloud") {
print_cloud_tags($.tags, { "list-class" => "ljtaglist tags_cloud", "print_uses" => $*tags_page_count_type });
}
else {
print_list_tags($.tags, { "list-class" => "ljtaglist tags_list", "print_uses" => $*tags_page_count_type });
}
"</div>\n</div>\n";
"""<div class="footer">\n<div class="inner">\n""";
print_tag_manage_link();
"</div>\n</div>\n";
"</div>\n</div>\n";
$this->print_navigation( { "class" => "bottomnav" } );
}
# so that the decorative background image will show up
function IconsPage::print_navigation( string{} opts ) {
"""
<div class="navigation $opts{"class"}">
<div class="inner">
</div><!-- navigation>inner -->
</div><!-- navigation -->
""";
}
function IconsPage::print_body {
$this->print_navigation( { "class" => "topnav" } );
"""<div class='icons-container'>\n<div class="inner">\n""";
"""<div class="header">\n<div class="inner">\n""";
print safe "<h2>$*text_icons_page_header</h2>";
"</div>\n</div>\n";
"""<div class="contents">\n<div class="inner">\n""";
"""<div class="sorting-options">\n<ul>\n""";
var int sort_ct = 0;
foreach var string k ($.sort_keyseq) {
var string text = lang_icon_sortorder_title($k);
if ( $k == $.sortorder ) {
print safe """<li class='$k active'>$text""";
} else {
print safe """<li class='$k'><a href='$.sort_urls{$k}'>$text</a>""";
}
if ( (++$sort_ct) < size $.sort_keyseq) { print $*text_default_separator; }
"</li>\n";
}
"</ul>\n</div>\n";
$.pages->print({ "class" => "icon-pages toppages" });
foreach var Icon i ($.icons) {
$i->print();
}
$.pages->print({ "class" => "icon-pages bottompages" });
"</div>\n</div>\n";
"""<div class="footer">\n<div class="inner">\n""";
$this->print_icon_manage_link();
"</div>\n</div>\n";
"</div>\n</div>\n";
$this->print_navigation( { "class" => "bottomnav" } );
}
function generate_background_css_flipped (
string background_image,
string background_image_repeat,
string background_image_position,
Color background_color
) : string
"Same as generate_background_css, but uses a flipped version of the image."
{
var string background_css = generate_background_css( $background_image, $background_image_repeat,
$background_image_position, $background_color );
return $background_css->replace( ".gif", "-REDUX.gif" );
}
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[] path_components = $*image_background_entry_url->split("/");
var string image_base = $path_components[size($path_components)-1];
var string theme_base_color = $image_base->substr(0, $image_base->index("_"));
var string page_font = generate_font_css("", $*font_base, $*font_fallback, $*font_base_size, $*font_base_units );
var string journal_title_font = generate_font_css($*font_journal_title, $*font_base, $*font_fallback, $*font_journal_title_size, $*font_journal_title_units);
var string journal_subtitle_font = generate_font_css($*font_journal_subtitle, $*font_base, $*font_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_title_font = generate_font_css($*font_module_heading, $*font_base, $*font_fallback, $*font_module_heading_size, $*font_module_heading_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 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
min-height: """ + $*image_background_header_height + """px;""";
}
var string container_background = generate_background_css( $*image_background_container_url, $*image_background_container_repeat, "right", $*color_footer_background );
var string container_background_redux = generate_background_css_flipped( $*image_background_container_url, $*image_background_container_repeat, "left", $*color_footer_background );
var string footer_background = generate_background_css( $*image_background_footer_url, $*image_background_footer_repeat, $*image_background_footer_position, $*color_footer_background );
if ($*image_background_header_height > 0) {
$footer_background = """
$footer_background
height: """ + $*image_background_header_height + """px;""";
}
var string page_link_colors = generate_color_css($*color_page_link, new Color, new Color);
var string page_link_hover_colors = generate_color_css($*color_page_link_hover, new Color, new Color);
var string page_link_visited_colors = generate_color_css($*color_page_link_visited, new Color, new Color);
var string container_colors = generate_color_css( $*color_page_text, $*color_module_background, new Color );
var string content_colors = generate_color_css( new Color, $*color_page_border, new Color );
var string page_text_colors = generate_color_css($*color_page_text, new Color, new Color);
var string page_details_text_colors = generate_color_css($*color_page_details_text, new Color, new Color );
var string header_colors = generate_color_css( $*color_page_title, $*color_header_background, new Color );
var string header_link_colors = generate_color_css( $*color_header_link, new Color, new Color );
var string header_link_active_colors = generate_color_css( $*color_header_link_active, new Color, new Color );
var string header_link_hover_colors = generate_color_css( $*color_header_link_hover, $*color_header_link_hover_background, new Color );
var string header_link_visited_colors = generate_color_css( $*color_header_link_visited, new Color, new Color );
var Color header_bottom_color = $*color_header_background->darker();
var string footer_colors = generate_color_css( $*color_footer_text, $*color_footer_background, new Color );
var string footer_link_colors = generate_color_css( $*color_footer_link, new Color, new Color );
var string footer_link_active_colors = generate_color_css( $*color_footer_link_active, new Color, new Color );
var string footer_link_hover_colors = generate_color_css( $*color_footer_link_hover, $*color_footer_link_hover_background, new Color );
var string footer_link_visited_colors = generate_color_css( $*color_footer_link_visited, new Color, new Color );
var string module_colors = generate_color_css( new Color, $*color_module_background, new Color );
var string module_box_background = generate_background_css( $*image_background_module_url, $*image_background_module_repeat, $*image_background_module_position, new Color );
var string module_box_colors = generate_color_css( $*color_module_text, new Color, new Color );
var string module_link_colors = generate_color_css( $*color_module_link, new Color, new Color );
var string module_title_colors = generate_color_css( $*color_module_title, new Color, new Color );
var string entry_background = generate_background_css( $*image_background_entry_url, $*image_background_entry_repeat, "right", $*color_entry_background );
var string entry_background_redux = generate_background_css_flipped( $*image_background_entry_url, $*image_background_entry_repeat, "left", $*color_entry_background );
var string entry_colors = generate_color_css( $*color_entry_text, $*color_entry_background, new Color );
var string entry_title_colors = generate_color_css($*color_entry_title, $*color_entry_title_background, new Color);
var string blockquote_colors = generate_color_css(new Color,$*color_entry_background->darker(), new Color);
var string entry_metadata_color = generate_color_css($*color_entry_metadata_text, new Color, new Color);
var string navigation_background = generate_background_css($*image_background_navigation_url, $*image_background_navigation_repeat, "right top", $*color_entry_background);
var string navigation_background_redux = generate_background_css_flipped($*image_background_navigation_url, $*image_background_navigation_repeat, "left top", $*color_entry_background);
var string navigation_colors = generate_color_css($*color_page_details_text, $*color_entry_background, new Color);
var string entry_userpic_shift = "";
if ( $*entry_userpic_style == "" ) { $entry_userpic_shift = "-66px"; }
elseif ( $*entry_userpic_style == "small" ) { $entry_userpic_shift = "-50px"; }
elseif ( $*entry_userpic_style == "smaller" ) { $entry_userpic_shift = "-33px"; }
var string comment_userpic_shift = "";
if ( $*comment_userpic_style == "" ) { $comment_userpic_shift = "-66px"; }
elseif ( $*comment_userpic_style == "small" ) { $comment_userpic_shift = "-50px"; }
elseif ( $*comment_userpic_style == "smaller" ) { $comment_userpic_shift = "-33px"; }
var string entry_title_margin = "";
if ( $*entry_userpic_style == "" ) { $entry_title_margin = "120px"; }
elseif ( $*entry_userpic_style == "small" ) { $entry_title_margin = "95px"; }
elseif ( $*entry_userpic_style == "smaller" ) { $entry_title_margin = "70px"; }
var string comment_title_margin = "";
if ( $*comment_userpic_style == "" ) { $comment_title_margin = "120px"; }
elseif ( $*comment_userpic_style == "small" ) { $comment_title_margin = "95px"; }
elseif ( $*comment_userpic_style == "smaller" ) { $comment_title_margin = "70px"; }
var string entryicon_css = "";
if ($*entryicons_position == "same") {
$entryicon_css = """
.two-columns-right .has-userpic .entry .header,
.two-columns-right .has-userpic .entry .poster {
margin-right: $entry_title_margin;
}
.two-columns-right .has-userpic .comment .header { margin-right: $comment_title_margin; }
.two-columns-left .has-userpic .entry .header { margin-left: $entry_title_margin; }
.two-columns-left .has-userpic .comment .header,
.two-columns-left .has-userpic .comment .poster {
margin-left: $comment_title_margin;
}
.two-columns-right .entry .userpic a,
.two-columns-right .comment .userpic a { right: 10px; left: auto; }
.two-columns-left .entry .userpic a,
.two-columns-left .comment .userpic a { left: 10px; right: auto; }
""";
}
elseif ($*entryicons_position == "opposite") {
$entryicon_css = """
.two-columns-right .has-userpic .entry .header,
.two-columns-right .has-userpic .entry .poster {
margin-left: $entry_title_margin;
}
.two-columns-right .has-userpic .comment .header,
.two-columns-right .has-userpic .comment .poster {
margin-left: $comment_title_margin;
}
.two-columns-left .has-userpic .entry .header { margin-right: $entry_title_margin; }
.two-columns-left .has-userpic .comment .header { margin-right: $comment_title_margin; }
.two-columns-right .entry .userpic a,
.two-columns-right .comment .userpic a { left: 10px; right: auto; }
.two-columns-left .entry .userpic a,
.two-columns-left .comment .userpic a { right: 10px; left: auto; }
""";
}
print_custom_control_strip_css();
"""
/*
Theme Name: Skittlish Dreams, a DW port of Skittlish
Description: A candy coloured theme. Comes in 7 flavors (orange, blue, green, pink, cyan, red, violet).
Version:1.0 Dreamwidth
original designer: Damien Tanner
mephisto (original): Cristi Balan
wordpress port: A.M. Griffin
pmwiki port: Dave G
dw port: Kaigou H.
all versions released under CCL
changes for dreamwidth port:
--- rewrote css to fit dw classes
--- reduced image load to three images
--- removed js functionality for color-switching
--- converted font-sizes to ems from px
--- changed layout to flexible-width only
*/
html {margin: 0px; padding: 0px; font-size: 100%; /* IE hack */}
* {box-sizing:border-box; -moz-box-sizing:border-box}
a, a:link, a:active { $page_link_colors text-decoration: none; }
a:visited { $page_link_visited_colors }
a:hover { $page_link_hover_colors text-decoration: underline; }
h1, h2, h3, h4 {
font-weight: 700;
font-variant: normal;
letter-spacing: .08em;
}
q { font-style: italic; }
body { $page_background $page_font margin: 0; padding: 0; }
#canvas {
margin-left: $*margins_size$*margins_unit;
margin-right: $*margins_size$*margins_unit;
}
@media $medium_media_query {
.two-columns-right #container { $container_background }
.two-columns-left #container { $container_background_redux }
.two-columns-right #container, .two-columns-left #container { $container_colors margin: 0 4%; }
}
/*--- Header ---*/
#header, #header a {
$header_colors
border-bottom: 2px solid $header_bottom_color;
padding: 0;
text-decoration: none;
}
@media $medium_media_query {
.two-columns-right #header { margin: 0 5px 0 0; }
.two-columns-left #header {
margin: 0 0 0 5px;
text-align: right;
}
}
#header #titles-wrap {
$header_background
}
#header h1 {
$journal_title_font
font-weight: lighter;
font-variant: normal;
letter-spacing: .2em;
margin: 0;
padding: 20px 20px 0 2em;
text-transform: lowercase;
}
#header h2 {
$journal_subtitle_font
padding: 0 20px 0 2.7em;
}
@media $medium_media_query {
.two-columns-right .module-section-one .inner { text-align: right; }
.two-columns-left .module-section-one .inner { text-align: left; }
}
#header .module-navlinks ul {
margin: 0;
padding: .5em 20px;
}
#header .module-navlinks li {
display: inline;
}
#header .module-navlinks li a {
$header_link_colors
padding: .5em 20px;
line-height: 2em;
text-decoration: none;
}
#header .module-navlinks li a:visited {
$header_link_visited_colors
}
#header .module-navlinks li a:hover,
#header .module-navlinks li .current {
$header_link_hover_colors
}
#header .module-navlinks li a:active {
$header_link_active_colors
}
@media $medium_media_query {
#header .module-navlinks li a {
line-height: 1em;
}
}
/*--- Wrap ---*/
#wrap { $page_text_colors }
#content {position: relative; width: 100%; padding-bottom: 20px; $content_colors}
@media $medium_media_query {
.two-columns-right #wrap {padding-right: $*sidebar_width; padding-top: 20px; padding-left: 20px;}
.two-columns-left #wrap {padding-left: $*sidebar_width; padding-top: 20px; padding-right: 20px;}
.two-columns-right #content {margin: 0 -5px 0 0; float: left;}
.two-columns-left #content {margin: 0 0 0 -5px; float: right;}
}
.tags-container,
.icons-container {
background-color: $*color_entry_background;
color: $*color_entry_text;
padding: 10px 10px 10px 30px;
}
.tags-container a,
.icons-container a {
color: $*color_entry_link;
}
.tags-container a:visited,
.icons-container a:visited {
color: $*color_entry_link_visited;
}
.tags-container a:hover,
.icons-container a:hover {
color: $*color_entry_link_hover;
}
.tags-container a:active,
.icons-container a:active {
color: $*color_entry_link_active;
}
.module-section-two { $module_colors position: relative; text-align: center; padding: 20px; }
.module-section-two .module { $module_box_background $module_box_colors margin: 0 20px; padding: 10px; text-align: left; }
@media $medium_media_query {
.multiple-columns .module-section-two { padding: 0; width: $*sidebar_width; }
.multiple-columns .module-section-two .module { margin: 20px; }
.two-columns-right .module-section-two {float: left; margin-right: -$*sidebar_width; /* <--- IMPORTANT */}
.two-columns-left .module-section-two {float: right; margin-left: -$*sidebar_width; /* <--- IMPORTANT */}
.two-columns-right .module-section-two .module {margin-left: 10px;}
.two-columns-left .module-section-two .module {margin-right: 10px;}
}
.module-section-two a { $module_link_colors }
.module-section-two .module-header a {text-decoration: none; }
.module-section-two h2 {margin: 0; margin-bottom: 7px; padding: 0.2em; $module_title_colors }
.module-section-two ul {list-style: none; margin-left: 0.5em; padding: 0; }
.module-section-two ul ul { margin-left: 0.5em; padding: 0.5em; }
.module-userprofile .userpic img {border: none; margin: 20px; }
.module-userprofile .userpic {text-align: center; }
.module-userprofile ul {margin: 0px; padding: 0px; text-align: center; margin-top: 5px; }
.module-userprofile p {margin-top: 0px; margin-bottom: 0px; }
.module-userprofile li {display: inline; padding: 5px; }
.module-calendar .module-content {text-align: center; }
.module-calendar table {margin-left: auto; margin-right: auto; }
.module h2 {
$module_title_font
}
.module-content {
$module_font
}
.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
}
@media $medium_media_query {
.two-columns-right #entries,
.two-columns-right.page-entry .entry-wrapper,
.two-columns-right.page-entry #comments,
.two-columns-right.page-archive .year,
.two-columns-right #archive-month {padding-right:22px; margin:-20px 5px -20px -20px; padding-left:5px; border-left: solid 1px $*color_page_border; $entry_background }
.two-columns-left #entries,
.two-columns-left.page-entry .entry-wrapper,
.two-columns-left.page-entry #comments,
.two-columns-left.page-archive .year,
.two-columns-left #archive-month {padding-left:22px; margin:-20px -20px -20px 5px; padding-right:5px; border-right: solid 1px $*color_page_border; $entry_background_redux }
.two-columns-right .tags-container,
.two-columns-right .icons-container { margin: 20px 5px -20px -20px; border-left: solid 1px $*color_page_border; $entry_background }
.two-columns-left .tags-container,
.two-columns-left .icons-container { margin: 20px -20px -20px 5px; border-right: solid 1px $*color_page_border; $entry_background_redux }
.two-columns-right.page-reply #content, .two-columns-right.page-reply #postform { $navigation_background }
.two-columns-right.page-reply #postform { background-position: right bottom; }
.two-columns-left.page-reply #content, .two-columns-left.page-reply #postform { $navigation_background_redux }
.two-columns-left.page-reply #postform { background-position: left bottom; }
.entry, .comment, .text_noentries_day, .page-reply .talkform {margin-left:2em;}
}
.page-entry .entry-wrapper {margin-top:0;}
.page-reply .entry { border-bottom: solid 2px $*color_page_border}
.entry, .comment, .text_noentries_day {padding: 10px; margin-top: 76px; position: relative; margin-bottom: 10px; border-top: solid 2px $*color_page_border; $entry_colors}
.page-entry .entry, .page-entry .comment, .page-entry .text_noentries_day {border:0px;}
.page-entry #comments {padding-top:20px;}
.entry-title, .comment-title {
$entry_title_colors
border: solid 1px $*color_entry_title_border;
margin: 0 0 .5em;
padding: .2em;
}
.entry .entry-title {
$entry_title_font
}
.comment-title {
$comment_title_font
}
.entry-wrapper-even .entry-title,
.comment-wrapper-even .comment-title {
$entry_title_colors
border: solid 1px $*color_entry_title_border_alt;
}
.no-subject .entry .entry-title,
.no-subject .comment .comment-title {
background: none;
border:none;
margin: 0;
padding: 0;
}
.comment-posted {
font-weight:bold;
}
.comment-wrapper {
min-width: 15em;
}
.comment .admin-poster {
white-space: nowrap;
}
.userpic a {background-color: $*color_page_border; border: 0px; }
.entry .userpic a, .comment .userpic a {background-color: $*color_entry_background; border: solid 2px $*color_page_border; display: block; position: absolute; padding: 5px; }
.entry .userpic a {
top: $entry_userpic_shift;
}
.comment .userpic a {
top: $comment_userpic_shift;
}
.entry .userpic img, .comment .userpic img {border: none; display:block;}
.no-userpic .comment {margin-top: 20px; }
.no-userpic .comment-title {
margin: 0;
}
.entry .time, .entry .date {padding: 0.2em; display: inline-block; }
.entry-content,
.comment-content {
padding: 10px 0;
}
/* 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 */
.page-recent .security-public.restrictions-none.journal-type-P.has-userpic.no-subject .entry-content,
.page-day .security-public.restrictions-none.journal-type-P.has-userpic.no-subject .entry-content {
padding-top: 20px;
}
p {margin-top: .5em; margin-bottom: 0.5em; }
blockquote {margin: 1em; padding: 1em; $blockquote_colors }
.tag {font-weight: bold; text-align: left; }
.tag a {font-weight: normal; }
.tag ul {display: inline; margin: 0; padding: 0; }
.tag li {display: inline; padding: 0px; }
*+html .tag li {padding: 0 5px; }
.entry .metadata.top-metadata { padding-top: 10px; }
.entry .metadata ul {list-style: none; margin: 0px; padding: 0px; }
.entry .footer .inner, .comment .footer .inner {text-align: right; }
.entry .footer a {white-space: nowrap; }
.entry-management-links, .entry-interaction-links, .comment-management-links, .comment-interaction-links {text-align: right; margin: 0; padding: 0; display: inline; }
.entry-management-links li, .entry-interaction-links li, .comment-management-links li, .comment-interaction-links li {display: inline; margin: 0; padding: 5px; }
.comment-management-links li.unscreen_comment a, .comment-management-links li.screen_comment a, .comment-management-links li.freeze_thread a { padding-left: 0; }""";
if ( $*use_action_links_images ) {
""".entry-management-links li a, .comment-management-links li a, .comment-interaction-links .thread a {background-repeat: no-repeat; background-position: 0% 50%; padding-left: 18px; }
.entry-management-links .edit_entry a, .comment-management-links .delete_comment a, .comment-management-links .edit_comment a {background-image: url($*STYLES_IMGDIR/skittlishdreams/${theme_base_color}_edit.png); }
.entry-management-links .edit_tags a, .comment-interaction-links .parent a {background-image: url($*STYLES_IMGDIR/skittlishdreams/${theme_base_color}_tag.png); }
.entry-management-links .mem_add a {background-image: url($*STYLES_IMGDIR/skittlishdreams/${theme_base_color}_add.png); }
.entry-management-links .watch_comments a, .comment-management-links .watch_thread a {background-image: url($*STYLES_IMGDIR/skittlishdreams/${theme_base_color}_track.png); }
.entry-management-links .link_prev a {background-image: url($*STYLES_IMGDIR/skittlishdreams/${theme_base_color}_arrow_left.png); }
.entry-management-links .link_next a {background-image: url($*STYLES_IMGDIR/skittlishdreams/${theme_base_color}_arrow_right.png); }
.entry-management-links .tell_friend a {background-image: url($*STYLES_IMGDIR/skittlishdreams/${theme_base_color}_tell.png);}
.entry-interaction-links .entry-readlink a, .entry-interaction-links .entry-permalink a { background-image: url($*STYLES_IMGDIR/skittlishdreams/${theme_base_color}_comments.png); }
.entry-interaction-links li a, .comment-interaction-links li a { background-image: url($*STYLES_IMGDIR/skittlishdreams/${theme_base_color}_comment.png); background-repeat: no-repeat; background-position: 0% 50%; padding-left: 18px; display: inline; }""";
}
"""
.entry .footer hr {display: none; }
.entry .metadata-label {font-weight: bold; }
.full .comment-poster {display: inline-block; min-width: 40%; }
#content > hr {display: none; }
/*--- Footer ---*/
#footer {
background: transparent;
padding: 0;
}
#footer .inner {
clear: both;
$footer_background
$footer_colors
padding: .5em 1em;
}
#footer .inner .inner {
background: none;
height: auto;
margin: 0;
padding: 0;
}
@media $medium_media_query {
#footer { margin: 0 4%; }
.two-columns-right #footer { $container_background }
.two-columns-left #footer { $container_background_redux }
.two-columns-right #footer .inner {
margin-right: 5px;
}
.two-columns-left #footer .inner {
margin-left: 5px;
}
}
#footer a {
$footer_link_colors
text-decoration: none;
}
#footer a:visited {
$footer_link_visited_colors
}
#footer a:hover {
$footer_link_hover_colors
}
#footer a:active {
$footer_link_active_colors
}
#footer .module {
padding-left: 20px;
}
#footer .page-top {
text-align: right;
}
.module-tags_cloud li, .tags_cloud li { display: inline; }
.hfeed .navigation, #archive-year .navigation, #archive-month .navigation, #archive-day .navigation {height:61px; margin-bottom:-20px; }
.page-tags .navigation,
.page-icons .navigation {
height: 61px;
}
@media $medium_media_query {
.two-columns-right .hfeed .navigation,
.two-columns-right #archive-year .navigation,
.two-columns-right #archive-month .navigation,
.two-columns-right #archive-day .navigation {margin-right:-22px; $navigation_background }
.two-columns-left .hfeed .navigation,
.two-columns-left #archive-year .navigation,
.two-columns-left #archive-month .navigation,
.two-columns-left #archive-day .navigation {margin-left:-22px; $navigation_background_redux}
.two-columns-right.page-tags .navigation,
.two-columns-right.page-icons .navigation {
margin: -20px 5px -20px -20px; border-left: solid 1px $*color_page_border; $navigation_background
}
.two-columns-left.page-tags .navigation,
.two-columns-left.page-icons .navigation {
margin: -20px -20px -20px 5px; border-right: solid 1px $*color_page_border; $navigation_background_redux
}
.two-columns-right .bottomcomment, .two-columns-right .comments-message { $navigation_background }
.two-columns-left .bottomcomment, .two-columns-left .comments-message { $navigation_background_redux }
#comments .bottomcomment, #comments .comments-message {min-height:6em;border-top:4px solid $*color_page_border;text-align:center; background-color: transparent;}
.two-columns-right .bottomcomment, .two-columns-right .comments-message {margin:20px -22px 20px 0;padding-right:30px;}
.two-columns-left .bottomcomment, .two-columns-left .comments-message {margin:20px 0 20px -22px;padding-left:30px;}
}
.navigation {margin: 0; padding: 0; text-align: center; $navigation_colors }
.navigation ul {margin: 0; padding: 5px 0 0 0; text-align: center; }
.navigation li {display: inline; padding: 0 5px; }
.navigation .page-back a:before {content: "<-- "; font-size: 0.5em; line-height:2em; letter-spacing: 0.08em; /*vertical-align: 50%; */ padding-right: 1px; }
.navigation .page-forward a:after {content: " -->"; font-size: 0.5em; line-height:2em; letter-spacing: 0.08em; /*vertical-align: 50%; */ padding-left: 1px; }
#archive-year .navigation, #archive-month .navigation {height:61px;text-align:center;}
.page-tags #content h2,
.page-icons #content h2 {
$entry_colors
border: solid 1px $*color_page_border;
font-size: 1.2em;
margin: 0;
margin-bottom: 20px;
padding: .2em;
}
@media $medium_media_query {
.two-columns-right #archive-year .navigation {margin:-20px 5px -20px -20px; border-left: solid 1px $*color_page_border;}
.two-columns-left #archive-year .navigation {margin:-20px -20px -20px 5px;border-right: solid 1px $*color_page_border;}
.two-columns-right #archive-month .navigation {margin:0 -22px 0 0;}
.two-columns-left #archive-month .navigation {margin:0 0 0 -22px;}
.two-columns-right.page-tags #content h2,
.two-columns-right.page-icons #content h2 {
margin-right: 10px;
}
.two-columns-left.page-tags #content h2,
.two-columns-left.page-icons #content h2 {
margin-left: 10px;
}
}
#archive-month dt {font-weight: bold; }
.month-wrapper, #archive-month dl {padding:10px;position:relative;background-color:$*color_entry_background;}
@media $medium_media_query {
.two-columns-right #archive-month .entry-title {display: inline-block; margin:0 0 .5em 0; padding-left: 5px; }
.two-columns-left #archive-month .entry-title {display: inline-block; margin:0 0 .5em 0; padding-right: 5px; }
.two-columns-right .month-wrapper, .two-columns-right #archive-month dl {margin: 20px 2em 20px 3em;}
.two-columns-left .month-wrapper, .two-columns-left #archive-month dl {margin: 20px 3em 20px 2em; }
}
.month-wrapper h3 {padding: 0.2em; margin: 0; border-top: solid 2px $*color_page_border; $entry_title_colors font-size: 1.2em; margin-bottom: 20px; }
.month caption {display: none; }
.month .day span, .month .day p {padding: 0; margin: 0; }
.month .day p {margin-top: 4px; margin-bottom: -4px; }
.month .day, .month th {line-height: 2em; vertical-align: text-top; padding: 5px; text-align: center; }
/* IE only to line up the empty days neatly */
*+html .month .day span, *+html .month th span{vertical-align: 100%; }
.month .day-has-entries {line-height: 1em; }
.month .footer {width: 250px; text-align: center; margin: 10px 0px; }
.text_noentries_day {margin-top: 20px; margin-bottom: 20px; }
#postform {margin-top: 20px; }
#commenttext {width: 95%; }
.metadata-label, .metadata-item, .datetime, .tag, .entry-management-links, .entry-interaction-links {margin-top:.5em; font-weight: lighter; font-variant: normal; text-transform: uppercase; $page_details_text_colors; letter-spacing: 0.08em; display: block; }
.metadata-label-groups, .tag-text {display:none; }
.metadata-item {color: $*color_entry_metadata_text; }
.journal-name,
.journal-website-name {text-align: center; font-size: 1.8em; color: $*color_module_link; line-height: 1.43em; margin-bottom:.3em; font-weight: lighter; font-variant: normal; letter-spacing: .16em; }
.journal-name { font-size: 1.8em; }
.journal-website-name { font-size: 1.6em; }
.partial .comment-title {
display: inline;
margin-right: .2em;
}
.partial .comment-poster:before {
content: "- ";
}
.partial .comment .datetime {
display: inline;
}
/*--- Icons Page ---*/
.sorting-options ul {
padding-left: 0;
text-align: center;
}
.sorting-options ul li {
display: inline;
}
.icons-container .icon {
margin: 1em 0;
}
.icon-image {
float: left;
clear: left;
margin-bottom: .25em;
min-width: 100px;
padding-right: 1em;
}
.icon-info {
min-height: 100px;
}
.icon-info span {
font-weight: bold;
}
.icon-info .default {
text-decoration: underline;
}
.icon-keywords ul {
display: inline;
margin: 0;
padding: 0;
}
.icon-keywords ul li {
display: inline;
padding: 0;
}
$entryicon_css
""";
}