Changeset 102

Show
Ignore:
Timestamp:
04/19/07 01:03:45 (3 years ago)
Author:
eevee
Message:

Styled forums, mostly. Hooray!

Location:
veekun/branches/layout
Files:
1 added
4 modified

Legend:

Unmodified
Added
Removed

  • veekun/branches/layout/lib/Vee/View/TT.pm

    r68 r102  
    3333        post_width => \&Vee::Utils::post_width, 
    3434        postrank => sub { Vee::Utils::postrank(shift, Vee->site_opts->{post_ranks}) }, 
    35         postbar_color => sub { Vee::Utils::hsv2rgb(shift, 192, 192) }, 
     35        postbar_color => sub { Vee::Utils::hsv2rgb(shift, 84, 192) }, 
    3636 
    3737            # forum stuff... 

  • veekun/branches/layout/templates/forum/common.tt

    r36 r102  
    1919[%     END %] 
    2020[%             IF postct_barsize > 100; postct_barsize = 97.5; END %] 
    21 [%             postct_hue = posts * 0.36 %] 
    22 <div class="postctbox"><div class="postctbar" style="width: [% round(postct_barsize, 1) %]%; background-color: #[% postbar_color(postct_hue) %];"></div></div> 
     21[%             postct_hue = posts * 0.32 # not quite 360! %] 
     22<div class="postbar-container"><div class="postbar-bar" style="width: [% round(postct_barsize, 1) %]%; background-color: #[% postbar_color(postct_hue) %];"></div></div> 
    2323[% END %] 
    2424 
    … …  
    7272<!-- blocks for printing out a sequence of posts --> 
    7373 
    74 [% BLOCK posts_start %][% END %] 
     74[% BLOCK posts_start %] 
     75[%     c.stash.posts_color = 1 %] 
     76[% END %] 
    7577 
    7678[% BLOCK posts_each %][%# post, thread, forum, show_deleted %] 
    7779[%     is_deleted = post.flags.match('deleted') %] 
    78 <div class="forum-post[% ' forum-post-deleted' IF is_deleted %]"> 
     80<div class="forum-post color[% c.stash.posts_color %][% ' deleted' IF is_deleted %]"> 
    7981[%     IF is_deleted AND !show_deleted %] 
    8082 <p> 
    … …  
    8991[%     END %] 
    9092[%     INCLUDE post_buttons post=post thread=thread forum=forum %] 
    91     <div class="forum-post-sidebar"><div class="forum-post-content"> 
     93    <div class="sidebar-wrapper"><div class="sidebar"> 
    9294[%     groups = post.user.groups.split(' '); primary_group = groups.shift %] 
    93         <div class="forum-post-username"><a href="/user/[% post.userid %]"><img src="/images/groups/[% UserGroups.$primary_group.icon %]" alt="[% UserGroups.$primary_group.name %]" title="[% UserGroups.$primary_group.name %]"/> [% post.user.name %]</a></div> 
    94         <div class="forum-post-title[% IF post.user.customtitle -%] forum-post-custom">[% post.user.customtitle %][% ELSE %]">[% UserGroups.$primary_group.name %][% END %]</div> 
    95         <div class="forum-post-avatar"[% IF post.user.avatar %] style="background-image: url(/images/avatars/[% post.user.avatar %]);">[% ELSE %]>No avatar[% END %]</div> 
    96         <span style="float: right;">[% postrank(post.user.postct) %]</span> Posts: [% post.user.postct %] [% INCLUDE postbar posts=post.user.postct %] 
     95        <div class="username"><a href="/user/[% post.userid %]"><img src="/images/groups/[% UserGroups.$primary_group.icon %]" alt="[% UserGroups.$primary_group.name %]" title="[% UserGroups.$primary_group.name %]"/> [% post.user.name %]</a></div> 
     96        <div class="title[% IF post.user.customtitle -%] custom">[% post.user.customtitle %][% ELSE %]">[% UserGroups.$primary_group.name %][% END %]</div> 
     97        <div class="avatar">[% IF post.user.avatar %]<img src="/images/avatars/[% post.user.avatar %]" alt="">[% ELSE %]No avatar[% END %]</div> 
     98        <div class="postbar"> 
     99            <span class="postrank">[% postrank(post.user.postct) %]</span> 
     100            <span class="postcount">Posts: [% post.user.postct %]</span> 
     101            [% INCLUDE postbar posts=post.user.postct %] 
     102        </div> 
    97103    </div></div> 
    98     <div class="forum-post-header"><div class="forum-post-content"> 
     104    <div class="topbar"> 
     105        <a[% IF post.id %] href="/forum/post/[% post.id %]"[% END %] name="p[% post.id %]">[% post.time | date %]</a> 
     106    </div> 
     107    <div class="content"> 
     108[%     IF post.newspic %] 
     109        <img src="/images/news/[% post.user.newspic %]" alt="[% post.name %]'s newspic" class="forum-post-newspic"/> 
     110[%     END %] 
    99111[%     IF post.lastedit %] 
    100         <div class="forum-post-edits">Post last <a href="/forum/post/[% post.id %]/edits">edited</a> on [% post.lastedit.time | date %] by <a href="/user/[% post.editor %]">[% post.lastedit.user.name %]</a></div> 
    101 [%     END %] 
    102         <a[% IF post.id %] href="/forum/post/[% post.id %]"[% END %] name="p[% post.id %]">[% post.time | date %]</a> 
    103     </div></div> 
    104 [%     IF post.newspic %] 
    105     <img src="/images/news/[% post.user.newspic %]" alt="[% post.name %]'s newspic" class="forum-post-newspic"/> 
    106 [%     END %] 
    107     <div class="forum-post-main"><div class="forum-post-content"> 
    108 [%+    post.message | bbcode | indent(8) %] 
     112        <div class="edits">Post last <a href="/forum/post/[% post.id %]/edits">edited</a> on [% post.lastedit.time | date %] by <a href="/user/[% post.editor %]">[% post.lastedit.user.name %]</a></div> 
     113[%     END %] 
     114        <div class="message"> 
     115[%+    post.message | bbcode | indent(12) %] 
     116        </div> 
    109117[%     IF post.user.signature %] 
    110         <div class="forum-post-sig">[% post.user.signature | bbcode %]</div> 
    111 [%     END %] 
    112     </div></div> 
    113 </div> 
     118        <div class="sig">[% post.user.signature | bbcode %]</div> 
     119[%     END %] 
     120    </div> 
     121</div> 
     122[%     c.stash.posts_color = 3 - c.stash.posts_color %] 
    114123[%+ END %] 
    115124 
    … …  
    119128 
    120129[% BLOCK threads_start %] 
     130[%     c.stash.threads_color = 1 %] 
    121131<table class="forums" cellspacing="0"> 
    122 <tr><th class="forum-icon"></th><th class="forum-name left">Thread</th><th class="forum-postinfo">First Post</th><th class="forum-count">Replies</th><th class="forum-count">Views</th><th class="forum-postinfo">Last Post</th></tr> 
     132<tr><th class="icon"></th><th class="name">Thread</th><th class="postinfo">First Post</th><th class="count">Replies</th><th class="count">Views</th><th class="postinfo">Last Post</th></tr> 
    123133[% END %] 
    124134 
    125135[% BLOCK threads_each %][%# thread, ?show_forum -%] 
    126 <tr[% IF thread.flags.match('deleted') %] class="forum-thread-deleted"[% END %]><td class="forum-icon">[%# space reserved for some sort of thread icons %]</td><td class="forum-name"> 
     136<tr class="color[% c.stash.threads_color %][% IF thread.flags.match('deleted') %] deleted[% END %]"><td class="icon"><!-- space reserved for some sort of thread icons --></td><td class="name"> 
    127137<!--<a href="/forum/thread/[% thread.id %]/nuke" style="float: right;"><img src="/images/icons/nuke.png" alt="Nuke" title="Nuke"/></a> 
    128138    <a href="/forum/thread/[% thread.id %]/del" style="float: right;"><img src="/images/icons/delete.png" alt="Delete" title="Delete"/></a> 
    129139    <a href="/forum/thread/[% thread.id %]/edit" style="float: right;"><img src="/images/icons/edit.png" alt="Edit" title="Edit"/></a>--> 
    130 <a href="/forum/thread/[% thread.id %]" class="forum-link"> 
    131  <div class="forum-title"> 
     140<a href="/forum/thread/[% thread.id %]"> 
     141 <div class="name"> 
    132142[%     FOREACH flag IN ThreadFlagArray %] 
    133143[%         NEXT UNLESS thread.flags.match(flag.name) %] 
    134   <img src="/images/icons/[% flag.name %].png" alt="[% flag.name %]" title="[% flag.name %]: [% flag.blurb %]" class="forum-icon"/> 
     144  <img src="/images/icons/[% flag.name %].png" alt="[% flag.name %]" title="[% flag.name %]: [% flag.blurb %]" class="flag"/> 
    135145[%     END %] 
    136146[%     thread.subject %] 
    137147 </div> 
    138148[%     IF thread.blurb %] 
    139  <div class="forum-info">[% thread.blurb %]</div> 
     149 <div class="blurb">[% thread.blurb %]</div> 
    140150[%     END %] 
    141151</a> <!-- [ <a>2</a>, <a>3</a>, <a>4</a>, ... <a>9</a>, <a>10</a> ] --> 
    142152[%     IF show_forum %] 
    143 <div class="forum-info">in forum "<a href="/forum/[% thread.forumid %]">[% thread.forum.name %]</a>"</div> 
     153<div class="inforum">in forum "<a href="/forum/[% thread.forumid %]">[% thread.forum.name %]</a>"</div> 
    144154[%     END %] 
    145155</td> 
    146 <td class="forum-postinfo"><a href="/user/[% thread.firstpost.userid %]">[% thread.firstpost.user.name %]</a> <br/> <a href="/forum/post/[% thread.firstpost.id %]">[% thread.firstpost.time | date %]</a></td> 
    147 <td class="forum-count">[% thread.postct - 1 %]</td><td class="forum-count">[% thread.hitct %]</td> 
    148 <td class="forum-postinfo"> 
     156<td class="postinfo"><a href="/user/[% thread.firstpost.userid %]">[% thread.firstpost.user.name %]</a> <a href="/forum/post/[% thread.firstpost.id %]">[% thread.firstpost.time | date %]</a></td> 
     157<td class="count">[% thread.postct - 1 %]</td><td class="count">[% thread.hitct %]</td> 
     158<td class="postinfo"> 
    149159[%     IF thread.postct <= 1 -%] 
    150160- 
    151161[%     ELSE %] 
    152 <a href="/user/[% thread.lastpost.userid %]">[% thread.lastpost.user.name %]</a> <br/> <a href="/forum/post/[% thread.lastpost.id %]">[% thread.lastpost.time | date %]</a> 
     162<a href="/user/[% thread.lastpost.userid %]">[% thread.lastpost.user.name %]</a> <a href="/forum/post/[% thread.lastpost.id %]">[% thread.lastpost.time | date %]</a> 
    153163[%     END -%] 
    154164</td></tr> 
     165[%     c.stash.threads_color = 3 - c.stash.threads_color %] 
    155166[% END -%] 
    156167 
    … …  
    165176<!-- blocks for printing out a table of forums --> 
    166177 
    167 [%- BLOCK forums_start -%] 
     178[% BLOCK forums_start %] 
     179[%     c.stash.forums_color = 1 %] 
    168180<table class="forums" cellspacing="0"> 
    169 <tr><th class="forum-icon"></th><th class="forum-name left">Forum</th><th class="forum-count">Threads</th><th class="forum-count">Posts</th><th class="forum-postinfo">Last Post</th></tr> 
     181<tr><th class="icon"></th><th class="name">Forum</th><th class="count">Threads</th><th class="count">Posts</th><th class="postinfo">Last Post</th></tr> 
    170182[% END %] 
    171183 
    172184[% BLOCK forums_header %][%# title, blurb -%] 
    173 <tr><th colspan="5" class="forum-header">[% title %][% IF blurb %]<div class="forum-info">[% blurb %]</div>[% END %]</th></tr> 
     185<tr><th colspan="5" class="heading">[% title %][% IF blurb %]<div class="blurb">[% blurb %]</div>[% END %]</th></tr> 
    174186[% END %] 
    175187 
    176188[% BLOCK forums_each %][%# forum -%] 
    177 <tr><td class="forum-icon"> 
     189<tr class="color[% c.stash.forums_color %]"><td class="icon"> 
    178190[% UNLESS forum.accessibility == 'normal' %]<img src="/images/icons/[% forum.accessibility %].png" alt="[% forum.accessibility %]" title="[% forum.accessibility %]"/>[% END %] 
    179 </td><td class="forum-name"> 
    180 <a href="/forum/[% forum.id %]" class="forum-link"> 
    181  <div class="forum-title">[% forum.name %]</div> 
     191</td><td class="name"> 
     192<a href="/forum/[% forum.id %]"> 
     193 <span class="title">[% forum.name %]</span> 
    182194[%     IF forum.blurb %] 
    183  <div class="forum-info">[% forum.blurb %]</div> 
     195 <span class="blurb">[% forum.blurb %]</span> 
    184196[%     END %] 
    185197</a> 
    186198</td> 
    187 <td class="forum-count">[% forum.threadct %]</td><td class="forum-count">[% forum.postct %]</td> 
    188 <td class="forum-postinfo"> 
     199<td class="count">[% forum.threadct %]</td><td class="count">[% forum.postct %]</td> 
     200<td class="postinfo"> 
    189201[%     IF forum.lastpostid %] 
    190202[%         IF 25 < forum.lastpost.thread.subject.length; subject = last_thread.subject.substr(0, 22) _ '...'; ELSE; subject = forum.lastpost.thread.subject; END -%] 
    191 [%             subject %] <br/> <a href="/user/[% forum.lastpost.userid %]">[% forum.lastpost.user.name %]</a> <br/> <a href="/forum/post/[% forum.lastpostid %]">[% forum.lastpost.time | date %]</a> 
     203[%             subject %] <a href="/user/[% forum.lastpost.userid %]">[% forum.lastpost.user.name %]</a> <a href="/forum/post/[% forum.lastpostid %]">[% forum.lastpost.time | date %]</a> 
    192204[%     ELSE %] 
    193205(no posts) 
    194206[%     END %] 
    195207</td></tr> 
     208[%     c.stash.forums_color = 3 - c.stash.forums_color %] 
    196209[% END %] 
    197210 
    198211[% BLOCK forums_message %][%# message -%] 
    199 <tr><td class="forum-message" colspan="5">[% message %]</td></tr> 
     212<tr><td class="message" colspan="5">[% message %]</td></tr> 
    200213[% END %] 
    201214 

  • veekun/branches/layout/templates/forum/thread/view.tt

    r23 r102  
    22[% PROCESS 'forum/common.tt' %] 
    33 
    4 [% IF thread.blurb %]<div class="forum-blurb">[% thread.blurb %]</div>[% END %] 
    5 <div class="forum-postct">[% thread.postct %] post[% 's' IF thread.postct != 1 %], [% thread.hitct %] view[% 's' IF thread.hitct != 1 %]</div> 
    6 [% this_pagelist = pagelist(skip, c.site_opts.page_sizes.posts, thread.postct, c.uri('Forum', 'thread', thread.id), c.req.params); this_pagelist %] 
     4<div class="forum-post-infobox"> 
     5[% IF thread.blurb %] 
     6    <div class="blurb">[% thread.blurb %]</div> 
     7[% END %] 
     8    <div class="flags">flags...</div> 
     9    <div class="postcount">[% thread.postct %] post[% 's' IF thread.postct != 1 %]; [% thread.hitct %] view[% 's' IF thread.hitct != 1 %]</div> 
     10    [% this_pagelist = pagelist(skip, c.site_opts.page_sizes.posts, thread.postct, c.uri('Forum', 'thread', thread.id), c.req.params); this_pagelist %] 
     11</div> 
    712[% INCLUDE posts_start %] 
    813[% done_posts = 0 %] 
    914[% WHILE (p = posts_rs.next) %] 
    1015[%     IF done_posts > 0 %] 
    11 <div class="forum-postdiff">[% p.time - last_post_time | timespan %]</div> 
     16<div class="forum-post-diff">[% p.time - last_post_time | timespan %]</div> 
    1217[%     END %] 
    1318[%     INCLUDE posts_each post=p thread=thread forum=thread.forum show_deleted=0 %] 
    … …  
    3136 
    3237[% IF page_islast %] 
    33 <div class="forum-postdiff">[% time - last_post_time | timespan %]<br/>since last post</div> 
     38<div class="forum-post-diff">[% time - last_post_time | timespan %]<br/>since last post</div> 
    3439[% ELSE %] 
    35 <div class="forum-postdiff">[% posts_rs.next.time - last_post_time | timespan %]<br/>to first post on next page</div> 
     40<div class="forum-post-diff">[% posts_rs.next.time - last_post_time | timespan %]<br/>to first post on next page</div> 
    3641[% END %] 
    3742<form action="/forum/thread/[% thread.id %]" method="get" class="forum-filter"> 
    38 <p>Filter by user: <input type="text" name="filter" value="[% filter.name %]"/></p> 
    39 [% IF filter.keys.size %]<p><a href="/forum/thread/[% thread.id %]">Remove filter</a></p>[% END %] 
     43<fieldset> 
     44    <legend>View options</legend> 
     45    <p>Filter by user: <input type="text" name="filter" value="[% filter.name %]"/></p> 
     46[% IF filter.keys.size %] 
     47    <p><a href="/forum/thread/[% thread.id %]">Remove filter</a></p> 
     48[% END %] 
     49</fieldset> 
    4050</form> 
    4151[% IF allowed('thread.flag') %] 

  • veekun/branches/layout/templates/style/global.tt

    r97 r102  
    3737 
    3838/* regular ol' layout bits */ 
    39 p { margin: 0.5em; line-height: 133%; } 
     39p { margin: 0.5em 0; line-height: 133%; } 
    4040#content h1, #content h2, #content h3 { background: url(/images/h1-ground.png) #e6d3b8 no-repeat left center; clear: both; margin: 1em 0 0.5em 0; padding-left: 80px; color: #806640; border: 1px solid #c0a680; border-left: none; border-right: none; } 
    4141#content h1 { margin: 0.5em -8px; padding: 0; padding-left: 80px; border-top: 2px solid #806640; } 
    … …  
    9292 
    9393/* forms */ 
    94 fieldset { border: 2px solid #806640; border-right: none; border-bottom: none; -moz-border-radius-topleft: 16px; padding: 0.33em 0.66em; } 
     94fieldset { border: 2px solid #806640; border-right: none; border-bottom: none; -moz-border-radius-topleft: 16px; padding: 0 0.5em; margin: 0.5em 0; } 
    9595fieldset legend { font-weight: bold; margin-left: 1em; } 
    9696