This brings us closer to the desired presentation for the data, without changing the markup in unsightly ways. This has been tested against Chrome, Safari 5.0.4, and Firefox 4.
Reviewed-By: Randall Hansen Signed-off-by: Pieter van de Bruggen <[email protected]> --- Local-branch: poc/master/align-node-counts public/stylesheets/application.css | 29 +++++++++++------------------ public/stylesheets/sass/application.scss | 23 ++++++++++------------- 2 files changed, 21 insertions(+), 31 deletions(-) diff --git a/public/stylesheets/application.css b/public/stylesheets/application.css index 1235f94..6a8dbd4 100644 --- a/public/stylesheets/application.css +++ b/public/stylesheets/application.css @@ -424,8 +424,7 @@ body { width: 100%; } body .node_summary table .count { font-weight: bold; - padding-left: .3em; - padding-right: .6em; } + padding-left: .3em; } body .node_summary table .count, body .node_summary table .graph { padding-left: .3em; } @@ -434,15 +433,7 @@ body { padding-top: .2em; } body .node_summary table.primary tr { cursor: pointer; - display: block; - display: block; } - body .node_summary table.primary tr:after { - content: "\0020"; - display: block; - height: 0; - clear: both; - visibility: hidden; - overflow: hidden; } + position: relative; } body .node_summary table.primary tr.unresponsive a { color: #888888; } body .node_summary table.primary tr.unresponsive .percent a { @@ -522,14 +513,16 @@ body { background-color: #fff; } body .node_summary table.primary tr td { font-size: 1.4em; - display: block; } - body .node_summary table.primary tr td.count, body .node_summary table.primary tr td.label { - float: left; } - body .node_summary table.primary tr td.label { - padding-right: .3em; } + padding-bottom: .5em; } + body .node_summary table.primary tr td.count { + text-align: right; + padding-right: 0.3em; } body .node_summary table.primary tr td.percent { - padding-left: .3em; - padding-bottom: .3em; } + display: block; + position: absolute; + left: 0.6em; + right: 0.6em; + margin-top: 1.3em; } body .node_summary table.primary tr td.percent a { text-indent: -9999px; display: block; diff --git a/public/stylesheets/sass/application.scss b/public/stylesheets/sass/application.scss index dd2dea0..d4ff681 100644 --- a/public/stylesheets/sass/application.scss +++ b/public/stylesheets/sass/application.scss @@ -630,7 +630,6 @@ body { .count { font-weight : bold; padding-left: .3em; - padding-right: .6em; } .count, .graph { @@ -645,8 +644,7 @@ body { table.primary { // this is marked up as a table, but not rendered that way tr { cursor : pointer; - display : block; - @include clearfix; + position: relative; &.unresponsive { @include node_summary_row( #888 )} &.failed { @include node_summary_row( #c21 )} @@ -658,20 +656,19 @@ body { td { font-size : 1.4em; - display : block; + padding-bottom: .5em; - &.count, - &.label { - float : left; - } &.count { - } - &.label { - padding-right : .3em; + text-align: right; + padding-right: 0.3em; } &.percent { - padding-left : .3em; - padding-bottom : .3em; + display: block; + position: absolute; + left: 0.6em; + right: 0.6em; + margin-top: 1.3em; + a { text-indent : -9999px; display : block; -- 1.7.5.1 -- You received this message because you are subscribed to the Google Groups "Puppet Developers" group. To post to this group, send email to [email protected]. To unsubscribe from this group, send email to [email protected]. For more options, visit this group at http://groups.google.com/group/puppet-dev?hl=en.
