42 Light Themes

[Stinky666]

Mar 24, 2013 3:14:57 GMT -8 User 180565 is taking donation said:

Does anyone else get reminded of Windows 7 High contrast themes when you see this?

Never used windows 7, only vista. So nope

[User 180565 is taking donation]

Mar 24, 2013 3:37:46 GMT -8 Stinky666 said:

Mar 24, 2013 3:14:57 GMT -8 User 180565 is taking donation said:

Does anyone else get reminded of Windows 7 High contrast themes when you see this?

Never used windows 7, only vista. So nope

Vista should have them not saying they look alike just the same idea.

[Stinky666]

Some may because of their brightness, but it wasn't my intention at all. I didn't even think of it.
It was simply an "opposite" version to my "33 dark themes" themes..

[Stinky666]

Apr 5, 2013 11:50:49 GMT -8 TinMachine said:

Hey, there's something not co-ordinating with regards to borders in the info center. Here's the topic I made with the question: "Also, where in the style editor is the border for info center? I couldn't find it, and I want to put a black border around like the rest of the forum has as do the title bars."

support.proboards.com/thread/456320?scrollTo=5249826&page=1

kettering.freeforums.net/ is my board.

At this time, I'm not too sure about the border. I know I did fix it on my latest theme, so I will try compare the two to see what's wrong with it, but that wont be until tomorrow, sorry.
For the legend, go to Layout Templates > Home

On line 13, add the following:
<div class="wrapper2">

and then on line 27, make a new line and add
</div>

So that will be on line 28

[Stinky666]

Apr 5, 2013 12:33:16 GMT -8 TinMachine said:

Shall I remove the stray </div> on line 12?

No.
If you want to see why not, go ahead and do it, save (or preview)

[Stinky666]

Did you edit anything else?

here's what the first 28 lines should look like:

$[news]
{foreach $[category]}
$[category.anchor]
<div class="container boards">
<div class="title-bar bbcode"><h2><div class="title_wrapper">$[category.display_name]</div></h2></div>
<div class="content cap-bottom">
$[category.board_list]
</div>
</div>
{/foreach}

</div>
<div class="wrapper2">
{if $[legend]}
<div class="container legend">
<div class="title-bar"><h2>Legend</h2></div>
<div class="content">
<table>
<tr>
{foreach $[legend]}
<td>$[legend.icon] <span>$[legend.name]</span></td>
{/foreach}
</tr>
</table>
</div>
</div>
{/if}
</div>

Could you paste me your whole "Home" please (be sure to put it in code tags, makes it easier).

[Stinky666]

Have you removed the CSS that Ricky told you to add? Removing that should fix it.

[K Phoenix]

Hey Stinky666,

I'm currently testing both this theme and the dark variants. It seems like this one is having the same/similar issues with the Sidebar Redux sidetables as the dark theme was, and which you fixed here for that theme. Do you think you could drum up a similar fix for the light themes? My test board is here with the light theme temporarily set to default if you need to see it.

Additionally, I've noticed that the "legend" div is outside the "wrapper2" div in both the light and dark themes and so is wider than the other divs/tables, even without the sidebar—is this intentional? On the dark version I've gone ahead and put it inside that wrapper anyway just to keep them all aligned, and I'll likely do the same on the light, but I was just curious.

Thanks in advance, and thanks for the lovely themes!

[Stinky666]

Apr 5, 2013 13:14:56 GMT -8 TinMachine said:

Oh that worked, thanks.

I hope I'm not being a pain, but there's a few other things I'm not sure how to sort out.

kettering.freeforums.net/board/1/general-board in the thread lists, the thread creator appears underneath the thread icon (the folder image). How do I put it so that icon is to the left of the thread creator's name. I'd also like to remove the '# posts # replies' that appears above threads titles in the list of threads.

Lastly the second nav bar - the one under the Home, Help etc. The words 'forum', 'home' etc look like they are not centered properly within that nav bar. So they have a bigger space above them than the space below them and it looks odd to me, like, not neat, centered and tidy? If you get what I mean.

The thread creator's name is below the icon because it's on the left of the topic title, and makes sense.
I would recommend against putting your folder icon next to the name, on the left side. Reason being, people with long names. Currently, I have it so it won't go to two lines too easily, but by adding the folder to the left of the name, it will.

As for the replies and views, what did you have in mind instead? Or you just want them completely removed?

The big gap is there for a couple of reasons for the nav tree (it's the only nav tree, not a second one (the other things you mentioned are simply buttons/navigation menu). 1) The gap on the right is there because usually there is an arrow but it's removed. 2) If the gap was smaller, the words would be too close together, as in, you'd think they are all one word. This way you can easily tell the words apart from one another.

Apr 5, 2013 15:15:38 GMT -8 K Phoenix said:

Hey Stinky666,

I'm currently testing both this theme and the dark variants. It seems like this one is having the same/similar issues with the Sidebar Redux sidetables as the dark theme was, and which you fixed here for that theme. Do you think you could drum up a similar fix for the light themes? My test board is here with the light theme temporarily set to default if you need to see it.

Additionally, I've noticed that the "legend" div is outside the "wrapper2" div in both the light and dark themes and so is wider than the other divs/tables, even without the sidebar—is this intentional? On the dark version I've gone ahead and put it inside that wrapper anyway just to keep them all aligned, and I'll likely do the same on the light, but I was just curious.

