[dw-free] Add "icon scaling" to customize options
[commit: http://hg.dwscoalition.org/dw-free/rev/02abc4b6f22f]
http://bugs.dwscoalition.org/show_bug.cgi?id=3495
Make adjustments for different icon sizes. Some refactoring.
Patch by
ninetydegrees.
Files modified:
http://bugs.dwscoalition.org/show_bug.cgi?id=3495
Make adjustments for different icon sizes. Some refactoring.
Patch by
![[personal profile]](https://www.dreamwidth.org/img/silk/identity/user.png)
Files modified:
- bin/upgrading/s2layers/colorside/layout.s2
- bin/upgrading/s2layers/compartmentalize/layout.s2
- bin/upgrading/s2layers/funkycircles/layout.s2
- bin/upgrading/s2layers/practicality/layout.s2
- bin/upgrading/s2layers/refriedtablet/layout.s2
- bin/upgrading/s2layers/refriedtablet/themes.s2
- bin/upgrading/s2layers/steppingstones/themes.s2
-------------------------------------------------------------------------------- diff -r 854cd299a2b5 -r 02abc4b6f22f bin/upgrading/s2layers/colorside/layout.s2 --- a/bin/upgrading/s2layers/colorside/layout.s2 Mon Apr 18 13:37:19 2011 +0800 +++ b/bin/upgrading/s2layers/colorside/layout.s2 Mon Apr 18 13:51:49 2011 +0800 @@ -48,26 +48,53 @@ function print_stylesheet() { var string footer_colors = generate_color_css( new Color, $*color_page_background, new Color ); + var string entry_padding = ""; + if ( $*entry_userpic_style == "" ) { $entry_padding = "110px"; } + elseif ( $*entry_userpic_style == "small" ) { $entry_padding = "85px"; } + elseif ( $*entry_userpic_style == "smaller" ) { $entry_padding = "60px"; } + + var string comment_padding = ""; + if ( $*comment_userpic_style == "" ) { $comment_padding = "110px"; } + elseif ( $*comment_userpic_style == "small" ) { $comment_padding = "85px"; } + elseif ( $*comment_userpic_style == "smaller" ) { $comment_padding = "60px"; } + var string userpic_css = ""; if ($*userpics_position == "left") { $userpic_css = """ .has-userpic .entry .entry-title, - .has-userpic .comment .comment-title, - .has-userpic .comment .comment-subjecticon, - .has-userpic .comment .datetime { margin: 0 0 0 110px; } .has-userpic .entry .access-filter, .has-userpic .entry .restrictions, .has-userpic .entry .datetime, - .has-userpic .entry .poster, + .has-userpic .entry .poster { + padding-left: $entry_padding; + } + + .has-userpic .comment .header, .has-userpic .comment .poster, - .has-userpic .comment .poster-ip { padding-left: 110px; } + .has-userpic .comment .poster-ip { + padding-left: $comment_padding; + } + .has-userpic .entry .contents .userpic, .has-userpic .comment .contents .userpic { left: 5px; } """; } elseif ($*userpics_position == "right") { $userpic_css = """ - .has-userpic .entry .entry-title { margin: 5px 110px 5px 5px; } + .has-userpic .entry .entry-title, + .has-userpic .entry .access-filter, + .has-userpic .entry .restrictions, + .has-userpic .entry .datetime, + .has-userpic .entry .poster { + padding-right: $entry_padding; + } + + .has-userpic .comment .header, + .has-userpic .comment .poster, + .has-userpic .comment .poster-ip { + padding-right: $comment_padding; + } + .has-userpic .entry .contents .userpic, .has-userpic .comment .contents .userpic { right: 5px; } """; @@ -199,7 +226,7 @@ ul.entry-interaction-links { text-align: padding: 1px 0 0 0;} .comment .header { $entry_header_colors - padding: 5px 110px 5px 5px; + padding: 5px; margin: 0 0 1em 0;} .comment .header a, .comment .header a:visited { $entry_title_link_colors } diff -r 854cd299a2b5 -r 02abc4b6f22f bin/upgrading/s2layers/compartmentalize/layout.s2 --- a/bin/upgrading/s2layers/compartmentalize/layout.s2 Mon Apr 18 13:37:19 2011 +0800 +++ b/bin/upgrading/s2layers/compartmentalize/layout.s2 Mon Apr 18 13:51:49 2011 +0800 @@ -48,6 +48,16 @@ function print_stylesheet () { var string header_colors = generate_color_css($*color_page_title, $*color_header_background, $*color_entry_border); var string entry_colors = generate_color_css($*color_entry_text, $*color_entry_background, $*color_entry_border); + var string entry_header_margin = ""; + if ( $*entry_userpic_style == "" ) { $entry_header_margin = "118px"; } + elseif ( $*entry_userpic_style == "small" ) { $entry_header_margin = "93px"; } + elseif ( $*entry_userpic_style == "smaller" ) { $entry_header_margin = "68px"; } + + var string comment_header_margin = ""; + if ( $*comment_userpic_style == "" ) { $comment_header_margin = "118px"; } + elseif ( $*comment_userpic_style == "small" ) { $comment_header_margin = "93px"; } + elseif ( $*comment_userpic_style == "smaller" ) { $comment_header_margin = "68px"; } + var string userpic_css = ""; if ($*userpics_position == "left") { $userpic_css = """ @@ -57,8 +67,13 @@ function print_stylesheet () { } .has-userpic div.entry div.header, .has-userpic div.comment div.header { - margin-left: 118px; text-align: right; + } + .has-userpic div.entry div.header { + margin-left: $entry_header_margin; + } + .has-userpic div.comment div.header { + margin-left: $comment_header_margin; } .has-userpic div.comment div.userpic { float: left; @@ -72,9 +87,11 @@ function print_stylesheet () { float: right; margin: -4em 0 1em 1em; } - .has-userpic div.entry div.header, + .has-userpic div.entry div.header { + margin-right: $entry_header_margin; + } .has-userpic div.comment div.header { - margin-right: 118px; + margin-right: $comment_header_margin; } .has-userpic div.comment div.userpic { float: right; diff -r 854cd299a2b5 -r 02abc4b6f22f bin/upgrading/s2layers/funkycircles/layout.s2 --- a/bin/upgrading/s2layers/funkycircles/layout.s2 Mon Apr 18 13:37:19 2011 +0800 +++ b/bin/upgrading/s2layers/funkycircles/layout.s2 Mon Apr 18 13:51:49 2011 +0800 @@ -159,20 +159,40 @@ function print_stylesheet () { 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, $*image_entry_list_background_position, new Color); + var string entry_spacing = ""; + if ( $*entry_userpic_style == "" ) { $entry_spacing = "65px"; } + elseif ( $*entry_userpic_style == "small" ) { $entry_spacing = "40px"; } + elseif ( $*entry_userpic_style == "smaller" ) { $entry_spacing = "15px"; } + + var string comment_spacing = ""; + if ( $*comment_userpic_style == "" ) { $comment_spacing = "65px"; } + elseif ( $*comment_userpic_style == "small" ) { $comment_spacing = "40px"; } + elseif ( $*comment_userpic_style == "smaller" ) { $comment_spacing = "15px"; } + var string userpic_css = ""; if ($*userpics_position == "left") { $userpic_css = """ .contents .userpic { - left: -2.5em; + left: -40px; } .entry .header, .comment .header { - padding-left: 95px; + margin-left: 2em; } - .has-userpic .poster { - margin-left: 80px; + .entry .header { + padding-left: $entry_spacing; + } + .comment .header { + padding-left: $comment_spacing; + } + + .has-userpic .entry .poster { + margin-left: $entry_spacing; + } + .has-userpic .comment .poster { + margin-left: $comment_spacing; } .two-columns-left #primary > .inner:first-child, @@ -192,21 +212,27 @@ function print_stylesheet () { } elseif ($*userpics_position == "right") { $userpic_css = """ - .entry .contents .userpic { - right: -1.1em; - } - - .comment .contents .userpic { - right: -2.5em; + .contents .userpic { + right: -40px; } .entry .header, .comment .header { - padding-right: 95px; + margin-right: 2em; } - .has-userpic .poster { - margin-right: 80px; + .entry .header { + padding-right: $entry_spacing; + } + .comment .header { + padding-right: $comment_spacing; + } + + .has-userpic .entry .poster { + margin-right: $entry_spacing; + } + .has-userpic .comment .poster { + margin-right: $comment_spacing; } .two-columns-left #primary > .inner:first-child, @@ -660,25 +686,18 @@ h2#pagetitle { } .contents .userpic { - height: 100px; position: absolute; text-align: center; - top: -.7em; - width: 100px; + top: -10px; } .no-userpic .userpic { display: none; } - .comment .contents .userpic { - top: -1.5em; - } - - .entry .contents .userpic img, - .comment .contents .userpic { + .contents .userpic img { background-color: $*color_entry_userpic_border; - padding: .7em; + padding: 10px; box-shadow: .067em .067em .2em $*color_shadow; -moz-box-shadow: .067em .067em .2em $*color_shadow; -webkit-box-shadow: .067em .067em .2em $*color_shadow; @@ -698,7 +717,7 @@ h2#pagetitle { } .has-userpic .comment .poster { - margin-bottom: 32px; + margin-bottom: 40px; } .entry .poster:before { @@ -722,7 +741,10 @@ h2#pagetitle { /* Must be after userpic_css */ .no-userpic .header { + margin-left: 0; + margin-right: 0; padding-left: 0; + padding-right: 0; } .poster.empty { diff -r 854cd299a2b5 -r 02abc4b6f22f bin/upgrading/s2layers/practicality/layout.s2 --- a/bin/upgrading/s2layers/practicality/layout.s2 Mon Apr 18 13:37:19 2011 +0800 +++ b/bin/upgrading/s2layers/practicality/layout.s2 Mon Apr 18 13:51:49 2011 +0800 @@ -126,6 +126,16 @@ function print_stylesheet () { var string page_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 entry_header_margin = ""; + if ( $*entry_userpic_style == "" ) { $entry_header_margin = "135px"; } + elseif ( $*entry_userpic_style == "small" ) { $entry_header_margin = "110px"; } + elseif ( $*entry_userpic_style == "smaller" ) { $entry_header_margin = "85px"; } + + var string comment_header_margin = ""; + if ( $*comment_userpic_style == "" ) { $comment_header_margin = "135px"; } + elseif ( $*comment_userpic_style == "small" ) { $comment_header_margin = "110px"; } + elseif ( $*comment_userpic_style == "smaller" ) { $comment_header_margin = "85px"; } + var string userpic_css = ""; if ($*userpics_position == "left") { $userpic_css = """ @@ -135,8 +145,13 @@ function print_stylesheet () { } .has-userpic div.entry .header, .has-userpic div.comment .header { - margin-left: 135px; text-align: right; + } + .has-userpic div.entry .header { + margin-left: $entry_header_margin; + } + .has-userpic div.comment .header { + margin-left: $comment_header_margin; } """; } @@ -146,9 +161,11 @@ function print_stylesheet () { .has-userpic div.comment div.userpic { float: right; } - .has-userpic div.entry .header, + .has-userpic div.entry .header { + margin-right: $entry_header_margin; + } .has-userpic div.comment .header { - margin-right: 135px; + margin-right: $comment_header_margin; } """; } diff -r 854cd299a2b5 -r 02abc4b6f22f bin/upgrading/s2layers/refriedtablet/layout.s2 --- a/bin/upgrading/s2layers/refriedtablet/layout.s2 Mon Apr 18 13:37:19 2011 +0800 +++ b/bin/upgrading/s2layers/refriedtablet/layout.s2 Mon Apr 18 13:51:49 2011 +0800 @@ -115,12 +115,17 @@ function print_stylesheet () { 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 entry_margin = ""; + if ( $*entry_userpic_style == "" ) { $entry_margin = "105px"; } + elseif ( $*entry_userpic_style == "small" ) { $entry_margin = "80px"; } + elseif ( $*entry_userpic_style == "smaller" ) { $entry_margin = "55px"; } + var string userpic_css = ""; if ($*userpics_position == "left") { $userpic_css = """ .has-userpic .entry .header, .has-userpic .entry .poster { - left: 105px; - margin-right: 105px; + left: $entry_margin; + margin-right: $entry_margin; } .entry .inner .userpic { float: left; @@ -133,8 +138,8 @@ function print_stylesheet () { elseif ($*userpics_position == "right") { $userpic_css = """ .has-userpic .entry .header, .has-userpic .entry .poster { - right: 105px; - margin-left: 105px; + right: $entry_margin; + margin-left: $entry_margin; } .entry .inner .userpic { float: right; diff -r 854cd299a2b5 -r 02abc4b6f22f bin/upgrading/s2layers/refriedtablet/themes.s2 --- a/bin/upgrading/s2layers/refriedtablet/themes.s2 Mon Apr 18 13:37:19 2011 +0800 +++ b/bin/upgrading/s2layers/refriedtablet/themes.s2 Mon Apr 18 13:51:49 2011 +0800 @@ -323,20 +323,26 @@ set color_module_title_background = "#fd set color_module_title_background = "#fdfdfd"; function Page::print_theme_stylesheet() { + + var string entry_margin = ""; + if ( $*entry_userpic_style == "" ) { $entry_margin = "120px"; } + elseif ( $*entry_userpic_style == "small" ) { $entry_margin = "100px"; } + elseif ( $*entry_userpic_style == "smaller" ) { $entry_margin = "70px"; } + var string userpic_css = ""; if ($*userpics_position == "left") { $userpic_css = """ .has-userpic .entry .header, .has-userpic .entry .poster { - left: 120px; - margin-right: 120px; + left: $entry_margin; + margin-right: $entry_margin; } """; } elseif ($*userpics_position == "right") { $userpic_css = """ .has-userpic .entry .header, .has-userpic .entry .poster { - right: 120px; - margin-left: 120px; + right: $entry_margin; + margin-left: $entry_margin; } """; } @@ -400,20 +406,25 @@ set color_module_title = "#e23a1f"; set color_module_title = "#e23a1f"; function Page::print_theme_stylesheet() { + var string entry_margin = ""; + if ( $*entry_userpic_style == "" ) { $entry_margin = "120px"; } + elseif ( $*entry_userpic_style == "small" ) { $entry_margin = "100px"; } + elseif ( $*entry_userpic_style == "smaller" ) { $entry_margin = "70px"; } + var string userpic_css = ""; if ($*userpics_position == "left") { $userpic_css = """ .has-userpic .entry .header, .has-userpic .entry .poster { - left: 120px; - margin-right: 120px; + left: $entry_margin; + margin-right: $entry_margin; } """; } elseif ($*userpics_position == "right") { $userpic_css = """ .has-userpic .entry .header, .has-userpic .entry .poster { - right: 120px; - margin-left: 120px; + right: $entry_margin; + margin-left: $entry_margin; } """; } @@ -671,20 +682,25 @@ set color_module_title = "#0a99aa"; set color_module_title = "#0a99aa"; function Page::print_theme_stylesheet() { + var string entry_margin = ""; + if ( $*entry_userpic_style == "" ) { $entry_margin = "120px"; } + elseif ( $*entry_userpic_style == "small" ) { $entry_margin = "100px"; } + elseif ( $*entry_userpic_style == "smaller" ) { $entry_margin = "70px"; } + var string userpic_css = ""; if ($*userpics_position == "left") { $userpic_css = """ .has-userpic .entry .header, .has-userpic .entry .poster { - left: 120px; - margin-right: 120px; + left: $entry_margin; + margin-right: $entry_margin; } """; } elseif ($*userpics_position == "right") { $userpic_css = """ .has-userpic .entry .header, .has-userpic .entry .poster { - right: 120px; - margin-left: 120px; + right: $entry_margin; + margin-left: $entry_margin; } """; } diff -r 854cd299a2b5 -r 02abc4b6f22f bin/upgrading/s2layers/steppingstones/themes.s2 --- a/bin/upgrading/s2layers/steppingstones/themes.s2 Mon Apr 18 13:37:19 2011 +0800 +++ b/bin/upgrading/s2layers/steppingstones/themes.s2 Mon Apr 18 13:51:49 2011 +0800 @@ -162,19 +162,25 @@ set color_module_title = "#fff"; set color_module_title = "#fff"; function Page::print_theme_stylesheet () { + + var string entry_margin = ""; + if ( $*entry_userpic_style == "" ) { $entry_margin = "110px"; } + elseif ( $*entry_userpic_style == "small" ) { $entry_margin = "85px"; } + elseif ( $*entry_userpic_style == "smaller" ) { $entry_margin = "60px"; } + var string userpic_css = ""; if ($*userpics_position == "left") { $userpic_css = """ .entry .header { padding-left: 0; } .entry .contents .userpic { left: -1em; } - .entry-poster, .entry-content, .entry .metadata { margin-left: 110px; } + .entry-poster, .entry-content, .entry .metadata { margin-left: $entry_margin; } """; } elseif ($*userpics_position == "right") { $userpic_css = """ .entry .header { padding-right: 0; } .entry .contents .userpic { right: -1em; } - .entry-poster, .entry-content, .entry .metadata { margin-right: 110px; } + .entry-poster, .entry-content, .entry .metadata { margin-right: $entry_margin; } """; } """ @@ -238,7 +244,6 @@ function Page::print_theme_stylesheet () height: 100%; padding-top: 2px; top: 0; - width: 110px; } .entry .contents .userpic a { --------------------------------------------------------------------------------