AniDB:Page layout

From AniDB
Jump to: navigation, search
The information on this page is incomplete and may not be of much use.
If you can, please help by adding to it.

This page is going to be a guide to how pages on AniDB are layed out and marked up, to aid the creation of new stylesheets.





 <div id="layout-content"( class="nonav")>
   <div class="g_content [pagename]_all">
     <div class="g_section [pagename]_[sectionnamea]">
     <div class="g_section [pagename]_[sectionnameb]">



Tables of information, displayed in a columny way.

 <table( class="[tablename] (g_incomplete)")>
   <th class="[colnamea]( c_[sortclass])">[title]</th>
   <th class="[colnameb]( c_[sortclass])">[title]</th>
   <th class="[colnamec]( c_[sortclass])">[title]</th>
   <th class="[colnamed]( c_[sortclass])">[title]</th>
   <th class="[colnamee]( c_[sortclass])">[title]</th>
   <th class="[colnamef]( c_[sortclass])">[title]</th>
  <tr( class="g_odd")>
   <td class="[colnamea]( [contentmarker])">[content]</td>
   <td class="[colnameb]( [contentmarker])">[content]</td>
   <td class="[colnamec]( [contentmarker])">[content]</td>
   <td class="[colnamed]( [contentmarker])">[content]</td>
   <td class="[colnamee]( [contentmarker])">[content]</td>
   <td class="[colnamef]( [contentmarker])">[content]</td>

Sequential lists

Lists where not only the order is important, but also form a regular, unbroken sequence.

When the sequence is not 1+x. This would be easier with a value attribute on the <li>, but some w3c prat removed it from xhtml.

  <li class="g_odd"><span>[namea]</span> <[tag]>[value]</[tag]></li>
  <li><span>[nameb]</span> <[tag]>[value]</[tag]></li>
  <li class="g_odd">...etc

When the sequence counts up from 1, it's simple.

  <li class="g_odd">[value]</li>
  <li class="g_odd">...etc

Definition lists

Lists with two parts, a name or number, and an item of content, might be marked up in several different ways.

Definition list, for different types.

  <dt>[namea]</dt><dd class="[namea]">[value]</dd>
  <dt>[nameb]</dt><dd class="[nameb]">[value]</dd>

Table-as-definition-list, also for different types.

  <tr class="[namea]"><th>[namea]</th><td>[value]</td></tr>
  <tr class="[nameb]"><th>[nameb]</th><td>[value]</td></tr>

General lists

Any collection consisting of items a similar kind, not sequentially ordered.



In general displayed as a block, and floated if need be.

 <span class="i_icon i_[imagename]">[name]</span>
 <a class="i_icon i_[imagename]" href="[link]">[linkname]</a>


If not part of the content of the db (ie, stylesheet specific), they must be specified using the background property in the css.

 <img src="(absolute link)" alt="(something appropriate)" />


Text data should convert \n into <br /> before output. Text derived from user input should also convert from simple formating to html.

 <p class="[name]">[text]<br />
 [text]<br />