[Preview] justboards Theme

Started by KahneFan, January 25, 2009, 05:19:13 PM

Previous topic - Next topic

KahneFan

My site is currently decked out with a "justboards" theme I'm working on. It actually removes the category titles from the index page and lists just the boards in a 4 column pattern. There are several ways to adjust the CSS to make it fit (probably) EVERY site comfortably. I tried to figure out a way to get the category titles listed inline, but I could think of a good way to do it and keep the site symmetrical, so I just removed them. Many sites will be OK with no category titles anyway since boards are usually self explanatory. I've also added a quick view bar for when there are new replies to view. This is helpful on forums with a lot of boards so that you don't have to scroll-scroll-scroll to see if there's new posts.

Theme Preview


You will see the unread icon under the "Show unread posts since last visit" in the header. This icon actually uses the same system as the on/off icons, so it's quick, and it actually "grows/shrinks" when there are more or less boards with unread posts in them.

Any feedback is welcome.
#eric_on_twit| (video) Creating Themes for SMF | Reset Your Forum
NOTE: No PM's for support please.

Deaks

looks interesting not sure of the side to side the boxes need some spacing from each other
~~~~
Former SMF Project Manager
Former SMF Customizer

"For as lang as hunner o us is in life, in nae wey
will we thole the Soothron tae owergang us. In truth it isna for glory, or wealth, or
honours that we fecht, but for freedom alane, that nae honest cheil gies up but wi life
itsel."

KahneFan

Woo hoo! I'm the inaugural preview theme :D

Just to be sure, you're referring to the space between the boards (left/right)?
#eric_on_twit| (video) Creating Themes for SMF | Reset Your Forum
NOTE: No PM's for support please.

Deaks

on yoru preview the space between board1 and board 2 etc
~~~~
Former SMF Project Manager
Former SMF Customizer

"For as lang as hunner o us is in life, in nae wey
will we thole the Soothron tae owergang us. In truth it isna for glory, or wealth, or
honours that we fecht, but for freedom alane, that nae honest cheil gies up but wi life
itsel."

Antechinus

Good ideas there. I'd try listing the post and topic numbers above the last post details to make it look less cluttered. Just throw in another hr or something to keep it neat.

KahneFan

#5
@ Runic, see my site for new preview, or screenshot below. Much more definition now.

@ antechinus, so, two rows instead of two columns? Screenshot of this as well below.
#eric_on_twit| (video) Creating Themes for SMF | Reset Your Forum
NOTE: No PM's for support please.

Deaks

~~~~
Former SMF Project Manager
Former SMF Customizer

"For as lang as hunner o us is in life, in nae wey
will we thole the Soothron tae owergang us. In truth it isna for glory, or wealth, or
honours that we fecht, but for freedom alane, that nae honest cheil gies up but wi life
itsel."

Antechinus

#7
Looks good. Final tweaks IMO would be:

1/ Add "in" between xxxPosts  xxxTopics


2/ Put a <br /> between "Last post by xxxxxxx" and "in Blah blah Topic" and the date/time.

Last post by Kahnefan

in Child board Topic

January 15th, 2009, 2.02.34PM

You wouldn't need the "on" for the last line and losing it would look cleaner.


3/ Put line breaks between "Child Boards" and the board names themselves. That way they'll stack up cleanly in the narrow columns.

KahneFan

Quote from: antechinus on January 25, 2009, 07:18:38 PM
Looks good. Final tweaks IMO would be:

1/ Add "in" between xxxPosts  xxxTopics

Done.


Quote from: antechinus on January 25, 2009, 07:18:38 PM
2/ Put a <br /> between "Last post by xxxxxxx" and "in Blah blah Topic" and the date/time.

Done.

Quote from: antechinus on January 25, 2009, 07:18:38 PM
Last post by Kahnefan

in Child board Topic

January 15th, 2009, 2.02.34PM

You wouldn't need the "on" for the last line and losing it would look cleaner.

Done. I also removed the "in" that applies to "in {topic}"

Quote from: antechinus on January 25, 2009, 07:18:38 PM
3/ Put line breaks between "Child Boards" and the board names themselves. That way they'll stack up cleanly in the narrow columns.

I can not figure this out for some reason. Maybe because I've been messing with this all day. See code below if you can let me know where the <br /> would go.


// Show the "Child Boards: ". (there's a link_children but we're going to bold the new ones...)
if (!empty($board['children']))
{ echo '<hr />';
// Sort the links into an array with new boards bold so it can be imploded.
$children = array();
/* Each child in each board's children has:
id, name, description, new (is it new?), topics (#), posts (#), href, link, and last_post. */
foreach ($board['children'] as $child)
{
if (!$child['is_redirect'])
$child['link'] = '<a href="' . $child['href'] . '" title="' . ($child['new'] ? $txt['new_posts'] : $txt['old_posts']) . ' (' . $txt['board_topics'] . ': ' . $child['topics'] . ', ' . $txt['posts'] . ': ' . $child['posts'] . ')">' . $child['name'] . '</a>';
else
$child['link'] = '<a href="' . $child['href'] . '" title="' . $child['posts'] . ' ' . $txt['redirects'] . '">' . $child['name'] . '</a>';

// Has it posts awaiting approval?
if ($child['can_approve_posts'] && ($child['unapproved_posts'] | $child['unapproved_topics']))
$child['link'] .= ' <a href="' . $scripturl . '?action=moderate;area=postmod;sa=' . ($child['unapproved_topics'] ? 'topics' : 'posts') . ';brd=' . $child['id'] . ';sesc=' . $context['session_id'] . '" title="' . sprintf($txt['unapproved_posts'], $child['unapproved_topics'], $child['unapproved_posts']) . '" class="moderation_link">(!)</a>';

$children[] = $child['new'] ? '' . $child['link'] . '' : $child['link'];
}
echo '
', $txt['parent_boards'], ': ', implode(', ', $children), '';
}
#eric_on_twit| (video) Creating Themes for SMF | Reset Your Forum
NOTE: No PM's for support please.

