doc-page structural changes

examples/index.js

@@ -254,8 +254,91 @@ export default angular.module('ui-docs', [
  }))
 
  .factory('playgrounds', () => ({
+ // React playgrounds
+ 'react': {
+ 'first-playground': {
+ name: 'First playground',
+ component: 'FirstPlayground'
+ },
+ 'sams-playground': {
+ name: 'SAMS',
+ component: 'SamsPlayground'
+ },
+ 'test-ground': {
+ name: 'Test Ground',
+ component: 'TestGround'
+ },
+ 'ui-playground': {
+ name: 'UI',
+ component: 'UiPlayground'
+ },
+ 'pagelayout-test': {
+ name: 'PageLayout Test',
+ component: 'PageLayoutTest'
+ },
+ 'editor-test': {
+ name: 'Editor Layout Test',
+ component: 'EditorTest'
+ },
+ 'personal-profile': {
+ name: 'Personal Profile',
+ component: 'PersonalProfile'
+ },
+ 'rundown-editor': {
+ name: 'Rundown Editor',
+ component: 'RundownEditor'
+ },
+ 'rundowns': {
+ name: 'Rundowns',
+ component: 'Rundowns'
+ },
+ 'core-layout': {
+ name: 'Core Layout',
+ component: 'CoreLayout'
+ },
+ 'multiedit': {
+ name: 'Multiedit',
+ component: 'Multiedit'
+ }
+ },
+
+ // Publisher playgrounds
+ publisher: {
+ 'publisher-dashboard': {
+ name: 'Dashboard',
+ page: 'publisher-dashboard.html'
+ },
+ 'publisher-content-lists': {
+ name: 'Content Lists',
+ page: 'publisher-content-lists.html'
+ },
+ 'publisher-content-list-manual': {
+ name: 'Content List - Manual',
+ page: 'publisher-content-list-manual.html'
+ },
+ 'publisher-content-list-automatic': {
+ name: 'Content List - Automatic',
+ page: 'publisher-content-list-automatic.html'
+ },
+ 'publisher-output-control': {
+ name: 'Output Control',
+ page: 'publisher-output-control.html'
+ },
+ 'publisher-content-analytics': {
+ name: 'Content Analytics',
+ page: 'publisher-content-analytics.html'
+ },
+ 'publisher-website-settings': {
+ name: 'Website Settings',
+ page: 'publisher-website-settings.html'
+ },
+ 'publisher-website-settings-general': {
+ name: 'Website Settings - General',
+ page: 'publisher-website-settings-general.html'
+ },
+ },
  // Superdesk playgrounds
- superdesk: {
+ 'archived': {
  'planning': {
  name: 'Planning',
  page: 'buttons.html'
@@ -341,89 +424,6 @@ export default angular.module('ui-docs', [
  page: 'editor-3-test.html'
  },
  },
- // Publisher playgrounds
- publisher: {
- 'publisher-dashboard': {
- name: 'Dashboard',
- page: 'publisher-dashboard.html'
- },
- 'publisher-content-lists': {
- name: 'Content Lists',
- page: 'publisher-content-lists.html'
- },
- 'publisher-content-list-manual': {
- name: 'Content List - Manual',
- page: 'publisher-content-list-manual.html'
- },
- 'publisher-content-list-automatic': {
- name: 'Content List - Automatic',
- page: 'publisher-content-list-automatic.html'
- },
- 'publisher-output-control': {
- name: 'Output Control',
- page: 'publisher-output-control.html'
- },
- 'publisher-content-analytics': {
- name: 'Content Analytics',
- page: 'publisher-content-analytics.html'
- },
- 'publisher-website-settings': {
- name: 'Website Settings',
- page: 'publisher-website-settings.html'
- },
- 'publisher-website-settings-general': {
- name: 'Website Settings - General',
- page: 'publisher-website-settings-general.html'
- },
- },
-
- // React playgrounds
- react: {
- 'first-playground': {
- name: 'First playground',
- component: 'FirstPlayground'
- },
- 'sams-playground': {
- name: 'SAMS',
- component: 'SamsPlayground'
- },
- 'test-ground': {
- name: 'Test Ground',
- component: 'TestGround'
- },
- 'ui-playground': {
- name: 'UI',
- component: 'UiPlayground'
- },
- 'pagelayout-test': {
- name: 'PageLayout Test',
- component: 'PageLayoutTest'
- },
- 'editor-test': {
- name: 'Editor Layout Test',
- component: 'EditorTest'
- },
- 'personal-profile': {
- name: 'Personal Profile',
- component: 'PersonalProfile'
- },
- 'rundown-editor': {
- name: 'Rundown Editor',
- component: 'RundownEditor'
- },
- 'rundowns': {
- name: 'Rundowns',
- component: 'Rundowns'
- },
- 'core-layout': {
- name: 'Core Layout',
- component: 'CoreLayout'
- },
- 'multiedit': {
- name: 'Multiedit',
- component: 'Multiedit'
- }
- }
  }))
 
  .config(($routeProvider) => {

examples/js/react.js

@@ -123,8 +123,7 @@ class ReactDefault extends React.PureComponent {
  <img src="/illustration--react.svg" alt="React" />
  </figure>
  <h2 className="docs-page__hero-h2 docs-page__color--primary">Home of Superdesk React components</h2>
- <p className="docs-page__hero-text">As the headline suggests – React components for Superdesk. Work in progress!</p>
- <p className="docs-page__hero-text sd-text__normal">Feel free to contribute!</p>
+ <p className="docs-page__hero-text">As the headline suggests, these where the React components live.</p>
  </div>
  </section>
  )
@@ -141,9 +140,7 @@ class PatternsDefault extends React.PureComponent {
  </figure>
  <h2 className="docs-page__hero-h2 docs-page__color--primary">Design Patterns</h2>
  <p className="docs-page__hero-text">
- Vestibulum id ligula porta felis euismod semper. Aenean lacinia bibendum nulla sed consectetur.
- Fusce dapibus, tellus ac cursus commodo, tortor mauris condimentum nibh, ut fermentum massa
- justo sit amet risus.
+ Examples of reusable solutions for common UI patterns in Superdesk.
  </p>
  </div>
  </section>

examples/pages/components.html

@@ -3,9 +3,9 @@
  <h1 class="docs-page__h1">Superdesk UI</h1>
  <ul class="docs-page__header-nav">
  <li class="docs-page__header-nav-item"><a class="docs-page__header-nav-link" href="#/">Home</a></li>
- <li class="docs-page__header-nav-item"><a class="docs-page__header-nav-link" href="#/design">Design guidelines</a></li>
  <li class="docs-page__header-nav-item docs-page__header-nav-item--active"><a class="docs-page__header-nav-link" href="#/components">Components</a></li>
  <li class="docs-page__header-nav-item"><a class="docs-page__header-nav-link" href="#/design-patterns">Design Patterns</a></li>
+ <li class="docs-page__header-nav-item"><a class="docs-page__header-nav-link" href="#/design">Design guidelines</a></li>
  <li class="docs-page__header-nav-item"><a class="docs-page__header-nav-link" href="#/playgrounds">Playground</a></li>
  </ul>
  <button class="docs-page__header-button" aria-label="Change theme" aria-haspopup="menu" aria-expanded="false">

examples/pages/components_deprecated.html

@@ -3,9 +3,9 @@
  <h1 class="docs-page__h1">Superdesk UI</h1>
  <ul class="docs-page__header-nav">
  <li class="docs-page__header-nav-item"><a class="docs-page__header-nav-link" href="#/">Home</a></li>
- <li class="docs-page__header-nav-item"><a class="docs-page__header-nav-link" href="#/design">Design guidelines</a></li>
  <li class="docs-page__header-nav-item docs-page__header-nav-item--active"><a class="docs-page__header-nav-link" href="#/components">Components</a></li>
  <li class="docs-page__header-nav-item"><a class="docs-page__header-nav-link" href="#/design-patterns">Design Patterns</a></li>
+ <li class="docs-page__header-nav-item"><a class="docs-page__header-nav-link" href="#/design">Design guidelines</a></li>
  <li class="docs-page__header-nav-item"><a class="docs-page__header-nav-link" href="#/playgrounds">Playground</a></li>
  </ul>
 </header>

examples/pages/design-patterns.html

@@ -3,9 +3,9 @@
  <h1 class="docs-page__h1">Superdesk UI</h1>
  <ul class="docs-page__header-nav">
  <li class="docs-page__header-nav-item"><a class="docs-page__header-nav-link" href="#/">Home</a></li>
- <li class="docs-page__header-nav-item"><a class="docs-page__header-nav-link" href="#/design">Design guidelines</a></li>
  <li class="docs-page__header-nav-item"><a class="docs-page__header-nav-link" href="#/components">Components</a></li>
  <li class="docs-page__header-nav-item docs-page__header-nav-item--active"><a class="docs-page__header-nav-link" href="#/design-patterns">Design Patterns</a></li>
+ <li class="docs-page__header-nav-item"><a class="docs-page__header-nav-link" href="#/design">Design guidelines</a></li>
  <li class="docs-page__header-nav-item"><a class="docs-page__header-nav-link" href="#/playgrounds">Playground</a></li>
  </ul>
  <button class="docs-page__header-button" aria-label="Change theme" aria-haspopup="menu" aria-expanded="false">

examples/pages/design.html

@@ -3,9 +3,9 @@
  <h1 class="docs-page__h1">Superdesk UI</h1>
  <ul class="docs-page__header-nav">
  <li class="docs-page__header-nav-item"><a class="docs-page__header-nav-link" href="#/">Home</a></li>
- <li class="docs-page__header-nav-item docs-page__header-nav-item--active"><a class="docs-page__header-nav-link" href="#/design">Design guidelines</a></li>
  <li class="docs-page__header-nav-item"><a class="docs-page__header-nav-link" href="#/components">Components</a></li>
  <li class="docs-page__header-nav-item"><a class="docs-page__header-nav-link" href="#/design-patterns">Design Patterns</a></li>
+ <li class="docs-page__header-nav-item docs-page__header-nav-item--active"><a class="docs-page__header-nav-link" href="#/design">Design guidelines</a></li>
  <li class="docs-page__header-nav-item"><a class="docs-page__header-nav-link" href="#/playgrounds">Playground</a></li>
  </ul>
 </header>

examples/pages/main.html

@@ -3,9 +3,9 @@
  <h1 class="docs-page__h1">Superdesk UI</h1>
  <ul class="docs-page__header-nav">
  <li class="docs-page__header-nav-item docs-page__header-nav-item--active"><a class="docs-page__header-nav-link" href="#/">Home</a></li>
- <li class="docs-page__header-nav-item"><a class="docs-page__header-nav-link" href="#/design">Design guidelines</a></li>
  <li class="docs-page__header-nav-item"><a class="docs-page__header-nav-link" href="#/components">Components</a></li>
  <li class="docs-page__header-nav-item"><a class="docs-page__header-nav-link" href="#/design-patterns">Design Patterns</a></li>
+ <li class="docs-page__header-nav-item"><a class="docs-page__header-nav-link" href="#/design">Design guidelines</a></li>
  <li class="docs-page__header-nav-item"><a class="docs-page__header-nav-link" href="#/playgrounds">Playground</a></li>
  </ul>
 </header>
@@ -20,42 +20,44 @@ <h4 class="docs-page__masthead-subheading">v{{version}}</h4>
  <div class="docs-page__container docs-page__container--medium">
  <div class="flex-grid flex-grid--boxed flex-grid--wrap-items flex-grid--small-4">
 
- <a class="sd-card sd-card--with-click sd-card--blank sd-card--rounded flex-grid__item" href="#/design">
+ <a class="sd-card sd-card--with-click sd-card--blank sd-card--rounded flex-grid__item" href="#/components">
  <div class="sd-card__header sd-card__header--with-thumb sd-card__header--blank">
  <div class="sd-card__thumbnail sd-padding-x--1">
- <img src="/illustration--design.svg" alt="Design guidelines">
+ <img src="/illustration--react.svg" alt="React">
  </div>
  </div>
  <div class="sd-card__content">
- <h4 class="sd-card__content-heading sd-text__serif sd-text-align--center docs-page__color--primary">Design guidelines</h4>
- <p class="docs-page__paragraph--light sd-text-align--center">What to do and what not while creating user interfaces in Superdesk.</p>
+ <h4 class="sd-card__content-heading sd-text__serif sd-text-align--center docs-page__color--primary">Components</h4>
+ <p class="docs-page__paragraph--light sd-text-align--center">Superdesk UI components in React.</p> 
  </div>
  </a>
 
- <a class="sd-card sd-card--with-click sd-card--blank sd-card--rounded flex-grid__item" href="#/components">
+ <a class="sd-card sd-card--with-click sd-card--blank sd-card--rounded flex-grid__item" href="#/design-patterns">
  <div class="sd-card__header sd-card__header--with-thumb sd-card__header--blank">
  <div class="sd-card__thumbnail sd-padding-x--1">
  <img src="/illustration--components.svg" alt="Superdesk UI Components">
  </div>
  </div>
  <div class="sd-card__content sd-padding-x--1">
- <h4 class="sd-card__content-heading sd-text__serif sd-text-align--center docs-page__color--primary">Components</h4>
- <p class="docs-page__paragraph--light sd-text-align--center">Superdesk HTML/CSS and Angular UI components.</p>
+ <h4 class="sd-card__content-heading sd-text__serif sd-text-align--center docs-page__color--primary">Design Patterns</h4>
+ <p class="docs-page__paragraph--light sd-text-align--center">Examples of reusable solutions for common UI patterns in Superdesk.</p>
  </div>
  </a>
 
- <a class="sd-card sd-card--with-click sd-card--blank sd-card--rounded flex-grid__item" href="#/react">
+ <a class="sd-card sd-card--with-click sd-card--blank sd-card--rounded flex-grid__item" href="#/design">
  <div class="sd-card__header sd-card__header--with-thumb sd-card__header--blank">
  <div class="sd-card__thumbnail sd-padding-x--1">
- <img src="/illustration--react.svg" alt="React">
+ <img src="/illustration--design.svg" alt="Design guidelines">
  </div>
  </div>
  <div class="sd-card__content">
- <h4 class="sd-card__content-heading sd-text__serif sd-text-align--center docs-page__color--primary">React</h4>
- <p class="docs-page__paragraph--light sd-text-align--center">React UI components. Still in early stages, but will hopefully grow quickly.</p> 
+ <h4 class="sd-card__content-heading sd-text__serif sd-text-align--center docs-page__color--primary">Design guidelines</h4>
+ <p class="docs-page__paragraph--light sd-text-align--center">What to do and what not while creating user interfaces in Superdesk.</p>
  </div>
  </a>
 
+
+
  <a class="sd-card sd-card--with-click sd-card--blank sd-card--rounded flex-grid__item" href="#/playgrounds">
  <div class="sd-card__header sd-card__header--with-thumb sd-card__header--blank">
  <div class="sd-card__thumbnail sd-padding-x--1">
@@ -64,7 +66,7 @@ <h4 class="sd-card__content-heading sd-text__serif sd-text-align--center docs-pa
  </div>
  <div class="sd-card__content">
  <h4 class="sd-card__content-heading sd-text__serif sd-text-align--center docs-page__color--primary">Playground</h4>
- <p class="docs-page__paragraph--light sd-text-align--center">Examples and drafts for more complex modules and full-page layouts.</p>
+ <p class="docs-page__paragraph--light sd-text-align--center">Examples, full-page layouts and design drafts.</p>
  </div>
  </a>
 

examples/pages/playgrounds.html

@@ -3,9 +3,9 @@
  <h1 class="docs-page__h1">Superdesk UI</h1>
  <ul class="docs-page__header-nav">
  <li class="docs-page__header-nav-item"><a class="docs-page__header-nav-link" href="#/">Home</a></li>
- <li class="docs-page__header-nav-item"><a class="docs-page__header-nav-link" href="#/design">Design guidelines</a></li>
  <li class="docs-page__header-nav-item"><a class="docs-page__header-nav-link" href="#/components">Components</a></li>
  <li class="docs-page__header-nav-item"><a class="docs-page__header-nav-link" href="#/design-patterns">Design Patterns</a></li>
+ <li class="docs-page__header-nav-item"><a class="docs-page__header-nav-link" href="#/design">Design guidelines</a></li>
  <li class="docs-page__header-nav-item docs-page__header-nav-item--active"><a class="docs-page__header-nav-link" href="#/playgrounds">Playground</a></li>
  </ul>
 </header>
@@ -15,12 +15,10 @@ <h1 class="docs-page__h1">Superdesk UI</h1>
  <img src="/illustration--playground.svg" alt="React">
  </figure>
  <h2 class="docs-page__hero-h2 docs-page__color--primary">UI Playgrounds</h2>
- <p class="docs-page__hero-text">Examples and drafts for more complex modules<br>
- and full-page layouts.</p>
+ <p class="docs-page__hero-text">Examples, full-page layouts and design drafts.</p>
  </div>
  <section class="docs-page__container sd-margin-t--0">
  <div class="flex-grid flex-grid--boxed flex-grid--wrap-items flex-grid--small-3">
-
  <div class="sd-card flex-grid__item" ng-repeat="(group, content) in playgrounds">
  <div class="sd-card__header sd-card__header--with-thumb sd-card__header--gradient-1">
  <div class="sd-card__thumbnail sd-card__thumbnail--size-xxs">
@@ -36,7 +34,6 @@ <h4 class="sd-card__thumbnail-heading" style="text-transform: capitalize;">{{gro
  </ul>
  </div>
  </div>
-
  </div>
  </section>
 </main>

package.json

@@ -1,6 +1,6 @@
 {
  "name": "superdesk-ui-framework",
- "version": "3.1.5",
+ "version": "3.1.6",
  "license": "AGPL-3.0",
  "repository": {
  "type": "git",