YARN-7075. Better styling for donut charts in new YARN UI. Contributed by Da Ding.
Project: http://git-wip-us.apache.org/repos/asf/hadoop/repo Commit: http://git-wip-us.apache.org/repos/asf/hadoop/commit/da104a3e Tree: http://git-wip-us.apache.org/repos/asf/hadoop/tree/da104a3e Diff: http://git-wip-us.apache.org/repos/asf/hadoop/diff/da104a3e Branch: refs/heads/YARN-3368_branch2 Commit: da104a3e7845f39b2f02eb10c872aac84d4a0293 Parents: 1cf7ed8 Author: Sunil G <sun...@apache.org> Authored: Sat Sep 2 08:08:59 2017 +0530 Committer: Varun Saxena <varunsax...@apache.org> Committed: Wed Oct 18 02:06:49 2017 +0530 ---------------------------------------------------------------------- .../main/webapp/app/components/donut-chart.js | 5 +++- .../src/main/webapp/app/styles/app.css | 24 ++++++++++++++++++-- 2 files changed, 26 insertions(+), 3 deletions(-) ---------------------------------------------------------------------- http://git-wip-us.apache.org/repos/asf/hadoop/blob/da104a3e/hadoop-yarn-project/hadoop-yarn/hadoop-yarn-ui/src/main/webapp/app/components/donut-chart.js ---------------------------------------------------------------------- diff --git a/hadoop-yarn-project/hadoop-yarn/hadoop-yarn-ui/src/main/webapp/app/components/donut-chart.js b/hadoop-yarn-project/hadoop-yarn/hadoop-yarn-ui/src/main/webapp/app/components/donut-chart.js index 82d2d46..b1e6ecf 100644 --- a/hadoop-yarn-project/hadoop-yarn/hadoop-yarn-ui/src/main/webapp/app/components/donut-chart.js +++ b/hadoop-yarn-project/hadoop-yarn/hadoop-yarn-ui/src/main/webapp/app/components/donut-chart.js @@ -53,7 +53,10 @@ export default BaseChartComponent.extend({ // 50 is for title var outerRadius = (h - 50 - 2 * layout.margin) / 2; - var innerRadius = outerRadius * 0.618; + + // Ratio of inner radius to outer radius + var radiusRatio = 0.75; + var innerRadius = outerRadius * radiusRatio; var arc = d3.svg.arc() .innerRadius(innerRadius) http://git-wip-us.apache.org/repos/asf/hadoop/blob/da104a3e/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 8b8ea56..38e25e4 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 @@ -20,6 +20,8 @@ body, html, body > .ember-view { height: 100%; overflow: visible; color: @text-color; + background: #f6f6f8; + font-family: "Open Sans","Helvetica Neue", sans-serif!important; } body, html { min-width: 1024px; @@ -29,11 +31,11 @@ body, html { Over all style */ text { - font: 16px sans-serif; + font-size: 14px; } text.small { - font: 8px sans-serif; + font-size: 8px; } html, body @@ -184,6 +186,7 @@ table.dataTable thead .sorting_desc_disabled { .breadcrumb { padding-bottom: 3px; + background-color: #f6f6f8; } .navbar-default .navbar-nav > li > a { @@ -268,12 +271,29 @@ td { margin: 0 auto -40px; // Must be same as footer & footer-frame } +.panel { + background-color: #fff; + border: 1px solid #ddd; + border-radius: 15px; + -webkit-box-shadow: 0 1px 1px rgba(0, 0, 0, 0.05); + box-shadow: 0 1px 1px rgba(0, 0, 0, 0.05); + overflow: hidden; +} + .panel-default .container-fluid { margin-top: -45px !important; margin-bottom: -10px !important; } +.panel-default > .panel-heading { + background-image: none; + background-color: #f5f5f5 !important; + border-radius: 15px 15px 0px 0px; +} + + .panel-heading { + background-color: rgba(0, 0, 0, 0) !important; font-weight: bold; } --------------------------------------------------------------------- To unsubscribe, e-mail: common-commits-unsubscr...@hadoop.apache.org For additional commands, e-mail: common-commits-h...@hadoop.apache.org