{"issue":{"state":"open","created_at":"2011-11-20T12:56:59Z","updated_at":"2011-12-06T20:33:05Z","user":{"gravatar_id":"1b32fae892ca31c0f0c46eb7c7cc3964","id":170682,"url":"https://api.github.com/users/eKoeS","login":"eKoeS","avatar_url":"https://secure.gravatar.com/avatar/1b32fae892ca31c0f0c46eb7c7cc3964?d=https://a248.e.akamai.net/assets.github.com%2Fimages%2Fgravatars%2Fgravatar-140.png"},"comments":11,"body":"_This document will be updated as the discussion evolves. **Please make sure to read the summary before posting.** If you want your name to appear in one of the \"Likes\" array, please clearly express your preferences._\r\n\r\nYou can resume reading from [here](https://github.com/symphonycms/symphony-2/issues/905#issuecomment-2885207).\r\n\r\n### Deadline \r\nThis issue must be marked as solved before **February 30, 2011**\r\n\r\n### Contributing\r\n\r\n1. Create a repo called `<username>.github.com`. Your repo will be accessible by the following URL: `http://<username>.github.com/`\r\n2. Import all the files listed in this repo: https://github.com/nilshoerrmann/symphony-styles\r\n3. Make your changes\r\n4. Push your changes to your own repo and notify all the partecipants to this discussion, along with a **detailed explanation** of what has changed and why.\r\n\r\n## Open questions\r\n\r\n1. Fully dark/light navigation or light-on-dark/dark-on-light?\r\n   1. If fully light: dark hover state or light hover state?\r\n\r\n## Proposals\r\n\r\n### 1. Light dropdowns on light navigation (by @nilshoerrmann)\r\n\r\nhttp://projekte.nilshoerrmann.de/symphony-styles/symphony.htm\r\n\r\n_Likes_: @brendo, @eKoeS\r\n\r\n@nils-werner:\r\n\r\n> To me, the bright menu simply doesn't do it. Even with short menus it is kind of tricky to make out the menu from the content table or even the background. It is possible, but not immediately visible: http://www.phoque.de/workspace/uploads/bilder/Bright.png.\r\n\r\n> Now if the menu grows in length the issue becomes much more troublesome: In the worst case the lines of the content table lign up perfectly with the menu items, almost camouflaging them completely. Again, you can read them, but it takes quite an effort mentally and visually. http://www.phoque.de/workspace/uploads/bilder/Brightlong.png\r\n\r\n> Also, I believe there is a common scenario where people are searching the right submenu item by switching between main menu items quickly. It would be pretty hard to do as you're not only scanning for a line of text but always looking for the subtle hint that assures you've found the correct box in the first place.\r\n\r\n@nilshoerrmann:\r\n\r\n> I prefer the light version because it feels more consistent with the 2.0 and 2.1 releases of Symphony. I understand the need of contrast but that's a thing that should be solvable in both, a dark or a light design. Has anyone ever complained about the contrast of the current 2.1 drop downs? If no, why are they working compared to the updated ones? (That's serious question!)\r\n\r\n### 1A. Dark hover state on light navigation (by @nilshoerrman, @ekoes)\r\n\r\n![](http://www.phoque.de/workspace/uploads/bilder/disconnected.png)\r\n\r\n_Likes_:\r\n\r\n@nils-werner:\r\n\r\n> The background-color of the active menu item and the dropdown are severely disconnected: Making the active element darker than the default state but invoking a bright-white dropdown visually disconnects those two for me. But then, the menubar hover-color is not even the same shade of grey than the dropdown hover-color. Another disconnect.\r\n\r\n### 1B. White hover state on light navigation (by @nilswerner, @nickdunn)\r\n\r\n![](http://www.phoque.de/workspace/uploads/bilder/connected.png)\r\n\r\n_Likes_: @nickdunn, @brendo, @eKoeS, @nilshoerrmann\r\n\r\n@nils-werner:\r\n\r\n> I see the backend as an attempt to visually recreate a realistic, haptic surface. So I see things as actually beveled, hovering, sitting on top or besides one another. This implies that every fade, dropshadow, textshadow, border etc. would actually make sense from a perspective point of view. I guess we're all seeing that but I just wanted to make sure you know where I am coming from here.\r\n\r\n> Giving the active item and the dropdown the same background color makes the dropdown appear to be one single component, hovering above the main menu bar.\r\n\r\n> By having the same background-color, the two elements feel connected again and the dropshadow makes sense as there is a noticeable distance between the dropdown and the background: http://www.phoque.de/workspace/uploads/bilder/IMG_3947.JPG\r\n\r\n@eKoeS:\r\n\r\n> The only thing that I don't like is the absence of any visual difference between the \"outmost\" `<li>` and the sub items (same font, same size, etc.)\r\n\r\n### 2. Dark dropdowns on light navigation (by @nils-werner)\r\n\r\nhttp://www.phoque.de/workspace/uploads/bilder/Dark.png\r\n\r\n_Likes_:\r\n\r\n@nils-werner:\r\n\r\n> If the menu was visually disconnected from the content by a high-contrast box, those issues are solved almost immediately. You don't have to make sure your eyes stay inside the menu box, the contrast does that for you. You can always be sure you never switch reading-context by accident.\r\n\r\n> The same holds if the menu grows in size, everything stays perfectly readable and instantly recogniseable: http://www.phoque.de/workspace/uploads/bilder/Darklong.png\r\n\r\n@nilshoerrmann:\r\n\r\n> When styling the drop downs we have to make sure they are anchored at the right place. Just locking at contrasts, using dark drop downs makes the second menu level belong to the title bar and not the navigation bar itself. That's a big problem in my eyes and it's the main point why I think the dark drop down are a mess in the current context. [...] I think we should either go with a light navigation or a dark navigation – and that applies to the main and the sub menu.\r\n\r\n@brendo:\r\n\r\n> While I can see the argument for the dark navigation, I'm just not feeling it. It feels too disjointed and too much of a contrast at the moment.\r\n\r\n### 3. Flat navigation (by @DavidOliver)\r\n\r\n - [Light version](http://davidoliver.github.com/symphony.htm)\r\n - [Dark version](http://davidoliver.github.com/symphony-navdark.htm)\r\n\r\n@DavidOliver:\r\n\r\n> [Since] I don't like the style of the gradient in the nav bar in the main symphony-styles repo -- it seems at odds with the rest of the interface --, I had a go at the navigation. Not sure which approach (light/dark) I prefer to be honest. I agree there's a contrast issue with light dropdowns, but they still feel more right to me. [Also], I went more conservative with shadows in general.\r\n\r\n@nilshoerrmann:\r\n\r\n> Looking at the navigation, I really like the white style – but I'm not sure if the main navigation needs to be a bit more exposed visually.","assignee":null,"id":2292339,"pull_request":{"patch_url":null,"html_url":null,"diff_url":null},"labels":[{"name":"ux-ui","color":"36928B","url":"https://api.github.com/repos/symphonycms/symphony-2/labels/ux-ui"}],"number":905,"title":"2.3 UI: Navigation","html_url":"https://github.com/symphonycms/symphony-2/issues/905","closed_at":null,"url":"https://api.github.com/repos/symphonycms/symphony-2/issues/905","milestone":{"state":"open","created_at":"2011-06-16T04:12:36Z","due_on":"2012-02-27T08:00:00Z","closed_issues":43,"creator":{"gravatar_id":"6be8e584a0f454ac2dc7600bdeaca7b7","id":69268,"url":"https://api.github.com/users/brendo","login":"brendo","avatar_url":"https://secure.gravatar.com/avatar/6be8e584a0f454ac2dc7600bdeaca7b7?d=https://a248.e.akamai.net/assets.github.com%2Fimages%2Fgravatars%2Fgravatar-140.png"},"number":1,"description":"Symphony 2.3 is a UI Refresh release.\r\n\r\nThis release is tentatively scheduled for November. **Scope freeze will be October 2nd**\r\n\r\n#### UI Refresh\r\n\r\n- Complete UI Refresh\r\n- Removal of the Components page, instead the Utilities, Datasources and Events will have their own index pages\r\n- Addition of new widgets, Tabs, Notify and Drawer\r\n\r\n#### Datasource updates\r\n\r\n- The Remote JSON datasource can consume JSON natively\r\n- Multiple datasources parameters are now possible with the Sections datasource\r\n- Remote datasources now expose their cache information and allow users to clear the cache easily\r\n\r\n#### Field updates\r\n\r\n- Fields to have a publish label that is purely cosmetic for users in the backend\r\n- Field filtering abstracted so it can be added quickly and easily to Field extensions\r\n\r\n#### Manager improvements\r\n\r\n- All managers become static, removing the `$this->_Parent` notion\r\n- Performance improvements\r\n\r\n#### Core Email API updates\r\n\r\n- Updates to the Core Email API with performance, power and flexibility improvements\r\n\r\nA editorially controlled changelog is available [here](https://gist.github.com/1162216)","title":"2.3","open_issues":20,"url":"https://api.github.com/repos/symphonycms/symphony-2/milestones/1"}},"action":"created","comment":{"created_at":"2011-12-06T20:33:05Z","updated_at":"2011-12-06T20:33:05Z","user":{"gravatar_id":"b18fc48caab5bf7c3e2a15292972f05b","id":88704,"url":"https://api.github.com/users/nils-werner","login":"nils-werner","avatar_url":"https://secure.gravatar.com/avatar/b18fc48caab5bf7c3e2a15292972f05b?d=https://a248.e.akamai.net/assets.github.com%2Fimages%2Fgravatars%2Fgravatar-140.png"},"body":"2 or 1B for me.","id":3038245,"url":"https://api.github.com/repos/symphonycms/symphony-2/issues/comments/3038245"}}