A couple of fixes in zerostate code (#936)

1. Make the link include namespace that is selected. We should use
`$state` for all links, anyway.
1. Increase padding to make the information more prominent.
1. Add info that in order to see something you can change namespace.
1. Align external link icon vertically
1. Change wording to be similar to what we have in other places (e.g.,
"deploy a containerized app".

Author: bryk

i18n/messages-en.xtb

@@ -472,5 +472,5 @@
 	<translation id="2055003113871137121" key="MSG_NODE_DETAIL_ALLOCATED_RESOURCES_PODS" source="/home/maciaszczykm/workspace/dashboard/.tmp/serve/app-dev.js" desc="Label 'Pods' for the allocated resources table header on the node details page.">Memory limits (bytes)</translation>
 	<translation id="5154496218567149713" key="MSG_NODE_DETAIL_ALLOCATED_RESOURCES_PODS" source="/home/maciaszczykm/workspace/dashboard/.tmp/serve/app-dev.js" desc="Label 'Pods' for the allocated resources table header on the node details page.">Pods</translation>
 	<translation id="1538072409274591134" key="MSG_ZERO_STATE_TITLE" source="/home/floreks/Projects/dashboard/.tmp/serve/app-dev.js" desc="Title text which appears on zero state view.">There is nothing to display here</translation>
-	<translation id="843228251260108399" key="MSG_ZERO_STATE_TEXT" source="/home/floreks/Projects/dashboard/.tmp/serve/app-dev.js" desc="Text which appears on zero state view under the title. It provides to deploy view or offers user to take the Dashboard Tour.">Let's <ph name="CREATE_NEW_LINK" /> create a new app <ph name="CREATE_NEW_CLOSE_LINK" /> or learn more and <ph name="OPEN_LINK" /> take the Dashboard Tour <ph name="LINK_ICON" /> <ph name="CLOSE_LINK" /></translation>
+	<translation id="6640815328418723695" key="MSG_ZERO_STATE_TEXT" source="/usr/local/google/home/bryk/src/github.com/dashboard/.tmp/serve/app-dev.js" desc="Text which appears on zero state view under the title. It provides to deploy view or offers user to take the Dashboard Tour.">You can <ph name="CREATE_NEW_LINK" />deploy a containerized app<ph name="CREATE_NEW_CLOSE_LINK" />, select other namespace or <ph name="OPEN_LINK" />take the Dashboard Tour <ph name="LINK_ICON" /><ph name="CLOSE_LINK" /> to learn more</translation>
 </translationbundle>

i18n/messages-ja.xtb

@@ -659,5 +659,5 @@
 	<translation id="2055003113871137121" key="MSG_NODE_DETAIL_ALLOCATED_RESOURCES_PODS" source="/home/maciaszczykm/workspace/dashboard/.tmp/serve/app-dev.js" desc="Label 'Pods' for the allocated resources table header on the node details page.">メモリー上限（バイト）</translation>
 	<translation id="5154496218567149713" key="MSG_NODE_DETAIL_ALLOCATED_RESOURCES_PODS" source="/home/maciaszczykm/workspace/dashboard/.tmp/serve/app-dev.js" desc="Label 'Pods' for the allocated resources table header on the node details page.">ポッド</translation>
 	<translation id="1538072409274591134" key="MSG_ZERO_STATE_TITLE" source="/home/floreks/Projects/dashboard/.tmp/serve/app-dev.js" desc="Title text which appears on zero state view.">There is nothing to display here</translation>
-	<translation id="843228251260108399" key="MSG_ZERO_STATE_TEXT" source="/home/floreks/Projects/dashboard/.tmp/serve/app-dev.js" desc="Text which appears on zero state view under the title. It provides to deploy view or offers user to take the Dashboard Tour.">Let's <ph name="CREATE_NEW_LINK" /> create a new app <ph name="CREATE_NEW_CLOSE_LINK" /> or learn more and <ph name="OPEN_LINK" /> take the Dashboard Tour <ph name="LINK_ICON" /> <ph name="CLOSE_LINK" /></translation>
-</translationbundle>
+	<translation id="6640815328418723695" key="MSG_ZERO_STATE_TEXT" source="/usr/local/google/home/bryk/src/github.com/dashboard/.tmp/serve/app-dev.js" desc="Text which appears on zero state view under the title. It provides to deploy view or offers user to take the Dashboard Tour.">You can <ph name="CREATE_NEW_LINK" />deploy a containerized app<ph name="CREATE_NEW_CLOSE_LINK" />, select other namespace or <ph name="OPEN_LINK" />take the Dashboard Tour <ph name="LINK_ICON" /><ph name="CLOSE_LINK" /> to learn more</translation>
+</translationbundle>

src/app/frontend/common/components/zerostate/zerostate.html

@@ -16,7 +16,7 @@
 
 <kd-content-card>
   <kd-content>
-    <div class="kd-zerostate-message">
+    <div class="kd-zerostate-message" layout-padding>
       <div class="kd-zerostate-title">{{::$ctrl.i18n.MSG_ZERO_STATE_TITLE}}</div>
       <div class="kd-zerostate-text">
         <span ng-bind-html="::$ctrl.i18n.MSG_ZERO_STATE_TEXT"></span>

src/app/frontend/common/components/zerostate/zerostate.scss

@@ -21,7 +21,7 @@
 .kd-zerostate-icon {
   color: $primary;
   font-size: $body-font-size-base;
-  margin-bottom: $baseline-grid;
+  vertical-align: middle;
 }
 
 .kd-zerostate-title {

src/app/frontend/common/components/zerostate/zerostate_component.js

@@ -12,43 +12,48 @@
 // See the License for the specific language governing permissions and
 // limitations under the License.
 
+import {deployAppStateName} from 'deploy/deploy_state';
+
 /**
  * @final
  */
 export class ZeroStateController {
   /**
+   * @param {!ui.router.$state} $state
    * @ngInject
    */
-  constructor() {
+  constructor($state) {
     /** @export */
-    this.i18n = i18n;
+    this.i18n = i18n($state);
   }
 }
 
 /**
- * Returns zero state component.
- *
- * @return {!angular.Directive}
+ * @return {!angular.Component}
  */
 export const zeroStateComponent = {
   templateUrl: 'common/components/zerostate/zerostate.html',
   transclude: true,
   controller: ZeroStateController,
 };
 
-const i18n = {
+/**
+ * @param {!ui.router.$state} $state
+ */
+let i18n = ($state) => ({
   /** @export {string} @desc Title text which appears on zero state view. */
   MSG_ZERO_STATE_TITLE: goog.getMsg('There is nothing to display here'),
   /** @export {string} @desc Text which appears on zero state view under the title. It provides
    *  to deploy view or offers user to take the Dashboard Tour. */
   MSG_ZERO_STATE_TEXT: goog.getMsg(
-      'Let\'s {$createNewLink} create a new app {$createNewCloseLink} or learn more' +
-          ' and {$openLink} take the Dashboard Tour {$linkIcon} {$closeLink}',
+      'You can {$createNewLink}deploy a containerized app{$createNewCloseLink},' +
+          ' select other namespace or {$openLink}take the Dashboard Tour {$linkIcon}{$closeLink}' +
+          ' to learn more',
       {
-        'createNewLink': `<a href="#/deploy/file">`,
+        'createNewLink': `<a href="${$state.href(deployAppStateName)}">`,
         'createNewCloseLink': `</a>`,
         'openLink': `<a href="http://kubernetes.io/docs/user-guide/ui/" target="_blank">`,
         'linkIcon': `<i class="material-icons kd-zerostate-icon">open_in_new</i>`,
         'closeLink': `</a>`,
       }),
-};
+});