Make entire module label clickable and change remove icon

This commit is contained in:
Thomas Smith
2014-02-27 17:15:02 -07:00
parent 419180c443
commit eaf766c2a7
2 changed files with 21 additions and 18 deletions
+10 -9
View File
@@ -6,17 +6,23 @@
border: 1px solid #dddddd;
padding: 0;
margin-bottom: 5px;
background-color: #f1f1f1;
clear: both;
display: inline-block;
width: 100%;
}
.archetypeEditor .archetypeFieldsetLabel {
padding: 8px 25px 8px 3px;
float: left;
padding-left: 3px;
width: 98%;
.label-sub {
padding: 8px 0;
display: inline-block;
&.module-label {
width: 89%;
}
}
span {
font-weight: bold;
}
@@ -30,7 +36,6 @@
}
.caret {
float:left;
margin: 8px 1px 0 7px;
&.caret-right {
border-bottom: 4px solid transparent;
@@ -42,8 +47,6 @@
}
label{
float: left;
width: 80%;
margin-bottom: 0;
margin-left: 5px;
padding: 0;
@@ -56,7 +59,6 @@
.archetypeEditor .archetypeCollapser{
clear: both;
height: 100%;
margin-top: 10px;
padding-top: 12px;
background-color: #fff;
border-top: 1px solid silver;
@@ -74,7 +76,6 @@
.archetypeEditor, .archetypeConfig{
.archetypeEditorControls{
float: right;
i {
cursor: pointer;
&.handle {
@@ -281,4 +282,4 @@
span {
color: #343434;
}
}
}
+11 -9
View File
@@ -13,17 +13,19 @@
<li ng-repeat="fieldset in archetypeRenderModel.fieldsets" ng-hide="fieldset.remove">
<fieldset ng-class="{archetypeFieldsetError: !fieldset.isValid}" ng-init="fieldsetConfigModel = getConfigFieldsetByAlias(fieldset.alias)">
<div class="archetypeFieldsetLabel">
<span class="caret" ng-hide="fieldset.collapse"></span>
<span class="caret caret-right" ng-show="fieldset.collapse"></span>
<div ng-click="focusFieldset(fieldset)" class="label-sub module-label">
<span class="caret" ng-hide="fieldset.collapse"></span>
<span class="caret caret-right" ng-show="fieldset.collapse"></span>
<label ng-click="focusFieldset(fieldset)">
<i class="fieldsetIcon icon ng-class:fieldsetConfigModel.icon"></i>
<span ng-bind="getFieldsetTitle(fieldsetConfigModel, $index)"></span>
</label>
<label>
<i class="fieldsetIcon icon ng-class:fieldsetConfigModel.icon"></i>
<span ng-bind="getFieldsetTitle(fieldsetConfigModel, $index)"></span>
</label>
</div>
<div class="archetypeEditorControls" ng-hide="model.config.hideFieldsetControls || model.config.maxFieldsets == '1'">
<div class="archetypeEditorControls label-sub" ng-hide="model.config.hideFieldsetControls || model.config.maxFieldsets == '1'">
<i class="icon icon-add" ng-click="addRow(fieldset.alias, $index)" ng-show="canAdd()"></i>
<i class="icon icon-delete" ng-click="removeRow($index)" ng-show="canRemove()"></i>
<i class="icon icon-remove" ng-click="removeRow($index)" ng-show="canRemove()"></i>
<i class="icon icon-navigation handle" ng-show="canSort()"></i>
</div>
</div>
@@ -46,4 +48,4 @@
</fieldset>
</li>
</ul>
</div>
</div>