ElkArte Community

Elk Development => Feature Discussion => Exterminated Features => Topic started by: TE on June 17, 2013, 03:04:25 pm

Title: Linktree and Dropmenu arrows..
Post by: TE on June 17, 2013, 03:04:25 pm
Sorry, but I don't like the arrows in the linktree and the dropmenu.. Apart from that the theme fits much better on this site than on my local copy  :D
I've found some nice arrows on the net, maybe we can adapt some from here:
http://fortawesome.github.io/Font-Awesome/icons/
Title: Re: Linktree and Dropmenu arrows..
Post by: Antechinus on June 17, 2013, 07:30:05 pm
Looks interesting, but wouldn't like to rely on their whole shebang just for a couple of icons. The current ones are basic html entities that look good (or equally bad, depending on your opinion) in all browsers and (importantly) are stable for vertical positioning as font size is changed in the browser.

I like them in the linktree. The ones down in the first level drop menu could do with a bit more grunt, but I left them basic for now. They're all optional anyway, since they're in pseudos controlled in the CSS.
Title: Re: Linktree and Dropmenu arrows..
Post by: Bloc on June 17, 2013, 07:47:31 pm
Can the regular ">" for example, be added as a entity? I've used the quote entity(or ascii code I think its called) this way, for a BBC code relying on adding those by CSS.

I like the css triangles myself, useful as arrows and embellishments alike.
Title: Re: Linktree and Dropmenu arrows..
Post by: Antechinus on June 17, 2013, 07:51:19 pm
Yeah you can add those, but I tried triangles before with the old 2.1 alpha theme and they're a/ not that great in all browsers and b/ IMO not as good to look at. The basic > isn't that groovy either IMO. I ran through most of them when early testing 2.1 stuff. The current ones are the best I've found. I actually like them. I'd suggest leaving them for default, at least for the moment. Since they're pseudos, it would be easy to add a sprite background to them as part of one of the other sprites.
Title: Re: Linktree and Dropmenu arrows..
Post by: Antechinus on June 17, 2013, 08:14:58 pm
Just tried it on local with font-weight: 600; for the linktree/unread links, but font-weight: normal; for the divider pseudos (due to their larger font size). Colour set to #666 for both. Works quite well. Sorta makes the text balance out the grunt of the arrows. The slighter lighter colour stops the heavier font-weight being too in your face, while still meeting guidelines for a11y.

Better balance all round. Will have it in the next PR. :)
Title: Re: Linktree and Dropmenu arrows..
Post by: Bloc on June 18, 2013, 01:47:43 am
I got admit I agree with TE though...theres just something about those arrows that I don't associate them directly with something that has to "open" (as in the drop) or as a hierarchy symbol(as in linktree). They seem to me to be used rather as single-point things. Like, "right here the target is" sort of the thing.

I dunno. > or / always felt logical to me. Maybe not for others.
Title: Re: Linktree and Dropmenu arrows..
Post by: Antechinus on June 18, 2013, 03:16:09 am
Hmm. I've always liked linktrees that have thing that point towards the next level, which from what I've seen around the web seeems to be logical to a lot of people too. Hey ho.
Title: Re: Linktree and Dropmenu arrows..
Post by: Bloc on June 18, 2013, 05:57:02 am
Yeah, no big deal in the linktree I guess. The menu seems a bit ..well, unusual at least. Maybe its because I am used to simple graphics there instead of actual signs.
Title: Re: Linktree and Dropmenu arrows..
Post by: Antechinus on June 18, 2013, 06:00:38 am
 ;D Yeah well I was trying to get away from images. I'm not worried if they get changed for something else though. The theme has a good feel about it, feedback is generally good, and we're still in alpha. I reckon it'll all come together.

ETA: If running hover menus, I wouldn't bother putting any sub-level indicators, but I think they're handy for click menus.
Title: Re: Linktree and Dropmenu arrows..
Post by: TestMonkey on June 18, 2013, 07:40:10 am
Yes, it's particularly odd in the menu. It doesn't "say" it opens things to me either... dunno what it says but it ain't that.
No good ideas as to what it could be like, though.
Title: Re: Linktree and Dropmenu arrows..
Post by: Antechinus on June 18, 2013, 05:03:08 pm
Well it's only one line of CSS, so if they bug you just comment it out for now. Or play around with HTML entities if youre bored. :)

Code: [Select]
/* Top level subsection indicators, just in case anyone wants them. */
.dropmenu>.subsections>a:after {
content:" \2193";
}

Title: Re: Linktree and Dropmenu arrows..
Post by: Antechinus on June 20, 2013, 03:44:42 pm
K. I've played around with the droppy indicators a bit. Methinks this is quite a bit better. Throw in your 2c. :)
Title: Re: Linktree and Dropmenu arrows..
Post by: IchBin on June 20, 2013, 05:10:25 pm
I kind of like the arrows a more aligned with the text myself. Nothing I'll scream about though. :)
Title: Re: Linktree and Dropmenu arrows..
Post by: Feature Cat on June 20, 2013, 05:12:20 pm
'Tis... doesn't feel natural at all. They're not on the same line, and it feels like things in the menu are slipping away. :(
Title: Re: Linktree and Dropmenu arrows..
Post by: Antechinus on June 20, 2013, 05:17:41 pm
Meh. :P Ok, moved them.
Title: Re: Linktree and Dropmenu arrows..
Post by: Antechinus on June 20, 2013, 05:20:38 pm
Oh and while I think of it, over at the left of the first category, on the edge of the wrapper, is the new go-to-top and go-to-bottom buttons. I used these elsewhere and they rock, because you can find them anywhere on any page (kinda handy in long threads, or the depths of admin).

