1 Topic by rs324

  • rs324
  • Extension Developer
  • Offline
  • Registered: 2010-08-29
  • Posts: 32

Topic: css discussions

Well , if i got it right the main idea of punbb is to be simple , fast & strong

you made it on the server side very well (as far as i tested)

but why to make css so complex ? the desgin of punbb is very simple and dont require such complex css
if you just change the way you think a little

for example

/* Float Clearing
-------------------------------------------------------------*/

.brd-page:after,
.brd .gen-content:after,
.brd .ct-box:after,
#brd-index .item-head:after,
#brd-index .main-item:after,
#brd-index ul.item-info:after,
.brd .frm-group:after,
.brd .mf-set:after,
.brd .sf-set:after,
.brd .mf-box:after,
.brd .sf-box:after,
.brd .mf-item:after,
.brd .txt-set:after,
.brd .txt-box:after,
.brd .frm-form label:after,
.brd fieldset:after,
.brd span.fld-input:after,
.brd .posthead:after,
.brd .postbody:after,
.brd .postfoot .post-options:after {
    content: "";
    display: block;
    font-size: 0;
    height: 0;
    line-height: 0.0;
    overflow:hidden;
    visibility: hidden;
    clear: both;
    }

why not just do :

/* Float Clearing
-------------------------------------------------------------*/

.brd .clearfix:after {
    content: "";
    display: block;
    font-size: 0;
    height: 0;
    line-height: 0.0;
    overflow:hidden;
    visibility: hidden;
    clear: both;
    }

and apply clearfix on each dom element you want

.brd .main-content .main-item li.info-lastpost cite

Tag key with 4 descendant selectors and Class overly qualified with tag

its way 2 much , you should make it simple

.brd .main-head .hn, .brd .main-foot .hn {
    font-size: 1.084em;
    padding-right: 10em;
    }

why not to call is .category {} & .category h2 {}

will make css code much more simple

and here a quick review

http://punbb.informer.com/forums/style/ … Oxygen.css has 45 very inefficient rules, 108 inefficient rules, and 0 potentially inefficient uses of :hover out of 301 total rules.

this make loading slower
and also makes theme very hard hard to builld -> so there will be very few themes for punbb which will make punbb less popular

also 90% of code sets position:relative; which make you include special css file for IE 6 & IE 7
which is bad idea from the first place

and the last bad idea is to use div's for table data , just use table tag its will require less css hacks and will work better
and still will be XHTML Valid.

also making the forum to support rtl is impossible with this css , i ended up with rewriting all php files to replace div code to table and css change to support tables & rtl properties

i will be really happy to get developers comments.

  • KeyDog
  • KeyDog
  • Global Moderator
  • Offline
  • Registered: 2008-12-12
  • Posts: 1,693

Re: css discussions

From a user standpoint (not developer) so my opinion:
If you can make a new css which is faster loading and doesn't require rewriting of the php files (core) - that would be great. Or is it necessary to change lots of php files?

3 Reply by rs324

  • rs324
  • Extension Developer
  • Offline
  • Registered: 2010-08-29
  • Posts: 32

Re: css discussions

KeyDog wrote:

From a user standpoint (not developer) so my opinion:
If you can make a new css which is faster loading and doesn't require rewriting of the php files (core) - that would be great. Or is it necessary to change lots of php files?

well all div tags are writen inside the php files , i didnt change the php core function just update the display
example :

at search file i replaced :

<div class="main-item<?php echo $forum_page['item_style'] ?>">
            <span class="icon <?php echo implode(' ', $forum_page['item_status']) ?>"><!-- --></span>
            <div class="item-subject">
                <?php echo implode("\n\t\t\t\t", $forum_page['item_body']['subject'])."\n" ?>
            </div>
            <ul class="item-info">
                <?php echo implode("\n\t\t\t\t", $forum_page['item_body']['info'])."\n" ?>
            </ul>
        </div>

with 

<table id="forum<?php echo $cur_forum['fid'] ?>" class="forum">
<tr>
<td class="icon"><span class="icon <?php echo implode(' ', $forum_page['item_status']) ?>"><!-- --></span></td>
<td class="topic"><?php echo implode("\n\t\t\t\t", $forum_page['item_body']['subject'])."\n" ?></td>
<td class="postsinfo"><?php  print '<div>'.strip_tags($forum_page['item_body']['info']['replies']).'</div><div>'. strip_tags($forum_page['item_body']['info']['views']).'</div>'; ?></td>
<td class="lastpost"><?php print strip_tags($forum_page['item_body']['info']['lastpost'],'<a><span><strong>'); ?></td>
</tr>
</table>

its looks like simple change but when its comes to rtl the support is automatic for tables
also
i just wrote few css lines which is by far , way more simple then the orginal.

4 Reply by FhdQa

  • From: Doha - Qatar
  • Registered: 2006-01-20
  • Posts: 73

Re: css discussions

rs324

I've left punbb for a while. and now i'm trying to install one. i hoped that it would still support rtl (by default at least). unfortunately, even if i installed 1.2, the rtl files by zaher are no longer available sad . now, u seem like the man for this job. i'm really hoping that you have a solution already (preferable not involving changing the structure to tables).

So, any news?

فهد

5 Reply by rs324

  • rs324
  • Extension Developer
  • Offline
  • Registered: 2010-08-29
  • Posts: 32

Re: css discussions

well , i replaced the main files i edited the div based columns to be table based (yeah tabular data should stay in tables !!)
so its includes editing the main files , i can post the changed files if you ....
(applying rtl css to tables is much more simple)

  • Registered: 2010-09-23
  • Posts: 17

Re: css discussions

I don't agree, a forum does not store tabular data, but listed one (list of messages/posts), so I don't see why it would be stored semantically in a table instead of a list.

I agree that the CSS is much simpler, but we have to think beyond that if we want to create the real web. And if you are not convinced, think about accessibility, smartphone screens and so on ;-)

Forum Software Reviews Review, compare and test forum software solutions.
[img]http://www.forum-software.org/review-bar/punbb[/img]
PunBB score: 7/10! Vote

lastnico's Website