186 lines
6.9 KiB
HTML
186 lines
6.9 KiB
HTML
<div ng-controller="Umbraco.PropertyEditors.GridPrevalueEditorController" class="usky-grid usky-grid-configuration">
|
|
<div style="max-width: 600px">
|
|
<div class="control-group uSky-templates">
|
|
|
|
<h4><localize key="grid_gridLayouts" /></h4>
|
|
<p><localize key="grid_gridLayoutsDetail" /></p>
|
|
|
|
<ul class="unstyled"
|
|
ui-sortable
|
|
ng-model="model.value.templates">
|
|
|
|
<li ng-repeat="template in model.value.templates" class="clearfix">
|
|
|
|
<div ng-click="configureTemplate(template)"
|
|
class="preview-rows layout" style="margin-top: 5px; margin-bottom: 20px; float:left">
|
|
|
|
<div class="preview-row">
|
|
<div class="preview-col"
|
|
ng-class="{last:$last}"
|
|
ng-repeat="section in template.sections | filter:zeroWidthFilter"
|
|
ng-style="{width: percentage(section.grid) + '%', height: '60px', 'max-width': '100%'}">
|
|
<div class="preview-cell"></div>
|
|
</div>
|
|
</div>
|
|
</div>
|
|
|
|
<div>
|
|
{{template.name}} <br />
|
|
<i class="icon-delete red"></i>
|
|
<a class="btn btn-small btn-link"
|
|
href
|
|
ng-click="deleteTemplate($index)"><localize key="general_delete" /></a>
|
|
</div>
|
|
|
|
</li>
|
|
</ul>
|
|
|
|
<button class="btn btn-small"
|
|
prevent-default
|
|
ng-click="configureTemplate()">
|
|
<i class="icon-add"></i> <localize key="grid_addGridLayout" />
|
|
</button>
|
|
</div>
|
|
</div>
|
|
<div style="max-width: 600px">
|
|
|
|
<div class="control-group uSky-templates">
|
|
|
|
<h4><localize key="grid_rowConfigurations" /></h4>
|
|
<p><localize key="grid_rowConfigurationsDetail" /></p>
|
|
|
|
<div class="control-group uSky-templates-rows">
|
|
<ul class="unstyled"
|
|
ui-sortable
|
|
ng-model="model.value.layouts">
|
|
|
|
<li ng-repeat="layout in model.value.layouts" class="clearfix">
|
|
|
|
<div ng-click="configureLayout(layout)"
|
|
class="preview-rows columns" style="margin-top: 5px; margin-bottom: 25px; float:left">
|
|
|
|
<div class="preview-row">
|
|
<div class="preview-col"
|
|
ng-class="{last:$last}"
|
|
ng-repeat="area in layout.areas | filter:zeroWidthFilter"
|
|
ng-style="{width: percentage(area.grid) + '%', 'max-width': '100%'}">
|
|
|
|
<div class="preview-cell">
|
|
<p style="font-size: 6px; line-height: 8px; text-align: center" ng-show="area.maxItems > 0">{{area.maxItems}}</p>
|
|
</div>
|
|
</div>
|
|
</div>
|
|
</div>
|
|
|
|
<div>
|
|
{{layout.label || layout.name}}<br />
|
|
<i class="icon-delete red"></i>
|
|
<a class="btn btn-small btn-link" href ng-click="deleteLayout($index)">
|
|
<localize key="general_delete" />
|
|
</a>
|
|
</div>
|
|
|
|
</li>
|
|
</ul>
|
|
|
|
<button class="btn btn-small" prevent-default ng-click="configureLayout()">
|
|
<i class="icon-add"></i> <localize key="grid_addRowConfiguration" />
|
|
</button>
|
|
|
|
</div>
|
|
</div>
|
|
|
|
</div>
|
|
|
|
|
|
<div style="max-width: 600px">
|
|
|
|
<umb-control-group label="@grid_columns"
|
|
description="@grid_columnsDetails">
|
|
<input type="number" min="1" ng-model="model.value.columns" />
|
|
</umb-control-group>
|
|
|
|
<umb-control-group label="@grid_settings"
|
|
description="@grid_settingsDetails">
|
|
|
|
<ul class="unstyled list-icons umb-contentpicker"
|
|
ui-sortable
|
|
ng-model="model.value.config">
|
|
|
|
<li ng-repeat="configValue in model.value.config">
|
|
<i class="icon icon-navigation handle"></i>
|
|
|
|
<a href="#" prevent-default ng-click="removeConfigValue(model.value.config, $index)">
|
|
<i class="icon icon-delete red"></i>
|
|
{{configValue.label}}
|
|
</a>
|
|
</li>
|
|
</ul>
|
|
|
|
<ul class="unstyled list-icons">
|
|
<li>
|
|
<i class="icon icon-settings-alt-2 turquoise"></i>
|
|
|
|
<a href="#" ng-click="editConfig()" prevent-default>
|
|
<localize key="general_edit" />
|
|
</a>
|
|
</li>
|
|
</ul>
|
|
</umb-control-group>
|
|
|
|
|
|
<umb-control-group label="@grid_styles"
|
|
description="@grid_stylesDetails">
|
|
|
|
<ul class="unstyled list-icons umb-contentpicker"
|
|
ui-sortable
|
|
ng-model="model.value.styles">
|
|
|
|
<li ng-repeat="style in model.value.styles">
|
|
<i class="icon icon-navigation handle"></i>
|
|
|
|
<a href="#" prevent-default ng-click="removeConfigValue(model.value.styles, $index)">
|
|
<i class="icon icon-delete red"></i>
|
|
{{style.label}}
|
|
</a>
|
|
|
|
</li>
|
|
</ul>
|
|
|
|
<ul class="unstyled list-icons">
|
|
<li>
|
|
<i class="icon icon-settings-alt-2 turquoise"></i>
|
|
<a href="#" ng-click="editStyles()" prevent-default>
|
|
<localize key="general_edit" />
|
|
</a>
|
|
</li>
|
|
</ul>
|
|
</umb-control-group>
|
|
</div>
|
|
|
|
<umb-overlay ng-if="layoutConfigOverlay.show"
|
|
model="layoutConfigOverlay"
|
|
view="layoutConfigOverlay.view"
|
|
position="right">
|
|
</umb-overlay>
|
|
|
|
<umb-overlay ng-if="rowConfigOverlay.show"
|
|
model="rowConfigOverlay"
|
|
view="rowConfigOverlay.view"
|
|
position="right">
|
|
</umb-overlay>
|
|
|
|
<umb-overlay ng-if="editConfigCollectionOverlay.show"
|
|
model="editConfigCollectionOverlay"
|
|
view="editConfigCollectionOverlay.view"
|
|
position="right">
|
|
</umb-overlay>
|
|
|
|
<umb-overlay ng-if="rowDeleteOverlay.show"
|
|
model="rowDeleteOverlay"
|
|
view="rowDeleteOverlay.view"
|
|
position="right">
|
|
</umb-overlay>
|
|
|
|
</div>
|