They will stay put for height, and will always stay sitting on the edge of the wrapper regardless of width settings or screen res. Try them first before grumbling about them. :D
Title: Re: Linktree and Dropmenu arrows..
Post by: Bloc on June 21, 2013, 04:32:23 am
Nice effect on the arrow for top/bottom page :D - but IMHO they are way to prominent now. I would put them a bit more out of the way. Nice on mobile or narrow screens of course...but on normal widths it feels too much like "in your face".Like you just HAVE to press them. Truth told I am not too fond of things that follow you anyway, they detract from my focus. At the most I can tolerate a constant top/bottombar - but not those things that magically follow you around. Others may disagree of course.

About the arrows on dropmenu - I would much rather go for some kind of triangle shape, to hint theres a menu below, can't say I have seen the Wilhelm Tell arrows in use lol.But thats not to say they aren't used somewhere.

There, done grumbling for now lol.

/me wonder how much grumbling there will be for all the changes done in his own work. Prob too much to worry about now lol.
Title: Re: Linktree and Dropmenu arrows..
Post by: Antechinus on June 21, 2013, 04:46:24 am
How out of the way? Thing is I think the edge of the forum wrapper is the best place for them. Edge of screen is no good, unless you're one of those nutters who runs their themes at 100% so everyone has to chase lines of text five miles long. It's been known for yonks that lines of text longer than 80 characters get to be painful to read, which means themes really should be limited to somethng under 1200px to get a reasonable width on the content sections.

That in turn means you don't (or at least I don't) want the top/bottom buttons way off yonder. That just makes them less useful. Re the "in your face", I suspect you are really noticing them because they're new to you. I've been using these for ages and they don't grab you by the throat all the time. They're just there when you want them. They should also have a decent target size IMO. 16x16 targets are for fools. :D

Re arrows on drop menus: I think anything you do will look a bit doofus. If you want a really clean looking menu, live without the indicators. They're not in the markup anyway as they're only pseudo elements, so it's just a matter of commenting a couple of lines of CSS if you don't want them. I just thought I should code them so people had them ready made as an option.
Title: Re: Linktree and Dropmenu arrows..
Post by: Bloc on June 21, 2013, 08:22:10 am
Well, a more obvious choice would be on top/bottom, without them moving around with you. Its logical to read downwards, and when finished, go back up for whatever reason.You don't, or at least I don't, need to have them visible ALL the time, only when I reach the bottom - or being at the top and want to reach bottom.

Thats presents another question of course: why do you want to go up again for example? To get to the menu? Then maybe the menu should follow you instead. To read the top again? To get to the linktree? Thats already at the bottom(at least in topics)

One could argue that it could be in every post rather, so that it becomes part of the buttons, easily available when you need to go from the middle to top/bottom - but not want it hanging around like a irritating insect lmao. :)

Its unfortunelately always about "getting used to something", everything is new at one time or another..but the point is if it really is necessary or not to have it around like that. I think not..

Title: Re: Linktree and Dropmenu arrows..
Post by: Antechinus on June 21, 2013, 05:40:45 pm
Ok, you think not. Having it in every post would be worse. More markup, more clutter. What about admin pages? I've lost track of how many times I've been halfway down a long admin page and wanted to get to the menu. What about if someone changes their mind halfway through a page, and wants either the menu or the quick reply? I've done that too.

The thing is, you can either try to guesstimate where people might want such buttons, and then try to figure out how to add them all over the place, or you can just supply one pair of buttons that anyone can use anywhere. To me, the choice is obvious. When I introduced these buttons on the site I was running, they were an immediate hit. Nobody grumbled about them. Everyone found them useful. Quite apart from anything else, if you're idle and feeling silly, it's fun to just click them and watch the page whizz up and down with the jQuery scroll. :D

These aren't like those horrible floaty javascript-positioned whatnots that lag behind you and bounce up and down. These use CSS fixed positioning. They are always rock-solid stable. They just work. I suggest just using them for a week, and then deciding if you like them or not.
Title: Re: Linktree and Dropmenu arrows..
Post by: emanuele on June 21, 2013, 05:54:18 pm
Quote from: Antechinus – Ok, you think not. Having it in every post would be worse. More markup, more clutter. What about admin pages? I've lost track of how many times I've been halfway down a long admin page and wanted to get to the menu. What about if someone changes their mind halfway through a page, and wants either the menu or the quick reply? I've done that too.
But you are weird... :P

Quote from: Antechinus – and watch the page whizz up and down with the jQuery scroll. :D
I feel seasick when I click that buttons... (not joking)
Title: Re: Linktree and Dropmenu arrows..
Post by: Antechinus on June 21, 2013, 05:58:16 pm
I'm normal. Everyone who disagrees with me is weird. :P
Title: Re: Linktree and Dropmenu arrows..
Post by: Bloc on June 21, 2013, 06:08:31 pm
Same here. 8)

But yes, its a matter of trying out no doubt. Agree to disagree and all that, but in the end its forward thinking so I am not hellbent on persuading you from not adding/using them - not that i would be able I suspect lmao. :) The measure is (for me) is how well they fit with the design and then user's feedback. The thing with user feedback though, is that if they got to decide everything, you'll soon loose sight of what you actually started with. So its a compromise. (more on their part :P )
Title: Re: Linktree and Dropmenu arrows..
Post by: Antechinus on June 21, 2013, 06:28:45 pm
Ah yes. The "Let them eat brioche" theory. We all know where that got her. :D

