diff options
Diffstat (limited to 'catalog-ui/app/scripts/view-models/forms/property-form')
3 files changed, 612 insertions, 0 deletions
diff --git a/catalog-ui/app/scripts/view-models/forms/property-form/property-form-view-model.ts b/catalog-ui/app/scripts/view-models/forms/property-form/property-form-view-model.ts new file mode 100644 index 0000000000..c9732aa9a6 --- /dev/null +++ b/catalog-ui/app/scripts/view-models/forms/property-form/property-form-view-model.ts @@ -0,0 +1,330 @@ +/*- + * ============LICENSE_START======================================================= + * SDC + * ================================================================================ + * Copyright (C) 2017 AT&T Intellectual Property. All rights reserved. + * ================================================================================ + * Licensed under the Apache License, Version 2.0 (the "License"); + * you may not use this file except in compliance with the License. + * You may obtain a copy of the License at + * + * http://www.apache.org/licenses/LICENSE-2.0 + * + * Unless required by applicable law or agreed to in writing, software + * distributed under the License is distributed on an "AS IS" BASIS, + * WITHOUT WARRANTIES OR CONDITIONS OF ANY KIND, either express or implied. + * See the License for the specific language governing permissions and + * limitations under the License. + * ============LICENSE_END========================================================= + */ +/// <reference path="../../../references"/> + +module Sdc.ViewModels { + 'use strict'; + + export interface IEditPropertyModel { + property: Models.PropertyModel; + types: Array<string>; + simpleTypes: Array<string>; + sources: Array<string>; + } + + interface IPropertyFormViewModelScope extends ng.IScope { + forms:any; + editForm:ng.IFormController; + footerButtons: Array<any>; + isNew: boolean; + isLoading: boolean; + isService: boolean; + validationPattern: RegExp; + propertyNameValidationPattern: RegExp; + commentValidationPattern: RegExp; + editPropertyModel: IEditPropertyModel; + modalInstanceProperty:ng.ui.bootstrap.IModalServiceInstance; + currentPropertyIndex:number; + isLastProperty:boolean; + myValue:any; + nonPrimitiveTypes:Array<string>; + dataTypes:Models.DataTypesMap; + isTypeDataType:boolean; + maxLength:number; + + save(doNotCloseModal?:boolean): void; + getValidationPattern(type:string): RegExp; + validateIntRange(value:string):boolean; + close(): void; + onValueChange(): void; + onSchemaTypeChange():void; + onTypeChange(resetSchema:boolean): void; + isPropertyValueOwner():boolean; + showSchema(): boolean; + delete(property:Models.PropertyModel): void; + getPrev(): void; + getNext(): void; + isSimpleType(typeName:string):boolean; + getDefaultValue():any; + } + + export class PropertyFormViewModel { + + static '$inject' = [ + '$scope', + 'Sdc.Services.DataTypesService', + '$modalInstance', + 'property', + 'ValidationPattern', + 'PropertyNameValidationPattern', + 'CommentValidationPattern', + 'ValidationUtils', + 'component', + '$filter', + 'ModalsHandler', + 'filteredProperties', + '$timeout' + ]; + + private formState: Sdc.Utils.Constants.FormState; + + constructor(private $scope:IPropertyFormViewModelScope, + private DataTypesService:Sdc.Services.DataTypesService, + private $modalInstance:ng.ui.bootstrap.IModalServiceInstance, + private property: Models.PropertyModel, + private ValidationPattern:RegExp, + private PropertyNameValidationPattern: RegExp, + private CommentValidationPattern:RegExp, + private ValidationUtils:Sdc.Utils.ValidationUtils, + private component: Models.Components.Component, + private $filter:ng.IFilterService, + private ModalsHandler:Utils.ModalsHandler, + private filteredProperties: Array<Models.PropertyModel>, + private $timeout: ng.ITimeoutService) { + + this.formState = angular.isDefined(property.name) ? Utils.Constants.FormState.UPDATE : Utils.Constants.FormState.CREATE; + this.initScope(); + } + + private initResource = ():void => { + this.$scope.editPropertyModel.property = new Sdc.Models.PropertyModel(this.property); + this.$scope.editPropertyModel.property.type = this.property.type? this.property.type: null; + this.setMaxLength(); + // if (this.$scope.editPropertyModel.types.indexOf(this.property.type) === -1 && !this.$scope.isNew) { + // this.property.type = "string"; + // } + }; + + private initEditPropertyModel = ():void => { + this.$scope.editPropertyModel = { + property: null, + types: Utils.Constants.PROPERTY_DATA.TYPES, + simpleTypes: Utils.Constants.PROPERTY_DATA.SIMPLE_TYPES, + sources: Utils.Constants.PROPERTY_DATA.SOURCES + }; + + this.initResource(); + }; + + private initForNotSimpleType = ():void => { + let property = this.$scope.editPropertyModel.property; + this.$scope.isTypeDataType=this.DataTypesService.isDataTypeForPropertyType(this.$scope.editPropertyModel.property,this.$scope.dataTypes); + if(property.type && this.$scope.editPropertyModel.simpleTypes.indexOf(property.type)==-1){ + if(!(property.value||property.defaultValue)) { + switch (property.type) { + case Utils.Constants.PROPERTY_TYPES.MAP: + this.$scope.myValue = {'':null}; + break; + case Utils.Constants.PROPERTY_TYPES.LIST: + this.$scope.myValue = []; + break; + default: + this.$scope.myValue = {}; + } + }else{ + this.$scope.myValue = JSON.parse(property.value||property.defaultValue); + } + } + }; + + private setMaxLength = ():void => { + switch (this.$scope.editPropertyModel.property.type) { + case Utils.Constants.PROPERTY_TYPES.MAP: + case Utils.Constants.PROPERTY_TYPES.LIST: + this.$scope.maxLength = this.$scope.editPropertyModel.property.schema.property.type == Utils.Constants.PROPERTY_TYPES.JSON? + Utils.Constants.PROPERTY_VALUE_CONSTRAINTS.JSON_MAX_LENGTH: + Utils.Constants.PROPERTY_VALUE_CONSTRAINTS.MAX_LENGTH; + break; + case Utils.Constants.PROPERTY_TYPES.JSON: + this.$scope.maxLength = Utils.Constants.PROPERTY_VALUE_CONSTRAINTS.JSON_MAX_LENGTH; + break; + default: + this.$scope.maxLength = Utils.Constants.PROPERTY_VALUE_CONSTRAINTS.MAX_LENGTH; + } + }; + + + private initScope = ():void => { + + //scope properties + this.$scope.forms = {}; + this.$scope.validationPattern = this.ValidationPattern; + this.$scope.propertyNameValidationPattern = this.PropertyNameValidationPattern; + this.$scope.commentValidationPattern = this.CommentValidationPattern; + this.$scope.isLoading = false; + this.$scope.isNew = (this.formState === Utils.Constants.FormState.CREATE); + this.$scope.isService = this.component.isService(); + this.$scope.modalInstanceProperty = this.$modalInstance; + this.$scope.currentPropertyIndex = _.findIndex(this.filteredProperties, i=> i.name == this.property.name ); + this.$scope.isLastProperty= this.$scope.currentPropertyIndex==(this.filteredProperties.length-1); + + this.initEditPropertyModel(); + + this.DataTypesService.getAllDataTypes().then((response:any) => { + this.$scope.dataTypes = response; + delete response['tosca.datatypes.Root']; + this.$scope.nonPrimitiveTypes =_.filter(Object.keys(response),(type:string)=>{ + return this.$scope.editPropertyModel.types.indexOf(type)==-1; + }); + this.initForNotSimpleType(); + }, (err)=> {}); + + + + + + //scope methods + this.$scope.save = (doNotCloseModal?:boolean):void => { + let property:Models.PropertyModel = this.$scope.editPropertyModel.property; + this.$scope.editPropertyModel.property.description = this.ValidationUtils.stripAndSanitize(this.$scope.editPropertyModel.property.description); + ////if read only - just closes the modal + if (this.$scope.editPropertyModel.property.readonly && !this.$scope.isPropertyValueOwner()) { + this.$modalInstance.close(); + return; + } + + this.$scope.isLoading = true; + + let onPropertyFaild = (response):void => { + console.info('onFaild', response); + this.$scope.isLoading = false; + }; + + let onPropertySuccess = (propertyFromBE:Models.PropertyModel):void => { + console.info('onPropertyResourceSuccess : ', propertyFromBE); + this.$scope.isLoading = false; + + if (!doNotCloseModal) { + this.$modalInstance.close(); + } else { + this.$scope.forms.editForm.$setPristine(); + this.$scope.editPropertyModel.property = new Models.PropertyModel(); + } + }; + + //in case we have uniqueId we call update method + if (this.$scope.isPropertyValueOwner()) { + if(!this.$scope.editPropertyModel.property.simpleType && !this.$scope.isSimpleType(property.type)){ + let myValueString:string = JSON.stringify(this.$scope.myValue); + property.value = myValueString; + } + this.component.updateInstanceProperty(property).then(onPropertySuccess, onPropertyFaild); + } else { + if(!this.$scope.editPropertyModel.property.simpleType && !this.$scope.isSimpleType(property.type)){ + let myValueString:string = JSON.stringify(this.$scope.myValue); + property.defaultValue = myValueString; + }else{ + this.$scope.editPropertyModel.property.defaultValue = this.$scope.editPropertyModel.property.value; + } + this.component.addOrUpdateProperty(property).then(onPropertySuccess, onPropertyFaild); + } + }; + + + this.$scope.isPropertyValueOwner = ():boolean=> { + return this.component.isService() || !!this.component.selectedInstance; + }; + + this.$scope.getPrev = ():void=> { + this.property = this.filteredProperties[--this.$scope.currentPropertyIndex]; + this.initResource(); + this.initForNotSimpleType(); + this.$scope.isLastProperty=false; + }; + + this.$scope.getNext = ():void=> { + this.property = this.filteredProperties[++this.$scope.currentPropertyIndex]; + this.initResource(); + this.initForNotSimpleType(); + this.$scope.isLastProperty= this.$scope.currentPropertyIndex==(this.filteredProperties.length-1); + }; + + this.$scope.isSimpleType = (typeName:string):boolean=>{ + return typeName && this.$scope.editPropertyModel.simpleTypes.indexOf(typeName)!=-1; + }; + + this.$scope.showSchema = () :boolean => { + return [Utils.Constants.PROPERTY_TYPES.LIST, Utils.Constants.PROPERTY_TYPES.MAP].indexOf(this.$scope.editPropertyModel.property.type) > -1; + }; + + this.$scope.getValidationPattern = (type:string):RegExp => { + return this.ValidationUtils.getValidationPattern(type); + }; + + this.$scope.validateIntRange = (value:string):boolean => { + return !value || this.ValidationUtils.validateIntRange(value); + }; + + this.$scope.close = ():void => { + this.$modalInstance.close(); + }; + + // put default value when instance value is empty + this.$scope.onValueChange = ():void => { + if (!this.$scope.editPropertyModel.property.value) { + if (this.$scope.isPropertyValueOwner()) { + this.$scope.editPropertyModel.property.value = this.$scope.editPropertyModel.property.defaultValue; + } + } + }; + + // Add the done button at the footer. + this.$scope.footerButtons = [ + {'name': 'Save', 'css': 'blue', 'callback': this.$scope.save }, + {'name': 'Cancel', 'css': 'grey', 'callback':this.$scope.close } + ]; + + this.$scope.$watch("forms.editForm.$invalid", (newVal, oldVal) => { + this.$scope.footerButtons[0].disabled = this.$scope.forms.editForm.$invalid; + }); + + this.$scope.getDefaultValue = ():any => { + return this.$scope.isPropertyValueOwner() ? this.$scope.editPropertyModel.property.defaultValue : null; + }; + + this.$scope.onTypeChange = ():void => { + this.$scope.editPropertyModel.property.value = ''; + this.$scope.editPropertyModel.property.defaultValue = ''; + this.setMaxLength(); + this.initForNotSimpleType(); + }; + + this.$scope.onSchemaTypeChange = ():void => { + if(this.$scope.editPropertyModel.property.type==Utils.Constants.PROPERTY_TYPES.MAP){ + this.$scope.myValue={'':null}; + }else if(this.$scope.editPropertyModel.property.type==Utils.Constants.PROPERTY_TYPES.LIST){ + this.$scope.myValue=[]; + } + this.setMaxLength(); + }; + + this.$scope.delete = (property:Models.PropertyModel):void => { + let onOk = ():void => { + this.component.deleteProperty(property.uniqueId).then( + this.$scope.close + ); + }; + let title:string = this.$filter('translate')("PROPERTY_VIEW_DELETE_MODAL_TITLE"); + let message:string = this.$filter('translate')("PROPERTY_VIEW_DELETE_MODAL_TEXT", "{'name': '" + property.name + "'}"); + this.ModalsHandler.openConfirmationModal(title, message, false).then(onOk); + }; + } + } +} diff --git a/catalog-ui/app/scripts/view-models/forms/property-form/property-form-view.html b/catalog-ui/app/scripts/view-models/forms/property-form/property-form-view.html new file mode 100644 index 0000000000..d593d47a77 --- /dev/null +++ b/catalog-ui/app/scripts/view-models/forms/property-form/property-form-view.html @@ -0,0 +1,219 @@ +<sdc-modal modal="modalInstanceProperty" type="classic" class="sdc-edit-property-container" buttons="footerButtons" header="{{isNew ? 'Add' : 'Update' }} Property" show-close-button="true" data-tests-id="sdc-edit-property-container"> + <div class="sdc-modal-top-bar" data-ng-if="!isNew"> + <div class="sdc-modal-top-bar-buttons"> + <span ng-click="delete(editPropertyModel.property)" data-ng-class="{'disabled' : isPropertyValueOwner()||editPropertyModel.property.readonly}" class="sprite-new delete-btn" data-tests-id="delete_property" sdc-smart-tooltip="">Delete</span> + <span class="delimiter"></span> + <span data-ng-click="getPrev()" data-ng-class="{'disabled' : !currentPropertyIndex }" class="sprite-new left-arrow" data-tests-id="get-prev" sdc-smart-tooltip="">Previous</span> + <span data-ng-click="getNext()" data-ng-class="{'disabled' : isLastProperty }" class="sprite-new right-arrow" data-tests-id="get-next" sdc-smart-tooltip="">Next</span> + </div> + </div> + + <div class="sdc-edit-property-form-container" > + <perfect-scrollbar scroll-y-margin-offset="0" include-padding="true" class="scrollbar-container"> + <form novalidate class="w-sdc-form two-columns" name="forms.editForm" > + + <div class="w-sdc-form-columns-wrapper"> + + <div class="w-sdc-form-column"> + + <!-- Name --> + <div class="i-sdc-form-item" data-ng-class="{error:(forms.editForm.propertyName.$dirty && forms.editForm.propertyName.$invalid)}"> + <label class="i-sdc-form-label" ng-class="{'required': !isService}">Name</label> + <input class="i-sdc-form-input" + data-tests-id="propertyName" + data-ng-maxlength="50" + data-ng-disabled="!isNew || editPropertyModel.property.readonly" + maxlength="50" + data-ng-model="editPropertyModel.property.name" + type="text" + name="propertyName" + data-ng-pattern="propertyNameValidationPattern" + data-required + data-ng-model-options="{ debounce: 200 }" + autofocus /> + + <div class="input-error" data-ng-show="forms.editForm.propertyName.$dirty && forms.editForm.propertyName.$invalid"> + <span ng-show="forms.editForm.propertyName.$error.required" translate="VALIDATION_ERROR_REQUIRED" translate-values="{'field': 'Property name' }"></span> + <span ng-show="forms.editForm.propertyName.$error.maxlength" translate="VALIDATION_ERROR_MAX_LENGTH" translate-values="{'max': '128' }"></span> + <span ng-show="forms.editForm.propertyName.$error.pattern" translate="VALIDATION_ERROR_SPECIAL_CHARS_NOT_ALLOWED"></span> + </div> + + </div> + + <!-- Input source --> + <!--div class="i-sdc-form-item" data-ng-class="{error:(forms.editForm.source.$dirty && forms.editForm.source.$invalid)}"> + <label class="i-sdc-form-label required">Input Source</label> + <select class="i-sdc-form-select" + data-required + name="source" + data-ng-model="editPropertyModel.property.source" + data-ng-options="source for source in editPropertyModel.sources"> + <option value="" >Choose Input Source</option> + </select> + <sdc-error-tooltip data-ng-show="forms.editForm.source.$dirty && forms.editForm.source.$invalid"> + <span ng-show="forms.editForm.source.$error.required">source is required.</span> + </sdc-error-tooltip> + </div--> + + + </div> + + <div class="w-sdc-form-column"> + <div class="w-sdc-form-columns-wrapper"> + <div class="w-sdc-form-column"> + <!-- Type --> + <div class="i-sdc-form-item" data-ng-class="{error:(forms.editForm.type.$dirty && forms.editForm.type.$invalid)}"> + <label class="i-sdc-form-label" ng-class="{'required': !isService}">Type</label> + <select class="i-sdc-form-select" + data-tests-id="propertyType" + data-required + data-ng-disabled="isPropertyValueOwner() || editPropertyModel.property.readonly" + name="type" + data-ng-change="onTypeChange()" + data-ng-model="editPropertyModel.property.type"> + <option value="">Choose Type</option> + <option data-ng-repeat="type in editPropertyModel.types" + value="{{type}}">{{type}}</option> + <option data-ng-repeat="type in nonPrimitiveTypes" + value="{{type}}">{{type.replace("org.openecomp.datatypes.heat.","")}}</option> + </select> + + <div class="input-error" data-ng-show="forms.editForm.type.$dirty && forms.editForm.type.$invalid"> + <span ng-show="forms.editForm.type.$error.required" translate="VALIDATION_ERROR_REQUIRED" translate-values="{'field': 'Type' }"></span> + </div> + </div> + </div> + <div class="w-sdc-form-column" data-ng-if="showSchema()"> + <!-- Entry Schema --> + <div class="i-sdc-form-item" data-ng-class="{error:(forms.editForm.schemaType.$dirty && forms.editForm.schemaType.$invalid)}"> + <label class="i-sdc-form-label required">Entry Schema</label> + <select class="i-sdc-form-select" + data-required + data-tests-id="schema-type" + data-ng-disabled="isPropertyValueOwner() || editPropertyModel.property.readonly" + name="schemaType" + data-ng-change="onSchemaTypeChange()" + data-ng-model="editPropertyModel.property.schema.property.type"> + <option value="">Choose Schema Type</option> + <option data-ng-repeat="type in editPropertyModel.simpleTypes" + value="{{type}}">{{type}}</option> + <option data-ng-repeat="type in nonPrimitiveTypes" + value="{{type}}">{{type.replace("org.openecomp.datatypes.heat.","")}}</option> + </select> + + <div class="input-error" data-ng-show="forms.editForm.schemaType.$dirty && forms.editForm.schemaType.$invalid"> + <span ng-show="forms.editForm.schemaType.$error.required" translate="VALIDATION_ERROR_REQUIRED" translate-values="{'field': 'Entry schema' }"></span> + </div> + </div> + </div> + </div> + + <!-- Constraints by type --> + <div class="i-sdc-form-item" data-ng-if="false"> + <label class="i-sdc-form-label required">Constraints by type</label> + <div> + Should be constraints by type(TBD) + </div> + </div> + + </div> + + </div> + <!-- Description --> + <div class="i-sdc-form-item" data-ng-class="{error:(forms.editForm.description.$dirty && forms.editForm.description.$invalid)}"> + <label class="i-sdc-form-label">Description</label> + <textarea class="i-sdc-form-textarea" + data-ng-maxlength="256" + data-ng-disabled="isPropertyValueOwner() || editPropertyModel.property.readonly" + maxlength="256" + data-ng-pattern="commentValidationPattern" + name="description" + data-ng-model="editPropertyModel.property.description" + data-ng-model-options="{ debounce: 200 }" + data-tests-id="description" + ></textarea> + + <div class="input-error" data-ng-show="forms.editForm.description.$dirty && forms.editForm.description.$invalid"> + <span ng-show="forms.editForm.description.$error.maxlength" translate="VALIDATION_ERROR_MAX_LENGTH" translate-values="{'max': '256' }"></span> + <span ng-show="forms.editForm.description.$error.pattern" translate="VALIDATION_ERROR_SPECIAL_CHARS_NOT_ALLOWED"></span> + <span ng-show="forms.editForm.description.$error.required" translate="VALIDATION_ERROR_REQUIRED" translate-values="{'field': 'Description' }"></span> + </div> + </div> + <!-- Default value --> + + <div data-ng-if="dataTypes" class="default-value-section i-sdc-form-item"> + <label class="i-sdc-form-label">Default Value</label> + <div data-ng-if="isTypeDataType"> + <fields-structure value-obj-ref="myValue" + type-name="editPropertyModel.property.type" + parent-form-obj="forms.editForm" + fields-prefix-name="currentPropertyIndex" + read-only="editPropertyModel.property.readonly && !isPropertyValueOwner()" + default-value="{{getDefaultValue()}}" + types="dataTypes" + expand-by-default="true"></fields-structure> + + </div> + <div data-ng-if="!isTypeDataType" ng-switch="editPropertyModel.property.type"> + <div ng-switch-when="map"> + <type-map value-obj-ref="myValue" + schema-property="editPropertyModel.property.schema.property" + parent-form-obj="forms.editForm" + fields-prefix-name="currentPropertyIndex" + read-only="editPropertyModel.property.readonly && !isPropertyValueOwner()" + default-value="{{getDefaultValue()}}" + types="dataTypes" + max-length="maxLength"></type-map> + </div> + <div ng-switch-when="list"> + <type-list value-obj-ref="myValue" + schema-property="editPropertyModel.property.schema.property" + parent-form-obj="forms.editForm" + fields-prefix-name="currentPropertyIndex" + read-only="editPropertyModel.property.readonly && !isPropertyValueOwner()" + default-value="{{getDefaultValue()}}" + types="dataTypes" + max-length="maxLength"></type-list> + </div> + <div ng-switch-default> + <div class="i-sdc-form-item" data-ng-class="{error:(forms.editForm.value.$dirty && forms.editForm.value.$invalid)}"> + <input class="i-sdc-form-input" + data-tests-id="defaultvalue" + ng-if="!((editPropertyModel.property.simpleType||editPropertyModel.property.type) == 'boolean')" + data-ng-maxlength="maxLength" + data-ng-disabled="editPropertyModel.property.readonly && !isPropertyValueOwner()" + maxlength="{{maxLength}}" + data-ng-model="editPropertyModel.property.value" + type="text" + name="value" + data-ng-pattern="getValidationPattern((editPropertyModel.property.simpleType||editPropertyModel.property.type))" + data-ng-model-options="{ debounce: 200 }" + data-ng-change="!forms.editForm.value.$error.pattern && ('integer'==editPropertyModel.property.type && forms.editForm.value.$setValidity('pattern', validateIntRange(editPropertyModel.property.value)) || onValueChange())" + autofocus /> + <select class="i-sdc-form-select" + data-tests-id="booleantype" + ng-if="(editPropertyModel.property.simpleType||editPropertyModel.property.type) == 'boolean'" + data-ng-disabled="editPropertyModel.property.readonly && !isPropertyValueOwner()" + name="value" + data-ng-change="onValueChange()" + data-ng-model="editPropertyModel.property.value"> + <option value="true">true</option> + <option value="false">false</option> + </select> + + <div class="input-error" data-ng-show="forms.editForm.value.$dirty && forms.editForm.value.$invalid"> + <span ng-show="forms.editForm.value.$error.required" translate="VALIDATION_ERROR_REQUIRED" translate-values="{'field': 'Property' }"></span> + <span ng-show="forms.editForm.value.$error.maxlength" translate="VALIDATION_ERROR_MAX_LENGTH" translate-values="{'max': '{{maxLength}}' }"></span> + <span ng-show="forms.editForm.value.$error.pattern" translate="PROPERTY_EDIT_PATTERN"></span> + <span ng-show="forms.editForm.value.$error.customValidation" translate="PROPERTY_EDIT_MAP_UNIQUE_KEYS"></span> + </div> + </div> + </div> + </div> + </div> + <span class="w-sdc-form-note" data-ng-show="forms.editForm.$invalid && false" translate="LABEL_ALL_FIELDS_ARE_MANDATORY"></span> + </form> + </perfect-scrollbar> + </div> + +</sdc-modal> diff --git a/catalog-ui/app/scripts/view-models/forms/property-form/property-form.less b/catalog-ui/app/scripts/view-models/forms/property-form/property-form.less new file mode 100644 index 0000000000..15e30af4ee --- /dev/null +++ b/catalog-ui/app/scripts/view-models/forms/property-form/property-form.less @@ -0,0 +1,63 @@ +.sdc-edit-property-container { + .scrollbar-container{ + height: 415px; + width: 830px; + .perfect-scrollbar; + } + + form{ + width: 813px; + [name="description"]{ + min-height:50px; + } + } + + .sdc-modal-top-bar{ + height: 40px; + .sdc-modal-top-bar-buttons { + float: right; + + > span:not(.delimiter){ + vertical-align: middle; + .hand; + + &.sprite-new { + text-indent: 100%; + } + &.disabled, &:hover.disabled { + pointer-events: none; + } + } + + .delete-btn{ + margin-right: 6px; + } + + .left-arrow{ + margin-right: 8px; + } + + .delimiter { + height: 20px; + width: 1px; + background-color: #959595; + display: inline-block; + vertical-align: middle; + margin-right: 10px; + } + } + } + + .w-sdc-form-note { + .h_9; + display: block; + position: relative; + top: 13px; + } + + .default-value-section{ + border-top: solid 1px @main_color_a; + padding-top: 15px; + margin-top: 15px; + } +} |