Thanks in advance, and thanks for the lovely themes!

The same fix for that one should work for this light theme (info center and redux), since they are the same coding, just different colours.

[Stinky666]

TinMachine, just the thread creator's name? So you want the folder to still remain, I assume?
If so, simply do the following:

Admin > Themes > Layout Templates > Board > Thread List

On line 3 you should see:
       <td class="created-by">$[thread.icon]<br/>$[thread.created_by_user]:</td>

Replace that with the following:
       <td class="created-by">$[thread.icon]<!--<br/>$[thread.created_by_user]:--></td>

What you have changed, is you have added <!-- and --> to rule out the code, keeping the code there in case you need it back later.

You will also want to reduce the width of the cell where the folder icon is, so go to your Style Sheet and on lines 884 and 885, you should see:
.threads .main { width: 85%; text-align: @thread_align_subject; }
.threads .created-by { width: 15%; text-align: @thread_align_created_by; }

Change to:
.threads .main { width: 95%; text-align: @thread_align_subject; }
.threads .created-by { width: 5%; text-align: @thread_align_created_by; }


What you have changed, is the width's, from 85% to 95%, and 15% to 5%.


As for the nav tree text, it should be easy but everything I am trying isn't working
Maybe Brian, CheatAreZee or RedBassett can help with that

[Stinky666]

Apr 6, 2013 7:26:12 GMT -8 TinMachine said:

Ok thanks. What about removing the replies and views data - or if possible could you give me the way how to move it below thread title, so I can see if I prefer it that way or prefer it gone altogether.

To switch the title with replies and views, go to Layout Templates > Board > Thread List
Line 8 and 9 you should see:

                   <span class="replies">$[thread.replies] replies & $[thread.views] views</span>   $[thread.icons] <div style="clear: right; float: right; text-align: right;">$[thread.labels]</div>
          <br/>'<span class="link target">$[thread]</span>' <div class="ui-micro-pagination" style="display: inline;">{if $[thread.pagination]}$[thread.pagination]{/if}</div> <div style="clear: right; float: right; text-align: right;">Last post by $[thread.last_post.created_by_user], $[thread.last_post.date]</div>

Replace the above with
                   '<span class="link target">$[thread]</span>'   $[thread.icons] <div style="clear: right; float: right; text-align: right;">$[thread.labels]</div>
          <br/><span class="replies">$[thread.replies] replies & $[thread.views] views</span> <div class="ui-micro-pagination" style="display: inline;">{if $[thread.pagination]}$[thread.pagination]{/if}</div> <div style="clear: right; float: right; text-align: right;">Last post by $[thread.last_post.created_by_user], $[thread.last_post.date]</div>

If you want to completely remove views and replies, replace lines 8 and 9 with

                   '<span class="link target">$[thread]</span>'   $[thread.icons] <div style="clear: right; float: right; text-align: right;">$[thread.labels]</div>
          <br/><!--<span class="replies">$[thread.replies] replies & $[thread.views] views</span>--> <div class="ui-micro-pagination" style="display: inline;">{if $[thread.pagination]}$[thread.pagination]{/if}</div> <div style="clear: right; float: right; text-align: right;">Last post by $[thread.last_post.created_by_user], $[thread.last_post.date]</div>


I would also recommend, if you leave the replies and views below the title, to place the following below with it. Reason is, if a thread has multiple pages, and then also has thread icons (poll, event etc), it wont look good at all.

  $[thread.icons]

That is currently on line 8, so remove it from where it is on line 8, and move it to line 9, so it then looks like so

                   '<span class="link target">$[thread]</span>' <div style="clear: right; float: right; text-align: right;">$[thread.labels]</div>
          <br/><span class="replies">$[thread.replies] replies & $[thread.views] views</span>   $[thread.icons] <div class="ui-micro-pagination" style="display: inline;">{if $[thread.pagination]}$[thread.pagination]{/if}</div> <div style="clear: right; float: right; text-align: right;">Last post by $[thread.last_post.created_by_user], $[thread.last_post.date]</div>

[Stinky666]

Indeed that's correct

[Stinky666]

Hmm it hasn't for me on my test forum, where I made the changes.
Have you changed anything else at all?

Edit:
Wait, yes it has.
Let me try figure this out.

[K Phoenix]

Apr 6, 2013 1:48:25 GMT -8 Stinky666 said:

]The same fix for that one should work for this light theme (info center and redux), since they are the same coding, just different colours.

Ah, yep, that did it. Thank you!

[Stinky666]

Apr 8, 2013 6:47:22 GMT -8 TinMachine said:

Any luck?

Apologize, I completely forgot about this. Looking now. Though what have already discovered is that it is like it on all themes, so it was like it before the changes that have been made.


Edit:
Ok as a simple fix, go to your Layout Templates, then select Board.
Line 92 you should see:
<tr><th colspan="2">Threads and Posts</th></tr>
replace with
<tr><th colspan="2"><font style="color: #505050; font-weight: bold;">Threads and Posts</font></th></tr>

Do the same for line 109, replace:
<tr><th colspan="1">On This Board</th></tr>

with
<tr><th colspan="1"><font style="color: #505050; font-weight: bold;">On This Board</font></th></tr>


If you don't want them bold, remove the parts in red. If you don't mind, leave the red part in