I am confident that I can make these buttons look good, at least by my standards.  They also have benefits for less clutter/better looks in other areas. For instance, the page links and buttonlist areas more tolerant of smaller screens and/or larger font sizes, both of which are useful for some people. It also requires less code, and cleaner code, to run it. I find that appealing too. If anyone doesn't like the positioning or styling, it's very simple to change it to suit themselves.
Title: Re: Linktree and Dropmenu arrows..
Post by: Antechinus on June 21, 2013, 06:40:49 pm
Here ya go, mate. This is what they look like when you're into the page content. Not so bad, IMHO. :)

I did tweak the CSS a bit after looking at the originals again. First go was from memory and the arrows were a bit large.
Title: Re: Linktree and Dropmenu arrows..
Post by: TE on June 23, 2013, 08:45:31 am
I'm currently testing with these ones.
    \2026 for Level 2 subsection indicators
▼     \25BC for Level 1 subsection indicators  
»     \00BB for the linktree.

 

Title: Re: Linktree and Dropmenu arrows..
Post by: Antechinus on June 23, 2013, 05:15:40 pm
Yeah but ... tells me nothing. That was used in SMF 2.0.x for the subsection indicators and I, who was actually involved in the front end stuff for 2.0.x, did not realise what the silly little dots were until about a year or so after 2.0.x went gold. I think that gives a pretty good idea of how useful they really are. :D

Double right pointy thing has been done to death on SMF linktrees since time immemorial. I've never liked it much. I'm currently running this on local for the linktree:

Code: [Select]
/* Sized carefully for stability with non-standard font sizes. */
.linktree:after {
content:" \21D2";
font-size: 1.5em;
line-height: 1.4em;
position: absolute;
top: 0;
right: 0.3em;
display: block;
color: #888;
}
#ie .linktree:after {
line-height: 1.6em;
}

Looks much better IMO. Could also work for level 2 subsection indicators too. Try it and see what you think.
Title: Re: Linktree and Dropmenu arrows..
Post by: TestMonkey on June 25, 2013, 07:59:42 am
Quote from: Bloc – Nice effect on the arrow for top/bottom page :D - but IMHO they are way to prominent now. I would put them a bit more out of the way. Nice on mobile or narrow screens of course...but on normal widths it feels too much like "in your face".Like you just HAVE to press them. Truth told I am not too fond of things that follow you anyway, they detract from my focus. At the most I can tolerate a constant top/bottombar - but not those things that magically follow you around.
Agree. It's... terrible! Some "constant" corner maybe, but these things following you around make the experience ... argh. It's not helpful IMO, it screams "I know better than you what you need, click me click me click me"
Title: Re: Linktree and Dropmenu arrows..
Post by: Antechinus on June 25, 2013, 09:34:58 am
Can't please all the people all of the time. Go mad trying. :D

I could point you at a bunch of people who think that sort of button is great, including myself of course. Corner? No good. Too far out of reach. Fitt's Law FTW.

Suggestion: use them for a week first, then see if you still hate them. My guess is you're fixating on them because they are new.

Options: make it a user setting. Fixed or old style.
Title: Re: Linktree and Dropmenu arrows..
Post by: TestMonkey on June 25, 2013, 09:47:28 am
Quote from: Antechinus – Corner? No good. Too far out of reach. Fitt's Law FTW.
I wasn't suggesting 'corner' for the up/down buttons. I think corner is something that can stay on the page while you scroll - like a moderation bar or something. It doesn't strike as bad as 'following you on the page' up-down buttons in the middle of the page.

QuoteSuggestion: use them for a week first, then see if you still hate them. My guess is you're fixating on them because they are new.
I hate things that follow you on the page. I hate them. ;D

/me changes timestamps to one week after 'cause it'll be the same. :P


PS: I'm not joking on hating them (sorry!), but I'm joking on the week, in case it ain't clear. :) Experiment with whatever for a week or whatnot. Experiment FTW.
Title: Re: Linktree and Dropmenu arrows..
Post by: Antechinus on June 25, 2013, 09:56:33 am
I only hate obtrusive ones, especially if they lag or bounce or whatever. Those drive me up the wall. Ones that are solidly positioned and styled fairly conservatively don't bother me, and I find them useful. And they're not in the middle of the page. They're off to the side of the page, clear of the content. :D

Anywayz I'll go with the flow on this, as long as if you decide to keep the old ones you make them work properly. If it says up, it should go up. Right up. All the way. Ditto for down. None of this traditional SMF stuff that forces you to scroll manually because it stops before you want it to. :P.

