Merge pull request #6948 from umbraco/v8/feature/0000-DataType-DeleteWarning-styling

Styling for the DataType Delete Dialog
This commit is contained in:
Warren Buckley
2019-10-31 11:21:47 +00:00
committed by GitHub
3 changed files with 42 additions and 7 deletions

View File

@@ -188,6 +188,8 @@
@import "components/users/umb-user-preview.less";
@import "components/users/umb-user-picker-list.less";
@import "components/contextdialogs/umb-dialog-datatype-delete.less";
// Utilities
@import "utilities/layout/_display.less";

View File

@@ -0,0 +1,33 @@
.umb-dialog-datatype-delete {
.umb-dialog-datatype-delete__table-head-column-name {
width: 140px;
}
.umb-table-body__icon {
margin-right: 5px;
vertical-align: top;
display: inline-block;
}
.table tbody td {
vertical-align: top;
}
.table tbody td > span {
margin: 5px 0;
vertical-align: middle;
}
.table tbody p {
line-height: 12px;
margin: 5px 0;
vertical-align: middle;
}
.table tbody .icon {
vertical-align: top;
margin-right: 5px;
display: inline-block;
}
}

View File

@@ -1,4 +1,4 @@
<div class="umb-dialog umb-pane" ng-controller="Umbraco.Editors.DataType.DeleteController as vm">
<div class="umb-dialog umb-pane umb-dialog-datatype-delete" ng-controller="Umbraco.Editors.DataType.DeleteController as vm">
<div class="umb-dialog-body">
<ng-switch on="currentNode.nodeType">
@@ -44,14 +44,14 @@
<table class="table table-condensed table-bordered">
<thead>
<tr>
<th><localize key="general_name">Name</localize></th>
<th class="umb-dialog-datatype-delete__table-head-column-name"><localize key="general_name">Name</localize></th>
<th><localize key="general_properties">Properties</localize></th>
</tr>
</thead>
<tbody>
<tr ng-repeat="relation in vm.references.documentTypes">
<td><span title="{{::relation.name}}({{::relation.alias}})"><i class="umb-table-body__icon {{relation.icon}}"></i>{{::relation.name}}</span></td>
<td><span><span class="red" ng-repeat="property in relation.properties"><i class="icon icon-alert red"></i>{{::property.name}}{{$last ? '' : ', '}}</span></span></td>
<td><div><p class="red" ng-repeat="property in relation.properties"><i class="icon icon-alert red"></i>{{::property.name}}</p></div></td>
</tr>
</tbody>
</table>
@@ -68,14 +68,14 @@
<table class="table table-condensed table-bordered">
<thead>
<tr>
<th><localize key="general_name">Name</localize></th>
<th class="umb-dialog-datatype-delete__table-head-column-name"><localize key="general_name">Name</localize></th>
<th><localize key="general_properties">Properties</localize></th>
</tr>
</thead>
<tbody>
<tr ng-repeat="relation in vm.references.mediaTypes">
<td><span title="{{::relation.name}}({{::relation.alias}})"><i class="umb-table-body__icon {{relation.icon}}"></i>{{::relation.name}}</span></td>
<td><span><span class="red" ng-repeat="property in relation.properties"><i class="icon icon-alert red"></i>{{::property.name}}{{$last ? '' : ', '}}</span></span></td>
<td><div><p class="red" ng-repeat="property in relation.properties"><i class="icon icon-alert red"></i>{{::property.name}}</p></div></td>
</tr>
</tbody>
</table>
@@ -92,14 +92,14 @@
<table class="table table-condensed table-bordered">
<thead>
<tr>
<th><localize key="general_name">Name</localize></th>
<th class="umb-dialog-datatype-delete__table-head-column-name"><localize key="general_name">Name</localize></th>
<th><localize key="general_properties">Properties</localize></th>
</tr>
</thead>
<tbody>
<tr ng-repeat="relation in vm.references.memberTypes">
<td><span title="{{::relation.name}}({{::relation.alias}})"><i class="umb-table-body__icon {{relation.icon}}"></i>{{::relation.name}}</span></td>
<td><span><span class="red" ng-repeat="property in relation.properties"><i class="icon icon-alert red"></i>{{::property.name}}{{$last ? '' : ', '}}</span></span></td>
<td><div><p class="red" ng-repeat="property in relation.properties"><i class="icon icon-alert red"></i>{{::property.name}}</p></div></td>
</tr>
</tbody>
</table>