Forum OpenACS Q&A: Re: Copenhagen

6: Re: Copenhagen - UI discussion (response to 5)

Posted by xx xx on 07/06/03 06:48 PM

Very good!
Does this mean you make use of <div> and <span> instead of tables?
Is there a 'Naming Convention' that you use or that should be used?

7: Re: Copenhagen - UI discussion (response to 6)

Posted by Bruno Mattarollo on 07/06/03 08:04 PM

I use tables but not for layout. The layout is controlled by CSS. In the case of the calendar, in particular, I think we still need to use tables (since that's how the information is structured, in a tabular way) but the layout (all the fonts, colors, positioning etc) is controlled from the CSS.

My naming convention is quite lax at the moment, I have one main div called calendartable and then a class called calendar that is applied to each td. I use another classcalendarheader for the caption of the table containing the calendar. For the day view rows I have dayvieweven and dayviewodd just to continue with the current code.

I just started working on this because that's something I have been wanting to do for a long time ... I want to make it easier to change the layout of the widgets and stuff .

8: Re: Copenhagen - UI discussion (response to 7)

Posted by Jeff Davis on 07/07/03 11:31 AM

Bruno, rather than dayviewodd and dayvieweven you might want to use simply odd and even so that the banding will be done by the default sitewide css and if you want to overide it you can still do

.calendar .odd { }

Here is what I ended up with for the calendar table:

<table class="calendar">
  <tr class="title"><th class="month" colspan="7">July 2003</th></tr>
  <tr class="days">
    <th class="day">S</th>
    <th class="day">M</th>
    <th class="day">T</th>

    <th class="day">W</th>
    <th class="day">T</th>
    <th class="day">F</th>
    <th class="day">S</th>
  </tr>
  <tr>
    <td class="empty">&nbsp;</td>
    <td class="empty">&nbsp;</td>
    <td class="day">1</td>
    <td class="day">2</td>
    <td class="day">3</td>
    <td class="today">4</td>
    <td class="day">5</td>

  </tr>
...
  </table>

Forum OpenACS Q&A: Re: Copenhagen - UI discussion