Mind you, I really do think the traditional location is next to useless. I hardly ever use the old style, because they're hardly ever accessible. I use the fixed ones quite a lot.
Title: Re: Linktree and Dropmenu arrows..
Post by: emanuele on June 25, 2013, 10:05:06 am
/me likes things that stay there while the screen moves around (at least it's easier to point them when drunk :P).

Seriously, I think as soon as Ant stops changing the theme, I'd like to try a more "fixed" theme with some elements dragged around the page as I already experimented with the moderation buttons.
Title: Re: Linktree and Dropmenu arrows..
Post by: Antechinus on June 25, 2013, 10:09:08 am
Wotcha mean "more fixed"? More things that stay put? TBH I don't at all mind a fixed menu, and in testing with non-techy types it's been found that people are able to navigate sites faster if the menu is constantly available (which really shouldn't be surprising).

Then again, I have a 1050 high screen, and I've stripped the Firefox interface down so it takes up less space than Chrome's, so I have a fair amount of height to play with. Someone on a 1366x768 may feel differently about it.

Anyway, fixing stuff is easy, as is making it show on clicky or hover or anything else.

ETA: I could always try moving those buttons and see where they annoy Norv least. OTOH, its kinda fun being annoying. :P
Title: Re: Linktree and Dropmenu arrows..
Post by: emanuele on June 25, 2013, 10:35:55 am
lol

Yes: position: fixed.

Well, what I have in mind is always something "extreme" ( /me doesn't like to play with boring things), so fixed may be: menu, moderation buttons, page index, "topic buttons" (reply/add poll/etc), jump to, from time to time I think to a quick reply too (maybe a button in a corner, but that would fit only with an ajax reply of sort), the bar with the search, maybe something else.

Of course personal interpretation not to force on a default theme, but something I want to play with (and I started to play with it in my "minimalist extreme" (that at the moment is abandoned because of lack of time and a bit of interest, I have to revive it :P), but reverted because the effect was not as nice as I wanted it to be).
Title: Re: Linktree and Dropmenu arrows..
Post by: Bloc on June 25, 2013, 11:32:42 am
Actually..having the top stays the same - which contains menu and linktree - possibly moving any pageindex up there - is a interesting idea for a theme.
Title: Re: Linktree and Dropmenu arrows..
Post by: Antechinus on June 25, 2013, 06:18:03 pm
Hmm. I kinda like that idea, but it would take quite a bit of screen height to do it nicely. Worthy of some sort though.
Title: Re: Linktree and Dropmenu arrows..
Post by: Antechinus on June 25, 2013, 07:39:29 pm
Ok, if the up/down buttons are bugging you, try this on your local:

Find:
Code: [Select]
#gotop, #gobottom {
position: fixed;
z-index: 9;
display: block;
margin: 8.5em 0 0 -0.65em;
padding: 0 0.3em;
height: 2.1em;
border: 1px solid #bbb;
border-radius: 7px 3px 0 0;
background: #ebebeb;
background-image: linear-gradient(to bottom, #ebebeb 0%, #c6c6c6 100%);
font-size: 1.5em;
line-height: 2.1em;
}
#gobottom {
margin-top: 10.6em;
border-radius: 0 0 3px 7px;
}
#gotop:hover, #gobottom:hover {
background: #eee;
text-decoration: none;
}


Replace:
Code: [Select]
#gotop, #gobottom {
position: fixed;
right: 0;
z-index: 9;
display: block;
margin: 8.5em -0.1em 0 0;
padding: 0 0.3em;
height: 2.1em;
border: 1px solid #bbb;
border-radius: 7px 3px 0 0;
background: #ebebeb;
background-image: linear-gradient(to bottom, #ebebeb 0%, #c6c6c6 100%);
font-size: 1.5em;
line-height: 2.1em;
opacity: 0.7;
}
#gobottom {
margin-top: 10.6em;
border-radius: 0 0 3px 7px;
}
#gotop:hover, #gobottom:hover {
text-decoration: none;
opacity: 1;
}
Title: Re: Linktree and Dropmenu arrows..
Post by: Antechinus on July 03, 2013, 12:55:03 am
I had an idea for the droppy indicators (which I should have thought of yonks ago). Only make them show up on hover. D'oh. :P

This works well, if the button height and width is increased a little:

Code: [Select]
.listlevel1 {
position: relative;
float: left;
padding: 1px;
font-size: 0.929em;
line-height: 2.5em;
}

and:

Code: [Select]
/* Level 1 Menu bar: link or button. */
#main_menu .linklevel1, .admin_menu .linklevel1, #adm_submenus .linklevel1 {
display: block;
padding: 0 0.6em;
}

With the indicator code simplified to this:

Code: [Select]
/* Top level subsection indicators. */
/* Comment these out if you don't want them. */
.subsections:hover .linklevel1:after {
position: absolute;
top: 0.8em;
right: 0.7em;
content:" \2228";
}
Title: Re: Linktree and Dropmenu arrows..
Post by: Antechinus on July 08, 2013, 10:47:56 pm
Hey fun with media queries.

Some nutters (not mentioning any names) have been known to be obsessed with using the sidebar menu in an 800 window, and then grumbling that their favourite browser gives scrollbars on admin content at that res. Now you might figure that anyone who is bonkers enough to use a sidebar menu in admin on 800 res deserves all the scrollbars they get, and shouldn't grumble about it, or shouldn't be taken seriously if they do.