Antechinus

You need one for sure here:

echo '
', $txt['parent_boards'], ':<br /> ', implode(', ', $children), '';
}


and t'other ones here I think:

$children[] = $child['new'] ? '' . $child['link'] . '<br />' : ''. $child['link'].'<br />';

Try that last line as is.

KahneFan

Works with the 1st alone. However, now that they're on different rows, should I remove the ":" since it's not really needed as a divider any longer.
#eric_on_twit| (video) Creating Themes for SMF | Reset Your Forum
NOTE: No PM's for support please.

Antechinus

Add a couple more child boards. The line break you put in doesn't deal with all of them. It only puts the break between the "Child Boards:" text and the first one listed. As for the colon, it's up to you. Whatever you think looks best.

Antechinus

Actually I just realised my last suggestion was wrong. It should be like this:

$children[] = $child['new'] ? '<strong>' . $child['link'] . '</strong>'. $child['link'].'<br />';

KahneFan

The first (second) code put the children in a single stack, which is not preferred with the way I have the squares set up. They all need to stay the same size (if possible) so they line up. If there are a lot of children in a stack it makes that 1 board taller than the rest. The revised code gave me a parse error.
#eric_on_twit| (video) Creating Themes for SMF | Reset Your Forum
NOTE: No PM's for support please.

Antechinus

Hmm. Oh well just mess with it until you get the layout you want. I was thinking that if the child board names all string together it may be hard to read.

KahneFan

I could also put a graphic or a bullet between them. It may be something I could leave up to the discretion of the download-er. I could place a generic blank graphic or something in there just as a place holder so they could just replace the graphic if needed.
#eric_on_twit| (video) Creating Themes for SMF | Reset Your Forum
NOTE: No PM's for support please.

Antechinus

#16
Sounds like a plan. Actually my current preference is to replace the comma with a pipe.

Child board 1, Child board 2   becomes   Child board 1|Child board 2

KahneFan

I thought about that as well. I may just have to play with it. Thanks for all the feedback.
#eric_on_twit| (video) Creating Themes for SMF | Reset Your Forum
NOTE: No PM's for support please.

KahneFan

Last suggestion was on 1/25, any further suggestions before I submit this theme?
#eric_on_twit| (video) Creating Themes for SMF | Reset Your Forum
NOTE: No PM's for support please.

KahneFan

DirtRider, do you feel this theme would take a while to load? If so, why?
#eric_on_twit| (video) Creating Themes for SMF | Reset Your Forum
NOTE: No PM's for support please.

DirtRider

I think my biggest problem here is if you have a large forum with plenty boards the whole layout may become to big for the member. Meaning that you would have a huge scroll area to have to manage when moving form one board to the other. However I still think it is a very neat idea for a forum that does not have a lot of boards. 
http://www.triumphtalk.com

"The real question is not whether machines think but whether men do. "

KahneFan

So, not so much of a load time issue as just a scroll issue(?). One thing that will/can help, I currently have the description area set to a height of 250 (I think), which allows for 200 characters of description and/or a lot of child boards. BUT, if the site doesn't have very large descriptions or many child boards, the description cell can easily be changed to fit the site's largest description board. If a site's largest description only needs 75/100 pixels, then it will DRASTICALLY shrink all the boxes to where you can see probably 12/16/24 per screen depending on the end size.
#eric_on_twit| (video) Creating Themes for SMF | Reset Your Forum
NOTE: No PM's for support please.

DirtRider

I really like the size they are now for the small boards. What would be cool if you could implement two setting in the theme setting that can alternate between this size and a smaller block maybe
http://www.triumphtalk.com

"The real question is not whether machines think but whether men do. "

KahneFan

Do you mean inline? If so, there's not really a good way to do that (without using table cells). Since the blocks are using a "float: left" style, if any of them were sized different, they would not stack correctly. So, unfortunately, one side effect of using CSS, is they need to be all the same size.

However, I do have them all in a class which can be re-sized to the forum owner's liking.
#eric_on_twit| (video) Creating Themes for SMF | Reset Your Forum
NOTE: No PM's for support please.

DirtRider

Well that should do it then if he can resize them a bit to fit his board layout. I would like to see this them working on a running forum that would be cool
http://www.triumphtalk.com

"The real question is not whether machines think but whether men do. "

bloc

I agreed, using CSS to float them is the best way, to meet different screen widths.

This float idea is great, although I for one really love to see those containers being a bit more interesting. Lining them up like that just begs for them to be a little less "boxy" in their looks :) Can they be dressed with a background graphic through css..? overriding the full/header background/borders?

KahneFan

They are contained in a table, but their graphics are fully controlled by CSS.
#eric_on_twit| (video) Creating Themes for SMF | Reset Your Forum
NOTE: No PM's for support please.

Advertisement: