![[site community profile]](https://www.dreamwidth.org/img/comm_staff.png){kind=small}
[dw-free] Funky Circles: refactor
[commit: http://hg.dwscoalition.org/dw-free/rev/aa7e846f2689]
http://bugs.dwscoalition.org/show_bug.cgi?id=3284
Refactor, some cleanup, let custom entry list background position custom
setting show up in Customize, minor appearance tweaks.
Patch by![[personal profile]](https://www.dreamwidth.org/img/silk/identity/user.png)
ninetydegrees.
Files modified:
http://bugs.dwscoalition.org/show_bug.cgi?id=3284
Refactor, some cleanup, let custom entry list background position custom
setting show up in Customize, minor appearance tweaks.
Patch by
ninetydegrees.Files modified:
- bin/upgrading/s2layers/core2.s2
- bin/upgrading/s2layers/funkycircles/layout.s2
--------------------------------------------------------------------------------
diff -r 104a30538007 -r aa7e846f2689 bin/upgrading/s2layers/core2.s2
--- a/bin/upgrading/s2layers/core2.s2 Fri Dec 17 00:43:28 2010 +0800
+++ b/bin/upgrading/s2layers/core2.s2 Fri Dec 17 01:04:29 2010 +0800
@@ -4310,7 +4310,8 @@ function Page::print_linklist() {
# Prints the name of the account which posted the entry
function Entry::print_poster {
var Page p = get_page();
- print safe "<span class=\"poster entry-poster\">";
+ var string emptyclass = ((($p isa RecentPage and not $p isa FriendsPage) or $p isa MonthPage or $p isa DayPage) and $p.journal.journal_type != "C") ? "empty" : "";
+ print safe "<span class=\"poster entry-poster $emptyclass\">";
if ($p isa FriendsPage or $p isa EntryPage or $p isa ReplyPage) {
$this.poster->print();
if (not $this.poster->equals($this.journal)) {
diff -r 104a30538007 -r aa7e846f2689 bin/upgrading/s2layers/funkycircles/layout.s2
--- a/bin/upgrading/s2layers/funkycircles/layout.s2 Fri Dec 17 00:43:28 2010 +0800
+++ b/bin/upgrading/s2layers/funkycircles/layout.s2 Fri Dec 17 01:04:29 2010 +0800
@@ -1,38 +1,22 @@ layerinfo "type" = "layout";
-layerinfo "type" = "layout";
-layerinfo "name" = "Funky Circles";
+layerinfo type = "layout";
+layerinfo name = "Funky Circles";
layerinfo redist_uniq = "funkycircles/layout";
layerinfo author_name = "ninetydegrees";
layerinfo lang = "en";
+set layout_authors = [ { "name" => "ninetydegrees", "type" => "user" } ];
+
##===============================
-## Display settings - images
+## Presentation
##===============================
-propgroup images_child {
-
- property string[] image_entry_list_background_group {
- des = "Entry footer links background image";
- grouptype = "image";
- }
- set image_entry_list_background_group = [ "image_entry_list_background_url", "image_entry_list_background_repeat", "image_entry_list_background_position" ];
- property string image_entry_list_background_url {
- grouped = 1;
- }
- property string image_entry_list_background_repeat {
- values = "repeat|tile image|no-repeat|don't tile|repeat-x|tile horizontally|repeat-y|tile vertically";
- grouped = 1;
- }
- property string image_entry_list_background_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;
- }
- property string image_module_list { des = "Module list image"; }
- property string image_module_list_hover { des = "Module list hover image"; }
- property string image_module_list_active { des = "Module list active image"; }
-}
+set layout_type = "two-columns-right";
+set entry_management_links = "text";
+set comment_management_links = "text";
+set custom_colors_template = "%%new%% .entry .contents .userpic img {background-color: %%background%%;} %%new%% .entry-title a {color: %%foreground%%;}";
##===============================
-## Journal style - colors
+## Colors
##===============================
propgroup colors_child {
@@ -77,19 +61,8 @@ set color_shadow_alt = "#8c8c8c";
set color_shadow_alt = "#8c8c8c";
##===============================
-## Misc
+## Fonts
##===============================
-
-set layout_type = "two-columns-right";
-set text_posting_in = " in ";
-set entry_management_links = "text";
-set comment_management_links = "text";
-set custom_colors_template = "%%new%% .entry .contents .userpic img {background-color: %%background%%;} %%new%% .entry-title a {color: %%foreground%%;}";
-set layout_authors = [ { "name" => "ninetydegrees", "type" => "user" } ];
-
-#=================
-# Fonts
-#=================
set font_base = "Trebuchet MS, DejaVu Sans";
set font_fallback = "sans-serif";
@@ -106,6 +79,69 @@ set font_comment_title_units ="em";
set font_comment_title_units ="em";
set font_module_heading_size = "1.2";
set font_module_heading_units = "em";
+
+##===============================
+## Images
+##===============================
+
+propgroup images_child {
+
+ property string[] image_entry_list_background_group {
+ des = "Entry footer links background image";
+ grouptype = "image";
+ }
+ set image_entry_list_background_group = [ "image_entry_list_background_url", "image_entry_list_background_repeat", "image_entry_list_background_position" ];
+ property string image_entry_list_background_url {
+ grouped = 1;
+ }
+ property string image_entry_list_background_repeat {
+ values = "repeat|tile image|no-repeat|don't tile|repeat-x|tile horizontally|repeat-y|tile vertically";
+ grouped = 1;
+ }
+ property string image_entry_list_background_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 string image_module_list { des = "Module list image"; }
+ property string image_module_list_hover { des = "Module list hover image"; }
+ property string image_module_list_active { des = "Module list active image"; }
+}
+
+set image_entry_list_background_position = "100% 8px";
+
+
+##===============================
+## Text
+##===============================
+
+set text_posting_in = " in ";
+set text_comment_date = "on";
+set text_comment_from = "Posted by";
+
+##===============================
+## Functions
+##===============================
+
+function print_module_navlinks() {
+ var Page p = get_page();
+ open_module("navlinks", "", "");
+ var string[] links = [];
+
+ println """<ul class="module-list">""";
+ foreach var string k ($p.views_order) {
+ var string css = """$k""";
+ if ($p.view == $k) { $css = """current $k"""; }
+ println """<li class="module-list-item $css"><a href="$p.view_url{$k}" class="$css">"""+lang_viewname($k)+"""</a></li>""";
+ }
+ println "</ul>";
+
+ close_module();
+}
+
+##===============================
+## Stylesheet
+##===============================
function print_stylesheet () {
@@ -130,13 +166,12 @@ function print_stylesheet () {
var string entry_footer_link_colors = generate_color_css($*color_entry_footer_link, new Color, new Color);
var string entry_footer_link_hover_colors = generate_color_css($*color_entry_footer_link_hover, new Color, new Color);
var string entry_footer_link_visited_colors = generate_color_css($*color_entry_footer_link_visited, new Color, new Color);
- var string entry_list_background = generate_background_css ($*image_entry_list_background_url, $*image_entry_list_background_repeat, "", new Color);
+ var string entry_list_background = generate_background_css ($*image_entry_list_background_url, $*image_entry_list_background_repeat, $*image_entry_list_background_position, new Color);
var string userpic_css = "";
if ($*userpics_position == "left") {
$userpic_css = """
- .entry .contents .userpic,
- .comment .contents .userpic {
+ .contents .userpic {
left: -2.5em;
}
@@ -145,14 +180,7 @@ function print_stylesheet () {
padding-left: 95px;
}
- .page-recent .entry-wrapper.has-userpic.journal-type-C .entry .contents .poster,
- .page-read .entry-wrapper.has-userpic .entry .contents .poster,
- .page-network .entry-wrapper.has-userpic .entry .contents .poster,
- .page-entry .entry-wrapper.has-userpic .entry .contents .poster,
- .page-reply .entry-wrapper.has-userpic .entry .contents .poster,
- .page-day .entry-wrapper.has-userpic.journal-type-C .entry .contents .poster,
- .page-entry .comment-wrapper.has-userpic .comment .contents .poster,
- .page-reply .comment-wrapper.has-userpic .comment .contents .poster {
+ .has-userpic .poster {
margin-left: 80px;
}
@@ -167,7 +195,7 @@ function print_stylesheet () {
.two-columns-right #primary > .inner:first-child,
.three-columns-right #primary > .inner:first-child {
- padding: 1em 3.5em 1em 3.5em;
+ padding: 1em 3.5em 1em;
}
""";
}
@@ -186,20 +214,13 @@ function print_stylesheet () {
padding-right: 95px;
}
- .page-recent .entry-wrapper.has-userpic.journal-type-C .entry .contents .poster,
- .page-read .entry-wrapper.has-userpic .entry .contents .poster,
- .page-network .entry-wrapper.has-userpic .entry .contents .poster,
- .page-entry .entry-wrapper.has-userpic .entry .contents .poster,
- .page-reply .entry-wrapper.has-userpic .entry .contents .poster,
- .page-day .entry-wrapper.has-userpic.journal-type-C .entry .contents .poster,
- .page-entry .comment-wrapper.has-userpic .comment .contents .poster,
- .page-reply .comment-wrapper.has-userpic .comment .contents .poster {
+ .has-userpic .poster {
margin-right: 80px;
}
.two-columns-left #primary > .inner:first-child,
.three-columns-left #primary > .inner:first-child {
- padding: 1em 3.5em 1em 3.5em;
+ padding: 1em 3.5em 1em;
}
.three-columns-sides #primary > .inner:first-child {
@@ -400,11 +421,19 @@ h2#pagetitle {
}
.entry,
-.page-entry .comment,
-.page-reply .comment {
+.comment {
background-color: transparent;
border: none;
position: relative;
+ }
+
+.partial .comment {
+ padding: 0 .5em;
+ }
+
+.header,
+.page-tags h2 {
+ $entry_title_colors
}
.entry .header,
@@ -412,28 +441,15 @@ h2#pagetitle {
padding-bottom: .5em;
}
- .entry-wrapper.no-userpic .entry .header,
- .comment-wrapper.no-userpic .comment .header {
- padding-left: 0;
- }
-
-.header,
-.page-tags h2 {
- $entry_title_colors
- }
-
.header a { $page_link_colors }
.header a:visited { $page_link_visited_colors }
.header a:hover { $page_link_hover_colors }
.entry-title,
- .comment-title {
- text-transform: uppercase;
- }
-
+ .comment-title,
.page-tags h2,
- .page-archive h3 {
- $entry_title_font
+ .page-archive h3,
+ .page-month dd h3 {
text-transform: uppercase;
}
@@ -442,8 +458,9 @@ h2#pagetitle {
$entry_title_colors
}
- .page-month dd h3 {
- text-transform: uppercase;
+ .page-tags h2,
+ .page-archive h3 {
+ $entry_title_font
}
.page-day h3.day-date {
@@ -454,18 +471,15 @@ h2#pagetitle {
content: "on ";
}
- .entry .time:before,
- .comment .time:before {
+ .time:before {
content: "at ";
}
-.entry .contents,
-.month .contents,
-.comment .contents,
+.contents,
.comment-wrapper.partial,
.page-month .month .inner,
-.page-tags .tags-container ul,
-.page-tags .tags-container .tags_cloud {
+.tags-container ul,
+.tags-container .tags_cloud {
$entry_colors
border-width: 20px;
border-left: none;
@@ -477,52 +491,36 @@ h2#pagetitle {
-khtml-box-shadow: .667em .067em .667em $*color_shadow;
}
- .comment-wrapper.partial {
- margin-bottom: 4em;
- }
-
-.entry-wrapper.no-userpic .entry .contents,
-.comment-wrapper.no-userpic .comment .contents,
+.no-userpic .contents,
.month .contents,
.page-month .month .inner {
padding: 2em;
}
- .comment-wrapper.partial .comment {
- padding: 0 .5em;
+ .has-userpic .contents {
+ padding: 10px 2em 2em;
}
- .page-recent .entry-wrapper.has-userpic.journal-type-C .entry .contents,
- .page-read .entry-wrapper.has-userpic .entry .contents,
- .page-network .entry-wrapper.has-userpic .entry .contents,
- .page-entry .entry-wrapper.has-userpic .entry .contents,
- .page-reply .entry-wrapper.has-userpic .entry .contents,
- .page-day .entry-wrapper.has-userpic.journal-type-C .entry .contents,
- .page-entry .comment-wrapper.has-userpic .comment .contents,
- .page-reply .comment-wrapper.has-userpic .comment .contents {
- padding: 10px 2em 2em 2em;
- }
+ .page-recent .entry-wrapper.has-userpic.journal-type-P .entry .contents,
+ .page-day .entry-wrapper.has-userpic.journal-type-P .entry .contents {
+ padding: 55px 2em 2em;
+ }
- .page-recent .entry-wrapper.has-userpic.journal-type-P .entry .contents,
- .page-day .entry-wrapper.has-userpic.journal-type-P .entry .contents {
- padding: 55px 2em 2em 2em;
- }
-
- .page-tags .tags-container ul.ljtaglist {
+ .tags-container ul.ljtaglist {
margin: 0;
padding: 2em 2em 2em 5em;
}
- .page-tags .tags-container .tags_cloud {
+ .tags-container .tags_cloud {
margin: 0;
padding: 2em;
}
- .page-tags .tags-container .tags_multilevel li {
+ .tags-container .tags_multilevel li {
font-weight: bold;
}
- .page-tags .tags-container .tags_multilevel ul {
+ .tags-container .tags_multilevel ul {
background: none;
border: none;
list-style: disc;
@@ -534,76 +532,69 @@ h2#pagetitle {
-khtml--box-shadow: none;
}
- .page-tags .tags-container .tags_multilevel ul li {
+ .tags-container .tags_multilevel ul li {
color: $*color_entry_border;
font-weight: normal;
margin-top: 0;
}
- .page-tags .tags-container .tags_multilevel ul ul {
+ .tags-container .tags_multilevel ul ul {
list-style: circle;
}
- .page-tags .tags-container .tags_multilevel ul ul li {
+ .tags-container .tags_multilevel ul ul li {
color: $*color_entry_text;
}
-.entry .contents a,
-.comment .contents a,
-.comment-wrapper.partial .comment a,
-.month .contents a,
+.contents a,
+.partial .comment a,
.page-month .month a,
-.page-tags .tags-container a {
+.tags-container a {
$entry_link_colors
}
- .entry .contents a:visited,
- .comment .contents a:visited {
+ .contents a:visited {
$entry_link_visited_colors
text-decoration: none;
}
- .entry .contents a:hover,
- .comment .contents a:hover,
- .comment-wrapper.partial .comment a:hover,
- .month .contents a:hover,
+ .contents a:hover,
+ .partial .comment a:hover,
.page-month .month a:hover,
- .page-tags .tags-container a:hover {
+ .tags-container a:hover {
$entry_link_hover_colors
text-decoration: none;
}
- .entry .contents .entry-content a,
- .comment .contents .comment-content a {
+ .entry-content a,
+ .comment-content a {
text-decoration: underline;
}
- .entry .contents .entry-content a:hover,
- .comment .contents .comment-content a:hover,
- .entry .contents .entry-content a:visited,
- .comment .contents .comment-content a:visited {
+ .entry-content a:hover,
+ .comment-content a:hover,
+ .entry-content a:visited,
+ .comment-content a:visited {
text-decoration: none;
}
- .comment-wrapper.partial .comment .comment-title {
+ .partial .comment-title {
display: inline;
padding-bottom: .5em;
}
- .comment-wrapper.partial .comment .comment-title a {
+ .partial .comment-title a,
+ .partial .comment-title a:hover {
$entry_colors
border: none;
}
- .comment-wrapper.partial .comment .comment-title a:hover {
- $entry_colors
+ .partial .comment-title a:hover {
background-color: transparent;
- border: none;
text-decoration: underline;
}
-.entry .contents .userpic,
-.comment .contents .userpic {
+.contents .userpic {
height: 100px;
position: absolute;
text-align: center;
@@ -611,8 +602,7 @@ h2#pagetitle {
width: 100px;
}
- .entry-wrapper.no-userpic .entry .contents .userpic,
- .comment-wrapper.no-userpic .comment .contents .userpic {
+ .no-userpic .userpic {
display: none;
}
@@ -631,48 +621,26 @@ h2#pagetitle {
}
-.page-recent .journal-type-C .entry .contents .poster,
-.page-read .entry .contents .poster,
-.page-network .entry .contents .poster,
-.page-entry .entry .contents .poster,
-.page-entry .comment .contents .poster,
-.page-reply .entry .contents .poster,
-.page-reply .comment .contents .poster,
-.page-day .journal-type-C .entry .contents .poster {
+.contents .poster {
border-bottom: 1px dashed $*color_entry_poster_border;
display: block;
font-weight: bold;
padding-bottom: .5em;
}
- .page-recent .entry-wrapper.has-userpic.journal-type-C .entry .contents .poster,
- .page-read .entry-wrapper.has-userpic .entry .contents .poster,
- .page-network .entry-wrapper.has-userpic .entry .contents .poster,
- .page-entry .entry-wrapper.has-userpic .entry .contents .poster,
- .page-reply .entry-wrapper.has-userpic .entry .contents .poster,
- .page-day .entry-wrapper.has-userpic.journal-type-C .entry .contents .poster,
- .page-entry .comment-wrapper.has-userpic .comment .contents .poster,
- .page-reply .comment-wrapper.has-userpic .comment .contents .poster {
+ .has-userpic .poster {
margin-bottom: 20px;
}
- .page-entry .comment-wrapper.has-userpic .comment .contents .poster,
- .page-reply .comment-wrapper.has-userpic .comment .contents .poster {
+ .has-userpic .comment .poster {
margin-bottom: 32px;
}
- .page-recent .journal-type-C .entry .contents .poster:before,
- .page-read .entry .contents .poster:before,
- .page-network .entry .contents .poster:before,
- .page-entry .entry .contents .poster:before,
- .page-reply .entry .contents .poster:before,
- .page-reply .comment .contents .poster:before,
- .page-day .journal-type-C .entry .contents .poster:before {
+ .entry .poster:before {
content: 'Posted by ';
}
- .entry-wrapper.no-userpic .entry .contents .poster,
- .comment-wrapper.no-userpic .comment .contents .poster {
+ .no-userpic .poster {
margin-left: 0;
}
@@ -681,13 +649,25 @@ h2#pagetitle {
}
.poster-ip:before {
- content: "- ";
+ content: "- ";
+ }
+
+$userpic_css
+
+/* Must be after userpic_css */
+
+.no-userpic .header {
+ padding-left: 0;
+ }
+
+.poster.empty {
+ display: none;
}
#archive-year table * {
- border: none;
- text-align: center;
- vertical-align: top;
+ border: none;
+ text-align: center;
+ vertical-align: top;
}
#archive-year table caption {
@@ -703,16 +683,16 @@ h2#pagetitle {
}
#archive-year td {
- width: 14.285%;
+ width: 14.285%;
}
#archive-year table td.day-has-entries {
- font-weight: bold;
+ font-weight: bold;
}
#archive-year table td.day-has-entries p {
- $entry_link_hover_colors
- padding: .2em;
+ $entry_link_hover_colors
+ padding: .2em;
}
#archive-year table td.day-has-entries a {
@@ -729,27 +709,24 @@ h2#pagetitle {
$page_title_colors
}
-.entry .contents .entry-content {
+.entry-content {
text-align: justify;
- }
+ }
-.entry .contents .metadata ul li {
+.entry .metadata ul li {
list-style: url() inside disc;
}
- .entry .contents .metadata .metadata-label {
+ .entry .metadata .metadata-label {
font-style: italic;
}
-.entry .contents .metadata.top-metadata ul {
+.entry .metadata.top-metadata ul {
margin: 0;
}
-.entry .footer,
-.month .footer,
-.page-entry .comment .footer,
-.page-reply .comment .footer,
-.page-tags .tags-container .manage-tags-link,
+.footer,
+.tags-container .manage-tags-link,
.bottomcomment, .comments-message {
$entry_footer_colors
padding: 0 .5em;
@@ -760,43 +737,34 @@ h2#pagetitle {
-khtml-box-shadow: .067em .067em .667em $*color_shadow;
}
- .page-tags .tags-container .manage-tags-link {
+ .tags-container .manage-tags-link {
margin-top: 1em;
padding: .5em;
}
- .entry .footer a,
- .month .footer a,
- .page-entry .comment .footer a,
- .page-reply .comment .footer a,
- .page-tags .tags-container .manage-tags-link a,
+ .footer a,
+ .tags-container .manage-tags-link a,
.bottomcomment a {
$entry_footer_link_colors
}
- .entry .footer a:visited,
- .month .footer a:visited,
- .page-entry .comment .footer a:visited,
- .page-tags .tags-container .manage-tags-link a:visited,
+ .footer a:visited,
+ .tags-container .manage-tags-link a:visited,
.bottomcomment a:visited {
$entry_footer_link_visited_colors
}
- .entry .footer a:hover,
- .month .footer a:hover,
- .page-entry .comment .footer a:hover,
- .page-reply .comment .footer a:hover,
- .page-tags .tags-container .manage-tags-link a:hover,
+ .footer a:hover,
+ .tags-container .manage-tags-link a:hover,
.bottomcomment a:hover {
$entry_footer_link_hover_colors
background-color: transparent;
text-decoration: underline;
}
- .page-entry .comment .footer,
- .page-reply .comment .footer {
+ .comment .footer {
padding: 0 .5em;
- text-align: left;
+ text-align: left;
}
.month .footer .inner {
@@ -818,7 +786,7 @@ h2#pagetitle {
.entry .tag {
border-bottom: 1px dashed $*color_entry_footer_border;
padding: .5em 0;
- text-align: left;
+ text-align: left;
}
.page-month .tag {
@@ -826,7 +794,7 @@ h2#pagetitle {
}
.page-month .tag-text {
- font-weight: bold;
+ font-weight: bold;
}
.entry ul.entry-management-links,
@@ -862,7 +830,6 @@ h2#pagetitle {
.bottomcomment ul.entry-management-links li,
.bottomcomment ul.entry-interaction-links li {
$entry_list_background
- background-position: 100% 8px;
padding-right: 14px;
}
@@ -875,6 +842,14 @@ h2#pagetitle {
}
.entry ul.entry-interaction-links {
+ padding-left: .35em;
+ }
+
+.bottomcomment ul li {
+ padding-left: 0;
+ }
+
+.bottomcomment ul.entry-interaction-links li:first-child {
padding-left: .35em;
}
@@ -893,7 +868,7 @@ h2#pagetitle {
display: inline;
padding-top: 0;
text-align: left;
- }
+ }
#qrformdiv table {
border: none !important; /* Needed */
@@ -912,7 +887,7 @@ h2#pagetitle {
$page_link_visited_colors
}
-.page-reply #postform {
+#postform {
$entry_footer_colors
padding: .5em;
box-shadow: .067em .067em .667em $*color_shadow;
@@ -921,9 +896,17 @@ h2#pagetitle {
-khtml-box-shadow: .067em .067em .667em $*color_shadow;
}
- .page-reply #postform a {
+ #postform a {
$entry_footer_link_colors
}
+
+ #postform a:visited {
+ $entry_footer_link_visited_colors
+ }
+
+ #postform a:hover {
+ $entry_footer_link_hover_colors
+ }
/* Sidebars
***************************************************************************/
@@ -945,7 +928,7 @@ h2#pagetitle {
}
.one-column #tertiary .module{
- margin-bottom: .5em;
+ margin-bottom: .5em;
}
/* Modules
@@ -1143,24 +1126,5 @@ h2#pagetitle {
border-top: 1px solid $*color_footer_link_hover;
text-decoration: none;
}
-
-$userpic_css
""";
}
-
-function print_module_navlinks() {
- var Page p = get_page();
- open_module("navlinks", "", "");
- var string[] links = [];
-
- println """<ul class="module-list">""";
- foreach var string k ($p.views_order) {
- var string css = """$k""";
- if ($p.view == $k) { $css = """current $k"""; }
- println """<li class="module-list-item $css"><a href="$p.view_url{$k}" class="$css">"""+lang_viewname($k)+"""</a></li>""";
- }
- println "</ul>";
-
- close_module();
-}
-
--------------------------------------------------------------------------------