diff options
Diffstat (limited to 'web-ui/app/style-guide.html')
| -rw-r--r-- | web-ui/app/style-guide.html | 28 |
1 files changed, 11 insertions, 17 deletions
diff --git a/web-ui/app/style-guide.html b/web-ui/app/style-guide.html index c145bd9a..4e038822 100644 --- a/web-ui/app/style-guide.html +++ b/web-ui/app/style-guide.html @@ -16,32 +16,26 @@ <div id="style-guide-wrap" data-offcanvas> <nav class="top-bar" data-topbar> <ul class="left"> - <li><a class="logo-anchor" href="#guidelines">Pixelated Style Guide</a></li> + <li><a class="logo-anchor" href="#welcome">Pixelated Style Guide</a></li> </ul> <ul class="right"> - <li><a href="#guidelines">Guidelines</a></li> + <li><a href="#welcome">Welcome</a></li> <li><a href="#colors">Colors</a></li> <li><a href="#typography">Typography</a></li> <li><a href="#components">Components</a></li> <li><a href="#icons">Icons</a></li> </ul> </nav> - <section id="guidelines" class="guide-section" name="guidelines"> - <h2>Basic Guidelines</h2> - - Guidelines, guidelines, guidelines. - </br> - Guidelines, guidelines, guidelines. - </br> - Guidelines, guidelines, guidelines. - </br> - Guidelines, guidelines, guidelines. - </br> - Guidelines, guidelines, guidelines. - </br> - Guidelines, guidelines, guidelines. - </br> + <section id="welcome" class="guide-section" name="welcome"> + <h2>Welcome to the Pixelated Style Guide</h2> + <p> + Here you'll find information about visual design and UI guidelines for Pixelated, such as colors, typography and components. + </p> + <p> + This is a live style guide - that means it's reflecting the actual application cascading stylesheets, but also that it will be continuously and automatically updated as our design evolves. + </p> + <img class="screenshot" src="/images/pixelated-screenshot.png" alt="Pixelated Screenshot" /> </section> <section id="colors" class="guide-section"> <h2>Color Palette</h2> |