fu: Close-up of Fu, bringing a scoop of water to her mouth (Default)
fu ([personal profile] fu) wrote in [site community profile] changelog2012-02-14 05:41 pm

[dw-free] Cleanup tables on site-styled /icons

[commit: http://hg.dwscoalition.org/dw-free/rev/f24d2e4438a9]

http://bugs.dwscoalition.org/show_bug.cgi?id=4312

Use CSS instead of tables to align and space out /icons.

Patch by [personal profile] momijizukamori.

Files modified:
  • bin/upgrading/s2layers/siteviews/layout.s2
  • htdocs/stc/allpics.css
--------------------------------------------------------------------------------
diff -r f18a58c7d31f -r f24d2e4438a9 bin/upgrading/s2layers/siteviews/layout.s2
--- a/bin/upgrading/s2layers/siteviews/layout.s2	Tue Feb 14 22:15:12 2012 +0800
+++ b/bin/upgrading/s2layers/siteviews/layout.s2	Wed Feb 15 01:40:32 2012 +0800
@@ -83,10 +83,12 @@
 set text_icons_inactive = "[Inactive]";
 
 function IconsPage::print_title() {
+    # Do not actually *print* anything here, or in overridden instances, just call set_content with windowtitle or title as appropriate. 
     $*SITEVIEWS->set_content("title",$this->view_title());
 }
 
 function IconsPage::print_default_stylesheet() {
+    # Do not actually *print* any stylesheets here, but you can $*SITEVIEWS->need_res(...); here to pull in anything.
     $*SITEVIEWS->need_res( "stc/allpics.css" );
 }
 
@@ -120,68 +122,33 @@
             }
             if ( (++$sort_ct) < size $.sort_keyseq) { print $*text_default_separator; }
         }
-        """</p><table class='allpics'>""";
-        foreach var Icon i ($.icons) {
+        
+        """<div class="icon-container">"""; 
+                foreach var Icon i ($.icons) {
             $piccount++;
 
             if ($piccount % 2 == 1) {
-                """<tr>""";
+                """<div class="icon-row">""";
             }
 
             $i->print();
 
             if ($piccount % 2 == 1) {
-                """<td class='blank'></td>""";
+                
             } else {
-                """</tr>\n""";
+                """</div>""";
             }
         }
         if ($piccount) {
             if ($piccount % 2 == 1) {
             }
-            """</table>""";
+            
         } else {
         }
+        """</div>""";
 
         $.pages->print({ "anchor" => "" });
+        """<div class="clear-floats"></div>""";
     }
 }
 
-function Icon::print() {
-    """<td class='pic'>""";
-    
-    """<a href="$.link_url">"""; $.image->print(); """</a>""";
-
-    """</td><td class='desc'>""";
-
-    if ( $.default ) {
-        print safe """<u>$*text_icons_default</u><br/>""";
-    }
-
-    if ( not $.active ) {
-        print safe """<em>$*text_icons_inactive</em><br/>""";
-    }
-
-    if ( size $.keywords ) {
-        var int count = 0;
-        print safe """<strong>$*text_icons_keywords</strong> """;
-        foreach var string kw ( $.keywords ) {
-            $count++;
-            print safe $kw;
-            if ( $count < size $.keywords ) {
-                print safe $*text_icons_keyword_sep;
-            }
-        }
-        """<br/>""";
-    }
-
-    if ( $.comment ) {
-        print safe """<strong>$*text_icons_comment</strong> $.comment<br/>""";
-    }
-
-    if ( $.description ) {
-        print safe """<strong>$*text_icons_description</strong> $.description<br/>""";
-    }
-
-    """</td>""";
-}
diff -r f18a58c7d31f -r f24d2e4438a9 htdocs/stc/allpics.css
--- a/htdocs/stc/allpics.css	Tue Feb 14 22:15:12 2012 +0800
+++ b/htdocs/stc/allpics.css	Wed Feb 15 01:40:32 2012 +0800
@@ -1,18 +1,59 @@
 /* allpics styling */
 
-table.allpics {
+#content {
+    overflow: visible !important;
+    }
+
+.icon-container {
     margin-left: 50px;
+    min-width: 350px;
+    z-index:10;
 }
 
-.allpics td {
+.icon-image {
+    float: left;
+    width: 100px;
+    height: 100px;
+    line-height: 100px;
+    text-align: center;
+    padding: 0.2em 0.5em;
+    }
+
+.icon-image img {
+    
+    }
+
+.icon-info {
+    padding: 0.2em 0.5em;
+    overflow:auto;
     vertical-align: bottom;
-}
+    word-wrap: break-word;
+    display: table-cell;
+    width:100%;
+    }
 
-.allpics .userpic-img {
-    margin-right: 1em;
-    margin-top: 15px;
-}
+.icon {
+    width:50%;
+    float: left;
+    vertical-align: bottom;
+    min-width: 350px;
+    display:table;
+    }
 
-.allpics blank {
-    width: 50px;
-}
+.label, .comment-text, .description-text {
+    font-weight: bold;
+    }
+
+.default {
+    text-decoration: underline;
+    font-weight:normal;
+    }
+
+.keywords li, .keywords ul {
+    display:inline;
+    margin: 0;
+    }
+
+.icon-row {
+    clear:both;
+    }
--------------------------------------------------------------------------------

Post a comment in response:

This account has disabled anonymous posting.
If you don't have an account you can create one now.
No Subject Icon Selected
More info about formatting

If you are unable to use this captcha for any reason, please contact us by email at support@dreamwidth.org