deckgo · peterpeterparker · Jul 29, 2020 · Jun 22, 2020 · Jun 23, 2020 · Jun 24, 2020
diff --git a/CHANGELOG.md b/CHANGELOG.md
@@ -1,6 +1,18 @@
+<a name="2.1.0"></a>
+
+# [2.1.0](https://github.com/deckgo/deckdeckgo/compare/v2.0.0...v2.1.0) (In progress..)
+
+### Applications
+
+- docs: v1.7.1 ([CHANGELOG](https://github.com/deckgo/deckdeckgo/blob/master/docs/CHANGELOG.md))
+
+### Web Components
+
+- color: v2.1.2 ([CHANGELOG](https://github.com/deckgo/deckdeckgo/blob/master/webcomponents/color/CHANGELOG.md))
+
 <a name="2.0.0"></a>
 
-# [2.0.0](https://github.com/deckgo/deckdeckgo/compare/v1.5.0...v1.6.0) (In progress...)
+# [2.0.0](https://github.com/deckgo/deckdeckgo/compare/v1.5.0...v2.0.0) (2020-07-23)
 
 ### Breaking Changes
 

diff --git a/README.md b/README.md
@@ -47,7 +47,7 @@ Are you interested to contribute to our open source project? That would be aweso
 | ------------------ | ----------------------------------------------------------------------------------------------------------------------------- | ---------------------------------------------------------- | :--------------------------------------------------: | :--------------------------------: |
 | **Studio**         | [![version](https://img.shields.io/static/v1.svg?label=production&message=v2.0.0&color=success)](https://deckdeckgo.com)      | [https://deckdeckgo.com](https://deckdeckgo.com)           |             [`README`](studio/README.md)             | [`CHANGELOG`](studio/CHANGELOG.md) |
 | **Remote control** | [![version](https://img.shields.io/static/v1.svg?label=production&message=v1.6.0&color=success)](https://deckdeckgo.app)      | [https://deckdeckgo.app](https://deckdeckgo.app)           |             [`README`](remote/README.md)             | [`CHANGELOG`](remote/CHANGELOG.md) |
-| **Documentation**  | [![version](https://img.shields.io/static/v1.svg?label=production&message=v1.7.0&color=success)](https://docs.deckdeckgo.com) | [https://docs.deckdeckgo.com](https://docs.deckdeckgo.com) |              [`README`](docs/README.md)              |  [`CHANGELOG`](docs/CHANGELOG.md)  |
+| **Documentation**  | [![version](https://img.shields.io/static/v1.svg?label=production&message=v1.7.1&color=success)](https://docs.deckdeckgo.com) | [https://docs.deckdeckgo.com](https://docs.deckdeckgo.com) |              [`README`](docs/README.md)              |  [`CHANGELOG`](docs/CHANGELOG.md)  |
 | **Demo**           | [![version](https://img.shields.io/static/v1.svg?label=production&message=v2.4.0&color=success)](https://demo.deckdeckgo.com) | [https://demo.deckdeckgo.com](https://demo.deckdeckgo.com) | [`Repo`](https://github.com/deckgo/deckdeckgo-demo/) |                                    |
 
 ## Web Components

diff --git a/docs/CHANGELOG.md b/docs/CHANGELOG.md
@@ -1,3 +1,9 @@
+# 1.7.1 (2020-07-28)
+
+### Features
+
+- `part` option for `@deckdeckgo/color` component
+
 # 1.7.0 (2020-07-11)
 
 ### Features

diff --git a/docs/docs/components/app-components-color/app-components-color.md b/docs/docs/components/app-components-color/app-components-color.md
@@ -6,14 +6,21 @@ It is fully configurable in terms of colors, you could define the set of colors
 
 ## Table of contents
 
-- [Showcase](#app-components-color-showcase)
-- [Installation](#app-components-color-installation) - [Using from a CDN](#app-components-color-from-a-cdn) - [Install from NPM](#app-components-color-from-npm) - [Framework integration](#app-components-color-framework-integration)
-- [Usage](#app-components-color-usage)
-  - [Slots](#app-components-color-slots)
-  - [Attributes](#app-components-color-attributes)
-  - [Theming](#app-components-color-theming)
-  - [Methods](#app-components-color-methods)
-- [Trying it out](#app-components-color-trying-it-out)
+- [Color Picker](#color-picker)
+  - [Table of contents](#table-of-contents)
+  - [Showcase](#showcase)
+  - [Installation](#installation)
+    - [Using from a CDN](#using-from-a-cdn)
+    - [Install from NPM](#install-from-npm)
+    - [Framework integration](#framework-integration)
+      - [Import](#import)
+      - [Loader](#loader)
+  - [Usage](#usage)
+    - [Slots](#slots)
+    - [Attributes](#attributes)
+      - [Palette](#palette)
+    - [Theming](#theming)
+    - [Events](#events)
 
 ## Showcase
 
@@ -225,6 +232,10 @@ The following theming options will affect this component if set on its host or p
 | --deckgo-color-label-text-align        | center      | Text alignment of the color description                       |
 | --deckgo-color-label-color-font-weight | 300         | Font weight of the hexadecimal value of the color description |
 
+| Shadow-DOM part | Note                                                   |
+| --------------- | ------------------------------------------------------ |
+| container       | Allows to style the container the color buttons are in |
+
 ### Events
 
 To listen to the selected color you have to subscribe to the following event:

diff --git a/docs/package-lock.json b/docs/package-lock.json
diff --git a/docs/package.json b/docs/package.json
@@ -1,6 +1,6 @@
 {
   "name": "deckdeckgo-docs",
-  "version": "1.7.0",
+  "version": "1.7.1",
   "description": "The Progressive Web App alternative for simple presentations",
   "license": "MIT",
   "files": [

diff --git a/studio/src/app/app-root.tsx b/studio/src/app/app-root.tsx
@@ -126,10 +126,14 @@ export class AppRoot {
     return [
       <ion-app class={this.loading ? 'loading' : undefined}>
         <ion-router useHash={false}>
-          <ion-route url="/" component="app-home" />
+          <ion-route url="/" component="app-welcome" />
+
+          <ion-route url="/home" component="app-home" />
 
           <ion-route url="/discover" component="app-discover" />
 
+          <ion-route url="/enterprise" component="app-enterprise" />
+
           <ion-route url="/editor" component="app-editor" />
           <ion-route url="/editor/:deckId" component="app-editor" />
 

diff --git a/studio/src/app/components/core/app-menu/app-menu.tsx b/studio/src/app/components/core/app-menu/app-menu.tsx
@@ -43,6 +43,7 @@ export class AppMenu {
 
         {this.renderHome()}
         {this.renderDiscover()}
+        {this.renderEnterprise()}
         {this.renderDashboard()}
         {this.renderSettings()}
         {this.renderSignInOut()}
@@ -53,7 +54,7 @@ export class AppMenu {
   private renderUser() {
     if (authStore.state.loggedIn) {
       return (
-        <ion-item class="user">
+        <ion-item class="user ion-margin-bottom">
           <app-user-info avatarColSize={3}></app-user-info>
         </ion-item>
       );
@@ -95,18 +96,14 @@ export class AppMenu {
 
   private renderHome() {
     return (
-      <ion-item button class="home" href="/" routerDirection="forward">
-        <ion-icon lazy={true} name="home-outline" slot="start"></ion-icon>
-        <ion-label>Home</ion-label>
+      <ion-item button class="home" href="/home" routerDirection="forward">
+        <app-logo slot="start"></app-logo>
+        <ion-label>DeckDeckGo</ion-label>
       </ion-item>
     );
   }
 
   private renderDiscover() {
-    if (authStore.state.loggedIn) {
-      return undefined;
-    }
-
     return (
       <ion-item button class="home" href="/discover" routerDirection="forward">
         <ion-icon lazy={true} name="search-outline" slot="start"></ion-icon>
@@ -115,6 +112,15 @@ export class AppMenu {
     );
   }
 
+  private renderEnterprise() {
+    return (
+      <ion-item button class="home" href="/enterprise" routerDirection="forward">
+        <ion-icon lazy={true} name="business-outline" slot="start"></ion-icon>
+        <ion-label>Enterprise</ion-label>
+      </ion-item>
+    );
+  }
+
   private renderSettings() {
     return (
       <ion-item button class="home" href="/settings" routerDirection="forward">

diff --git a/studio/src/app/components/core/app-navigation-actions/app-navigation-actions.tsx b/studio/src/app/components/core/app-navigation-actions/app-navigation-actions.tsx
@@ -39,7 +39,6 @@ export class AppNavigationActions {
   render() {
     return (
       <div>
-        {this.renderFeed()}
         {this.renderSignIn()}
         {this.renderPresentationButton()}
         {this.renderPublishButton()}
@@ -48,18 +47,6 @@ export class AppNavigationActions {
     );
   }
 
-  private renderFeed() {
-    if (authStore.state.loggedIn || !this.signIn) {
-      return undefined;
-    } else if (this.presentation || this.publish) {
-      return (
-        <ion-router-link href="/discover" routerDirection="forward" class="wide-device ion-padding-start ion-padding-end">
-          <ion-label>Discover</ion-label>
-        </ion-router-link>
-      );
-    }
-  }
-
   private renderSignIn() {
     if (authStore.state.loggedIn || !this.signIn) {
       return undefined;

diff --git a/studio/src/app/components/core/app-navigation/app-navigation.scss b/studio/src/app/components/core/app-navigation/app-navigation.scss
@@ -32,13 +32,17 @@ app-navigation {
       user-select: none;
     }
 
+    ion-router-link.nav:not(:last-of-type) {
+      margin-right: 24px;
+    }
+
     &.deck-name-visible {
       ion-label.deck-name {
         visibility: initial;
         opacity: 1;
       }
 
-      ion-router-link.home div.logo ion-label {
+      ion-router-link.nav ion-label {
         display: none;
       }
     }
@@ -111,11 +115,11 @@ body.dark {
   }
 }
 
-@media screen and (max-width: 720px) {
+@media screen and (max-width: 768px) {
   ion-nav {
     div.title:not(.offline) {
       ion-label.deck-name,
-      ion-router-link.home ion-label {
+      ion-router-link.nav ion-label {
         display: none;
       }
     }

diff --git a/studio/src/app/components/core/app-navigation/app-navigation.tsx b/studio/src/app/components/core/app-navigation/app-navigation.tsx
@@ -40,15 +40,43 @@ export class AppNavigation {
 
     return (
       <div class={titleClass}>
-        <ion-router-link onClick={() => this.closeMenu()} href="/" routerDirection="forward" class="home">
+        <ion-router-link onClick={() => this.closeMenu()} href="/home" routerDirection="forward" class="nav">
           {this.renderLogo()}
         </ion-router-link>
 
+        {this.renderFeed()}
+
+        {this.renderEnterprise()}
+
         <ion-label class="deck-name">{store.state.name}</ion-label>
       </div>
     );
   }
 
+  private renderFeed() {
+    if (this.presentation || this.publish) {
+      return (
+        <ion-router-link href="/discover" routerDirection="forward" class="nav discover">
+          <ion-label>Discover</ion-label>
+        </ion-router-link>
+      );
+    } else {
+      return undefined;
+    }
+  }
+
+  private renderEnterprise() {
+    if (this.presentation || this.publish) {
+      return (
+        <ion-router-link href="/enterprise" routerDirection="forward" class="nav">
+          <ion-label>Enterprise</ion-label>
+        </ion-router-link>
+      );
+    } else {
+      return undefined;
+    }
+  }
+
   private renderTitleOffline() {
     if (offlineStore.state.offline === undefined) {
       return undefined;

diff --git a/...omponents/core/app-footer/app-footer.scss → ...ts/core/footer/app-footer/app-footer.scss b/...omponents/core/app-footer/app-footer.scss → ...ts/core/footer/app-footer/app-footer.scss
@@ -20,6 +20,8 @@
 }
 
 app-footer {
+  display: block;
+
   div.footer-container {
     font-size: var(--font-size-small);
 

diff --git a/...components/core/app-footer/app-footer.tsx → ...nts/core/footer/app-footer/app-footer.tsx b/...components/core/app-footer/app-footer.tsx → ...nts/core/footer/app-footer/app-footer.tsx
diff --git a/...pp-landing-footer/app-landing-footer.scss → ...pp-section-footer/app-section-footer.scss b/...pp-landing-footer/app-landing-footer.scss → ...pp-section-footer/app-section-footer.scss
@@ -1,10 +1,14 @@
-app-landing-footer {
-  main {
+app-section-footer {
+  footer {
     display: flex;
     flex-direction: column;
     justify-content: center;
     align-items: center;
 
+    section {
+      padding: 0;
+    }
+
     section.links {
       margin-top: 48px;
       max-width: 768px;

diff --git a/studio/src/app/components/core/footer/app-section-footer/app-section-footer.tsx b/studio/src/app/components/core/footer/app-section-footer/app-section-footer.tsx
@@ -0,0 +1,41 @@
+import {Component, h, Prop} from '@stencil/core';
+
+@Component({
+  tag: 'app-section-footer',
+  styleUrl: 'app-section-footer.scss',
+  shadow: false,
+})
+export class AppSectionFooter {
+  @Prop()
+  action: boolean = true;
+
+  render() {
+    return (
+      <footer>
+        <img src={`/assets/img/landing/wave-remote.svg`} role="presentation" loading="lazy" class="wave-section" />
+
+        {this.renderAction()}
+
+        <section class="ion-padding links">
+          <app-footer display="landing"></app-footer>
+        </section>
+      </footer>
+    );
+  }
+
+  private renderAction() {
+    if (!this.action) {
+      return undefined;
+    }
+
+    return (
+      <section class="ion-padding ion-text-center">
+        <h3>Start now.</h3>
+
+        <ion-button class="ion-margin-top" shape="round" href="/editor" routerDirection="root" mode="md" color="primary">
+          <ion-label>Write a presentation</ion-label>
+        </ion-button>
+      </section>
+    );
+  }
+}
diff --git a/studio/src/app/components/editor/actions/app-actions-editor/app-actions-editor.scss b/studio/src/app/components/editor/actions/app-actions-editor/app-actions-editor.scss
@@ -63,7 +63,7 @@ app-actions-editor {
     }
   }
 
-  @media screen and (max-width: 720px) {
+  @media screen and (max-width: 768px) {
     ion-tab-button,
     app-action-share,
     app-action-busy,
@@ -74,7 +74,7 @@ app-actions-editor {
     }
   }
 
-  @media screen and (min-width: 720px) {
+  @media screen and (min-width: 768px) {
     ion-tab-button,
     app-action-share,
     app-action-busy,

diff --git a/studio/src/app/components/enterprise/app-contact-form/app-contact-form.scss b/studio/src/app/components/enterprise/app-contact-form/app-contact-form.scss
@@ -0,0 +1,38 @@
+section.contact {
+  background: white;
+
+  div.content {
+    display: flex;
+    justify-content: center;
+
+    form {
+      width: 720px;
+      max-width: 100%;
+
+      display: flex;
+      flex-direction: column;
+
+      ion-item {
+        margin: 4px 0;
+      }
+
+      ion-button,
+      p {
+        width: fit-content;
+        align-self: center;
+
+        &.address {
+          white-space: pre-wrap;
+          text-align: center;
+          margin: 64px 16px 0;
+          font-size: var(--font-size-normal);
+          line-height: calc(var(--font-size-normal) + 8px);
+        }
+      }
+
+      small {
+        font-weight: 300;
+      }
+    }
+  }
+}