Skip to content

A
atlas
Commit ba1b40f0 by kevalbhatt
Options

ATLAS-3909: UI: Improve readability for the table view in the entity detail page

parent ce2ba123
Showing with 19 additions and 23 deletions
dashboardv2/public/css/scss/table.scss
...@@ -14,6 +14,10 @@ ...@@ -14,6 +14,10 @@
// See the License for the specific language governing permissions and // See the License for the specific language governing permissions and
// limitations under the License. // limitations under the License.
.table.bold-key>tbody>tr>td:first-child {
font-weight: 600;
}
tr.empty { tr.empty {
td { td {
display: table-cell; display: table-cell;
......
dashboardv2/public/js/templates/entity/EntityDetailTableLayoutView_tmpl.html
...@@ -38,7 +38,7 @@ ...@@ -38,7 +38,7 @@
<div id="collapse1" class="panel-collapse collapse in"> <div id="collapse1" class="panel-collapse collapse in">
<div class="panel-body"> <div class="panel-body">
<div class="entity-detail-table"> <div class="entity-detail-table">
<table class="table"> <table class="table bold-key">
<tbody data-id="detailValue" class="hide-empty-value"> <tbody data-id="detailValue" class="hide-empty-value">
</tbody> </tbody>
</table> </table>
......
dashboardv2/public/js/templates/entity/EntityUserDefineView_tmpl.html
...@@ -75,7 +75,7 @@ ...@@ -75,7 +75,7 @@
<div id="r_entityUserDefinedItemView"></div> <div id="r_entityUserDefinedItemView"></div>
{{else}} {{else}}
<div class="entity-detail-table"> <div class="entity-detail-table">
<table class="table"> <table class="table bold-key">
<tbody> <tbody>
{{#each customAttibutes}} {{#each customAttibutes}}
<tr> <tr>
......
dashboardv2/public/js/templates/graph/LineageLayoutView_tmpl.html
...@@ -123,13 +123,7 @@ ...@@ -123,13 +123,7 @@
<span data-id="box-close" class="btn btn-sm btn-close lineage-node-detail-close"><i class="fa fa-close"></i></span> <span data-id="box-close" class="btn btn-sm btn-close lineage-node-detail-close"><i class="fa fa-close"></i></span>
</div> </div>
<div class="body"> <div class="body">
<table class='table table-quickMenu'> <table class='table bold-key'>
<thead>
<tr>
<th>Key</th>
<th>Value</th>
</tr>
</thead>
<tbody data-id="nodeDetailTable"></tbody> <tbody data-id="nodeDetailTable"></tbody>
</table> </table>
</div> </div>
......
dashboardv2/public/js/templates/graph/RelationshipLayoutView_tmpl.html
...@@ -61,7 +61,7 @@ ...@@ -61,7 +61,7 @@
</div> </div>
</div> </div>
</div> </div>
<table class="table table-quickMenu" data-id="relationshipDetailTable"> <table class="table table-quickMenu bold-key" data-id="relationshipDetailTable">
<thead> <thead>
<tr> <tr>
<th>Key</th> <th>Key</th>
......
dashboardv2/public/js/views/entity/EntityBusinessMetaDataView.js
...@@ -262,7 +262,7 @@ define([ ...@@ -262,7 +262,7 @@ define([
'<div class="btn-group pull-left"> <button type="button" title="Collapse"><i class="ec-icon fa"></i></button></div>' + '<div class="btn-group pull-left"> <button type="button" title="Collapse"><i class="ec-icon fa"></i></button></div>' +
'</div>' + '</div>' +
'<div id="' + _.escape(obj.get("__internal_UI_businessMetadataName")) + '" class="panel-collapse collapse in">' + '<div id="' + _.escape(obj.get("__internal_UI_businessMetadataName")) + '" class="panel-collapse collapse in">' +
'<div class="panel-body"><table class="table">' + tableBody + '</table></div>' + '<div class="panel-body"><table class="table bold-key">' + tableBody + '</table></div>' +
'</div></div>'; '</div></div>';
}, },
onRender: function() { onRender: function() {
......
dashboardv3/public/css/scss/table.scss
...@@ -14,6 +14,10 @@ ...@@ -14,6 +14,10 @@
// See the License for the specific language governing permissions and // See the License for the specific language governing permissions and
// limitations under the License. // limitations under the License.
.table.bold-key>tbody>tr>td:first-child {
font-weight: 600;
}
tr.empty { tr.empty {
td { td {
display: table-cell; display: table-cell;
......
dashboardv3/public/css/scss/theme.scss
...@@ -131,7 +131,7 @@ header.atlas-header { ...@@ -131,7 +131,7 @@ header.atlas-header {
border-bottom: 1px $color_mystic_approx solid; border-bottom: 1px $color_mystic_approx solid;
position: fixed; position: fixed;
width: 100%; width: 100%;
z-index: 3; z-index: 4;
box-shadow: 0px 2px 6px 0px rgba(0, 0, 0, 0.05); box-shadow: 0px 2px 6px 0px rgba(0, 0, 0, 0.05);
.navbar-nav { .navbar-nav {
......
dashboardv3/public/js/templates/entity/EntityDetailTableLayoutView_tmpl.html
...@@ -38,7 +38,7 @@ ...@@ -38,7 +38,7 @@
<div id="collapse1" class="panel-collapse collapse in"> <div id="collapse1" class="panel-collapse collapse in">
<div class="panel-body"> <div class="panel-body">
<div class="entity-detail-table"> <div class="entity-detail-table">
<table class="table"> <table class="table bold-key">
<tbody data-id="detailValue" class="hide-empty-value"> <tbody data-id="detailValue" class="hide-empty-value">
</tbody> </tbody>
</table> </table>
......
dashboardv3/public/js/templates/entity/EntityUserDefineView_tmpl.html
...@@ -75,7 +75,7 @@ ...@@ -75,7 +75,7 @@
<div id="r_entityUserDefinedItemView"></div> <div id="r_entityUserDefinedItemView"></div>
{{else}} {{else}}
<div class="entity-detail-table"> <div class="entity-detail-table">
<table class="table"> <table class="table bold-key">
<tbody> <tbody>
{{#each customAttibutes}} {{#each customAttibutes}}
<tr> <tr>
......
dashboardv3/public/js/templates/graph/LineageLayoutView_tmpl.html
...@@ -123,13 +123,7 @@ ...@@ -123,13 +123,7 @@
<span data-id="box-close" class="btn btn-sm btn-close lineage-node-detail-close"><i class="fa fa-close"></i></span> <span data-id="box-close" class="btn btn-sm btn-close lineage-node-detail-close"><i class="fa fa-close"></i></span>
</div> </div>
<div class="body"> <div class="body">
<table class='table table-quickMenu'> <table class='table bold-key'>
<thead>
<tr>
<th>Key</th>
<th>Value</th>
</tr>
</thead>
<tbody data-id="nodeDetailTable"></tbody> <tbody data-id="nodeDetailTable"></tbody>
</table> </table>
</div> </div>
......
dashboardv3/public/js/templates/graph/RelationshipLayoutView_tmpl.html
...@@ -62,7 +62,7 @@ ...@@ -62,7 +62,7 @@
</div> </div>
</div> </div>
</div> </div>
<table class="table table-quickMenu" data-id="relationshipDetailTable"> <table class="table table-quickMenu bold-key" data-id="relationshipDetailTable">
<thead> <thead>
<tr> <tr>
<th>Key</th> <th>Key</th>
......
dashboardv3/public/js/views/entity/EntityBusinessMetaDataView.js
...@@ -262,7 +262,7 @@ define([ ...@@ -262,7 +262,7 @@ define([
'<div class="btn-group pull-left"> <button type="button" title="Collapse"><i class="ec-icon fa"></i></button></div>' + '<div class="btn-group pull-left"> <button type="button" title="Collapse"><i class="ec-icon fa"></i></button></div>' +
'</div>' + '</div>' +
'<div id="' + _.escape(obj.get("__internal_UI_businessMetadataName")) + '" class="panel-collapse collapse in">' + '<div id="' + _.escape(obj.get("__internal_UI_businessMetadataName")) + '" class="panel-collapse collapse in">' +
'<div class="panel-body"><table class="table">' + tableBody + '</table></div>' + '<div class="panel-body"><table class="table bold-key">' + tableBody + '</table></div>' +
'</div></div>'; '</div></div>';
}, },
onRender: function() { onRender: function() {
......
Markdown is supported
0% or
You are about to add 0 people to the discussion. Proceed with caution.
Finish editing this message first!
Please register or to comment