Added missing tooltips and fixed button styling. (#1564)

Author: azaslonov

src/components/content/content.html

@@ -1,12 +1,12 @@
 <div class="flex flex-column fit">
     <div class="flex-item flex-item-grow">
-        <button class="btn" data-bind="click: publish">
+        <button class="btn btn-default" data-bind="click: publish">
             <i class="paperbits-icon paperbits-send"></i>
             Publish website
         </button>
     </div>
     <div class="flex-item">
-        <button class="btn" data-bind="click: reset">
+        <button class="btn btn-default" data-bind="click: reset">
             <i class="paperbits-icon paperbits-simple-remove"></i>
             Reset content
         </button>

src/components/content/content.module.ts

@@ -1,12 +1,12 @@
 import { IInjectorModule, IInjector } from "@paperbits/common/injection";
 import { ContentWorkshop } from "./content";
-import { ContentWorkshopSection } from "./contentSection";
+import { OperationsSectionToolButton } from "./operationsSection";
 import { ResetDetailsWorkshop } from "./resetDetails";
 
 export class ContentModule implements IInjectorModule {
     public register(injector: IInjector): void {
         injector.bind("contentWorkshop", ContentWorkshop);
         injector.bind("resetDetailsWorkshop", ResetDetailsWorkshop);
-        injector.bindToCollection("workshopSections", ContentWorkshopSection);
+        injector.bindToCollection("workshopSections", OperationsSectionToolButton);
     }
-}
+}

src/components/content/contentSection.ts

@@ -1,3 +1,3 @@
 export * from "./content.module";
-export * from "./contentSection";
+export * from "./operationsSection";
 export * from "./content";

src/components/content/index.ts

@@ -0,0 +1,23 @@
+import { ToolButton, ViewManager, View } from "@paperbits/common/ui";
+
+const helpText = "<h1>Operations</h1><p>Publish your portal to make the latest version available to visitors.</p><p>Reset content to roll back to portal's default state.</p>";
+
+export class OperationsSectionToolButton implements ToolButton {
+    public readonly iconClass: string = "paperbits-icon paperbits-send";
+    public readonly title: string = "Operations";
+    public readonly tooltip: string = helpText;
+
+    constructor(private readonly viewManager: ViewManager) { }
+
+    public onActivate(): void {
+        this.viewManager.clearJourney();
+
+        const view: View = {
+            heading: this.title,
+            helpText: helpText,
+            component: { name: "content-workshop" }
+        };
+
+        this.viewManager.openViewAsWorkshop(view);
+    }
+}

src/components/content/operationsSection.ts

@@ -1,10 +1,10 @@
 import { IInjectorModule, IInjector } from "@paperbits/common/injection";
-import { HelpWorkshop, HelpDetailsWorkshop, HelpWorkshopSection } from ".";
+import { HelpWorkshop, HelpDetailsWorkshop, HelpSectionToolButton } from ".";
 
 export class HelpModule implements IInjectorModule {
     public register(injector: IInjector): void {
         injector.bind("helpWorkshop", HelpWorkshop);
         injector.bind("helpDetailsWorkshop", HelpDetailsWorkshop);
-        injector.bindToCollection("workshopSections", HelpWorkshopSection);
+        injector.bindToCollection("workshopSections", HelpSectionToolButton);
     }
 }

src/components/help/help.module.ts

@@ -1,8 +1,11 @@
 import { ToolButton, ViewManager, View } from "@paperbits/common/ui";
 
-export class HelpWorkshopSection implements ToolButton {
-    public iconClass: string = "paperbits-icon paperbits-c-question";
-    public title: string = "Help";
+const helpText = "<h1>Help</h1><p>Get help with configuring the developer portal.</p>";
+
+export class HelpSectionToolButton implements ToolButton {
+    public readonly iconClass: string = "paperbits-icon paperbits-c-question";
+    public readonly title: string = "Help";
+    public readonly tooltip: string = helpText;
 
     constructor(private readonly viewManager: ViewManager) { }