
<html><head><meta http-equiv="Content-Type" content="text/html charset=us-ascii"></head><body style="word-wrap: break-word; -webkit-nbsp-mode: space; -webkit-line-break: after-white-space;" class=""><br class=""><div><blockquote type="cite" class=""><div class="">On Jun 24, 2017, at 4:14 PM, Davide DB <<a href="mailto:dbdavide@gmail.com" class="">dbdavide@gmail.com</a>> wrote:</div><br class="Apple-interchange-newline"><div class=""><div dir="auto" class=""><div class="gmail_extra" dir="auto"><div style="font-family:sans-serif" dir="auto" class="">From what I read those weird definitions are just an invention of that palette generator. We have only a primary and an optional secondary color and their light and dark variations.</div><div dir="auto" style="font-family:sans-serif" class=""><br class=""></div><div dir="auto" style="font-family:sans-serif" class="">I found this reply very informative:</div><div dir="auto" style="font-family:sans-serif" class=""><br class=""></div><div dir="auto" style="font-family:sans-serif" class=""><a href="https://ux.stackexchange.com/questions/89815/choosing-colors-in-material-design" target="_blank" class="">https://ux.stackexchange.com/<wbr class="">questions/89815/choosing-<wbr class="">colors-in-material-design</a><br class=""></div><div dir="auto" style="font-family:sans-serif" class=""><br class=""></div><div dir="auto" style="font-family:sans-serif" class=""><br class="">Basically text is always black #000000 and you define opacity based on background. There are fixed values for that.<br class=""></div><div dir="auto" style="font-family:sans-serif" class="">Here Google explains the trick on text</div><div dir="auto" style="font-family:sans-serif" class=""><br class=""></div><div dir="auto" style="font-family:sans-serif" class=""><a href="https://material.io/guidelines/style/color.html#color-usability" target="_blank" class="">https://material.io/<wbr class="">guidelines/style/color.html#<wbr class="">color-usability</a></div><div dir="auto" style="font-family:sans-serif" class=""><div style="margin:20px 0px;padding:0px 0px 20px;border:0px;font-size:13px;line-height:inherit;font-family:roboto,sans-serif;vertical-align:top;display:inline-block;width:328px;color:rgb(33,33,33);background-color:rgb(250,250,250)" dir="auto" class=""><h2 style="margin:0px 0px 30px;padding:0px;border:0px;font-style:inherit;font-variant:inherit;font-weight:500;font-size:15px;line-height:24px;font-family:inherit;vertical-align:baseline;max-width:760px" class=""><span style="margin:0px;padding:0px;border:0px;font-style:inherit;font-variant:inherit;font-weight:600;font-size:inherit;line-height:inherit;font-family:inherit;vertical-align:baseline" class="">Dark text on light backgrounds</span></h2><p style="margin:0px 0px 20px;padding:0px;border:0px;font-style:inherit;font-variant:inherit;font-weight:inherit;line-height:24px;font-family:inherit;vertical-align:baseline;max-width:760px;word-wrap:break-word" class="">The level of opacity used for text depends on whether your background is dark or light. For dark text on light backgrounds, apply the following opacity levels:</p><ul style="margin:0px 0px 20px;padding:0px 0px 0px 20px;border:0px;font-style:inherit;font-variant:inherit;font-weight:inherit;font-size:inherit;line-height:inherit;font-family:inherit;vertical-align:baseline;list-style:none" class=""><li style="margin:0px 0px 0.5em;padding:0px;border:0px;font-style:inherit;font-variant:inherit;font-weight:inherit;line-height:24px;font-family:inherit;vertical-align:baseline;max-width:760px;word-wrap:break-word;list-style-type:disc" class="">The <span style="margin:0px;padding:0px;border:0px;font-style:inherit;font-variant:inherit;font-weight:600;font-size:inherit;line-height:inherit;font-family:inherit;vertical-align:baseline" class="">most important text</span> has an opacity of 87%.</li><li style="margin:0px 0px 0.5em;padding:0px;border:0px;font-style:inherit;font-variant:inherit;font-weight:inherit;line-height:24px;font-family:inherit;vertical-align:baseline;max-width:760px;word-wrap:break-word;list-style-type:disc" class=""><span style="margin:0px;padding:0px;border:0px;font-style:inherit;font-variant:inherit;font-weight:600;font-size:inherit;line-height:inherit;font-family:inherit;vertical-align:baseline" class="">Secondary text</span>, which is lower in the visual hierarchy, has an opacity of 54%.</li><li style="margin:0px 0px 0.5em;padding:0px;border:0px;font-style:inherit;font-variant:inherit;font-weight:inherit;line-height:24px;font-family:inherit;vertical-align:baseline;max-width:760px;word-wrap:break-word;list-style-type:disc" class=""><span style="margin:0px;padding:0px;border:0px;font-style:inherit;font-variant:inherit;font-weight:600;font-size:inherit;line-height:inherit;font-family:inherit;vertical-align:baseline" class="">Text hints</span> (such as text fields and labels) and <span style="margin:0px;padding:0px;border:0px;font-style:inherit;font-variant:inherit;font-weight:600;font-size:inherit;line-height:inherit;font-family:inherit;vertical-align:baseline" class="">disabled text</span> have even lower visual prominence with an opacity of 38%.</li></ul></div><div style="margin:20px 0px;padding:0px 0px 20px;border:0px;font-size:13px;line-height:inherit;font-family:roboto,sans-serif;vertical-align:top;display:inline-block;width:328px;color:rgb(33,33,33);background-color:rgb(250,250,250)" dir="auto" class=""><figure style="margin:0px;padding:0px;border:0px;font-style:inherit;font-variant:inherit;font-weight:inherit;font-size:inherit;line-height:inherit;font-family:inherit;vertical-align:baseline;width:328px" class=""><div style="margin:0px;padding:0px;border:0px;font-style:inherit;font-variant:inherit;font-weight:inherit;font-size:inherit;line-height:inherit;font-family:inherit;vertical-align:baseline;max-width:720px" class=""><div style="margin:0px;padding:186.766px 0px 0px;border:0px;font-style:inherit;font-variant:inherit;font-weight:inherit;font-size:inherit;line-height:inherit;font-family:inherit;vertical-align:baseline;max-width:100%" class=""><img alt="" src="https://storage.googleapis.com/material-design/publish/material_v_11/assets/0BxFyKV4eeNjDa0dlWGxkWXBnTUk/style_color_usability_alpha1_161116.png" style="margin:0px;padding:0px;border:0px;font-style:inherit;font-variant:inherit;font-weight:inherit;font-size:inherit;line-height:inherit;font-family:inherit;vertical-align:baseline;display:block;max-width:100%;width:328px;height:186.766px" class=""></div></div></figure></div><div style="margin:20px 0px;padding:0px 0px 20px;border:0px;font-size:13px;line-height:inherit;font-family:roboto,sans-serif;vertical-align:top;display:inline-block;width:328px;color:rgb(33,33,33);background-color:rgb(250,250,250)" dir="auto" class=""><br class=""></div></div><div dir="auto" style="font-family:sans-serif" class=""><br class=""></div></div></div></div></blockquote><div><br class=""></div><div>So that's not how we do it today - I'm actually happy with our approach to secondary color (I just need to fix it for the dark theme).</div><div>Unless you feel very strongly about this, I'd keep that as is for Blue and Pink</div><br class=""><blockquote type="cite" class=""><div class=""><div dir="auto" class=""><div class="gmail_extra" dir="auto"><div dir="auto" style="font-family:sans-serif" class="">Now, on our UI I see we no longer have distinction with the phone status bar as before. Everything is of primary color while before we correctly have it dark primary color.</div></div></div></div></blockquote><div><br class=""></div>I noticed that as I verified the colors. I bet this is just me confusing myself with my clever names again. I'll figure it out and get that back.</div><div><br class=""><blockquote type="cite" class=""><div class=""><div dir="auto" class=""><div class="gmail_extra" dir="auto"><div dir="auto" style="font-family:sans-serif" class="">I didn't noticed you changed also format of the dive name into the detail page. Amazing. It has a small button [map it] too.</div></div></div></div></blockquote><div><br class=""></div>Yup.</div><div><br class=""><blockquote type="cite" class=""><div class=""><div dir="auto" class=""><div class="gmail_extra" dir="auto"><div dir="auto" style="font-family:sans-serif" class="">Is there any way to take advantage of the full screen width during the dive edit?</div></div></div></div></blockquote><div><br class=""></div>That's the cool overlay page... I like it. You don't? Sure, we can change anything.</div><div><br class=""><blockquote type="cite" class=""><div dir="auto" class=""><div class="gmail_extra" dir="auto"><div dir="auto" style="font-family:sans-serif" class="">If it could be useful, next week I will play a bit with sidebar organization and settings adding other idea on github.</div></div></div>

</blockquote></div><br class=""><div class="">So far I think your work has been extremely useful. I often don't know how to implement things, but I'll be happy to try</div><div class=""><br class=""></div><div class="">Thanks</div><div class=""><br class=""></div><div class="">/D</div></body></html>