However, we have media queries now, which means we can do stuff like this if we want to (or more accurately, if it'll stop nutters grumbling at us)........................

Not sure if this is worth including in default or not, but it might as well get posted for discussion/bunfights..
Title: Re: Linktree and Dropmenu arrows..
Post by: emanuele on July 09, 2013, 03:06:53 am
Pretty cool I'd say.
Title: Re: Linktree and Dropmenu arrows..
Post by: TE on July 09, 2013, 05:11:32 am
yep, well done.. I like it..
Title: Re: Linktree and Dropmenu arrows..
Post by: Antechinus on July 10, 2013, 04:08:33 am
Ok, couple of brainwaves. :P

Fer a start I now haz teh awesomesauce droppy indicators. They are #444 triangles underneath teh menu buttons, only appear on hover, and are hidden by the drop menu once that is opened. These look very neat, but still tell people there's a droppy there ('specially useful with click menus). Ok, that's one.

Second one is that infernal strong tag for the new PM indicator. That's a pain because it's handy to define strong tags as being slightly lighter color than standard body text. That inteferes with the menu's PM indicator, and makes for special stuffz just to deal with it.

So, clever idea: don't use a strong tag for the PM indicator. There's no need to. It doesn't really do anything. Don't say "Yebbut a11y!". It wont do anything for a11y, for two reasons. First, blind peeps can't see the text anyway, so unless they are actually reading that specific button title they wont know about it. Second, apparently the whole fuss about strong tags being better for a11y than plain old b tags is nonsense. Ditto nonsense for em tags as opposed to i tags.

Why? Because screen reader users have the thing speaking so quickly (you should hear them go) that most screen readers just completely ignore strong, b, em and i tags. They simply don't have time to mess around with different voice emphasis when they're going 300 miles an hour. So, we don't really have to worry about strong tags for a11y.

This means we can just use a span for the main menu indicator, which can have special css if you want it fancy, or can just be ignored if you want it basic. :)
Title: Re: Linktree and Dropmenu arrows..
Post by: Antechinus on July 11, 2013, 09:52:58 am
Ok, here ya go. I'm loving these. The droppy under "Help" is related to this blithering over at GitHub (https://github.com/elkarte/Elkarte/issues/653).

I think this arrangement is much better use of menu bar space. It gets logout out of the way, without hiding it somewhere weird or needing extra markup and css. This means the main part of the menu is stuff people will be wanting to use regularly (like unread posts and new replies, etc). The "active" button background on the header collapse button gives a nice left/right balance to the top of the theme.

The rest is just other stuff I've been working on. Looks a lot cleaner and more up to date, IMO, and I've rationalised the css so that all buttons call as much of the same code as possible. Methinks the droppy indicators are now cool too. All css, and seem to be stable in all browsers we're supporting. Got the linktree sorted too, but you can wait to see that. :D
Title: Re: Linktree and Dropmenu arrows..
Post by: TE on July 11, 2013, 10:49:25 am
wow, that's really good, much better than before :)
Title: Re: Linktree and Dropmenu arrows..
Post by: Spuds on July 11, 2013, 11:21:09 am
Thats a nice improvement to be sure  :)  ..... I think we should consider another title than 'help" for the new combined menu.
Title: Re: Linktree and Dropmenu arrows..
Post by: IchBin on July 11, 2013, 02:46:45 pm
Definitely like the logout like that. Not so sure about your menu arrangement like Spuds said. :)
Title: Re: Linktree and Dropmenu arrows..
Post by: Bloc on July 11, 2013, 04:19:49 pm
Yep, better this way. :)

Whats the arrow below my messages in second thumb suppose to be?
Title: Re: Linktree and Dropmenu arrows..
Post by: Antechinus on July 11, 2013, 05:53:47 pm
The arrow is the indicator that the top level tab has a drop menu. Perhaps not so important with hover menus, but I think worth having with the click menu option, particularly for people who are new to the site in question. I don't think it's worth extra code for conditional stuffz, so might as well just run the indicators by default, IMO. :)


Quote from: Spuds – Thats a nice improvement to be sure  :)  ..... I think we should consider another title than 'help" for the new combined menu.
Something basic, like "General", or "Community"? I did think of just putting them under the Home tab, but if we're going to have a front page as a default option I'm not sure what will happen with the home tab.

ETA: Having thought about several options, I think it should just be titled "General" for now. It's obvious, and covers everything, without tying it down to irrelevant meanings.

I'd still make the top level link to the Help page by default, just so it does something if somebody clicks it.
Title: Re: Linktree and Dropmenu arrows..
Post by: Antechinus on July 11, 2013, 07:11:26 pm
Oh here ya go: new linktree. All css of course. Seems stable. Looks cool. Hey ho.
Title: Re: Linktree and Dropmenu arrows..
Post by: Bloc on July 11, 2013, 07:58:41 pm
Quote from: Antechinus – The arrow is the indicator that the top level tab has a drop menu. Perhaps not so important with hover menus, but I think worth having with the click menu option, particularly for people who are new to the site in question. I don't think it's worth extra code for conditional stuffz, so might as well just run the indicators by default, IMO. :)


Oh, lol, I thought it was showing a preview of personal messages or something. It reminded me alot of a speech bubble there...so I looked underneath to find whatever was being "said". :D Or who "said" the menu so to speak, since the arrow points down to a possible speaker. Wild.
Title: Re: Linktree and Dropmenu arrows..
Post by: Antechinus on July 11, 2013, 08:06:08 pm
Rofl. Well you know gui stuff: no matter what you implement or how much you think about it, somebody, somewhere, sometime is bound to do a double take. I think it'll be clear enough in practice. I probably should have used another button for the example, since the combo of droppy indicator and new PM indicator may not have been the best for a static screenshot. :D
Title: Re: Linktree and Dropmenu arrows..
Post by: Antechinus on July 11, 2013, 08:09:12 pm
Here, try this. :D

Oh and before anyone asks, the reason the indicator isn't centered under the tab is because I found I tend to aim for the middle with the cursor. So, having the indicator offset to the right means it's more likely to be visible when the cursor is sort of over the button (since it will never be exact).
Title: Re: Linktree and Dropmenu arrows..
Post by: Antechinus on July 12, 2013, 02:04:01 am
Hey here's an idea for menu stuffz.

I'm pretty much convinced that having no separate "Home" button is the right way to go. Even when using the click menus (prevent default on the top level links) there are still three ways to get to the home page: h1/banner, right click > open in new tab on Home button, or the linktree/breadcrumbs. Even if someone is using click menus and doesn't know about right click tricks, they still have the linktree at the top and bottom of most pages.

