ElkArte Community

Elk Development => Bug Reports => Exterminated Bugs => Topic started by: Antechinus on December 04, 2012, 05:38:12 pm

Title: Teh theme is an ugly POS
Post by: Antechinus on December 04, 2012, 05:38:12 pm
 :P Yeah wossup with dat?
Title: Re: Teh theme is an ugly POS
Post by: Spuds on December 04, 2012, 05:40:51 pm
k. pls fix ... thanks  ;D
Title: Re: Teh theme is an ugly POS
Post by: Antechinus on December 04, 2012, 05:45:03 pm
One thing I have just done on my 1.1.x plaything is move the userinfo droppy so it comes off the bottom of the avatar instead of the top. Much less annoying on the whole.
Title: Re: Teh theme is an ugly POS
Post by: TestMonkey on December 04, 2012, 08:44:16 pm
Quote from: Antechinus" date="1354661103" link=topic="8.msg15#msg15One thing I have just done on my 1.1.x plaything is move the userinfo droppy so it comes off the bottom of the avatar instead of the top. Much less annoying on the whole.
^^
It's odd to cover the avatar, it's better off down there. :)
Title: Re: Teh theme is an ugly POS
Post by: Antechinus on December 05, 2012, 04:35:20 pm
K, easy fix then. Just set the ul position to top: 100%;

Code: [Select]
.poster .dropmenu>li.sfhover>ul, .poster .dropmenu>li:hover>ul  {
top: 100%;
float: none;
left: 0;
padding: 6px 0.5em 4px  0.5em;
width: 15.2em;
}
Title: Re: Teh theme is an ugly POS
Post by: Antechinus on December 05, 2012, 04:37:22 pm
By the way, button order under the quick reply is not good. Should be Post, Preview, Save Draft, Spell Check IMO.

I'm assuming that spell check via php is redundant these days. TBH I think we should just let the browser handle it.

