User interface improvement ideas

phreak

Hi everybody,

Let's collect ideas and improvements for the user-interface of Vanilla. Forum users are very thankfull for solutions to shorten their ways while browsing or when they are able find relevant information for them fast. I guess we all agree that we choose Vanilla because of some of those advantages regarding UI, but still... in the daily routine i find things that could be done better or faster. Maybe you'd like to add ideas...

Here is a very simple tipp i use in a custom template... the users love it.

Anchor Up and Down -
The discussions in my board are very lively and a soon as you hit 250 discussions and 6.000-7.000 comments a month it gains harder to follow those long streams. Also the default theme does show the pagination just at the bottom. I didn't like to change this to keep the upper part of the website clear so the easiest improvement was to create a #top and #bottom anchor as you can see in the screenshot.

For this i pushed this into the template "default.master.php".

<div id="Content"><?php $this->RenderAsset('Content'); ?>
            <a name="bottom">.</a></div> <!-- Chrome fix, otherwise it jumps wrong -->
         </div>
         <div class="arrows">
            <a href="#top" class="arrowUp">&uarr;</a>
            <a href="#bottom" class="arrowDown">&darr;</a>          
        </div>
 <div id="Panel"><?php $this->RenderAsset('Panel'); ?>

And added some css as an example:

.arrows{position: fixed; float: left; margin-top: 4px; margin-left: -23px;}
.arrowUp, .arrowDown {font-weight: bold; background: #E6F5FC; border-radius: 10px 10px 0 0; padding: 0px 3px; color: #FFF; display: block;}
.arrowDown {border-radius: 0 0 10px 10px;}
.arrowDown:hover, .arrowUp:hover {background: #BC0C60; color: #FFF;}

Maybe anone of you can needs this...

DirtyDog

Looks great!

phreak

Hmm, my uploaded screenshot seems gone? Why?

DirtyDog

I see it