<html><head><meta http-equiv="Content-Type" content="text/html charset=windows-1252"></head><body style="word-wrap: break-word; -webkit-nbsp-mode: space; -webkit-line-break: after-white-space; ">Hi all,<div><br></div><div>Here is the scenario to investigate the Android 4.0.4 issue again:</div><div><br></div><div><br></div><div>1- Navigate to <a href="http://aerogear.org">aerogear.org</a> (of course in my local :)), and tap menu button. Here is the screen:</div><div><br></div><div><a href="https://dl.dropboxusercontent.com/u/7848530/aerogear.org/Screenshot_2013-08-12-10-45-18.png">https://dl.dropboxusercontent.com/u/7848530/aerogear.org/Screenshot_2013-08-12-10-45-18.png</a></div><div><br></div><div><br></div><div>2- Tap menu button again to close the menu, here is the screen:</div><div><br></div><div><a href="https://dl.dropboxusercontent.com/u/7848530/aerogear.org/Screenshot_2013-08-12-10-45-25.png">https://dl.dropboxusercontent.com/u/7848530/aerogear.org/Screenshot_2013-08-12-10-45-25.png</a></div><div><br></div><div><br></div><div>3- Tap menu button again to open menu again. Here is the screen:</div><div><br></div><div><a href="https://dl.dropboxusercontent.com/u/7848530/aerogear.org/Screenshot_2013-08-12-10-45-34.png">https://dl.dropboxusercontent.com/u/7848530/aerogear.org/Screenshot_2013-08-12-10-45-34.png</a></div><div><br></div><div><br></div><div>4- Tap menu button again to close the menu. Here is the screen:</div><div><br></div><div><a href="https://dl.dropboxusercontent.com/u/7848530/aerogear.org/Screenshot_2013-08-12-10-45-41.png">https://dl.dropboxusercontent.com/u/7848530/aerogear.org/Screenshot_2013-08-12-10-45-41.png</a></div><div><br></div><div><br></div><div>If you then keep tapping the menu button to open and close the menu, it produces step 3 and 4 (step 3, then 4, then 3, then 4...).</div><div><br></div><div>When you refresh the page, flow jumps to step 1, then 2, then 3, then 4, then 3, then 4 and goes on.</div><div><br></div><div><br></div><div>Regards,<br><div>
<div style="color: rgb(0, 0, 0); font-family: Helvetica; font-size: medium; font-style: normal; font-variant: normal; font-weight: normal; letter-spacing: normal; line-height: normal; orphans: 2; text-align: -webkit-auto; text-indent: 0px; text-transform: none; white-space: normal; widows: 2; word-spacing: 0px; -webkit-text-size-adjust: auto; -webkit-text-stroke-width: 0px; "><br class="Apple-interchange-newline">---</div><div style="color: rgb(0, 0, 0); font-family: Helvetica; font-size: medium; font-style: normal; font-variant: normal; font-weight: normal; letter-spacing: normal; line-height: normal; orphans: 2; text-align: -webkit-auto; text-indent: 0px; text-transform: none; white-space: normal; widows: 2; word-spacing: 0px; -webkit-text-size-adjust: auto; -webkit-text-stroke-width: 0px; ">Yavuz Selim Yilmaz</div><div style="color: rgb(0, 0, 0); font-family: Helvetica; font-size: medium; font-style: normal; font-variant: normal; font-weight: normal; letter-spacing: normal; line-height: normal; orphans: 2; text-align: -webkit-auto; text-indent: 0px; text-transform: none; white-space: normal; widows: 2; word-spacing: 0px; -webkit-text-size-adjust: auto; -webkit-text-stroke-width: 0px; ">SUNY at Buffalo</div><div style="color: rgb(0, 0, 0); font-family: Helvetica; font-size: medium; font-style: normal; font-variant: normal; font-weight: normal; letter-spacing: normal; line-height: normal; orphans: 2; text-align: -webkit-auto; text-indent: 0px; text-transform: none; white-space: normal; widows: 2; word-spacing: 0px; -webkit-text-size-adjust: auto; -webkit-text-stroke-width: 0px; ">Computer Science and Engineering</div><div style="color: rgb(0, 0, 0); font-family: Helvetica; font-size: medium; font-style: normal; font-variant: normal; font-weight: normal; letter-spacing: normal; line-height: normal; orphans: 2; text-align: -webkit-auto; text-indent: 0px; text-transform: none; white-space: normal; widows: 2; word-spacing: 0px; -webkit-text-size-adjust: auto; -webkit-text-stroke-width: 0px; ">PhD Candidate</div>
</div>
<br><div><div>On Aug 12, 2013, at 8:41 AM, Yavuz Selim YILMAZ <<a href="mailto:yavuzsel@buffalo.edu">yavuzsel@buffalo.edu</a>> wrote:</div><br class="Apple-interchange-newline"><blockquote type="cite"><meta http-equiv="Content-Type" content="text/html charset=windows-1252"><div style="word-wrap: break-word; -webkit-nbsp-mode: space; -webkit-line-break: after-white-space; ">Hi,<div><br></div><div>Response inline.</div><div><br></div><div>Regards,<br><div>
<div style="font-family: Helvetica; font-size: medium; font-style: normal; font-variant: normal; font-weight: normal; letter-spacing: normal; line-height: normal; orphans: 2; text-align: -webkit-auto; text-indent: 0px; text-transform: none; white-space: normal; widows: 2; word-spacing: 0px; -webkit-text-size-adjust: auto; -webkit-text-stroke-width: 0px; "><br class="Apple-interchange-newline">---</div><div style="font-family: Helvetica; font-size: medium; font-style: normal; font-variant: normal; font-weight: normal; letter-spacing: normal; line-height: normal; orphans: 2; text-align: -webkit-auto; text-indent: 0px; text-transform: none; white-space: normal; widows: 2; word-spacing: 0px; -webkit-text-size-adjust: auto; -webkit-text-stroke-width: 0px; ">Yavuz Selim Yilmaz</div><div style="font-family: Helvetica; font-size: medium; font-style: normal; font-variant: normal; font-weight: normal; letter-spacing: normal; line-height: normal; orphans: 2; text-align: -webkit-auto; text-indent: 0px; text-transform: none; white-space: normal; widows: 2; word-spacing: 0px; -webkit-text-size-adjust: auto; -webkit-text-stroke-width: 0px; ">SUNY at Buffalo</div><div style="font-family: Helvetica; font-size: medium; font-style: normal; font-variant: normal; font-weight: normal; letter-spacing: normal; line-height: normal; orphans: 2; text-align: -webkit-auto; text-indent: 0px; text-transform: none; white-space: normal; widows: 2; word-spacing: 0px; -webkit-text-size-adjust: auto; -webkit-text-stroke-width: 0px; ">Computer Science and Engineering</div><div style="font-family: Helvetica; font-size: medium; font-style: normal; font-variant: normal; font-weight: normal; letter-spacing: normal; line-height: normal; orphans: 2; text-align: -webkit-auto; text-indent: 0px; text-transform: none; white-space: normal; widows: 2; word-spacing: 0px; -webkit-text-size-adjust: auto; -webkit-text-stroke-width: 0px; ">PhD Candidate</div>
</div>
<br><div><div>On Aug 12, 2013, at 5:27 AM, Corinne Krych <<a href="mailto:corinnekrych@gmail.com">corinnekrych@gmail.com</a>> wrote:</div><br class="Apple-interchange-newline"><blockquote type="cite"><meta http-equiv="Content-Type" content="text/html charset=windows-1252"><div style="word-wrap: break-word; -webkit-nbsp-mode: space; -webkit-line-break: after-white-space; ">Hello Yavuz<div><br></div><div>Thanks for looking into it with such great details!</div><div>My response embedded in your original mail.</div><div><br></div><div>++</div><div>Corinne<br><div><div>On Aug 10, 2013, at 2:30 AM, Kris Borchers <<a href="mailto:kris@redhat.com">kris@redhat.com</a>> wrote:</div><br class="Apple-interchange-newline"><blockquote type="cite"><meta http-equiv="Content-Type" content="text/html charset=iso-8859-1"><div style="word-wrap: break-word; -webkit-nbsp-mode: space; -webkit-line-break: after-white-space; ">Thanks for this thorough review! These are the types of things I wanted to catch by doing a good review myself but just haven't had the time with the release coming. I will gladly go through and fix these when I have time but if you feel up to fixing any of them, patches welcome. ;)<div><br></div><div>Thanks!</div><div><br><div><div>On Aug 9, 2013, at 6:50 PM, Yavuz Selim YILMAZ <<a href="mailto:yavuzsel@buffalo.edu">yavuzsel@buffalo.edu</a>> wrote:</div><br class="Apple-interchange-newline"><blockquote type="cite"><meta http-equiv="Content-Type" content="text/html charset=iso-8859-1"><div style="word-wrap: break-word; -webkit-nbsp-mode: space; -webkit-line-break: after-white-space; "><div>Hi all,</div><div><br></div>I don't know if this is the correct thread and place to share this. Let me know if it needs to be somewhere else.<div><br></div><div>Tried <a href="https://github.com/corinnekrych/aerogear.org/tree/AEROGEAR-1285">https://github.com/corinnekrych/aerogear.org/tree/AEROGEAR-1285</a> this branch on my local, and checked with some devices I have over here. The problems listed below from my iPod exists for all devices I tested so far (latest versions of Chrome and Safari for iPod 4th gen and iPhone 5 (on latest iOS), and Chrome and Android Browser for my Nexus S on Android 4.0.4). More tests and devices will come next week if needed.</div><div><br></div><div>0) Menu button seems a little bit more far away from the left side. (have no screenshot specific to this one, but check item 2 screenshot below).</div><div><br></div></div></blockquote></div></div></div></blockquote><div><br></div><div>On phone AeroGear logo is centered whereas on web side, logo is on left. It was a 'design' choice (discussed in this thread) </div><br><blockquote type="cite"><div style="word-wrap: break-word; -webkit-nbsp-mode: space; -webkit-line-break: after-white-space; "><blockquote type="cite"><div style="word-wrap: break-word; -webkit-nbsp-mode: space; -webkit-line-break: after-white-space; "><div><br></div><div>1) When you tap on the menu icon, it draws a line under the icon.</div><div><br></div><div><a href="https://dl.dropboxusercontent.com/u/7848530/aerogear.org/IMG_0053.PNG">https://dl.dropboxusercontent.com/u/7848530/aerogear.org/IMG_0053.PNG</a></div></div></blockquote></div></blockquote><div><br></div><div>Agreed. I've just removed the underline on hover.</div><br><blockquote type="cite"><div style="word-wrap: break-word; -webkit-nbsp-mode: space; -webkit-line-break: after-white-space; "><blockquote type="cite"><div style="word-wrap: break-word; -webkit-nbsp-mode: space; -webkit-line-break: after-white-space; "><div><br></div><div><br></div><div>2) That line under the menu icon doesn't go away when the menu is closed.</div><div><br></div><div><a href="https://dl.dropboxusercontent.com/u/7848530/aerogear.org/IMG_0054.PNG">https://dl.dropboxusercontent.com/u/7848530/aerogear.org/IMG_0054.PNG</a></div></div></blockquote></div></blockquote><div><br></div><div>see 1)</div><br><blockquote type="cite"><div style="word-wrap: break-word; -webkit-nbsp-mode: space; -webkit-line-break: after-white-space; "><blockquote type="cite"><div style="word-wrap: break-word; -webkit-nbsp-mode: space; -webkit-line-break: after-white-space; "><div><br></div><div><br></div><div>3) The same underline appears for the menu items (but as it loads a new page, it does go with the refresh).</div><div><br></div><div><a href="https://dl.dropboxusercontent.com/u/7848530/aerogear.org/IMG_0058.PNG">https://dl.dropboxusercontent.com/u/7848530/aerogear.org/IMG_0058.PNG</a></div></div></blockquote></div></blockquote><div><br></div><div>I like the effect here. I think it looks nice. Personal view though. I'll be interested in hearing from Hylke.</div><br><blockquote type="cite"><div style="word-wrap: break-word; -webkit-nbsp-mode: space; -webkit-line-break: after-white-space; "><blockquote type="cite"><div style="word-wrap: break-word; -webkit-nbsp-mode: space; -webkit-line-break: after-white-space; "><div><br></div><div><br></div><div>4) When side menu is opened, horizontal scroll bar appears, and it scrolls (in a native app which uses sliding menu like the one we have here, when you tap to the main view area, it closes the menu, but in our site the main view area remains there and functional)</div><div><br></div><div><a href="https://dl.dropboxusercontent.com/u/7848530/aerogear.org/IMG_0062.PNG">https://dl.dropboxusercontent.com/u/7848530/aerogear.org/IMG_0062.PNG</a></div></div></blockquote></div></blockquote><div><br></div><div>Interesting point.</div><div>The menu CSS are from Topcoat.</div><div><br></div><div>Here is an example of menu with Topcoat</div><div><a href="http://codepen.io/piatra/pen/ofeDd">http://codepen.io/piatra/pen/ofeDd</a></div><div><br></div><div>Indeed content is shifted. Is it a real problem the shifted aspect on UX point of view? </div><div>If so, another interesting fwk to investigate could be <a href="http://sidetap.it/">http://sidetap.it/</a></div><br><blockquote type="cite"><div style="word-wrap: break-word; -webkit-nbsp-mode: space; -webkit-line-break: after-white-space; "><blockquote type="cite"><div style="word-wrap: break-word; -webkit-nbsp-mode: space; -webkit-line-break: after-white-space; "><div><br></div><div><br></div><div>5) Some of the pages doesn't have a mobile scaled view (like javadoc pages and community page).</div><div><br></div><div><a href="https://dl.dropboxusercontent.com/u/7848530/aerogear.org/IMG_0056.PNG">https://dl.dropboxusercontent.com/u/7848530/aerogear.org/IMG_0056.PNG</a></div></div></blockquote></div></blockquote><div><br></div>Community page is a noble embedded iFrame. Nable provide an API to embed forum in web site. Their page is quite responsive until a size that would fit tablet (width 640px) but smaller it doesn't fit anymore.</div><div>In the actual <a href="http://aerogear.org/">aerogear.org</a>, we have the same problem. It would be nice to do better, I've opened a JIRA for this. Ideas welcome.</div><div><a href="https://issues.jboss.org/browse/AEROGEAR-1300">https://issues.jboss.org/browse/AEROGEAR-1300</a></div><div><br><blockquote type="cite"><div style="word-wrap: break-word; -webkit-nbsp-mode: space; -webkit-line-break: after-white-space; "><blockquote type="cite"><div style="word-wrap: break-word; -webkit-nbsp-mode: space; -webkit-line-break: after-white-space; "><div><br></div><div><br></div><div>6) When a page has single word which does not fit to a single line, then horizontal scroll bar comes:</div><div><br></div><div><a href="https://dl.dropboxusercontent.com/u/7848530/aerogear.org/IMG_0061.PNG">https://dl.dropboxusercontent.com/u/7848530/aerogear.org/IMG_0061.PNG</a></div><div><br></div></div></blockquote></div></blockquote><div><br></div><div>Good catch!</div><div>I prefer not to apply break words property (word-break:break-all) on paragraph element in CSS because for normal text it's not nice to break in a middle of a word. I've modified the markdown page for this example and put a spec on application: and didRegister….. (incredible long names in Objective-C).</div><div><br></div><div>As Hylke mentions it for correct usage of <h1>, <h2> I would say the same for long names. Be aware of them in paragraph section. In <pre> section, CSS breaks on words.</div><div><br></div><blockquote type="cite"><div style="word-wrap: break-word; -webkit-nbsp-mode: space; -webkit-line-break: after-white-space; "><blockquote type="cite"><div style="word-wrap: break-word; -webkit-nbsp-mode: space; -webkit-line-break: after-white-space; "><div>7) Right margin is either not working, or is set to 0 (same for all pages).</div><div><br></div><div><a href="https://dl.dropboxusercontent.com/u/7848530/aerogear.org/IMG_0059.PNG">https://dl.dropboxusercontent.com/u/7848530/aerogear.org/IMG_0059.PNG</a></div></div></blockquote></div></blockquote><div><br></div><div>Hylke did work on adding extra spaces on his branch. PR to be sent.</div><div><br></div><blockquote type="cite"><div style="word-wrap: break-word; -webkit-nbsp-mode: space; -webkit-line-break: after-white-space; "><blockquote type="cite"><div style="word-wrap: break-word; -webkit-nbsp-mode: space; -webkit-line-break: after-white-space; "><div><br></div><div><br></div><div>8) Note field seems a little hard to understand when first looked ("Note" header has same font with the note text and "Note" header position is not the best IMO)</div><div><br></div><div><a href="https://dl.dropboxusercontent.com/u/7848530/aerogear.org/IMG_0060.PNG">https://dl.dropboxusercontent.com/u/7848530/aerogear.org/IMG_0060.PNG</a></div></div></blockquote></div></blockquote><div><br></div><div>Added CSS for [NOTE].</div><div>Table will be display with bold for 'Note' label. label at top of column,</div><br><blockquote type="cite"><div style="word-wrap: break-word; -webkit-nbsp-mode: space; -webkit-line-break: after-white-space; "><blockquote type="cite"><div style="word-wrap: break-word; -webkit-nbsp-mode: space; -webkit-line-break: after-white-space; "><div><br></div><div><br></div><div>9) Some links don't make sense to have on mobile (e.g. download links)</div><div><br></div><div><a href="https://dl.dropboxusercontent.com/u/7848530/aerogear.org/IMG_0055.PNG">https://dl.dropboxusercontent.com/u/7848530/aerogear.org/IMG_0055.PNG</a></div></div></blockquote></div></blockquote><div><br></div><div>This brings us to Responsive content. Do we want to deliver the same content for small screen?</div><div>I like this post from Bergie:</div><div><a href="http://bergie.iki.fi/blog/mobile-first-web/">http://bergie.iki.fi/blog/mobile-first-web/</a> quoting "Mobile users should get the same content"</div><div>Once again, I'd like to have Hylke's view on that point.</div><div>If needed we can open a JIRA for this.</div><div><br></div><blockquote type="cite"><div style="word-wrap: break-word; -webkit-nbsp-mode: space; -webkit-line-break: after-white-space; "><blockquote type="cite"><div style="word-wrap: break-word; -webkit-nbsp-mode: space; -webkit-line-break: after-white-space; "><div><br></div><div>10) (this one is specific to my Android device) Menu items don't appear on Android Browser (fine on Chrome for Android), but the menu works, i.e. when I tap where the item supposed to be, it navigates (and actually the menu items appear while loading the next page, but then again disappear as the next page loads):</div><div><br></div><div><a href="https://dl.dropboxusercontent.com/u/7848530/aerogear.org/Screenshot_2013-08-09-16-45-18.png">https://dl.dropboxusercontent.com/u/7848530/aerogear.org/Screenshot_2013-08-09-16-45-18.png</a></div></div></blockquote></div></blockquote><div><br></div><div>Puzzled on that one</div><div>May I ask you which Android you're on?</div><div>@passos do you get into same behaviour?</div><div><br></div><div>One thing to know is that the menu is based on Topcoat menu and used CSS3 transition. Browser has to support CSS3 for best rendering. </div><div>I've tested on my old android phone (Android 2.3.3), the transition is not applied but you see the menu hovering on top of the page, which is still useable.</div></div></div></div></blockquote><div><br></div><div>It's on Nexus S with Android 4.0.4. And it only happens with Android Browser, with Chrome on the same device it works fine.</div><br><blockquote type="cite"><div style="word-wrap: break-word; -webkit-nbsp-mode: space; -webkit-line-break: after-white-space; "><div><div><br></div><blockquote type="cite"><div style="word-wrap: break-word; -webkit-nbsp-mode: space; -webkit-line-break: after-white-space; "><div><blockquote type="cite"><div style="word-wrap: break-word; -webkit-nbsp-mode: space; -webkit-line-break: after-white-space; "><div><br></div><div><br></div><div>Regards,</div><div>
<div style="font-family: Helvetica; font-size: medium; font-style: normal; font-variant: normal; font-weight: normal; letter-spacing: normal; line-height: normal; orphans: 2; text-align: -webkit-auto; text-indent: 0px; text-transform: none; white-space: normal; widows: 2; word-spacing: 0px; -webkit-text-size-adjust: auto; -webkit-text-stroke-width: 0px; "><br class="Apple-interchange-newline">---</div><div style="font-family: Helvetica; font-size: medium; font-style: normal; font-variant: normal; font-weight: normal; letter-spacing: normal; line-height: normal; orphans: 2; text-align: -webkit-auto; text-indent: 0px; text-transform: none; white-space: normal; widows: 2; word-spacing: 0px; -webkit-text-size-adjust: auto; -webkit-text-stroke-width: 0px; ">Yavuz Selim Yilmaz</div><div style="font-family: Helvetica; font-size: medium; font-style: normal; font-variant: normal; font-weight: normal; letter-spacing: normal; line-height: normal; orphans: 2; text-align: -webkit-auto; text-indent: 0px; text-transform: none; white-space: normal; widows: 2; word-spacing: 0px; -webkit-text-size-adjust: auto; -webkit-text-stroke-width: 0px; ">SUNY at Buffalo</div><div style="font-family: Helvetica; font-size: medium; font-style: normal; font-variant: normal; font-weight: normal; letter-spacing: normal; line-height: normal; orphans: 2; text-align: -webkit-auto; text-indent: 0px; text-transform: none; white-space: normal; widows: 2; word-spacing: 0px; -webkit-text-size-adjust: auto; -webkit-text-stroke-width: 0px; ">Computer Science and Engineering</div><div style="font-family: Helvetica; font-size: medium; font-style: normal; font-variant: normal; font-weight: normal; letter-spacing: normal; line-height: normal; orphans: 2; text-align: -webkit-auto; text-indent: 0px; text-transform: none; white-space: normal; widows: 2; word-spacing: 0px; -webkit-text-size-adjust: auto; -webkit-text-stroke-width: 0px; ">PhD Candidate</div>
</div>
<br><div><div>On Aug 7, 2013, at 1:08 PM, Daniel Passos <<a href="mailto:daniel@passos.me">daniel@passos.me</a>> wrote:</div><br class="Apple-interchange-newline"><blockquote type="cite"><div dir="ltr"><span style="font-family:arial,sans-serif;font-size:13px">+1 for lean.</span><br></div><div class="gmail_extra"><br><br><div class="gmail_quote">On Wed, Aug 7, 2013 at 9:37 AM, Corinne Krych <span dir="ltr"><<a href="mailto:corinnekrych@gmail.com" target="_blank">corinnekrych@gmail.com</a>></span> wrote:<br>
<blockquote class="gmail_quote" style="margin:0 0 0 .8ex;border-left:1px #ccc solid;padding-left:1ex"><div style="word-wrap:break-word">+1 for the link, I've updated the PR<div><br></div><div>++</div><div><span class="HOEnZb"><font color="#888888">Corinne</font></span><div>
<div class="h5"><br><div><div>On Aug 7, 2013, at 1:51 PM, Kris Borchers <<a href="mailto:kris@redhat.com" target="_blank">kris@redhat.com</a>> wrote:</div><br><blockquote type="cite"><div style="word-wrap:break-word">
+1 for lean version.<div><br></div><div>One thing I noticed is that the "Contribute" link just goes to <a href="http://github.com/aerogear" target="_blank">github.com/aerogear</a>. I think it would make more sense to link to <a href="http://aerogear.org/docs/guides/Contributing/" target="_blank">http://aerogear.org/docs/guides/Contributing/</a> and add some info near the top linking to our github organization. Make sense?</div>
<div><br><div><div>On Aug 7, 2013, at 4:51 AM, Hylke Bons <<a href="mailto:hbons@redhat.com" target="_blank">hbons@redhat.com</a>> wrote:</div><br><blockquote type="cite">
<div bgcolor="#FFFFFF" text="#000000">
<div>I like what you did with the "lean"
one.<br>
There are some spacing changes to make, but overall I prefer that
one.<br>
<br>
Hylke<br>
<br>
<br>
<br>
On 07/08/2013 11:39, Corinne Krych wrote:<br>
</div>
<blockquote type="cite">
<div>Hello Guys</div>
<div><br>
</div>
<div>With Hylke we've been discussing footer recently. I\d like to
know your view on our site footer. </div>
<div><br>
</div>
<div>Do you prefer the one complete with all news details (knowing
we already have a news entry in the menu) ? like below</div>
<div><br>
</div>
<div>
<div><span style="text-decoration:underline;letter-spacing:0px"><a href="https://docs.google.com/file/d/0B3bDL8OwQQUdNVYwTlFIajZ4c2M/edit?usp=sharing" target="_blank">https://docs.google.com/file/d/0B3bDL8OwQQUdNVYwTlFIajZ4c2M/edit?usp=sharing</a></span></div>
<div><br>
</div>
<div><span style="font-family:Helvetica;font-size:medium">or a lean one just with links (no contents of
news) like:</span></div>
<div><br>
</div>
<div><span style="letter-spacing:0.0px"><a href="https://docs.google.com/file/d/0B3bDL8OwQQUdWjBFU3k5WWEtUk0/edit?usp=sharing" target="_blank">https://docs.google.com/file/d/0B3bDL8OwQQUdWjBFU3k5WWEtUk0/edit?usp=sharing</a></span></div>
</div>
<div><span style="letter-spacing:0.0px"><br>
</span></div>
<div><span style="letter-spacing:0.0px"><br>
</span></div>
<div><span style="letter-spacing:0.0px">Feedback welcome</span></div>
<div><span style="letter-spacing:0.0px"><br>
</span></div>
<div><span style="letter-spacing:0.0px">++</span></div>
<div><span style="letter-spacing:0.0px">Corinne</span></div>
<div><span style="letter-spacing:0.0px"><br>
</span></div>
<br>
<div>
<div>On Aug 6, 2013, at 6:22 PM, Hylke Bons <<a href="mailto:hbons@redhat.com" target="_blank">hbons@redhat.com</a>>
wrote:</div>
<br>
<blockquote type="cite">
<div bgcolor="#FFFFFF" text="#000000">
<div>Thanks again!<br>
I've pushed the fix to my branch now.<br>
<br>
Hylke<br>
<br>
On 06/08/2013 16:53, Corinne Krych wrote:<br>
</div>
<blockquote type="cite">
Hi Hylke
<div><br>
</div>
<div>Regarding the issue you had on you fork branch, on
iPhone/Android browsers of the paragraph being shifted
to the right. This issue is caused by this line: </div>
<div><a href="https://github.com/hbons/aerogear.org/blob/AEROGEAR-1285/css/main.css#L389" target="_blank">https://github.com/hbons/aerogear.org/blob/AEROGEAR-1285/css/main.css#L389</a></div>
<div><br>
</div>
<div>Replace</div>
<div>
<pre style="word-wrap:break-word;white-space:pre-wrap"><font face="Helvetica">.feature {
margin: 0 auto;
padding: 1em 3em;
max-width: 50em;
}</font>
</pre>
</div>
<div>by</div>
<div><br>
</div>
<div>
<pre style="word-wrap:break-word;white-space:pre-wrap"><font face="Helvetica">.feature {
margin: 0 auto;
padding: 1em 1em;
max-width: 50em;
}</font></pre>
<pre style="word-wrap:break-word;white-space:pre-wrap"><font face="Helvetica">and remove margin in:</font></pre>
<pre style="word-wrap:break-word"><font face="Helvetica"><span style="white-space:pre-wrap">.features {
/*margin: 3em auto;*/
}
</span></font></pre>
<div><font face="Helvetica">and you should get
the spec you wanted.</font></div>
<div>Because you're working border-box, padding is
taking extra space out out the box and if there is not
enough space in the parent container it expands. One
thing I would advise is: when designing your site,
test it on real devices on iterative steps as often
as possible. </div>
</div>
<div><br>
</div>
<div>++</div>
<div>Corinne</div>
<div><br>
</div>
<div><br>
<div>
<div>On Aug 5, 2013, at 8:32 PM, Kris Borchers <<a href="mailto:kborcher@redhat.com" target="_blank">kborcher@redhat.com</a>>
wrote:</div>
<br>
<blockquote type="cite">
<div dir="auto">
<div>+0.5 </div>
<div><br>
</div>
<div>I agree the footer was too big but I want to
do a full review of all navigation when i get
back before saying +1</div>
<div><br>
On Aug 5, 2013, at 7:34, Corinne Krych <<a href="mailto:corinnekrych@gmail.com" target="_blank">corinnekrych@gmail.com</a>>
wrote:<br>
<br>
</div>
<blockquote type="cite">
<div>Hi All,</div>
<div><br>
</div>
#agreed on icons not being meaningful, we could
do hyperlinks with text.
<div>But to keep footer small, let's not put to
much information in the footer. Id you recall
we had a huge footer.
<div>I'd go for a footer that looks like this
one:
<div><a href="http://wildfly.org/" target="_blank">http://wildfly.org/</a><br>
<div>
<div><br>
</div>
<div>wdyt?</div>
<div><br>
</div>
<div>Corinne</div>
<div><br>
</div>
<div>On Aug 5, 2013, at 1:53 PM, Hylke
Bons <<a href="mailto:hbons@redhat.com" target="_blank">hbons@redhat.com</a>>
wrote:</div>
<br>
<blockquote type="cite">
<div bgcolor="#FFFFFF" text="#000000">
<div>Great!<br>
<br>
We're nearly there now, I'll fix
the remaining issues today.<br>
<br>
I the use of icons in the footer
is problematic. Visitors don't
necessarily know what these mean.<br>
<br>
For example, where would you go if
you want to report an issue? Not
everyone is familiar with Jira and
its logo. (You could hover and get
some kind of clue, but you can't
do this on touch devices, and it
would be annoying)<br>
<br>
So I think we should revert back
to just using text links... The
social networks can remain as
icons.<br>
<br>
Thanks,<br>
<br>
Hylke<br>
<br>
<br>
On 05/08/2013 10:14, Corinne Krych
wrote:<br>
</div>
<blockquote type="cite">
Hello All
<div><br>
</div>
<div>@Hylke, I've integrated your
comments:</div>
<div><br>
</div>
<div>1. logo is on left on
desktop, centred on phone. I
think this was a good comprise
to make it look good on desktop
and phone.</div>
<div>2. menu icon is fixed</div>
<div>3. page padding for paragraph
added</div>
<div>4. I've downloaded the fonts
locally and honestly it improved
performance when browsing on
devices </div>
<div><br>
</div>
<div>I'd like you to revisit the
footer icons I've added
(doc/jira/email/github/irc). It
would be nice if they can look
like the
twitter/facebook/google+ ones
you initially created. wdyt?</div>
<div><br>
</div>
<div>@all, ready for your review
guys, PR sent. </div>
<div><br>
</div>
<div>++</div>
<div>Corinne</div>
<div><br>
<div>
<div>On Aug 2, 2013, at 10:59
AM, Corinne Krych <<a href="mailto:corinnekrych@gmail.com" target="_blank">corinnekrych@gmail.com</a>>
wrote:</div>
<br>
<blockquote type="cite">
<div style="word-wrap:break-word">
<div>Hi Hylke!</div>
<div><br>
</div>
I've answered your comets
below.
<div><br>
</div>
<div>Taking the latest
code in my branch:</div>
<div><a href="https://github.com/corinnekrych/aerogear.org/tree/AEROGEAR-1285" target="_blank">https://github.com/corinnekrych/aerogear.org/tree/AEROGEAR-1285</a></div>
<div><br>
</div>
<div>I've also proposed a
solution to make the
footer much smaller. I
used images. But, I like
to have your designer
view on that.</div>
<div><br>
</div>
<div>By tonight i hope to
have a general feeling
for the all site. Stay
tune.</div>
<div><br>
</div>
<div>Thanks!</div>
<div>++</div>
<div>Corinne</div>
<div><br>
<div>
<div>On Aug 2, 2013,
at 10:39 AM, Hylke
Bons <<a href="mailto:hbons@redhat.com" target="_blank">hbons@redhat.com</a>> wrote:</div>
<br>
<blockquote type="cite">
<div bgcolor="#FFFFFF" text="#000000">
<div>Thanks
so much for
looking into
this Corrine!<br>
<br>
I just had a
look at the
OpenShift
instance. It
looks good to me
responsiveness-wise.
I like the menu
behaviour.<br>
<br>
There are still
some minor style
issues. If you
still have time
to look into
this that would
be great,<br>
otherwise I can
take a look at
these be fore we
launch the new
style:<br>
<br>
- Logo is
centred on the
page, it looks
more balanced
having it stick
to the left.<br>
</div>
</div>
</blockquote>
<div><br>
</div>
Funny, personally and
specially on phone I
found centred logo
looks more balance. i
remember seeing
Passos's comments on
this. He actually
wanted it centred too.
But I guess it's a
mater of taste. I can
change. let's see
others comments.</div>
<div><br>
<blockquote type="cite">
<div bgcolor="#FFFFFF" text="#000000">
<div>
- The menu icon
is a bit hard to
see (I've
attached a quick
svg with a
colour change,
would be nice if
we could use
that and have it
not change
shape)<br>
</div>
</div>
</blockquote>
<div><br>
</div>
<div>I changed the
icon with a unicode
(triple bar) much
easier to see.
Pushed all that to
my branch.</div>
<br>
<blockquote type="cite">
<div bgcolor="#FFFFFF" text="#000000">
<div>-
The news
headline ("AG
1.0 is out!") is
sticking to the
right of the
page, it would
be better if it
kept to the
right, but still
in the middle of
the page for
large screen
setups<br>
- The platform
icons seem to
shift a pixel
when you hover
them<br>
</div>
</div>
</blockquote>
<div><br>
</div>
<div>nice catch will
fix that. it gives a
bad flickering
effect indeed.</div>
<br>
<blockquote type="cite">
<div bgcolor="#FFFFFF" text="#000000">
<div>
- There's no
page padding
when scaling
down, this makes
the text
paragraphs
harder to read,
because they
touch the screen
edge<br>
- Some
padding/spacing
issue all-round.
This is probably
because
everything was
rebased on
Boilerplate.<br>
</div>
</div>
</blockquote>
<div><br>
</div>
I am actually working
on all the other
pages. my initial
focus was home page.</div>
<div><br>
</div>
<div>
<blockquote type="cite">
<div bgcolor="#FFFFFF" text="#000000">
<div>
<br>
I'll try to get
a local instance
running again
and help out
with these
things.<br>
</div>
</div>
</blockquote>
<div><br>
</div>
+ 10001</div>
<div>Together we'll have
much power, thanks!</div>
<div><br>
<blockquote type="cite">
<div bgcolor="#FFFFFF" text="#000000">
<div>
<br>
Thanks!<br>
<br>
Hylke<br>
<br>
<br>
<br>
On 01/08/2013
06:40, Daniel
Bevenius wrote:<br>
</div>
<blockquote type="cite">
<div dir="ltr">Looks
nice!</div>
<div class="gmail_extra"><br>
<br>
<div class="gmail_quote">On
31 July 2013
18:57, Bruno
Oliveira <span dir="ltr"><<a href="mailto:bruno@abstractj.org" target="_blank">bruno@abstractj.org</a>></span>
wrote:<br>
<blockquote class="gmail_quote" style="margin:0 0 0 .8ex;border-left:1px #ccc solid;padding-left:1ex">
<div dir="ltr">Thanks
Corinne.
<div><br>
</div>
<div>Just
tried and
deployed on
OpenShift <a href="http://site-abstractj.rhcloud.com/" target="_blank">http://site-abstractj.rhcloud.com/</a>.
Looks really
good, I also
tested it
with <a href="http://mattkersley.com/responsive/" target="_blank">http://mattkersley.com/responsive/</a></div>
<div><br>
</div>
<div>I'll try
later on
Android,
IPhone and
IPad.</div>
<div><br>
</div>
<div>Thanks
for looking at
this.</div>
</div>
<div class="gmail_extra">
<div>
<div><br>
<br>
<div class="gmail_quote">On
Wed, Jul 31,
2013 at 12:54
PM, Matthias
Wessendorf <span dir="ltr"><<a href="mailto:matzew@apache.org" target="_blank">matzew@apache.org</a>></span>
wrote:<br>
<blockquote class="gmail_quote" style="margin:0 0 0 .8ex;border-left:1px #ccc solid;padding-left:1ex">
<div dir="ltr">pretty
cool!
<div><br>
</div>
<div>Just
tried your
branch and it
looks good on
my iPhone 4s
and on my
Galaxy S II.</div>
<div><br>
</div>
<div><br>
</div>
<div>-Matthias</div>
</div>
<div class="gmail_extra"><br>
<br>
<div class="gmail_quote">
<div> On Wed,
Jul 31, 2013
at 5:45 PM,
Corinne Krych
<span dir="ltr"><<a href="mailto:corinnekrych@gmail.com" target="_blank">corinnekrych@gmail.com</a>></span>
wrote:<br>
</div>
<blockquote class="gmail_quote" style="margin:0 0 0 .8ex;border-left:1px #ccc solid;padding-left:1ex">
<div>
<div>
<div style="word-wrap:break-word">Hello
All,
<div><br>
</div>
<div>We've
been talking
about
redesigning
our <a href="http://aerogear.org/" target="_blank">aerogear.org</a> web site.
Hylke has
done a great
design job.
Now, we 'just'
want to make
it responsive.</div>
<div><br>
</div>
<div>Out of
several
proposals:</div>
<div>1. use
bootstrap
(current
version of our
site) and
apply our
custom design </div>
<div>2. use
topcoat css
and apply our
custom design</div>
<div>3. use
HTML5
boilerplate and
apply our
custom design
and make it
responsive</div>
<div><br>
</div>
<div>I
initially
started with
option 1,
which might be
overkill for a
static site. </div>
<div>Tried
option 2, but
here too, it
seems overkill
so ended with
option 3.</div>
<div><br>
</div>
<div>Using a
blank page, I
worked on Home
page
reapplying
Hylke css but:</div>
<div>-
removing
maximun-scale=1.0
because we
want to let
people zoom if
they wish, </div>
<div>-
replacing 'px'
unit to use
'em', </div>
<div>- centred
logo images,</div>
<div>- making
sure width is
right
otherwise you
get screw up
with iPhone
rotate</div>
<div>- adding
media queries
(only 2
breakpoints
for now, but
need to be
adjusted with
devices tests
and your
feedbacks)</div>
<div><br>
</div>
<div>The main
points to sort
out for UX
design is the
menu bar and
the footer. </div>
<div>To me,
footer is too
huge, even on
desktop, could
we remove
news? </div>
<div>For the
menu, it looks
fine on
tablets format
but on phone,
it's not
really
accessible. So
I implemented
topcoat swipe
menu using
CSS3
transform. Is
it UX
friendly?
wdyt?</div>
<div><br>
</div>
<div>Feedback
welcome,</div>
<div>Work in
progress in <a href="https://github.com/corinnekrych/aerogear.org/tree/AEROGEAR-1285" target="_blank">https://github.com/corinnekrych/aerogear.org/tree/AEROGEAR-1285</a></div>
<div><br>
</div>
<div>++</div>
<span><font color="#888888">
<div>Corinne</div>
</font></span></div>
<br>
</div>
</div>
<div>_______________________________________________<br>
aerogear-dev
mailing list<br>
<a href="mailto:aerogear-dev@lists.jboss.org" target="_blank">aerogear-dev@lists.jboss.org</a><br>
<a href="https://lists.jboss.org/mailman/listinfo/aerogear-dev" target="_blank">https://lists.jboss.org/mailman/listinfo/aerogear-dev</a><br>
</div>
</blockquote>
</div>
<span><font color="#888888"><br>
<br clear="all">
<div><br>
</div>
-- <br>
Matthias
Wessendorf <br>
<br>
blog: <a href="http://matthiaswessendorf.wordpress.com/" target="_blank">http://matthiaswessendorf.wordpress.com/</a><br>
sessions: <a href="http://www.slideshare.net/mwessendorf" target="_blank">http://www.slideshare.net/mwessendorf</a><br>
twitter: <a href="http://twitter.com/mwessendorf" target="_blank">http://twitter.com/mwessendorf</a>
</font></span></div>
<br>
_______________________________________________<br>
aerogear-dev
mailing list<br>
<a href="mailto:aerogear-dev@lists.jboss.org" target="_blank">aerogear-dev@lists.jboss.org</a><br>
<a href="https://lists.jboss.org/mailman/listinfo/aerogear-dev" target="_blank">https://lists.jboss.org/mailman/listinfo/aerogear-dev</a><br>
</blockquote>
</div>
<br>
<br clear="all">
<div><br>
</div>
-- <br>
<div><br>
</div>
</div>
</div>
<span><font color="#888888">-- <br>
"The measure
of a man is
what he does
with power" -
Plato<br>
-<br>
@abstractj<br>
-<br>
Volenti Nihil
Difficile </font></span></div>
<br>
_______________________________________________<br>
aerogear-dev
mailing list<br>
<a href="mailto:aerogear-dev@lists.jboss.org" target="_blank">aerogear-dev@lists.jboss.org</a><br>
<a href="https://lists.jboss.org/mailman/listinfo/aerogear-dev" target="_blank">https://lists.jboss.org/mailman/listinfo/aerogear-dev</a><br>
</blockquote>
</div>
<br>
</div>
<br>
<fieldset></fieldset>
<br>
<pre>_______________________________________________
aerogear-dev mailing list
<a href="mailto:aerogear-dev@lists.jboss.org" target="_blank">aerogear-dev@lists.jboss.org</a>
<a href="https://lists.jboss.org/mailman/listinfo/aerogear-dev" target="_blank">https://lists.jboss.org/mailman/listinfo/aerogear-dev</a></pre>
</blockquote>
<br>
</div>
<span><menu-icon.svg></span>_______________________________________________<br>
aerogear-dev mailing
list<br>
<a href="mailto:aerogear-dev@lists.jboss.org" target="_blank">aerogear-dev@lists.jboss.org</a><br>
<a href="https://lists.jboss.org/mailman/listinfo/aerogear-dev" target="_blank">https://lists.jboss.org/mailman/listinfo/aerogear-dev</a></blockquote>
</div>
<br>
</div>
</div>
</blockquote>
</div>
<br>
</div>
<br>
<fieldset></fieldset>
<br>
<pre>_______________________________________________
aerogear-dev mailing list
<a href="mailto:aerogear-dev@lists.jboss.org" target="_blank">aerogear-dev@lists.jboss.org</a>
<a href="https://lists.jboss.org/mailman/listinfo/aerogear-dev" target="_blank">https://lists.jboss.org/mailman/listinfo/aerogear-dev</a></pre>
</blockquote>
<br>
</div>
_______________________________________________<br>
aerogear-dev mailing list<br>
<a href="mailto:aerogear-dev@lists.jboss.org" target="_blank">aerogear-dev@lists.jboss.org</a><br>
<a href="https://lists.jboss.org/mailman/listinfo/aerogear-dev" target="_blank">https://lists.jboss.org/mailman/listinfo/aerogear-dev</a></blockquote>
</div>
<br>
</div>
</div>
</div>
</blockquote>
<blockquote type="cite"><span>_______________________________________________</span><br>
<span>aerogear-dev mailing list</span><br>
<span><a href="mailto:aerogear-dev@lists.jboss.org" target="_blank">aerogear-dev@lists.jboss.org</a></span><br>
<span><a href="https://lists.jboss.org/mailman/listinfo/aerogear-dev" target="_blank">https://lists.jboss.org/mailman/listinfo/aerogear-dev</a></span></blockquote>
</div>
_______________________________________________<br>
aerogear-dev mailing list<br>
<a href="mailto:aerogear-dev@lists.jboss.org" target="_blank">aerogear-dev@lists.jboss.org</a><br>
<a href="https://lists.jboss.org/mailman/listinfo/aerogear-dev" target="_blank">https://lists.jboss.org/mailman/listinfo/aerogear-dev</a></blockquote>
</div>
<br>
</div>
<br>
<fieldset></fieldset>
<br>
<pre>_______________________________________________
aerogear-dev mailing list
<a href="mailto:aerogear-dev@lists.jboss.org" target="_blank">aerogear-dev@lists.jboss.org</a>
<a href="https://lists.jboss.org/mailman/listinfo/aerogear-dev" target="_blank">https://lists.jboss.org/mailman/listinfo/aerogear-dev</a></pre>
</blockquote>
<br>
</div>
_______________________________________________<br>
aerogear-dev mailing list<br>
<a href="mailto:aerogear-dev@lists.jboss.org" target="_blank">aerogear-dev@lists.jboss.org</a><br>
<a href="https://lists.jboss.org/mailman/listinfo/aerogear-dev" target="_blank">https://lists.jboss.org/mailman/listinfo/aerogear-dev</a></blockquote>
</div>
<br>
<br>
<fieldset></fieldset>
<br>
<pre>_______________________________________________
aerogear-dev mailing list
<a href="mailto:aerogear-dev@lists.jboss.org" target="_blank">aerogear-dev@lists.jboss.org</a>
<a href="https://lists.jboss.org/mailman/listinfo/aerogear-dev" target="_blank">https://lists.jboss.org/mailman/listinfo/aerogear-dev</a></pre>
</blockquote>
<br>
</div>
_______________________________________________<br>aerogear-dev mailing list<br><a href="mailto:aerogear-dev@lists.jboss.org" target="_blank">aerogear-dev@lists.jboss.org</a><br><a href="https://lists.jboss.org/mailman/listinfo/aerogear-dev" target="_blank">https://lists.jboss.org/mailman/listinfo/aerogear-dev</a></blockquote>
</div><br></div></div>_______________________________________________<br>aerogear-dev mailing list<br><a href="mailto:aerogear-dev@lists.jboss.org" target="_blank">aerogear-dev@lists.jboss.org</a><br><a href="https://lists.jboss.org/mailman/listinfo/aerogear-dev" target="_blank">https://lists.jboss.org/mailman/listinfo/aerogear-dev</a></blockquote>
</div><br></div></div></div></div><br>_______________________________________________<br>
aerogear-dev mailing list<br>
<a href="mailto:aerogear-dev@lists.jboss.org">aerogear-dev@lists.jboss.org</a><br>
<a href="https://lists.jboss.org/mailman/listinfo/aerogear-dev" target="_blank">https://lists.jboss.org/mailman/listinfo/aerogear-dev</a><br></blockquote></div><br></div>
_______________________________________________<br>aerogear-dev mailing list<br><a href="mailto:aerogear-dev@lists.jboss.org">aerogear-dev@lists.jboss.org</a><br><a href="https://lists.jboss.org/mailman/listinfo/aerogear-dev">https://lists.jboss.org/mailman/listinfo/aerogear-dev</a></blockquote></div><br></div>_______________________________________________<br>aerogear-dev mailing list<br><a href="mailto:aerogear-dev@lists.jboss.org">aerogear-dev@lists.jboss.org</a><br><a href="https://lists.jboss.org/mailman/listinfo/aerogear-dev">https://lists.jboss.org/mailman/listinfo/aerogear-dev</a></blockquote></div><br></div>_______________________________________________<br>aerogear-dev mailing list<br><a href="mailto:aerogear-dev@lists.jboss.org">aerogear-dev@lists.jboss.org</a><br><a href="https://lists.jboss.org/mailman/listinfo/aerogear-dev">https://lists.jboss.org/mailman/listinfo/aerogear-dev</a></blockquote></div><br></div>_______________________________________________<br>aerogear-dev mailing list<br><a href="mailto:aerogear-dev@lists.jboss.org">aerogear-dev@lists.jboss.org</a><br><a href="https://lists.jboss.org/mailman/listinfo/aerogear-dev">https://lists.jboss.org/mailman/listinfo/aerogear-dev</a></blockquote></div><br></div></div></blockquote></div><br></div></body></html>