ETA: Annnnnnnnnnnnnnnnnnnnndddd another ting! I noticed that the menus here are really slow. What that means is that someone has, yet again, after we sorted this issue on SMF (http://www.simplemachines.org/community/index.php?topic=483190.msg3424083#msg3424083), gone and reverted to the Superfish defaults. I really hate digging up the same issues again and again after I take the trouble to fix them. :P

Looky at this V V V

Code: [Select]
	sf.defaults = {
hoverClass : 'sfhover',
pathClass : 'current',
pathLevels : 1,
delay : 600,
animation : {opacity:'show', height: 'show', width: 'show'},
speed : 200,
disableHI : false, // Leave as false. True disables hoverIntent detection (not good).
onInit : function(){}, // callback functions
onBeforeShow: function(){},
onShow : function(){},
onHide : function(){}
};
sf.hoverdefaults = {
sensitivity : 8,
interval    : 50,
timeout     : 1
};


Use it. Kthnx. :P



ETAgain: Got some minor css gltiches in the new editor too. I'll take a look at that.
Title: Re: Teh theme is an ugly POS
Post by: Spuds on December 05, 2012, 08:25:34 pm
QuoteBy the way, button order under the quick reply is not good. Should be Post, Preview, Save Draft, Spell Check IMO.
Generally the submit button is the right most in all the forms, that why post is on the right as well ... either way its not just quick reply its also that way on any post page.  Easy to change if we want to

QuoteI'm assuming that spell check via php is redundant these days. TBH I think we should just let the browser handle it.
Next round when ie10 is da bomb.  Besides if someone does not want it, just don't check the box in the acp :P  I actually like the option since I use a custom spell check dictionary for some technical sites.  So while its there, you should fix the window layout :D

QuoteETA: Annnnnnnnnnnnnnnnnnnnndddd another ting! I noticed that the menus here are really slow
Thats odd since those are the values used
Code: [Select]
superfish({delay : 600, speed: 200, sensitivity : 8, interval : 50, timeout : 1})
have to take a look!

Quote, after we sorted this issue on SMF,
Its the same as a lot of posts on SMF these days "The theme or topic is off limits to you" :P

Quote Got some minor css glitches in the new editor too. I'll take a look at that.
Some of that could be since I moved to the 1.4 branch, it had quite the number of changes so there are a few glitches here and there ....
Title: Re: Teh theme is an ugly POS
Post by: Spuds on December 05, 2012, 08:34:34 pm
^^^
hey whats with all that ugly white space in my code block :'(

the speed thing should be fixed now, let me know
Title: Re: Teh theme is an ugly POS
Post by: Antechinus on December 05, 2012, 08:47:04 pm
The way I figure menus, the buttons you are likely to want should be the most accessible. Hiding "Post" at the end of a row of less-frequently used buttons feels off to me. A good analogy would be the buttonlists at top and bottom of the page, or the quickbuttons. In both cases, the item you will most likely want is first in line. When I first posted here I had to deliberately look for the "Post" button, and I'm finding myself still having to do that. It's not natural and intuitive IMO.

Space in the code block is because it has resize on it, which means you have to set a height. That can be set to anything you like.

Menus seem fine now.

Oh and quoting into quick reply seems to have major bugz at the moment. :D
Title: Re: Teh theme is an ugly POS
Post by: TestMonkey on December 06, 2012, 11:29:29 am

Quote from: Antechinus – The way I figure menus, the buttons you are likely to want should be the most accessible. Hiding "Post" at the end of a row of less-frequently used buttons feels off to me. A good analogy would be the buttonlists at top and bottom of the page, or the quickbuttons. In both cases, the item you will most likely want is first in line. When I first posted here I had to deliberately look for the "Post" button, and I'm finding myself still having to do that. It's not natural and intuitive IMO.

I'm not sure about the rest, but I did have the same feeling of chasing for it. Maybe it's just too much to the right... Dunno.
Title: Re: Teh theme is an ugly POS
Post by: Antechinus on December 06, 2012, 02:11:31 pm
Oh about the code blocks. I don't much care how the thing ships, but I wanted to try something out. The old style code blocks had no min-height set, but did have a max-height. Max-height stops you using resize on the block (coz max means max innit).

I like resize (a lot) so I wanted it on code blocks as well, but that means I had to set a min-height and no max. Min-height has to be set to some number, so I chose a reasonable compromise.

It probably comes down to how you use code blocks. I did a lot of support at SMF, and often found myself wanting to see more without having to scroll in a little box. Dragging it out vertically is a nifty trick in those situations. Not so relevant if you're just copy/pastingthe lot to an editor.
Title: Re: Teh theme is an ugly POS
Post by: Antechinus on December 11, 2012, 02:23:20 pm
Ok, two details which IMO count as bug fixes for the theme.

First: the posting submit buttons. I still think we should reorder them to put "Post" first, and also give that one an extra class so it can be styled by itself. The idea here is to make it accentuated like the active and/or primary buttons in other menus. This should help usability IMO.

Second one is to do with post layout. Although not having the thread title in every post is nice and clean for looks, I have been intensively using such a setup live over at the site I run.* What I have noticed is that altough it's fine in situations like this (typing in quick reply, where I can see the link tree) and although it's fine on the full reply page (linktree visible, again) it can be confusing when browsing threads.

If you have a stack of threads opened in different tabs and you're halfway down the page, it can lead to WTF syndrome. To get around this without shoving the title in my face, I tried having it in a pop-up off the timestamp/anchor. That ended up being a nusiance too, because when WTF syndrome hit I had to go looking for the pop-up.

The solution I came up with, and which seems to work very nicely, is to float a shortened and slightly faded title over at the right. This doesn't draw the eye, but is visble at a glance so you never get lost.

Example here: http://www.councilofexmuslims.com/index.php?topic=6468.msg652062;theme=38

The shortening doesn't rely on PHP. It's just a basic CSS hide with text-overflow: ellipsis;

Code: [Select]
  float: right;
  display: block;
  white-space: pre;
  font-size: 0.9em;
  color: #777;
  max-width: 13em;
  overflow: hidden;
  text-overflow: ellipsis;

*Told ya playing with my 1.1.x theme is good for fixing bugs with new builds. ;)
Title: Re: Teh theme is an ugly POS
Post by: Spuds on December 11, 2012, 05:44:19 pm
That looks pretty nice ....

Right now I think we have the last edited by text in that location as well, so would you show both, move one, ignore one in the event of both?
Title: Re: Teh theme is an ugly POS
Post by: Antechinus on December 12, 2012, 12:06:33 am
I stuck that back in the old location. Since the button row is so short now, I think it's ok to have both in the same row.

http://www.councilofexmuslims.com/index.php?topic=20936.msg652166#msg652166

ETA: Although it may create problems with largish font sizes and narrow screens. At the moment it's just in another li, but it can always be moved outside the ul and have the ul floated right if necessary. That would allow things to break cleanly to separate lines.
Title: Re: Teh theme is an ugly POS
Post by: emanuele on December 12, 2012, 09:13:22 am
The order is usually not important the moment you are used to something: most of the desktop applications have the "ok" on the right, then some from time to time have it on the left. The first two times it looks strange, then you get used to it.

I like the post button on the far right, but I agree it would improve having a different aspect from the others, even only because is the smallest one...

But TBH I don't click it so frequently (tab > enter > move the hand to the mouse to go somewhere else), so I may not be the best to ask...
Title: Re: Teh theme is an ugly POS
Post by: Antechinus on December 12, 2012, 02:59:00 pm
Yup, tab + enter works but a lot of users wont know about that. I like having them listed in order of the usage they get (taking into account ltr or rtl language of course). My suggestion, off the top of my head, would be Post, Spell check (if enabled), Preview, Draft.