YARN-5488. [YARN-3368] Applications table overflows beyond the page 
boundary(Harish Jaiprakash via Sunil G)


Project: http://git-wip-us.apache.org/repos/asf/hadoop/repo
Commit: http://git-wip-us.apache.org/repos/asf/hadoop/commit/3e26433a
Tree: http://git-wip-us.apache.org/repos/asf/hadoop/tree/3e26433a
Diff: http://git-wip-us.apache.org/repos/asf/hadoop/diff/3e26433a

Branch: refs/heads/YARN-3368
Commit: 3e26433a2c80385967e7b2c4fb899f807d355ba5
Parents: 55b1afa
Author: sunilg <sun...@apache.org>
Authored: Fri Aug 12 14:51:03 2016 +0530
Committer: sunilg <sun...@apache.org>
Committed: Wed Oct 12 20:36:11 2016 +0530

----------------------------------------------------------------------
 .../src/main/webapp/app/styles/app.css          |  4 +
 .../src/main/webapp/app/templates/yarn-app.hbs  | 98 ++++++++++----------
 2 files changed, 54 insertions(+), 48 deletions(-)
----------------------------------------------------------------------


http://git-wip-us.apache.org/repos/asf/hadoop/blob/3e26433a/hadoop-yarn-project/hadoop-yarn/hadoop-yarn-ui/src/main/webapp/app/styles/app.css
----------------------------------------------------------------------
diff --git 
a/hadoop-yarn-project/hadoop-yarn/hadoop-yarn-ui/src/main/webapp/app/styles/app.css
 
b/hadoop-yarn-project/hadoop-yarn/hadoop-yarn-ui/src/main/webapp/app/styles/app.css
index a68a0ac..da5b4bf 100644
--- 
a/hadoop-yarn-project/hadoop-yarn/hadoop-yarn-ui/src/main/webapp/app/styles/app.css
+++ 
b/hadoop-yarn-project/hadoop-yarn/hadoop-yarn-ui/src/main/webapp/app/styles/app.css
@@ -273,3 +273,7 @@ li a.navigation-link.ember-view {
   right: 20px;
   top: 3px;
 }
+
+.x-scroll {
+  overflow-x: scroll;
+}

http://git-wip-us.apache.org/repos/asf/hadoop/blob/3e26433a/hadoop-yarn-project/hadoop-yarn/hadoop-yarn-ui/src/main/webapp/app/templates/yarn-app.hbs
----------------------------------------------------------------------
diff --git 
a/hadoop-yarn-project/hadoop-yarn/hadoop-yarn-ui/src/main/webapp/app/templates/yarn-app.hbs
 
b/hadoop-yarn-project/hadoop-yarn/hadoop-yarn-ui/src/main/webapp/app/templates/yarn-app.hbs
index 49c4bfd..9e92fc1 100644
--- 
a/hadoop-yarn-project/hadoop-yarn/hadoop-yarn-ui/src/main/webapp/app/templates/yarn-app.hbs
+++ 
b/hadoop-yarn-project/hadoop-yarn/hadoop-yarn-ui/src/main/webapp/app/templates/yarn-app.hbs
@@ -49,55 +49,57 @@
         <div class="col-md-12 container-fluid">
           <div class="panel panel-default">
             <div class="panel-heading">Basic Info</div>
-            <table class="display table table-striped table-bordered"
-                   cellspacing="0" width="100%">
-              <thead>
-                <tr>
-                  <th>Application ID</th>
-                  <th>Name</th>
-                  <th>User</th>
-                  <th>Queue</th>
-                  <th>State</th>
-                  <th>Final Status</th>
-                  <th>Start Time</th>
-                  <th>Elapsed Time</th>
-                  <th>Finished Time</th>
-                  <th>Priority</th>
-                  <th>Progress</th>
-                  <th>Is Unmanaged AM</th>
-                </tr>
-              </thead>
+            <div class="x-scroll">
+              <table class="display table table-striped table-bordered"
+                     cellspacing="0" width="100%">
+                <thead>
+                  <tr>
+                    <th>Application ID</th>
+                    <th>Name</th>
+                    <th>User</th>
+                    <th>Queue</th>
+                    <th>State</th>
+                    <th>Final Status</th>
+                    <th>Start Time</th>
+                    <th>Elapsed Time</th>
+                    <th>Finished Time</th>
+                    <th>Priority</th>
+                    <th>Progress</th>
+                    <th>Is Unmanaged AM</th>
+                  </tr>
+                </thead>
 
-              <tbody>
-                <tr>
-                  <td>{{model.app.id}}</td>
-                  <td>{{model.app.appName}}</td>
-                  <td>{{model.app.user}}</td>
-                  <td>{{model.app.queue}}</td>
-                  <td>{{model.app.state}}</td>
-                  <td>
-                    <span class={{model.app.finalStatusStyle}}>
-                      {{model.app.finalStatus}}
-                    </span>
-                  </td>
-                  <td>{{model.app.startTime}}</td>
-                  <td>{{model.app.elapsedTime}}</td>
-                  <td>{{model.app.validatedFinishedTs}}</td>
-                  <td>{{model.app.priority}}</td>
-                  <td>
-                    <div class="progress" style="margin-bottom: 0;">
-                      <div class="progress-bar" role="progressbar"
-                           aria-valuenow="60" aria-valuemin="0"
-                           aria-valuemax="100"
-                           style={{model.app.progressStyle}}>
-                        {{model.app.progress}}%
+                <tbody>
+                  <tr>
+                    <td>{{model.app.id}}</td>
+                    <td>{{model.app.appName}}</td>
+                    <td>{{model.app.user}}</td>
+                    <td>{{model.app.queue}}</td>
+                    <td>{{model.app.state}}</td>
+                    <td>
+                      <span class={{model.app.finalStatusStyle}}>
+                        {{model.app.finalStatus}}
+                      </span>
+                    </td>
+                    <td>{{model.app.startTime}}</td>
+                    <td>{{model.app.elapsedTime}}</td>
+                    <td>{{model.app.validatedFinishedTs}}</td>
+                    <td>{{model.app.priority}}</td>
+                    <td>
+                      <div class="progress" style="margin-bottom: 0;">
+                        <div class="progress-bar" role="progressbar"
+                             aria-valuenow="60" aria-valuemin="0"
+                             aria-valuemax="100"
+                             style={{model.app.progressStyle}}>
+                          {{model.app.progress}}%
+                        </div>
                       </div>
-                    </div>
-                  </td>
-                  <td>{{model.app.unmanagedApplication}}</td>
-                </tr>
-              </tbody>
-            </table>
+                    </td>
+                    <td>{{model.app.unmanagedApplication}}</td>
+                  </tr>
+                </tbody>
+              </table>
+            </div>
           </div>
         </div>
       </div>
@@ -248,4 +250,4 @@
   </div>
 </div>
 {{/if}}
-{{outlet}}
\ No newline at end of file
+{{outlet}}


---------------------------------------------------------------------
To unsubscribe, e-mail: common-commits-unsubscr...@hadoop.apache.org
For additional commands, e-mail: common-commits-h...@hadoop.apache.org

Reply via email to