<div dir="ltr"><div dir="ltr">





<p class="gmail-p1" style="margin:0px;font-variant-numeric:normal;font-variant-east-asian:normal;font-stretch:normal;font-size:12px;line-height:normal;font-family:"Helvetica Neue"">One of the topics from the GUI Design workgroup is how the GUI style guide is shared with the whole community. The attendees agreed that we should get feedback from the broader community on the proposal to make the guide more "open".</p><p class="gmail-p1" style="margin:0px;font-variant-numeric:normal;font-variant-east-asian:normal;font-stretch:normal;font-size:12px;line-height:normal;font-family:"Helvetica Neue""><br></p><p class="gmail-p1" style="margin:0px;font-variant-numeric:normal;font-variant-east-asian:normal;font-stretch:normal;font-size:12px;line-height:normal;font-family:"Helvetica Neue"">To start with, the purpose of the guide is not to replace the bootstrap library. Instead, this guide will help front-end designers and developers provide consistent patterns, behaviors, and interactions such as colors, form and validation behaviors, accessibility interactions, terminology, animations, etc. </p><p class="gmail-p1" style="margin:0px;font-variant-numeric:normal;font-variant-east-asian:normal;font-stretch:normal;font-size:12px;line-height:normal;font-family:"Helvetica Neue""><br></p><p class="gmail-p1" style="margin:0px;font-variant-numeric:normal;font-variant-east-asian:normal;font-stretch:normal;font-size:12px;line-height:normal;font-family:"Helvetica Neue"">Today, the first version of the style guide is shared as a series of flattened images (png). And the source files are not easily accessible to the community <a href="https://ibm.invisionapp.com/share/EBNYECMH3Y2">https://ibm.invisionapp.com/share/EBNYECMH3Y2</a>.  </p><p class="gmail-p1" style="margin:0px;font-variant-numeric:normal;font-variant-east-asian:normal;font-stretch:normal;font-size:12px;line-height:normal;font-family:"Helvetica Neue""><br></p><p class="gmail-p1" style="margin:0px;font-variant-numeric:normal;font-variant-east-asian:normal;font-stretch:normal;font-size:12px;line-height:normal;font-family:"Helvetica Neue"">I am proposing to build a website served through Github Pages. This would allow users to easily find and navigate to the information they need. It also allows users to interact with the content.  An example of this can be found here: <a href="https://bradfrost.github.io/style-guide-guide/">https://bradfrost.github.io/style-guide-guide/</a>. </p>





<p class="gmail-p1" style="margin:0px;font-variant-numeric:normal;font-variant-east-asian:normal;font-stretch:normal;font-size:12px;line-height:normal;font-family:"Helvetica Neue""><br></p><p class="gmail-p1" style="margin:0px;font-variant-numeric:normal;font-variant-east-asian:normal;font-stretch:normal;font-size:12px;line-height:normal;font-family:"Helvetica Neue"">With this solution, the code will be stored in a style guide repo allowing for the community to provide feedback using Github issues, as well as the ability to make changes using the standard development process. </p>





<p class="gmail-p1" style="margin:0px;font-variant-numeric:normal;font-variant-east-asian:normal;font-stretch:normal;font-size:12px;line-height:normal;font-family:"Helvetica Neue""><br></p><p class="gmail-p1" style="margin:0px;font-variant-numeric:normal;font-variant-east-asian:normal;font-stretch:normal;font-size:12px;line-height:normal;font-family:"Helvetica Neue"">A Github issue has been created to track feedback on this topic. Please post your feedback here:  <a href="https://github.com/openbmc/phosphor-webui/issues/41">https://github.com/openbmc/phosphor-webui/issues/41</a></p><p class="gmail-p1" style="margin:0px;font-variant-numeric:normal;font-variant-east-asian:normal;font-stretch:normal;font-size:12px;line-height:normal;font-family:"Helvetica Neue""><br></p><p class="gmail-p1" style="margin:0px;font-variant-numeric:normal;font-variant-east-asian:normal;font-stretch:normal;font-size:12px;line-height:normal;font-family:"Helvetica Neue"">Thank you in advance for your feedback -- Susan Jasinski</p>











<p class="gmail-p1" style="margin:0px;font-variant-numeric:normal;font-variant-east-asian:normal;font-stretch:normal;line-height:normal"><br></p></div></div>