OTOH, starting with a button labelled "General" would be a bit off-putting IMO. So re-label the Home button as "Community" and stick most stuff under it (Help, Search, blah blah blah). That's welcoming and gets rid of a whole lot of stuff.

Could extend this idea further.

Profile isn't visited that often, in my experience. It tends to be set and forget. So, we could have another button labelled "Personal" that does PM's first, with profile stuffz linked from its droppy.

We could even have a "Staff" tab to handle both admin and moderation links. That could, if anyone feels like it, include a top level link to an actual staff page/list, which might be a handy feature for a lot of sites.

So that would cut the menu down to Community, Staff, Personal, Unread posts and New Replies, with logout over at the far right by itself. That should leave heaps of space for mods to mindlessly spew out a pile of tabs and clutter it all up again. :D

Speaking of which, it would be possible to not spew out top level tabs for all mods, and put a hook in the Community droppy yes? ;)
Title: Re: Linktree and Dropmenu arrows..
Post by: Arantor on July 12, 2013, 02:51:35 am
That last point, of course it would be possible, just that most mods don't because it's kind of a hassle even when using hooks to do so (since visibility of a lower item doesn't magically cascade back upwards, as I found with SimpleDesk - a user could be a helpdesk admin and thus entitled to be able to visit some of the admin panel but the admin menu would otherwise be hidden to them)
Title: Re: Linktree and Dropmenu arrows..
Post by: Antechinus on July 12, 2013, 03:09:33 am
Yeah but that's just because nobody bothers to edit the top level permissions, which should be perfectly possible. Anyway, it wouldn't apply to the Community tab, since that would be visible to all. So, that one should be a safe place to add anything.
Title: Re: Linktree and Dropmenu arrows..
Post by: Arantor on July 12, 2013, 03:13:29 am
Well... I did bother to deal with it ;) But yeah, in general I agree with what you're saying.

The only concern about having a menu like that is that I kind of see it like the Mod Settings page in the admin panel: you have two places you're encouraging people to add stuff, one little container for small stuff and one much larger container for bigger stuff but no-one will do it the way you expect, and the containers you do have won't necessarily be suitable for as many people as you think.

Most of the mods out there currently that add menu items, how many of them really would move to a very generic menu that's likely to grow enormous?
Title: Re: Linktree and Dropmenu arrows..
Post by: Antechinus on July 12, 2013, 03:24:13 am
Is it likely to grow enormous though? That would depend on the site I think. For a lot of sites, it should be perfectly adequate. But, there's no reason why this couldn't be an additional hook, rather than the only one. So call the one you want, and put your links there.

Now admittedly, most mod authors will want their willy waving in the breeze where everyone can see it, so they aint all that likely to use a droppy when they have the option of getting in people's faces. It could still be an option though.

If a full-on menu editor is not on the cards for Elk 1.0 (probably aint) then having mods coded so you can pick link location on installation would be rather nifty, and should be possible.
Title: Re: Linktree and Dropmenu arrows..
Post by: Antechinus on July 12, 2013, 03:41:49 am
Just thinking about this idea of basic division into Community, Staff and Personal. It should be easy to arrange, and has a nice logic to it IMO. Take the moderation/admin stuff. At the moment it has this:

Code: [Select]
			'moderate' => array(
'title' => $txt['moderate'],
'href' => $scripturl . '?action=moderate',
'show' => $context['allow_moderation_center'],
'sub_buttons' => array(

So I can't see why we couldn't do something like this:

Code: [Select]
			'staff' => array(
'title' => $txt['staff'],
'href' => $context['allow_admin'] ? $scripturl . '?action=admin : $scripturl . '?action=moderate',
'show' => $context['allow_moderation_center'],
'sub_buttons' => array(

With stuff under it to suit (probably admin stuff on top for admins).
Title: Re: Linktree and Dropmenu arrows..
Post by: Antechinus on July 12, 2013, 05:47:25 am
Just tried it. I like. Space for another four buttons on a 1024 screen, at default 90% theme width setting. Good scope there for more mods, and/or non-standard font size in browser preferences, and/or smaller screens. I could live with this.
Title: Re: Linktree and Dropmenu arrows..
Post by: Bloc on July 12, 2013, 06:24:39 am
Theres a solution to the problem where mods add themselves to a crowded "community" area: let the admin decide which goes where, even into other submenus if need be. :) Its one of the things people always ask for, how to change the menu. If you make such a feature, even if a mod decided to hardcode its placement, admins will complain to that particular mod that doesn't follow the routines, thus keeping things in line.

Of course, admins can also make a total mess out of it..but thats on them then. One could additionally set some boundaries in the template, like over 10 items you get a scrollbar etc.
Title: Re: Linktree and Dropmenu arrows..
Post by: TE on July 12, 2013, 07:19:53 am
I'd rename "staff" to "manage" and "personal" with the members display name  8)
Apart from that I love it  :) It's modern and way better organized.
Title: Re: Linktree and Dropmenu arrows..
Post by: Antechinus on July 12, 2013, 08:22:57 am
You can do that on your site. You have access to the admin language string editor. ;)

My 2c: I'd prefer "Staff" and "Personal". I don't need my name on the tab, and it would feel weird. Sorta like talking to yourself or something. Kinda nutty. I'd be thinking "No I'm not there. I'm here and looking at that imposter which is only button but thinks it's me". :D

Personal fits better IMO, because it's my personal stuff (Pm's and profile).

