Updated Template files and CSS

jsuddsjr · Jun 1, 2019 · 4be2635 · 4be2635
1 parent 053cd2d
commit 4be2635
Show file tree

Hide file tree

Showing 5 changed files with 162 additions and 27 deletions.
diff --git a/src/app/GeneratorTeamsApp.ts b/src/app/GeneratorTeamsApp.ts
@@ -320,6 +320,7 @@ export class GeneratorTeamsApp extends Generator {
                 "src/manifest/icon-outline.png",
                 "src/manifest/icon-color.png",
                 "src/app/web/assets/icon.png",
+                "src/app/web/styles/main.scss",
                 'deploy.cmd',
                 '_deployment',
                 "src/app/TeamsAppsComponents.ts"
@@ -328,6 +329,7 @@ export class GeneratorTeamsApp extends Generator {
             let templateFiles = [
                 "README.md",
                 "gulpfile.js",
+                "gulp.config.js",
                 "package.json",
                 ".env",
                 'src/app/server.ts',

diff --git a/src/app/templates/src/app/web/index.html b/src/app/templates/src/app/web/index.html
@@ -21,17 +21,22 @@
 </head>
 
 <body>
-    <h1>
-        Welcome to the <em><%= title %></em></h1>
-    <p>
-        <%= description %>
-    </p>
+    <header class="l-header">
+        <div class="logo">
+            <img src="https://static2.sharepointonline.com/files/fabric/assets/brand-icons/product-fluent/svg/teams_48x1.svg"
+                class="logo">
+        </div>
+        <div class="l-title">
+            <h1>Welcome to the <em><%= title %></em></h1>
+        </div>
+    </header>
+    <article class="l-article">
+        <p><%= description %></p>
     <% if (botType == 'botframework') { %>
-        <p>
-            Add the Bot to Microsoft Teams: 
-            <a href='https://teams.microsoft.com/l/chat/0/0?users=28:{{<%= botidEnv %>}}'><img height="30" width="113" src='https://dev.botframework.com/Client/Images/Add-To-MSTeams-Buttons.png'></a>
-        </p>
+        <p>Add the Bot to Microsoft Teams: 
+            <a href='https://teams.microsoft.com/l/chat/0/0?users=28:{{<%= botidEnv %>}}'><img height="30" width="113" src='https://dev.botframework.com/Client/Images/Add-To-MSTeams-Buttons.png'></a></p>
     <% } %>
+    </article>
 </body>
 
 </html>
diff --git a/src/app/templates/src/app/web/privacy.html b/src/app/templates/src/app/web/privacy.html
@@ -11,21 +11,65 @@
     <!-- endinject -->
     <% if (useAzureAppInsights) { %><script type="text/javascript">
         var appInsights = window.appInsights || function (a) {
-            function b(a) { c[a] = function () { var b = arguments; c.queue.push(function () { c[a].apply(c, b) }) } } var c = { config: a }, d = document, e = window; setTimeout(function () { var b = d.createElement("script"); b.src = a.url || "https://az416426.vo.msecnd.net/scripts/a/ai.0.js", d.getElementsByTagName("script")[0].parentNode.appendChild(b) }); try { c.cookie = d.cookie } catch (a) { } c.queue = []; for (var f = ["Event", "Exception", "Metric", "PageView", "Trace", "Dependency"]; f.length;)b("track" + f.pop()); if (b("setAuthenticatedUserContext"), b("clearAuthenticatedUserContext"), b("startTrackEvent"), b("stopTrackEvent"), b("startTrackPage"), b("stopTrackPage"), b("flush"), !a.disableExceptionTracking) { f = "onerror", b("_" + f); var g = e[f]; e[f] = function (a, b, d, e, h) { var i = g && g(a, b, d, e, h); return !0 !== i && c["_" + f](a, b, d, e, h), i } } return c
+            function b(a) {
+                c[a] = function () {
+                    var b = arguments;
+                    c.queue.push(function () {
+                        c[a].apply(c, b)
+                    })
+                }
+            }
+            var c = {
+                    config: a
+                },
+                d = document,
+                e = window;
+            setTimeout(function () {
+                var b = d.createElement("script");
+                b.src = a.url || "https://az416426.vo.msecnd.net/scripts/a/ai.0.js", d.getElementsByTagName(
+                    "script")[0].parentNode.appendChild(b)
+            });
+            try {
+                c.cookie = d.cookie
+            } catch (a) {}
+            c.queue = [];
+            for (var f = ["Event", "Exception", "Metric", "PageView", "Trace", "Dependency"]; f.length;) b("track" +
+                f.pop());
+            if (b("setAuthenticatedUserContext"), b("clearAuthenticatedUserContext"), b("startTrackEvent"), b(
+                    "stopTrackEvent"), b("startTrackPage"), b("stopTrackPage"), b("flush"), !a
+                .disableExceptionTracking) {
+                f = "onerror", b("_" + f);
+                var g = e[f];
+                e[f] = function (a, b, d, e, h) {
+                    var i = g && g(a, b, d, e, h);
+                    return !0 !== i && c["_" + f](a, b, d, e, h), i
+                }
+            }
+            return c
         }({
             instrumentationKey: "{{APPINSIGHTS_INSTRUMENTATIONKEY}}"
         });
-
-        window.appInsights = appInsights, appInsights.queue && 0 === appInsights.queue.length && appInsights.trackPageView();
-      </script><% } %>
+
+        window.appInsights = appInsights, appInsights.queue && 0 === appInsights.queue.length && appInsights
+            .trackPageView();
+    </script><% } %>
 </head>
 
 <body>
-    <h1>
-        <%= title %> Privacy</h1>
-    <p>
-        Add your privacy statement here...
-    </p>
+    <header class="l-header">
+        <div class="logo">
+            <img src="https://static2.sharepointonline.com/files/fabric/assets/brand-icons/product-fluent/svg/teams_48x1.svg"
+                class="logo">
+        </div>
+        <div class="l-title">
+            <h1><%= title %> Privacy</h1>
+        </div>
+    </header>
+    <article class="l-article">
+        <p>
+            Add your privacy statement here...
+        </p>
+    </article>
 </body>
 
 </html>
diff --git a/src/app/templates/src/app/web/styles/main.scss b/src/app/templates/src/app/web/styles/main.scss
@@ -0,0 +1,40 @@
+body {
+	font-family: sans-serif;
+
+	max-width: 80vw;
+	margin: 0 auto;
+}
+
+.l-header {
+	display: flex;
+
+	box-sizing: border-box;
+	width: 100%;
+	min-height: 5em;
+	padding: 1em;
+
+	align-content: space-between;
+	align-items: stretch;
+	justify-content: space-between;
+
+	h1 {
+		box-sizing: border-box;
+		padding-left: 1.5em;
+		padding-right: 1.5em;
+
+	}
+}
+
+.l-article {
+	margin: 3em 2em;
+}
+
+.l-title {
+	flex-grow: 1;
+}
+
+img.logo {
+	width: 100%;
+	min-width: 76px;
+	height: auto;
+}
diff --git a/src/app/templates/src/app/web/tou.html b/src/app/templates/src/app/web/tou.html
@@ -11,21 +11,65 @@
     <!-- endinject -->
     <% if (useAzureAppInsights) { %><script type="text/javascript">
         var appInsights = window.appInsights || function (a) {
-            function b(a) { c[a] = function () { var b = arguments; c.queue.push(function () { c[a].apply(c, b) }) } } var c = { config: a }, d = document, e = window; setTimeout(function () { var b = d.createElement("script"); b.src = a.url || "https://az416426.vo.msecnd.net/scripts/a/ai.0.js", d.getElementsByTagName("script")[0].parentNode.appendChild(b) }); try { c.cookie = d.cookie } catch (a) { } c.queue = []; for (var f = ["Event", "Exception", "Metric", "PageView", "Trace", "Dependency"]; f.length;)b("track" + f.pop()); if (b("setAuthenticatedUserContext"), b("clearAuthenticatedUserContext"), b("startTrackEvent"), b("stopTrackEvent"), b("startTrackPage"), b("stopTrackPage"), b("flush"), !a.disableExceptionTracking) { f = "onerror", b("_" + f); var g = e[f]; e[f] = function (a, b, d, e, h) { var i = g && g(a, b, d, e, h); return !0 !== i && c["_" + f](a, b, d, e, h), i } } return c
+            function b(a) {
+                c[a] = function () {
+                    var b = arguments;
+                    c.queue.push(function () {
+                        c[a].apply(c, b)
+                    })
+                }
+            }
+            var c = {
+                    config: a
+                },
+                d = document,
+                e = window;
+            setTimeout(function () {
+                var b = d.createElement("script");
+                b.src = a.url || "https://az416426.vo.msecnd.net/scripts/a/ai.0.js", d.getElementsByTagName(
+                    "script")[0].parentNode.appendChild(b)
+            });
+            try {
+                c.cookie = d.cookie
+            } catch (a) {}
+            c.queue = [];
+            for (var f = ["Event", "Exception", "Metric", "PageView", "Trace", "Dependency"]; f.length;) b("track" +
+                f.pop());
+            if (b("setAuthenticatedUserContext"), b("clearAuthenticatedUserContext"), b("startTrackEvent"), b(
+                    "stopTrackEvent"), b("startTrackPage"), b("stopTrackPage"), b("flush"), !a
+                .disableExceptionTracking) {
+                f = "onerror", b("_" + f);
+                var g = e[f];
+                e[f] = function (a, b, d, e, h) {
+                    var i = g && g(a, b, d, e, h);
+                    return !0 !== i && c["_" + f](a, b, d, e, h), i
+                }
+            }
+            return c
         }({
             instrumentationKey: "{{APPINSIGHTS_INSTRUMENTATIONKEY}}"
         });
-
-        window.appInsights = appInsights, appInsights.queue && 0 === appInsights.queue.length && appInsights.trackPageView();
-      </script><% } %>
+
+        window.appInsights = appInsights, appInsights.queue && 0 === appInsights.queue.length && appInsights
+            .trackPageView();
+    </script><% } %>
 </head>
 
 <body>
-    <h1>
-        <%= title %> Terms of Use</h1>
-    <p>
-        Add your Terms of Use here...
-    </p>
+    <header class="l-header">
+        <div class="logo">
+            <img src="https://static2.sharepointonline.com/files/fabric/assets/brand-icons/product-fluent/svg/teams_48x1.svg"
+                class="logo">
+        </div>
+        <div class="l-title">
+            <h1><%= title %> Terms of Use</h1>
+        </div>
+    </header>
+    <article class="l-article">
+        <p>
+            Add your Terms of Use here...
+        </p>
+    </article>
 </body>
 
 </html>