rancher/5722 (#821)

* mobile issues

* rancher/rancher#5722

* small screen nav tabs

* rancher/rancher#5723

app/components/form-networking/template.hbs

@@ -180,9 +180,6 @@
               <td>
                 {{dns.value}}
               </td>
-              <td width="30" class="text-right">
-                &nbsp;
-              </td>
             </tr>
           {{/each}}
         </table>
@@ -225,9 +222,6 @@
               <td>
                 {{dnsSearch.value}}
               </td>
-              <td width="30" class="text-right">
-                &nbsp;
-              </td>
             </tr>
           {{/each}}
         </table>

app/components/form-security/template.hbs

@@ -9,7 +9,7 @@
       </div>
     {{/input-or-display}}
   </div>
-
+  <hr class="visible-xs-block visible-sm-block" />
   <div class="col-sm-12 col-md-2 form-label">
     <label class="form-control-static">{{t 'formSecurity.pidMode.label'}}</label>
   </div>
@@ -34,7 +34,7 @@
       </div>
     {{/input-or-display}}
   </div>
-
+  <hr class="visible-xs-block visible-sm-block" />
   <div class="col-sm-12 col-md-2 form-label">
     <label class="form-control-static">{{t 'formSecurity.swapLimit.label'}}</label>
   </div>
@@ -58,6 +58,7 @@
       {{input type="text" value=instance.cpuSet classNames="form-control" placeholder=(t 'formSecurity.cpuPinning.placeholder')}}
     {{/input-or-display}}
   </div>
+  <hr class="visible-xs-block visible-sm-block" />
   <div class="col-sm-12 col-md-2 form-label">
     <label class="form-control-static">{{t 'formSecurity.shares.label'}}</label>
   </div>
@@ -89,7 +90,7 @@
       {{/if}}
     {{/if}}
   </div>
-
+  <hr class="visible-xs-block visible-sm-block" />
   {{#unless editing}}
   <div class="col-sm-12 col-md-2 form-label">
     <label class="form-control-static">{{t 'formSecurity.capabilities.label'}}({{t 'formSecurity.capabilities.drop'}})</label>

app/components/settings/catalog-url/template.hbs

@@ -21,7 +21,7 @@
       </label>
     </div>
   </div>
-  <div class="col-md-6 r-pr0">
+  <div class="col-md-6 r-pl0">
     <h5>{{t 'catalogSettings.community.header'}}</h5>
     <p class="help-block">
       {{t 'catalogSettings.community.helpText.text'}}{{#if settings.isRancher}}  {{t 'catalogSettings.community.helpText.isRancher'}}{{/if}}

app/container/volumes/template.hbs

@@ -29,7 +29,7 @@
           {{#if model.mountError}}
             <div class="text-danger text-center">{{t 'containersPage.containerPage.volumesTab.table.body.error.error'}} {{model.mountError.message}}</div>
           {{else}}
-            <div class="text-muted text-center">{{t 'containersPage.containerPage.volumesTab.table.body.error.noData'}}</div>
+            <div class="text-muted text-center" style="display:inline-block;">{{t 'containersPage.containerPage.volumesTab.table.body.error.noData'}}</div>
           {{/if}}
         </td>
       </tr>

app/host/template.hbs

@@ -18,7 +18,7 @@
 
 <section>
   <div class="row">
-    <div class="col-md-3 rm-mb15">
+    <div class="col-md-3 r-mb15">
       {{#if host.description}}
         <div>
           <label>{{t 'hostsPage.hostPage.infoMultiStats.description'}} </label>

app/service/links/template.hbs

@@ -1,7 +1,7 @@
 <label class="text-muted r-ml15">{{t 'servicePage.linksTab.header'}}</label>
 <ul class="list-unstyled list-inline with-room">
   {{#each model.consumedServicesWithNames as |link|}}
-    {{#if (eq link.service.name link.name)}}
+    <li>{{#if (eq link.service.name link.name)}}
       {{t (if (eq link.service.environmentId model.environmentID) 'serviceLink.noAlias.sameStack' 'serviceLink.noAlias.differentStack')
         stack=link.service.displayEnvironment
         service=link.service.displayName
@@ -13,7 +13,7 @@
         service=link.service.displayName
         alias=link.name
       }}
-    {{/if}}
+    {{/if}}</li>
   {{else}}
     <li class="text-muted">{{t 'servicePage.linksTab.noData'}}</li>
   {{/each}}

app/styles/layout/_sm-screen.scss

@@ -149,7 +149,6 @@
   td:before {
     content: attr(data-title);
     width: 45%;
-    margin-right: 10px;
     white-space: nowrap;
     text-align: left;
     font-weight: bold;

app/styles/layout/_xs-screen.scss

@@ -5,6 +5,20 @@
     width: 100%;
   }
 
+  .btn-group.searchable .icon {
+    top: 18px;
+  }
+
+  .searchable {
+    margin-bottom: 15px;
+  }
+
+  ul.nav-tabs.shadowed li {
+    display: block;
+    width: 100%;
+    margin-bottom: 5px;
+  }
+
   .grid {
     & > THEAD > TR > TH,
     & > THEAD > TR > TD,

app/styles/vendors/_bootstrap-tweak.scss

@@ -8,7 +8,6 @@ a {
 H1, H2, H3, H4, H5, H6, SECTION.header {
   margin: 0;
   cursor: normal;
-  word-break: break-all;
 
   .btn {
     margin-left: 10px;