Or, we could use the title I suggested back at SMF once: My Shiznit instead of My Messages.

BTW, current array code looks like this:

Code: [Select]
	// All the buttons we can possible want and then some, try pulling the final list of buttons from cache first.
if (($menu_buttons = cache_get_data('menu_buttons-' . implode('_', $user_info['groups']) . '-' . $user_info['language'], $cacheTime)) === null || time() - $cacheTime <= $modSettings['settings_updated'])
{
$buttons = array(

'logout' => array(
'title' => $txt['logout'],
'href' => $scripturl . '?action=logout;%1$s=%2$s',
'show' => !$user_info['is_guest'],
'sub_buttons' => array(
),
),
'home' => array(
'title' => $txt['community'],
'href' => $scripturl,
'show' => true,
'sub_buttons' => array(
'help' => array(
'title' => $txt['help'],
'href' => $scripturl . '?action=help',
'show' => true,
'sub_buttons' => array(
),
),
'search' => array(
'title' => $txt['search'],
'href' => $scripturl . '?action=search',
'show' => $context['allow_search'],
'sub_buttons' => array(
),
),
'calendar' => array(
'title' => $txt['calendar'],
'href' => $scripturl . '?action=calendar',
'show' => $context['allow_calendar'],
'sub_buttons' => array(
'view' => array(
'title' => $txt['calendar_menu'],
'href' => $scripturl . '?action=calendar',
'show' => allowedTo('calendar_post'),
),
'post' => array(
'title' => $txt['calendar_post_event'],
'href' => $scripturl . '?action=calendar;sa=post',
'show' => allowedTo('calendar_post'),
'is_last' => true,
),
),
),
'memberlist' => array(
'title' => $txt['members_title'],
'href' => $scripturl . '?action=memberlist',
'show' => $context['allow_memberlist'],
'sub_buttons' => array(
'mlist_view' => array(
'title' => $txt['mlist_menu_view'],
'href' => $scripturl . '?action=memberlist',
'show' => true,
),
'mlist_search' => array(
'title' => $txt['mlist_search'],
'href' => $scripturl . '?action=memberlist;sa=search',
'show' => true,
'is_last' => true,
),
),
),
),
),

'admin' => array(
'title' => /*$context['allow_admin'] ? $txt['admin'] : $txt['moderate']*/'Staff',
'href' => $context['allow_admin'] ? $scripturl . '?action=admin' : $scripturl . '?action=moderate',
'show' => $context['allow_moderation_center'],
'sub_buttons' => array(
'admin_center' => array(
'title' => $txt['admin_center'],
'href' => $scripturl . '?action=admin',
'show' => $context['allow_admin'],
),
'featuresettings' => array(
'title' => $txt['modSettings_title'],
'href' => $scripturl . '?action=admin;area=featuresettings',
'show' => allowedTo('admin_forum'),
),
'packages' => array(
'title' => $txt['package'],
'href' => $scripturl . '?action=admin;area=packages',
'show' => allowedTo('admin_forum'),
),
'permissions' => array(
'title' => $txt['edit_permissions'],
'href' => $scripturl . '?action=admin;area=permissions',
'show' => allowedTo('manage_permissions'),
),
'errorlog' => array(
'title' => $txt['errlog'],
'href' => $scripturl . '?action=admin;area=logs;sa=errorlog;desc',
'show' => allowedTo('admin_forum') && !empty($modSettings['enableErrorLogging']),
),
'moderate_sub' => array(
'title' => $txt['moderate'],
'href' => $scripturl . '?action=moderate',
'show' => $context['allow_admin'],
'is_last' => true,
'sub_buttons' => array(
'reports' => array(
'title' => $txt['mc_reported_posts'],
'href' => $scripturl . '?action=moderate;area=reports',
'show' => !empty($user_info['mod_cache']) && $user_info['mod_cache']['bq'] != '0=1',
'is_last' => true,
),
'modlog' => array(
'title' => $txt['modlog_view'],
'href' => $scripturl . '?action=moderate;area=modlog',
'show' => !empty($modSettings['modlog_enabled']) && !empty($user_info['mod_cache']) && $user_info['mod_cache']['bq'] != '0=1',
),
'attachments' => array(
'title' => $txt['mc_unapproved_attachments'],
'href' => $scripturl . '?action=moderate;area=attachmod;sa=attachments',
'show' => $modSettings['postmod_active'] && !empty($user_info['mod_cache']['ap']),
),
'poststopics' => array(
'title' => $txt['mc_unapproved_poststopics'],
'href' => $scripturl . '?action=moderate;area=postmod;sa=posts',
'show' => $modSettings['postmod_active'] && !empty($user_info['mod_cache']['ap']),
),
'postbyemail' => array(
'title' => $txt['mc_emailerror'],
'href' => $scripturl . '?action=admin;area=maillist;sa=emaillist',
'show' => !empty($modSettings['maillist_enabled']) && allowedTo('approve_emails'),
),
),
),
'moderate' => array(
'title' => $txt['moderate'],
'href' => $scripturl . '?action=moderate',
'show' => !$context['allow_admin'],
),
'reports' => array(
'title' => $txt['mc_reported_posts'],
'href' => $scripturl . '?action=moderate;area=reports',
'show' => !$context['allow_admin'] && !empty($user_info['mod_cache']) && $user_info['mod_cache']['bq'] != '0=1',
),
'modlog' => array(
'title' => $txt['modlog_view'],
'href' => $scripturl . '?action=moderate;area=modlog',
'show' => !$context['allow_admin'] && !empty($modSettings['modlog_enabled']) && !empty($user_info['mod_cache']) && $user_info['mod_cache']['bq'] != '0=1',
),
'attachments' => array(
'title' => $txt['mc_unapproved_attachments'],
'href' => $scripturl . '?action=moderate;area=attachmod;sa=attachments',
'show' => !$context['allow_admin'] && $modSettings['postmod_active'] && !empty($user_info['mod_cache']['ap']),
),
'poststopics' => array(
'title' => $txt['mc_unapproved_poststopics'],
'href' => $scripturl . '?action=moderate;area=postmod;sa=posts',
'show' => !$context['allow_admin'] && $modSettings['postmod_active'] && !empty($user_info['mod_cache']['ap']),
),
'postbyemail' => array(
'title' => $txt['mc_emailerror'],
'href' => $scripturl . '?action=admin;area=maillist;sa=emaillist',
'show' => !$context['allow_admin'] && !empty($modSettings['maillist_enabled']) && allowedTo('approve_emails'),
),
),
),

'pm' => array(
'title' => 'Personal'/*$txt['pm_short']*/,
'href' => $context['allow_pm'] ? $scripturl . '?action=pm' : $scripturl . '?action=profile',
'show' => $context['allow_pm'] || $context['allow_edit_profile'],
'sub_buttons' => array(
'pm_read' => array(
'title' => $txt['pm_menu_read'],
'href' => $scripturl . '?action=pm',
'show' => allowedTo('pm_read'),
),
'pm_send' => array(
'title' => $txt['pm_menu_send'],
'href' => $scripturl . '?action=pm;sa=send',
'show' => allowedTo('pm_send'),
'is_last' => true,
),
'profile' => array(
'title' => $txt['profile'],
'href' => $scripturl . '?action=profile',
'show' => $context['allow_edit_profile'],
'sub_buttons' => array(
'account' => array(
'title' => $txt['account'],
'href' => $scripturl . '?action=profile;area=account',
'show' => allowedTo(array('profile_identity_any', 'profile_identity_own', 'manage_membergroups')),
),
'profile' => array(
'title' => $txt['forumprofile'],
'href' => $scripturl . '?action=profile;area=forumprofile',
'show' => allowedTo(array('profile_extra_any', 'profile_extra_own')),
'is_last' => true,
),
'theme' => array(
'title' => $txt['theme'],
'href' => $scripturl . '?action=profile;area=theme',
'show' => allowedTo(array('profile_extra_any', 'profile_extra_own', 'profile_extra_any')),
),
),
),
),
),

'unread' => array(
'title' => /*$txt['view_unread_category']*/'New Posts',
'href' => $scripturl . '?action=unread',
'show' => !$user_info['is_guest'],
'sub_buttons' => array(
),
),

'updated' => array(
'title' => $txt['view_replies_category'],
'href' => $scripturl . '?action=unreadreplies',
'show' => !$user_info['is_guest'],
'sub_buttons' => array(
),
),

'login' => array(
'title' => $txt['login'],
'href' => $scripturl . '?action=login',
'show' => $user_info['is_guest'],
'sub_buttons' => array(
),
),

'register' => array(
'title' => $txt['register'],
'href' => $scripturl . '?action=register',
'show' => $user_info['is_guest'] && $context['can_register'],
'sub_buttons' => array(
),
'is_last' => !$context['right_to_left'],
),

);

There are a few stray details to clean up, but it's basically sorted.
Title: Re: Linktree and Dropmenu arrows..
Post by: TE on July 12, 2013, 08:40:00 am
I'd  associate staff with a staff page or something similar.. How about "control" or "control panel"?
Title: Re: Linktree and Dropmenu arrows..
Post by: Antechinus on July 12, 2013, 08:49:18 am
Well you can call yours whatever you like, and so can any other admin, so as long as it's clear and not insane I think just about any name is fine for default.

I associate staff with the "staff room", which is what we used to call the private staff boards (and we called them staff boards too, and so do other sites I've been on), so it works for me. Control sounds a bit too megalomanic for my taste. I'm not too worried about it all though. Hey ho.

Anyway speaking of staff page, I had thought that the staff tab (if labelled as such for ordinary member view) would be a handy place to have links to contact form, staff page, etc. Those aren't standard features now, but would be easy to implement and are potentially useful and popular. Admins and mods wouldn't really need to see those pages straight from a tab, so it could make the one tab do three different and useful things, depending on who is looking at it.

Anyway, sleep. Later. :)
Title: Re: Linktree and Dropmenu arrows..
Post by: Arantor on July 12, 2013, 11:51:50 am
The problem with that, Bloc, is that either the mod author has to go out of their way to do what is otherwise a simple enough task or there needs to be a menu editor. Writing a good menu editor is actually very difficult, as evidenced by the multiple attempts thus far with varying levels of success...

And we all know how much mod authors love doing things that they don't feel they should have to do...
Title: Re: Linktree and Dropmenu arrows..
Post by: Bloc on July 12, 2013, 01:45:37 pm
Oh don't get me wrong, I am not so keen on a full-blown editor myself. But I see some choice must be there, for admins or mods as it may be. I believe the way is to split up the menu, like suggested in this topic, for my part i already split it up into a not-forum part and pure-forum part(located around the username).

But I revised this and think I will limit the menu around username/welcome text to just the personal ones, like pm, profile,replies and so on, with a forum submenu containg the other forum parts in the main menu.

What Elkarte will do is of course up to the guys here. :D