From f9bb2fa238d08280470af7de7521f26a00f4d263 Mon Sep 17 00:00:00 2001 From: Samuel Georges Date: Fri, 29 May 2015 18:55:21 +1000 Subject: [PATCH] Break inspector out, clean up flags + icons --- .../backend/assets/js/october.inspector.js | 1271 ----------------- modules/backend/assets/js/october.js | 2 +- modules/backend/assets/less/core/flags.less | 270 ---- modules/backend/assets/less/core/icons.less | 604 -------- .../backend/assets/less/core/variables.less | 6 - modules/backend/assets/less/october.less | 2 +- modules/system/assets/ui/js/inspector.js | 4 + .../assets/ui/less}/inspector.less | 21 + 8 files changed, 27 insertions(+), 2153 deletions(-) delete mode 100644 modules/backend/assets/js/october.inspector.js delete mode 100644 modules/backend/assets/less/core/flags.less delete mode 100644 modules/backend/assets/less/core/icons.less rename modules/{backend/assets/less/controls => system/assets/ui/less}/inspector.less (94%) diff --git a/modules/backend/assets/js/october.inspector.js b/modules/backend/assets/js/october.inspector.js deleted file mode 100644 index 88f0f608b..000000000 --- a/modules/backend/assets/js/october.inspector.js +++ /dev/null @@ -1,1271 +0,0 @@ -/* - * Inspector control - * - * Manages properties of inspectable controls. - * - * Data attributes: - * - data-inspectable - makes a control inspectable. - * - data-inspector-title - title for the inspector popup - * - data-inspector-description - optional description for the inspector popup - * - data-inspector-class - PHP class name of the inspectable object. Required for drop-down - * fields with dynamic options. - * - data-inspector-css-class - CSS class name to apply to the Inspector container element. - * - data-inspector-container - specifies a CSS selector for the inspector container. The default container - * is the document body. The container element should be relative positioned. The 'self' container value - * allows to inject the inspector to the inspectable element. - * - data-inspector-offset - offset in pixels to add to the calculated position, to make the position more "random" - * - data-inspector-placement - top | bottom | left | right. The placement could automatically be changed - if the popover doesn't fit into the desired position. - * - data-inspector-fallback-placement - The placement to use if the default placement - * and all other possible placements do not work. The default value is "bottom". - * - data-inspector-config - Configuration of the inspector fields as an array in the JSON format. - * Each element in the array is an object with the following properties: - * - property - * - title - * - group (optional) - * - type (currently supported types are: string, checkbox, dropdown) - * - description (optional) - * - validationPattern (regex pattern for for validating the value, supported by the text editor) - * - validationMessage (a message to display if the validation fails) - * - placeholder - placholder text, for text and dropdown properties - * - default - default value - * - depends - a list of properties the property depend on, for dropdown lists - * - options - an option list for dropdown lists, optional. If not provided the options are loaded with AJAX. - * - showExternalParam - specifies the visibility of the external parameter feature for the property. Default: true. - * Example of the configuration string (a single property): - * [{"property":"max-width","title":"Max width","type":"string"}] - * - * The Inspector requires the inspectable element to contain a hidden input element with the attribute "data-inspector-values". - * The inspector uses this field to read and write field values. The field value is a JSON string, an object with keys matching property - * names and values matching property values. - * - * Any HTML element that wraps the inspectable element can have the data-inspector-external-parameters property that enables the external - * parameters support. External parameters saved with the special syntax {{ paramName }}. The external parameter feature can be toggled - * on per-property basis with the showExternalParam option, visible by default. - * - * Events - * - change - the event is triggered on the inspectable element when it's properties are updated. - * - showing.oc.inspector - triggered before the Inspector is displayed. Allows to cancel the action with e.preventDefault() - * - hiding.oc.inspector - triggered before the Inspector is hidden. Allows to cancel the action with e.preventDefault() - * - hidden.oc.inspector - triggered after the Inspector is hidden. - * - * Dependences: - * - october.popover.js - */ -+function ($) { "use strict"; - var Base = $.oc.foundation.base, - BaseProto = Base.prototype - - if ($.oc === undefined) - $.oc = {} - - $.oc.inspector = { - editors: {}, - propertyCounter: 0 - } - - // INSPECTOR CLASS DEFINITION - // ============================ - - var Inspector = function(element, options) { - this.options = options - this.$el = $(element) - - this.title = false - this.description = false - - Base.call(this) - } - - Inspector.prototype = Object.create(BaseProto) - Inspector.prototype.constructor = Inspector - - Inspector.prototype.loadConfiguration = function(onSuccess) { - var configString = this.$el.data('inspector-config') - if (configString !== undefined) { - // If the data-inspector-config attribute is provided, - // load the configuration from it - this.parseConfiguration(configString) - - if (onSuccess !== undefined) - onSuccess(); - } else { - // If the data-inspector-config attribute is not provided, - // request the configuration from the server. - var $form = $(this.selector).closest('form'), - data = this.$el.data(), - self = this - - $.oc.stripeLoadIndicator.show() - - var request = $form.request('onGetInspectorConfiguration', { - data: data - }).done(function(data) { - self.parseConfiguration(data.configuration.properties) - - if (data.configuration.title !== undefined) - self.title = data.configuration.title - - if (data.configuration.description !== undefined) - self.description = data.configuration.description - - $.oc.stripeLoadIndicator.hide() - - if (onSuccess !== undefined) - onSuccess(); - }).always(function() { - $.oc.stripeLoadIndicator.hide() - }) - } - } - - Inspector.prototype.parseConfiguration = function(jsonString) { - if (jsonString === undefined) - throw new Error('The Inspector cannot be initialized because the Inspector configuration ' + - 'attribute is not defined on the inspectable element.'); - - if (!$.isArray(jsonString) && !$.isPlainObject(jsonString)) { - try { - this.config = $.parseJSON(jsonString) - } catch(err) { - throw new Error('Error parsing the Inspector field configuration. ' + err) - } - } else - this.config = jsonString - - this.propertyValuesField = $('input[data-inspector-values]', this.$el) - - // Inspector saves property values to data-property-xxx attributes if the input[data-inspector-values] - // doesn't exist, so the condition is not required. - // - // if (this.propertyValuesField.length === 0) - // throw new Error('Error initializing the Inspector: the inspectable element should contain ' + - // 'an hidden input element with the data-inspector-values property.') - } - - Inspector.prototype.getPopoverTemplate = function() { - return ' \ -
\ -

{{title}}

\ - {{#description}} \ -

{{description}}

\ - {{/description}} \ - \ -
\ -
\ - \ - {{#properties}} \ - \ - \ - {{#editor}}{{/editor}} \ - \ - {{/properties}} \ -
\ - {{#expandControl}}{{/expandControl}} \ - {{title}} \ - {{#info}}{{/info}} \ -
\ - \ - ' - } - - Inspector.prototype.init = function() { - // Exit if there are no properties - if (!this.config || this.config.length == 0) - return - - this.editors = [] - this.initProperties() - - this.$el.data('oc.inspectorVisible', true) - - var e = $.Event('showing.oc.inspector') - this.$el.trigger(e, [{callback: this.proxy(this.displayPopover)}]) - if (e.isDefaultPrevented()) - return - - if (!e.isPropagationStopped()) - this.displayPopover() - } - - Inspector.prototype.displayPopover = function() { - var fieldsConfig = this.preprocessConfig(), - renderEditorBound = this.proxy(this.renderEditor), - groupExpandedBound = this.proxy(this.groupExpanded), - data = { - title: this.title ? this.title : this.$el.data('inspector-title'), - description: this.description ? this.description : this.$el.data('inspector-description'), - properties: fieldsConfig.properties, - editor: function() { - return function(text, render) { - if (this.itemType == 'property') - return renderEditorBound(this, render) - } - }, - info: function() { - return function(text, render) { - if (this.description !== undefined && this.description != null) - return render('', this) - } - }, - propFormat: function() { - return function(text, render) { - return 'prop-'+render(text).replace('.', '-') - } - }, - colspan: function() { - return function(text, render) { - return this.itemType == 'group' ? 'colspan="2"' : null - } - }, - tableClass: function() { - return function(text, render) { - return fieldsConfig.hasGroups ? 'has-groups' : null - } - }, - cellClass: function() { - return function(text, render) { - var result = this.itemType + ((this.itemType == 'property' && this.groupIndex !== undefined) ? ' grouped' : '') - - if (this.itemType == 'property' && this.groupIndex !== undefined) - result += groupExpandedBound(this.group) ? ' expanded' : ' collapsed' - - if (this.itemType == 'property' && !this.showExternalParam) - result += ' no-external-parameter' - - return result - } - }, - expandControl: function() { - return function(text, render) { - if (this.itemType == 'group') { - this.itemStatus = groupExpandedBound(this.title) ? 'expanded' : '' - - return render('Expand/collapse', this) - } - } - }, - dataGroupIndex: function() { - return function(text, render) { - return this.groupIndex !== undefined && this.itemType == 'property' ? render('data-group-index={{groupIndex}}', this) : '' - } - - } - } - - var offset = this.$el.data('inspector-offset') - if (offset === undefined) - offset = 15 - - var offsetX = this.$el.data('inspector-offset-x'), - offsetY = this.$el.data('inspector-offset-y') - - var placement = this.$el.data('inspector-placement') - if (placement === undefined) - placement = 'bottom' - - var fallbackPlacement = this.$el.data('inspector-fallback-placement') - if (fallbackPlacement === undefined) - fallbackPlacement = 'bottom' - - this.$el.ocPopover({ - content: Mustache.render(this.getPopoverTemplate(), data), - highlightModalTarget: true, - modal: true, - placement: placement, - fallbackPlacement: fallbackPlacement, - containerClass: 'control-inspector', - container: this.$el.data('inspector-container'), - offset: offset, - offsetX: offsetX, - offsetY: offsetY, - width: 400 - }) - - this.$el.on('hiding.oc.popover', this.proxy(this.onBeforeHide)) - this.$el.on('hide.oc.popover', this.proxy(this.cleanup)) - this.$el.addClass('inspector-open') - - $(this.$el.data('oc.popover').$container).on('keydown', this.proxy(this.onPopoverKeyDown)) - - if (this.editors.length > 0) { - if (this.editors[0].focus !== undefined) - this.editors[0].focus() - } - - if (this.$el.closest('[data-inspector-external-parameters]').length > 0) - this.initExternalParameterEditor(this.$el.data('oc.popover').$container) - - for (var i=0, len = this.editors.length; i < len; i++) { - if (this.editors[i].init !== undefined) - this.editors[i].init() - } - - $('.with-tooltip', this.$el.data('oc.popover').$container) - .tooltip({ placement: 'auto right', container: 'body', delay: 500 }) - - var $container = this.$el.data('oc.popover').$container - $container.on('click', 'tr.group', this.proxy(this.onGroupClick)) - - var cssClass = this.options.inspectorCssClass - - if (cssClass !== undefined) - $container.addClass(cssClass) - } - - Inspector.prototype.onPopoverKeyDown = function(ev) { - if(ev.keyCode == 13) - $(ev.currentTarget).trigger('close.oc.popover') - } - - Inspector.prototype.onGroupClick = function(ev) { - var $container = this.$el.data('oc.popover').$container - this.toggleGroup($('a.expandControl', ev.target), $container) - - return false - } - - /* - * Initializes the external parameter editors for properties that support this feature. - */ - Inspector.prototype.initExternalParameterEditor = function($container) { - var self = this - - $('table.inspector-fields tr', $container).each(function(){ - if (!$(this).hasClass('no-external-parameter')) { - var property = $(this).data('property'), - $td = $('td', this), - $editorContainer = $('
'), - $editor = $( - '
\ -
\ - \ - \ - \ - \ -
\ -
') - - $editorContainer.append($td.children()) - $editorContainer.append($editor) - $td.append($editorContainer) - - var $editorLink = $('a', $editor) - - $editorLink - .click(function() { - return self.toggleExternalParameterEditor($(this)) - }) - .attr('title', 'Click to enter the external parameter name to load the property value from') - .tooltip({'container': 'body', delay: 500}) - - var $input = $editor.find('input'), - propertyValue = self.propertyValues[property] - - $input.on('focus', function(){ - var $field = $(this) - - $('td', $field.closest('table')).removeClass('active') - $field.closest('td').addClass('active') - }) - - $input.on('change', function(){ - self.markPropertyChanged(property, true) - }) - - var matches = [] - if (propertyValue) { - if (matches = propertyValue.match(/^\{\{([^\}]+)\}\}$/)) { - var value = $.trim(matches[1]) - - if (value.length > 0) { - self.showExternalParameterEditor($editorContainer, $editor, $editorLink, $td, true) - $editor.find('input').val(value) - self.writeProperty(property, null, true) - } - } - } - } - }) - } - - Inspector.prototype.showExternalParameterEditor = function($container, $editor, $editorLink, $cell, noAnimation) { - var position = $editor.position() - $('input', $editor).focus() - - if (!noAnimation) { - $editor.css({ - 'left': position.left + 'px', - 'right': 0 - }) - } else { - $editor.css('right', 0) - } - - setTimeout(function(){ - $editor.css('left', 0) - $cell.scrollTop(0) - }, 0) - - $container.addClass('editor-visible') - $editorLink.attr('data-original-title', 'Click to enter the property value') - this.toggleCellEditorVisibility($cell, false) - $editor.find('input').attr('tabindex', 0) - } - - Inspector.prototype.toggleExternalParameterEditor = function($editorLink) { - var $container = $editorLink.closest('.external-param-editor-container'), - $editor = $('.external-editor', $container), - $cell = $editorLink.closest('td'), - self = this - - $editorLink.tooltip('hide') - - if (!$container.hasClass('editor-visible')) { - self.showExternalParameterEditor($container, $editor, $editorLink, $cell) - } else { - var left = $container.width() - - $editor.css('left', left + 'px') - setTimeout(function(){ - $editor.css({ - 'left': 'auto', - 'right': '30px' - }) - $container.removeClass('editor-visible') - $container.closest('td').removeClass('active') - - var property = $container.closest('tr').data('property'), - propertyEditor = self.findEditor(property) - - if (propertyEditor && propertyEditor.onHideExternalParameterEditor !== undefined) - propertyEditor.onHideExternalParameterEditor() - }, 200) - $editorLink.attr('data-original-title', 'Click to enter the external parameter name to load the property value from') - $editor.find('input').attr('tabindex', -1) - self.toggleCellEditorVisibility($cell, true) - } - - return false - } - - Inspector.prototype.toggleCellEditorVisibility = function($cell, show) { - var $container = $('.external-param-editor-container', $cell) - - $container.children().each(function(){ - var $el = $(this) - - if ($el.hasClass('external-editor')) - return - - if (show) - $el.removeClass('hide') - else { - var height = $cell.data('inspector-cell-height') - - if (!height) { - height = $cell.height() - $cell.data('inspector-cell-height', height) - } - - $container.css('height', height + 'px') - $el.addClass('hide') - } - }) - } - - /* - * Creates group nodes in the property set - */ - Inspector.prototype.preprocessConfig = function() { - var fields = [], - result = { - hasGroups: false, - properties: [] - }, - groupIndex = 0 - - function findGroup(title) { - var groups = $.grep(fields, function(item) { - return item.itemType !== undefined && item.itemType == 'group' && item.title == title - }) - - if (groups.length > 0) - return groups[0] - - return null - } - - $.each(this.config, function() { - this.itemType = 'property' - - if (this.group === undefined) - fields.push(this) - else { - var group = findGroup(this.group) - - if (!group) { - group = { - itemType: 'group', - title: this.group, - properties: [], - groupIndex: groupIndex - } - - groupIndex++ - fields.push(group) - } - - this.groupIndex = group.groupIndex - group.properties.push(this) - } - }) - - $.each(fields, function() { - result.properties.push(this) - - if (this.itemType == 'group') { - result.hasGroups = true - - $.each(this.properties, function() { - result.properties.push(this) - }) - - delete this.properties - } - }) - - return result - } - - Inspector.prototype.toggleGroup = function(link, $container) { - var $link = $(link), - groupIndex = $link.data('group-index'), - propertyRows = $('tr[data-group-index='+groupIndex+']', $container), - duration = Math.round(100 / propertyRows.length), - collapse = true, - statuses = this.loadGroupExpandedStatuses(), - title = $('span.title-element', $link.closest('tr')).attr('title') - - if ($link.hasClass('expanded')) { - $link.removeClass('expanded') - statuses[title] = false - } else { - $link.addClass('expanded') - collapse = false - statuses[title] = true - } - - propertyRows.each(function(index){ - var self = $(this) - setTimeout(function(){ - self.toggleClass('collapsed', collapse) - self.toggleClass('expanded', !collapse) - }, index*duration) - - }) - - this.writeGroupExpandedStatuses(statuses) - } - - Inspector.prototype.loadGroupExpandedStatuses = function() { - var statuses = this.$el.data('inspector-group-statuses') - - return statuses !== undefined ? JSON.parse(statuses) : {} - } - - Inspector.prototype.writeGroupExpandedStatuses = function(statuses) { - this.$el.data('inspector-group-statuses', JSON.stringify(statuses)) - } - - Inspector.prototype.groupExpanded = function(title) { - var statuses = this.loadGroupExpandedStatuses() - - if (statuses[title] !== undefined) - return statuses[title] - - return false - } - - Inspector.prototype.normalizePropertyCode = function(code) { - var lowerCaseCode = code.toLowerCase() - - for (var index in this.config) { - var propertyInfo = this.config[index] - - if (propertyInfo.property.toLowerCase() == lowerCaseCode) - return propertyInfo.property - } - - return code - } - - Inspector.prototype.initProperties = function() { - if (!this.propertyValuesField.length) { - // Load property valies from data-property-xxx attributes - var properties = {}, - attributes = this.$el.get(0).attributes - - for (var i=0, len = attributes.length; i < len; i++) { - var attribute = attributes[i], - matches = [] - - if (matches = attribute.name.match(/^data-property-(.*)$/)) { - properties[this.normalizePropertyCode(matches[1])] = attribute.value - } - } - - this.propertyValues = properties - } else { - // Load property values from the hidden input - var propertyValuesStr = $.trim(this.propertyValuesField.val()) - this.propertyValues = propertyValuesStr.length === 0 ? {} : $.parseJSON(propertyValuesStr) - } - - try { - this.originalPropertyValues = $.extend(true, {}, this.propertyValues) - } catch(err) { - throw new Error('Error parsing the Inspector property values string. ' + err) - } - } - - Inspector.prototype.readProperty = function(property, returnUndefined) { - if (this.propertyValues[property] !== undefined) - return this.propertyValues[property] - - return returnUndefined ? undefined : null - } - - Inspector.prototype.getDefaultValue = function(property) { - for (var index in this.config) { - var propertyInfo = this.config[index] - - if (propertyInfo.itemType !== 'property') - continue - - if (propertyInfo.property == property) - return propertyInfo.default - } - - return undefined - } - - Inspector.prototype.writeProperty = function(property, value, noChangedStatusUpdate) { - this.propertyValues[property] = value - - if (this.propertyValuesField.length) - this.propertyValuesField.val(JSON.stringify(this.propertyValues)) - else { - var self = this - - $.each(this.propertyValues, function(propertyName) { - self.$el.attr('data-property-' + propertyName, this) - }) - } - - if (this.originalPropertyValues[property] === undefined || this.originalPropertyValues[property] != value) { - if (!noChangedStatusUpdate) { - this.$el.trigger('change') - this.markPropertyChanged(property, true) - } - } else { - if (!noChangedStatusUpdate) - this.markPropertyChanged(property, false) - } - - if (!noChangedStatusUpdate) - this.$el.trigger('propertyChanged.oc.Inspector', [property]) - - return value - } - - Inspector.prototype.markPropertyChanged = function(property, changed) { - $('#prop-'+property.replace('.', '-'), this.$el.data('oc.popover').$container).toggleClass('changed', changed) - } - - Inspector.prototype.renderEditor = function(data, render) { - $.oc.inspector.propertyCounter ++ - - var editorClass = 'inspectorEditor' - + data.type.charAt(0).toUpperCase() - + data.type.slice(1), - editorId = 'inspector-property-'+data.type+$.oc.inspector.propertyCounter - - if ($.oc.inspector.editors[editorClass] === undefined) - throw new Error('The Inspector editor class "' + editorClass + - '" is not defined in the $.oc.inspector.editors namespace.') - - var editor = new $.oc.inspector.editors[editorClass](editorId, this, data) - this.editors.push(editor) - editor.inspectorCellId = editorId - - return editor.renderEditor() - } - - Inspector.prototype.cleanup = function() { - this.$el.off('hiding.oc.popover') - this.$el.off('hide.oc.popover') - this.$el.off('.oc.Inspector') - this.$el.removeClass('inspector-open') - - var e = $.Event('hidden.oc.inspector') - this.$el.trigger(e) - - this.$el.data('oc.inspectorVisible', false) - - this.dispose() - } - - Inspector.prototype.dispose = function() { - for (var i=0, len=this.editors.length; i', data) - } - - InspectorEditorString.prototype.validate = function() { - var val = $.trim($(this.selector).val()) - - if (this.fieldDef.required && val.length === 0) - return this.fieldDef.validationMessage || 'Required fields were left blank.' - - if (this.fieldDef.validationPattern === undefined) - return - - var re = new RegExp(this.fieldDef.validationPattern, 'm') - - if (!val.match(re)) - return this.fieldDef.validationMessage - } - - InspectorEditorString.prototype.focus = function() { - $(this.selector).focus() - $(this.selector).closest('td').scrollLeft(0) - } - - $.oc.inspector.editors.inspectorEditorString = InspectorEditorString; - - // CHECKBOX EDITOR - // ================== - - var InspectorEditorCheckbox = function(editorId, inspector, fieldDef) { - this.inspector = inspector - this.fieldDef = fieldDef - this.editorId = editorId - this.selector = '#'+this.editorId+' input' - - Base.call(this) - - $(document).on('change', this.selector, this.proxy(this.applyValue)) - } - - InspectorEditorCheckbox.prototype = Object.create(BaseProto) - InspectorEditorCheckbox.prototype.constructor = InspectorEditorCheckbox - - InspectorEditorCheckbox.prototype.dispose = function() { - $(document).off('change', this.selector, this.proxy(this.applyValue)) - - this.inspector = null - this.fieldDef = null - this.editorId = null - this.selector = null - - BaseProto.dispose.call(this) - } - - InspectorEditorCheckbox.prototype.applyValue = function() { - this.inspector.writeProperty(this.fieldDef.property, $(this.selector).get(0).checked ? 1 : 0 ) - } - - InspectorEditorCheckbox.prototype.renderEditor = function() { - var self = this, - data = { - id: this.editorId, - cbId: this.editorId + '-cb', - title: this.fieldDef.title - } - - return Mustache.render(this.getTemplate(), data) - } - - InspectorEditorCheckbox.prototype.init = function() { - var isChecked = this.inspector.readProperty(this.fieldDef.property, true) - - if (isChecked === undefined) { - if (this.fieldDef.default !== undefined) { - isChecked = this.normalizeCheckedValue(this.fieldDef.default) - } - } else { - isChecked = this.normalizeCheckedValue(isChecked) - } - - $(this.selector).prop('checked', isChecked) - } - - InspectorEditorCheckbox.prototype.normalizeCheckedValue = function(value) { - if (value == '0' || value == 'false') - return false - - return value - } - - InspectorEditorCheckbox.prototype.focus = function() { - $(this.selector).closest('div').focus() - } - - InspectorEditorCheckbox.prototype.getTemplate = function() { - return ' \ - \ -
\ - \ - \ -
\ - \ - '; - } - - $.oc.inspector.editors.inspectorEditorCheckbox = InspectorEditorCheckbox; - - // DROPDOWN EDITOR - // ================== - - var InspectorEditorDropdown = function(editorId, inspector, fieldDef) { - this.inspector = inspector - this.fieldDef = fieldDef - this.editorId = editorId - this.selector = '#'+this.editorId+' select' - this.dynamicOptions = this.fieldDef.options ? false : true - this.initialization = false - - Base.call(this) - - $(document).on('change', this.selector, this.proxy(this.applyValue)) - } - - InspectorEditorDropdown.prototype = Object.create(BaseProto) - InspectorEditorDropdown.prototype.constructor = InspectorEditorDropdown - - InspectorEditorDropdown.prototype.dispose = function() { - $(document).off('change', this.selector, this.proxy(this.applyValue)) - - $(this.selector).select2('destroy') - - this.inspector = null - this.fieldDef = null - this.editorId = null - this.selector = null - - BaseProto.dispose.call(this) - } - - InspectorEditorDropdown.prototype.applyValue = function() { - this.inspector.writeProperty(this.fieldDef.property, $(this.selector).val(), this.initialization) - } - - InspectorEditorDropdown.prototype.renderEditor = function() { - var - self = this, - data = { - id: this.editorId, - value: $.trim(this.inspector.readProperty(this.fieldDef.property)), - selectId: this.editorId + '-select', - defaultOption: function() { - return function(text, render) { - if (self.fieldDef.placeholder == undefined) - return '' - - if (!Modernizr.touch) - return '' - } - } - } - - if (this.fieldDef.options) { - var options = [] - - if (this.fieldDef.placeholder !== undefined && Modernizr.touch) - options.push({value: null, title: this.fieldDef.placeholder}) - - $.each(this.fieldDef.options, function(value, title){ - options.push({value: value, title: title}) - }) - - data.options = options - } - - return Mustache.render(this.getTemplate(), data) - } - - InspectorEditorDropdown.prototype.getTemplate = function() { - return ' \ - \ - \ - \ - '; - } - - InspectorEditorDropdown.prototype.init = function() { - var value = this.inspector.readProperty(this.fieldDef.property, true) - - if (value === undefined) - value = this.inspector.getDefaultValue(this.fieldDef.property) - - $(this.selector).attr('data-no-auto-update-on-render', 'true') - - $(this.selector).val(value) - - if (!Modernizr.touch) { - var options = { - dropdownCssClass: 'ocInspectorDropdown' - } - - if (this.fieldDef.placeholder !== undefined) - options.placeholder = this.fieldDef.placeholder - - $(this.selector).select2(options) - } - - if (this.dynamicOptions) { - if (!Modernizr.touch) { - this.indicatorContainer = $('.select2-container', $(this.selector).closest('td')) - this.indicatorContainer.addClass('loading-indicator-container').addClass('size-small') - } - - this.loadOptions(true) - } - - if (this.fieldDef.depends) - this.inspector.$el.on('propertyChanged.oc.Inspector', $.proxy(this.onDependencyChanged, this)) - } - - InspectorEditorDropdown.prototype.onDependencyChanged = function(ev, property) { - if ($.inArray(property, this.fieldDef.depends) === -1) - return - - var self = this, - dependencyValues = this.getDependencyValues() - - if (this.prevDependencyValues === undefined || this.prevDependencyValues != dependencyValues) - this.loadOptions() - } - - InspectorEditorDropdown.prototype.saveDependencyValues = function() { - this.prevDependencyValues = this.getDependencyValues() - } - - InspectorEditorDropdown.prototype.getDependencyValues = function() { - var dependencyValues = '', - self = this - - $.each(this.fieldDef.depends, function(index, masterProperty){ - dependencyValues += masterProperty + ':' + self.inspector.readProperty(masterProperty) + '-' - }) - - return dependencyValues - } - - InspectorEditorDropdown.prototype.showLoadingIndicator = function() { - if (!Modernizr.touch) - this.indicatorContainer.loadIndicator() - } - - InspectorEditorDropdown.prototype.hideLoadingIndicator = function() { - if (!Modernizr.touch) - this.indicatorContainer.loadIndicator('hide') - } - - InspectorEditorDropdown.prototype.loadOptions = function(initialization) { - var $form = $(this.selector).closest('form'), - data = this.inspector.propertyValues, - $select = $(this.selector), - currentValue = this.inspector.readProperty(this.fieldDef.property, true), - self = this - - if (currentValue === undefined) - currentValue = this.inspector.getDefaultValue(this.fieldDef.property) - - for (var index in this.inspector.config) { - var propertyInfo = this.inspector.config[index] - - if (propertyInfo.itemType == 'property') { - if (data[propertyInfo.property] === undefined) - data[propertyInfo.property] = this.inspector.getDefaultValue(propertyInfo.property) - } - } - - if (this.fieldDef.depends) - this.saveDependencyValues() - - data.inspectorProperty = this.fieldDef.property - data.inspectorClassName = this.inspector.options.inspectorClass - - this.showLoadingIndicator() - - $form.request('onInspectableGetOptions', { - data: data, - success: function(data) { - $('option', $select).remove() - - if (self.fieldDef.placeholder !== undefined) - $select.append($('')) - - if (data.options) - $.each(data.options, function(key, obj) { - $select.append($('').attr('value', obj.value).text(obj.title)) - }) - - var hasOption = $('option[value="' + currentValue + '"]', $select).length > 0 - if (hasOption) - $select.val(currentValue) - else - $('option:first-child', $select).attr("selected", "selected"); - - self.initialization = initialization - $select.trigger('change') - self.initialization = false - - self.hideLoadingIndicator() - }, - error: function(jqXHR, textStatus, errorThrown) { - alert(jqXHR.responseText.length ? jqXHR.responseText : jqXHR.statusText) - self.hideLoadingIndicator() - } - }) - } - - InspectorEditorDropdown.prototype.onHideExternalParameterEditor = function() { - this.loadOptions(false) - } - - $.oc.inspector.editors.inspectorEditorDropdown = InspectorEditorDropdown; - - // INSPECTOR PLUGIN DEFINITION - // ============================ - - function initInspector($element) { - // For now the inspector configuration is not retained in the element's data, - // fix later (see #83) -ab Apr 27 2015 - var inspector = $element.data('oc.inspector') - - if (inspector === undefined) { - inspector = new Inspector($element.get(0), $element.data()) - - inspector.loadConfiguration(function(){ - inspector.init() - }) - - $element.data('oc.inspector', inspector) - } - // else - // inspector.init() - } - - $.fn.inspector = function (option) { - return this.each(function () { - initInspector($(this)) - }) - } - - // INSPECTOR DATA-API - // ================== - - $(document).on('click', '[data-inspectable]', function(){ - var $this = $(this) - - if ($this.data('oc.inspectorVisible')) - return false - - initInspector($this) - - return false - }) -}(window.jQuery); diff --git a/modules/backend/assets/js/october.js b/modules/backend/assets/js/october.js index 987d63f1f..2b137272e 100644 --- a/modules/backend/assets/js/october.js +++ b/modules/backend/assets/js/october.js @@ -9,6 +9,7 @@ =require ../../../system/assets/ui/js/foundation.js =require ../../../system/assets/ui/js/flashmessage.js +=require ../../../system/assets/ui/js/inspector.js =require ../../../system/assets/ui/js/dropdown.js =require ../../../system/assets/ui/js/tooltip.js =require ../../../system/assets/ui/js/loader.js @@ -36,7 +37,6 @@ =require october.sidepaneltab.js =require october.simplelist.js =require october.sortable.js -=require october.inspector.js =require october.changemonitor.js =require october.chartutils.js =require october.chartpie.js diff --git a/modules/backend/assets/less/core/flags.less b/modules/backend/assets/less/core/flags.less deleted file mode 100644 index 19c44a983..000000000 --- a/modules/backend/assets/less/core/flags.less +++ /dev/null @@ -1,270 +0,0 @@ - -[class^="flag-"], -[class*=" flag-"] { - .img-retina('../images/flag-icons-small.png', '../images/flag-icons-large.png', 16px, 3952px); - width: 16px; - height: 16px; - line-height: 16px; - vertical-align: middle; - display: inline-block; - margin: -3px 2px 0 2px; -} - -.flag-AfricanUnion { background-position:0 -16px } -.flag-ArabLeague { background-position:0 -32px } -.flag-ASEAN { background-position:0 -48px } -.flag-CARICOM { background-position:0 -64px } -.flag-CIS { background-position:0 -80px } -.flag-Commonwealth { background-position:0 -96px } -.flag-England { background-position:0 -112px } -.flag-European_Union { background-position:0 -128px } -.flag-Islamic_Conference { background-position:0 -144px } -.flag-Kosovo { background-position:0 -160px } -.flag-NATO { background-position:0 -176px } -.flag-NorthernCyprus { background-position:0 -192px } -.flag-NorthernIreland { background-position:0 -208px } -.flag-OlimpicMovement { background-position:0 -224px } -.flag-OPEC { background-position:0 -240px } -.flag-RedCross { background-position:0 -256px } -.flag-Scotland { background-position:0 -272px } -.flag-Somaliland { background-position:0 -288px } -.flag-Tibet { background-position:0 -304px } -.flag-United_Nations { background-position:0 -320px } -.flag-Wales { background-position:0 -336px } - -.flag-eu { background-position:0 -128px } -.flag-ad { background-position:0 -352px } -.flag-ae { background-position:0 -368px } -.flag-af { background-position:0 -384px } -.flag-ag { background-position:0 -400px } -.flag-ai { background-position:0 -416px } -.flag-al { background-position:0 -432px } -.flag-am { background-position:0 -448px } -.flag-ao { background-position:0 -464px } -.flag-aq { background-position:0 -480px } -.flag-ar { background-position:0 -496px } -.flag-as { background-position:0 -512px } -.flag-at { background-position:0 -528px } -.flag-au { background-position:0 -544px } -.flag-aw { background-position:0 -560px } -.flag-ax { background-position:0 -576px } -.flag-az { background-position:0 -592px } -.flag-ba { background-position:0 -608px } -.flag-bb { background-position:0 -624px } -.flag-bd { background-position:0 -640px } -.flag-be { background-position:0 -656px } -.flag-bf { background-position:0 -672px } -.flag-bg { background-position:0 -688px } -.flag-bh { background-position:0 -704px } -.flag-bi { background-position:0 -720px } -.flag-bj { background-position:0 -736px } -.flag-bm { background-position:0 -752px } -.flag-bn { background-position:0 -768px } -.flag-bo { background-position:0 -784px } -.flag-br { background-position:0 -800px } -.flag-bs { background-position:0 -816px } -.flag-bt { background-position:0 -832px } -.flag-bw { background-position:0 -848px } -.flag-by { background-position:0 -864px } -.flag-bz { background-position:0 -880px } -.flag-ca { background-position:0 -896px } -.flag-cg { background-position:0 -912px } -.flag-cf { background-position:0 -928px } -.flag-cd { background-position:0 -944px } -.flag-ch { background-position:0 -960px } -.flag-ci { background-position:0 -976px } -.flag-ck { background-position:0 -992px } -.flag-cl { background-position:0 -1008px } -.flag-cm { background-position:0 -1024px } -.flag-cn { background-position:0 -1040px } -.flag-co { background-position:0 -1056px } -.flag-cr { background-position:0 -1072px } -.flag-cu { background-position:0 -1088px } -.flag-cv { background-position:0 -1104px } -.flag-cy { background-position:0 -1120px } -.flag-cz { background-position:0 -1136px } -.flag-de { background-position:0 -1152px } -.flag-dj { background-position:0 -1168px } -.flag-dk { background-position:0 -1184px } -.flag-dm { background-position:0 -1200px } -.flag-do { background-position:0 -1216px } -.flag-dz { background-position:0 -1232px } -.flag-ec { background-position:0 -1248px } -.flag-ee { background-position:0 -1264px } -.flag-eg { background-position:0 -1280px } -.flag-eh { background-position:0 -1296px } -.flag-er { background-position:0 -1312px } -.flag-es { background-position:0 -1328px } -.flag-et { background-position:0 -1344px } -.flag-fi { background-position:0 -1360px } -.flag-fj { background-position:0 -1376px } -.flag-fm { background-position:0 -1392px } -.flag-fo { background-position:0 -1408px } -.flag-fr { background-position:0 -1424px } -.flag-bl { background-position:0 -1424px } -.flag-cp { background-position:0 -1424px } -.flag-mf { background-position:0 -1424px } -.flag-yt { background-position:0 -1424px } -.flag-ga { background-position:0 -1440px } -.flag-gb { background-position:0 -1456px } -.flag-sh { background-position:0 -1456px } -.flag-gd { background-position:0 -1472px } -.flag-ge { background-position:0 -1488px } -.flag-gg { background-position:0 -1504px } -.flag-gh { background-position:0 -1520px } -.flag-gi { background-position:0 -1536px } -.flag-gl { background-position:0 -1552px } -.flag-gm { background-position:0 -1568px } -.flag-gn { background-position:0 -1584px } -.flag-gp { background-position:0 -1600px } -.flag-gq { background-position:0 -1616px } -.flag-gr { background-position:0 -1632px } -.flag-gt { background-position:0 -1648px } -.flag-gu { background-position:0 -1664px } -.flag-gw { background-position:0 -1680px } -.flag-gy { background-position:0 -1696px } -.flag-hk { background-position:0 -1712px } -.flag-hn { background-position:0 -1728px } -.flag-hr { background-position:0 -1744px } -.flag-ht { background-position:0 -1760px } -.flag-hu { background-position:0 -1776px } -.flag-id { background-position:0 -1792px } -.flag-mc { background-position:0 -1792px } -.flag-ie { background-position:0 -1808px } -.flag-il { background-position:0 -1824px } -.flag-im { background-position:0 -1840px } -.flag-in { background-position:0 -1856px } -.flag-iq { background-position:0 -1872px } -.flag-ir { background-position:0 -1888px } -.flag-is { background-position:0 -1904px } -.flag-it { background-position:0 -1920px } -.flag-je { background-position:0 -1936px } -.flag-jm { background-position:0 -1952px } -.flag-jo { background-position:0 -1968px } -.flag-jp { background-position:0 -1984px } -.flag-ke { background-position:0 -2000px } -.flag-kg { background-position:0 -2016px } -.flag-kh { background-position:0 -2032px } -.flag-ki { background-position:0 -2048px } -.flag-km { background-position:0 -2064px } -.flag-kn { background-position:0 -2080px } -.flag-kp { background-position:0 -2096px } -.flag-kr { background-position:0 -2112px } -.flag-kw { background-position:0 -2128px } -.flag-ky { background-position:0 -2144px } -.flag-kz { background-position:0 -2160px } -.flag-la { background-position:0 -2176px } -.flag-lb { background-position:0 -2192px } -.flag-lc { background-position:0 -2208px } -.flag-li { background-position:0 -2224px } -.flag-lk { background-position:0 -2240px } -.flag-lr { background-position:0 -2256px } -.flag-ls { background-position:0 -2272px } -.flag-lt { background-position:0 -2288px } -.flag-lu { background-position:0 -2304px } -.flag-lv { background-position:0 -2320px } -.flag-ly { background-position:0 -2336px } -.flag-ma { background-position:0 -2352px } -.flag-md { background-position:0 -2368px } -.flag-me { background-position:0 -2384px } -.flag-mg { background-position:0 -2400px } -.flag-mh { background-position:0 -2416px } -.flag-mk { background-position:0 -2432px } -.flag-ml { background-position:0 -2448px } -.flag-mm { background-position:0 -2464px } -.flag-mn { background-position:0 -2480px } -.flag-mo { background-position:0 -2496px } -.flag-mq { background-position:0 -2512px } -.flag-mr { background-position:0 -2528px } -.flag-ms { background-position:0 -2544px } -.flag-mt { background-position:0 -2560px } -.flag-mu { background-position:0 -2576px } -.flag-mv { background-position:0 -2592px } -.flag-mw { background-position:0 -2608px } -.flag-mx { background-position:0 -2624px } -.flag-my { background-position:0 -2640px } -.flag-mz { background-position:0 -2656px } -.flag-na { background-position:0 -2672px } -.flag-nc { background-position:0 -2688px } -.flag-ne { background-position:0 -2704px } -.flag-ng { background-position:0 -2720px } -.flag-ni { background-position:0 -2736px } -.flag-nl { background-position:0 -2752px } -.flag-bq { background-position:0 -2752px } -.flag-no { background-position:0 -2768px } -.flag-bv { background-position:0 -2768px } -.flag-nq { background-position:0 -2768px } -.flag-sj { background-position:0 -2768px } -.flag-np { background-position:0 -2784px } -.flag-nr { background-position:0 -2800px } -.flag-nz { background-position:0 -2816px } -.flag-om { background-position:0 -2832px } -.flag-pa { background-position:0 -2848px } -.flag-pe { background-position:0 -2864px } -.flag-pf { background-position:0 -2880px } -.flag-pg { background-position:0 -2896px } -.flag-ph { background-position:0 -2912px } -.flag-pk { background-position:0 -2928px } -.flag-pl { background-position:0 -2944px } -.flag-pr { background-position:0 -2960px } -.flag-ps { background-position:0 -2976px } -.flag-pt { background-position:0 -2992px } -.flag-pw { background-position:0 -3008px } -.flag-py { background-position:0 -3024px } -.flag-qa { background-position:0 -3040px } -.flag-re { background-position:0 -3056px } -.flag-ro { background-position:0 -3072px } -.flag-rs { background-position:0 -3088px } -.flag-ru { background-position:0 -3104px } -.flag-rw { background-position:0 -3120px } -.flag-sa { background-position:0 -3136px } -.flag-sb { background-position:0 -3152px } -.flag-sc { background-position:0 -3168px } -.flag-sd { background-position:0 -3184px } -.flag-se { background-position:0 -3200px } -.flag-sg { background-position:0 -3216px } -.flag-si { background-position:0 -3232px } -.flag-sk { background-position:0 -3248px } -.flag-sl { background-position:0 -3264px } -.flag-sm { background-position:0 -3280px } -.flag-sn { background-position:0 -3296px } -.flag-so { background-position:0 -3312px } -.flag-sr { background-position:0 -3328px } -.flag-st { background-position:0 -3344px } -.flag-sv { background-position:0 -3360px } -.flag-sy { background-position:0 -3376px } -.flag-sz { background-position:0 -3392px } -.flag-tc { background-position:0 -3408px } -.flag-td { background-position:0 -3424px } -.flag-tg { background-position:0 -3440px } -.flag-th { background-position:0 -3456px } -.flag-tj { background-position:0 -3472px } -.flag-tl { background-position:0 -3488px } -.flag-tm { background-position:0 -3504px } -.flag-tn { background-position:0 -3520px } -.flag-to { background-position:0 -3536px } -.flag-tr { background-position:0 -3552px } -.flag-tt { background-position:0 -3568px } -.flag-tv { background-position:0 -3584px } -.flag-tw { background-position:0 -3600px } -.flag-tz { background-position:0 -3616px } -.flag-ua { background-position:0 -3632px } -.flag-ug { background-position:0 -3648px } -.flag-us { background-position:0 -3664px } -.flag-uy { background-position:0 -3680px } -.flag-uz { background-position:0 -3696px } -.flag-va { background-position:0 -3712px } -.flag-vc { background-position:0 -3728px } -.flag-ve { background-position:0 -3744px } -.flag-vg { background-position:0 -3760px } -.flag-vi { background-position:0 -3776px } -.flag-vn { background-position:0 -3792px } -.flag-vu { background-position:0 -3808px } -.flag-ws { background-position:0 -3824px } -.flag-ye { background-position:0 -3840px } -.flag-za { background-position:0 -3856px } -.flag-zm { background-position:0 -3872px } -.flag-zw { background-position:0 -3888px } -.flag-sx { background-position:0 -3904px } -.flag-cw { background-position:0 -3920px } -.flag-ss { background-position:0 -3936px } diff --git a/modules/backend/assets/less/core/icons.less b/modules/backend/assets/less/core/icons.less deleted file mode 100644 index 7ca3e1973..000000000 --- a/modules/backend/assets/less/core/icons.less +++ /dev/null @@ -1,604 +0,0 @@ -[class^="oc-icon-"], -[class*=" oc-icon-"] { - &:before { - display: inline-block; - margin-right: 8px; - .icon-FontAutumn(); - vertical-align: baseline; - } - &.empty:before {margin-right: 0;} -} - -.oc-icon-glass:before { content: @glass; } -.oc-icon-music:before { content: @music; } -.oc-icon-search:before { content: @search; } -.oc-icon-envelope-o:before { content: @envelope-o; } -.oc-icon-heart:before { content: @heart; } -.oc-icon-star:before { content: @star; } -.oc-icon-star-o:before { content: @star-o; } -.oc-icon-user:before { content: @user; } -.oc-icon-film:before { content: @film; } -.oc-icon-th-large:before { content: @th-large; } -.oc-icon-th:before { content: @th; } -.oc-icon-th-list:before { content: @th-list; } -.oc-icon-check:before { content: @check; } -.oc-icon-remove:before, -.oc-icon-close:before, -.oc-icon-times:before { content: @times; } -.oc-icon-search-plus:before { content: @search-plus; } -.oc-icon-search-minus:before { content: @search-minus; } -.oc-icon-power-off:before { content: @power-off; } -.oc-icon-signal:before { content: @signal; } -.oc-icon-gear:before, -.oc-icon-cog:before { content: @cog; } -.oc-icon-trash-o:before { content: @trash-o; } -.oc-icon-home:before { content: @home; } -.oc-icon-file-o:before { content: @file-o; } -.oc-icon-clock-o:before { content: @clock-o; } -.oc-icon-road:before { content: @road; } -.oc-icon-download:before { content: @download; } -.oc-icon-arrow-circle-o-down:before { content: @arrow-circle-o-down; } -.oc-icon-arrow-circle-o-up:before { content: @arrow-circle-o-up; } -.oc-icon-inbox:before { content: @inbox; } -.oc-icon-play-circle-o:before { content: @play-circle-o; } -.oc-icon-rotate-right:before, -.oc-icon-repeat:before { content: @repeat; } -.oc-icon-refresh:before { content: @refresh; } -.oc-icon-list-alt:before { content: @list-alt; } -.oc-icon-lock:before { content: @lock; } -.oc-icon-flag:before { content: @flag; } -.oc-icon-headphones:before { content: @headphones; } -.oc-icon-volume-off:before { content: @volume-off; } -.oc-icon-volume-down:before { content: @volume-down; } -.oc-icon-volume-up:before { content: @volume-up; } -.oc-icon-qrcode:before { content: @qrcode; } -.oc-icon-barcode:before { content: @barcode; } -.oc-icon-tag:before { content: @tag; } -.oc-icon-tags:before { content: @tags; } -.oc-icon-book:before { content: @book; } -.oc-icon-bookmark:before { content: @bookmark; } -.oc-icon-print:before { content: @print; } -.oc-icon-camera:before { content: @camera; } -.oc-icon-font:before { content: @font; } -.oc-icon-bold:before { content: @bold; } -.oc-icon-italic:before { content: @italic; } -.oc-icon-text-height:before { content: @text-height; } -.oc-icon-text-width:before { content: @text-width; } -.oc-icon-align-left:before { content: @align-left; } -.oc-icon-align-center:before { content: @align-center; } -.oc-icon-align-right:before { content: @align-right; } -.oc-icon-align-justify:before { content: @align-justify; } -.oc-icon-list:before { content: @list; } -.oc-icon-dedent:before, -.oc-icon-outdent:before { content: @outdent; } -.oc-icon-indent:before { content: @indent; } -.oc-icon-video-camera:before { content: @video-camera; } -.oc-icon-photo:before, -.oc-icon-image:before, -.oc-icon-picture-o:before { content: @picture-o; } -.oc-icon-pencil:before { content: @pencil; } -.oc-icon-map-marker:before { content: @map-marker; } -.oc-icon-adjust:before { content: @adjust; } -.oc-icon-tint:before { content: @tint; } -.oc-icon-edit:before, -.oc-icon-pencil-square-o:before { content: @pencil-square-o; } -.oc-icon-share-square-o:before { content: @share-square-o; } -.oc-icon-check-square-o:before { content: @check-square-o; } -.oc-icon-arrows:before { content: @arrows; } -.oc-icon-step-backward:before { content: @step-backward; } -.oc-icon-fast-backward:before { content: @fast-backward; } -.oc-icon-backward:before { content: @backward; } -.oc-icon-play:before { content: @play; } -.oc-icon-pause:before { content: @pause; } -.oc-icon-stop:before { content: @stop; } -.oc-icon-forward:before { content: @forward; } -.oc-icon-fast-forward:before { content: @fast-forward; } -.oc-icon-step-forward:before { content: @step-forward; } -.oc-icon-eject:before { content: @eject; } -.oc-icon-chevron-left:before { content: @chevron-left; } -.oc-icon-chevron-right:before { content: @chevron-right; } -.oc-icon-plus-circle:before { content: @plus-circle; } -.oc-icon-minus-circle:before { content: @minus-circle; } -.oc-icon-times-circle:before { content: @times-circle; } -.oc-icon-check-circle:before { content: @check-circle; } -.oc-icon-question-circle:before { content: @question-circle; } -.oc-icon-info-circle:before { content: @info-circle; } -.oc-icon-crosshairs:before { content: @crosshairs; } -.oc-icon-times-circle-o:before { content: @times-circle-o; } -.oc-icon-check-circle-o:before { content: @check-circle-o; } -.oc-icon-ban:before { content: @ban; } -.oc-icon-arrow-left:before { content: @arrow-left; } -.oc-icon-arrow-right:before { content: @arrow-right; } -.oc-icon-arrow-up:before { content: @arrow-up; } -.oc-icon-arrow-down:before { content: @arrow-down; } -.oc-icon-mail-forward:before, -.oc-icon-share:before { content: @share; } -.oc-icon-expand:before { content: @expand; } -.oc-icon-compress:before { content: @compress; } -.oc-icon-plus:before { content: @plus; } -.oc-icon-minus:before { content: @minus; } -.oc-icon-asterisk:before { content: @asterisk; } -.oc-icon-exclamation-circle:before { content: @exclamation-circle; } -.oc-icon-gift:before { content: @gift; } -.oc-icon-leaf:before { content: @leaf; } -.oc-icon-fire:before { content: @fire; } -.oc-icon-eye:before { content: @eye; } -.oc-icon-eye-slash:before { content: @eye-slash; } -.oc-icon-warning:before, -.oc-icon-exclamation-triangle:before { content: @exclamation-triangle; } -.oc-icon-plane:before { content: @plane; } -.oc-icon-calendar:before { content: @calendar; } -.oc-icon-random:before { content: @random; } -.oc-icon-comment:before { content: @comment; } -.oc-icon-magnet:before { content: @magnet; } -.oc-icon-chevron-up:before { content: @chevron-up; } -.oc-icon-chevron-down:before { content: @chevron-down; } -.oc-icon-retweet:before { content: @retweet; } -.oc-icon-shopping-cart:before { content: @shopping-cart; } -.oc-icon-folder:before { content: @folder; } -.oc-icon-folder-open:before { content: @folder-open; } -.oc-icon-arrows-v:before { content: @arrows-v; } -.oc-icon-arrows-h:before { content: @arrows-h; } -.oc-icon-bar-chart-o:before, -.oc-icon-bar-chart:before { content: @bar-chart; } -.oc-icon-twitter-square:before { content: @twitter-square; } -.oc-icon-facebook-square:before { content: @facebook-square; } -.oc-icon-camera-retro:before { content: @camera-retro; } -.oc-icon-key:before { content: @key; } -.oc-icon-gears:before, -.oc-icon-cogs:before { content: @cogs; } -.oc-icon-comments:before { content: @comments; } -.oc-icon-thumbs-o-up:before { content: @thumbs-o-up; } -.oc-icon-thumbs-o-down:before { content: @thumbs-o-down; } -.oc-icon-star-half:before { content: @star-half; } -.oc-icon-heart-o:before { content: @heart-o; } -.oc-icon-sign-out:before { content: @sign-out; } -.oc-icon-linkedin-square:before { content: @linkedin-square; } -.oc-icon-thumb-tack:before { content: @thumb-tack; } -.oc-icon-external-link:before { content: @external-link; } -.oc-icon-sign-in:before { content: @sign-in; } -.oc-icon-trophy:before { content: @trophy; } -.oc-icon-github-square:before { content: @github-square; } -.oc-icon-upload:before { content: @upload; } -.oc-icon-lemon-o:before { content: @lemon-o; } -.oc-icon-phone:before { content: @phone; } -.oc-icon-square-o:before { content: @square-o; } -.oc-icon-bookmark-o:before { content: @bookmark-o; } -.oc-icon-phone-square:before { content: @phone-square; } -.oc-icon-twitter:before { content: @twitter; } -.oc-icon-facebook-f:before, -.oc-icon-facebook:before { content: @facebook; } -.oc-icon-github:before { content: @github; } -.oc-icon-unlock:before { content: @unlock; } -.oc-icon-credit-card:before { content: @credit-card; } -.oc-icon-rss:before { content: @rss; } -.oc-icon-hdd-o:before { content: @hdd-o; } -.oc-icon-bullhorn:before { content: @bullhorn; } -.oc-icon-bell:before { content: @bell; } -.oc-icon-certificate:before { content: @certificate; } -.oc-icon-hand-o-right:before { content: @hand-o-right; } -.oc-icon-hand-o-left:before { content: @hand-o-left; } -.oc-icon-hand-o-up:before { content: @hand-o-up; } -.oc-icon-hand-o-down:before { content: @hand-o-down; } -.oc-icon-arrow-circle-left:before { content: @arrow-circle-left; } -.oc-icon-arrow-circle-right:before { content: @arrow-circle-right; } -.oc-icon-arrow-circle-up:before { content: @arrow-circle-up; } -.oc-icon-arrow-circle-down:before { content: @arrow-circle-down; } -.oc-icon-globe:before { content: @globe; } -.oc-icon-wrench:before { content: @wrench; } -.oc-icon-tasks:before { content: @tasks; } -.oc-icon-filter:before { content: @filter; } -.oc-icon-briefcase:before { content: @briefcase; } -.oc-icon-arrows-alt:before { content: @arrows-alt; } -.oc-icon-group:before, -.oc-icon-users:before { content: @users; } -.oc-icon-chain:before, -.oc-icon-link:before { content: @link; } -.oc-icon-cloud:before { content: @cloud; } -.oc-icon-flask:before { content: @flask; } -.oc-icon-cut:before, -.oc-icon-scissors:before { content: @scissors; } -.oc-icon-copy:before, -.oc-icon-files-o:before { content: @files-o; } -.oc-icon-paperclip:before { content: @paperclip; } -.oc-icon-save:before, -.oc-icon-floppy-o:before { content: @floppy-o; } -.oc-icon-square:before { content: @square; } -.oc-icon-navicon:before, -.oc-icon-reorder:before, -.oc-icon-bars:before { content: @bars; } -.oc-icon-list-ul:before { content: @list-ul; } -.oc-icon-list-ol:before { content: @list-ol; } -.oc-icon-strikethrough:before { content: @strikethrough; } -.oc-icon-underline:before { content: @underline; } -.oc-icon-table:before { content: @table; } -.oc-icon-magic:before { content: @magic; } -.oc-icon-truck:before { content: @truck; } -.oc-icon-pinterest:before { content: @pinterest; } -.oc-icon-pinterest-square:before { content: @pinterest-square; } -.oc-icon-google-plus-square:before { content: @google-plus-square; } -.oc-icon-google-plus:before { content: @google-plus; } -.oc-icon-money:before { content: @money; } -.oc-icon-caret-down:before { content: @caret-down; } -.oc-icon-caret-up:before { content: @caret-up; } -.oc-icon-caret-left:before { content: @caret-left; } -.oc-icon-caret-right:before { content: @caret-right; } -.oc-icon-columns:before { content: @columns; } -.oc-icon-unsorted:before, -.oc-icon-sort:before { content: @sort; } -.oc-icon-sort-down:before, -.oc-icon-sort-desc:before { content: @sort-desc; } -.oc-icon-sort-up:before, -.oc-icon-sort-asc:before { content: @sort-asc; } -.oc-icon-envelope:before { content: @envelope; } -.oc-icon-linkedin:before { content: @linkedin; } -.oc-icon-rotate-left:before, -.oc-icon-undo:before { content: @undo; } -.oc-icon-legal:before, -.oc-icon-gavel:before { content: @gavel; } -.oc-icon-dashboard:before, -.oc-icon-tachometer:before { content: @tachometer; } -.oc-icon-comment-o:before { content: @comment-o; } -.oc-icon-comments-o:before { content: @comments-o; } -.oc-icon-flash:before, -.oc-icon-bolt:before { content: @bolt; } -.oc-icon-sitemap:before { content: @sitemap; } -.oc-icon-umbrella:before { content: @umbrella; } -.oc-icon-paste:before, -.oc-icon-clipboard:before { content: @clipboard; } -.oc-icon-lightbulb-o:before { content: @lightbulb-o; } -.oc-icon-exchange:before { content: @exchange; } -.oc-icon-cloud-download:before { content: @cloud-download; } -.oc-icon-cloud-upload:before { content: @cloud-upload; } -.oc-icon-user-md:before { content: @user-md; } -.oc-icon-stethoscope:before { content: @stethoscope; } -.oc-icon-suitcase:before { content: @suitcase; } -.oc-icon-bell-o:before { content: @bell-o; } -.oc-icon-coffee:before { content: @coffee; } -.oc-icon-cutlery:before { content: @cutlery; } -.oc-icon-file-text-o:before { content: @file-text-o; } -.oc-icon-building-o:before { content: @building-o; } -.oc-icon-hospital-o:before { content: @hospital-o; } -.oc-icon-ambulance:before { content: @ambulance; } -.oc-icon-medkit:before { content: @medkit; } -.oc-icon-fighter-jet:before { content: @fighter-jet; } -.oc-icon-beer:before { content: @beer; } -.oc-icon-h-square:before { content: @h-square; } -.oc-icon-plus-square:before { content: @plus-square; } -.oc-icon-angle-double-left:before { content: @angle-double-left; } -.oc-icon-angle-double-right:before { content: @angle-double-right; } -.oc-icon-angle-double-up:before { content: @angle-double-up; } -.oc-icon-angle-double-down:before { content: @angle-double-down; } -.oc-icon-angle-left:before { content: @angle-left; } -.oc-icon-angle-right:before { content: @angle-right; } -.oc-icon-angle-up:before { content: @angle-up; } -.oc-icon-angle-down:before { content: @angle-down; } -.oc-icon-desktop:before { content: @desktop; } -.oc-icon-laptop:before { content: @laptop; } -.oc-icon-tablet:before { content: @tablet; } -.oc-icon-mobile-phone:before, -.oc-icon-mobile:before { content: @mobile; } -.oc-icon-circle-o:before { content: @circle-o; } -.oc-icon-quote-left:before { content: @quote-left; } -.oc-icon-quote-right:before { content: @quote-right; } -.oc-icon-spinner:before { content: @spinner; } -.oc-icon-circle:before { content: @circle; } -.oc-icon-mail-reply:before, -.oc-icon-reply:before { content: @reply; } -.oc-icon-github-alt:before { content: @github-alt; } -.oc-icon-folder-o:before { content: @folder-o; } -.oc-icon-folder-open-o:before { content: @folder-open-o; } -.oc-icon-smile-o:before { content: @smile-o; } -.oc-icon-frown-o:before { content: @frown-o; } -.oc-icon-meh-o:before { content: @meh-o; } -.oc-icon-gamepad:before { content: @gamepad; } -.oc-icon-keyboard-o:before { content: @keyboard-o; } -.oc-icon-flag-o:before { content: @flag-o; } -.oc-icon-flag-checkered:before { content: @flag-checkered; } -.oc-icon-terminal:before { content: @terminal; } -.oc-icon-code:before { content: @code; } -.oc-icon-mail-reply-all:before, -.oc-icon-reply-all:before { content: @reply-all; } -.oc-icon-star-half-empty:before, -.oc-icon-star-half-full:before, -.oc-icon-star-half-o:before { content: @star-half-o; } -.oc-icon-location-arrow:before { content: @location-arrow; } -.oc-icon-crop:before { content: @crop; } -.oc-icon-code-fork:before { content: @code-fork; } -.oc-icon-unlink:before, -.oc-icon-chain-broken:before { content: @chain-broken; } -.oc-icon-question:before { content: @question; } -.oc-icon-info:before { content: @info; } -.oc-icon-exclamation:before { content: @exclamation; } -.oc-icon-superscript:before { content: @superscript; } -.oc-icon-subscript:before { content: @subscript; } -.oc-icon-eraser:before { content: @eraser; } -.oc-icon-puzzle-piece:before { content: @puzzle-piece; } -.oc-icon-microphone:before { content: @microphone; } -.oc-icon-microphone-slash:before { content: @microphone-slash; } -.oc-icon-shield:before { content: @shield; } -.oc-icon-calendar-o:before { content: @calendar-o; } -.oc-icon-fire-extinguisher:before { content: @fire-extinguisher; } -.oc-icon-rocket:before { content: @rocket; } -.oc-icon-maxcdn:before { content: @maxcdn; } -.oc-icon-chevron-circle-left:before { content: @chevron-circle-left; } -.oc-icon-chevron-circle-right:before { content: @chevron-circle-right; } -.oc-icon-chevron-circle-up:before { content: @chevron-circle-up; } -.oc-icon-chevron-circle-down:before { content: @chevron-circle-down; } -.oc-icon-html5:before { content: @html5; } -.oc-icon-css3:before { content: @css3; } -.oc-icon-anchor:before { content: @anchor; } -.oc-icon-unlock-alt:before { content: @unlock-alt; } -.oc-icon-bullseye:before { content: @bullseye; } -.oc-icon-ellipsis-h:before { content: @ellipsis-h; } -.oc-icon-ellipsis-v:before { content: @ellipsis-v; } -.oc-icon-rss-square:before { content: @rss-square; } -.oc-icon-play-circle:before { content: @play-circle; } -.oc-icon-ticket:before { content: @ticket; } -.oc-icon-minus-square:before { content: @minus-square; } -.oc-icon-minus-square-o:before { content: @minus-square-o; } -.oc-icon-level-up:before { content: @level-up; } -.oc-icon-level-down:before { content: @level-down; } -.oc-icon-check-square:before { content: @check-square; } -.oc-icon-pencil-square:before { content: @pencil-square; } -.oc-icon-external-link-square:before { content: @external-link-square; } -.oc-icon-share-square:before { content: @share-square; } -.oc-icon-compass:before { content: @compass; } -.oc-icon-toggle-down:before, -.oc-icon-caret-square-o-down:before { content: @caret-square-o-down; } -.oc-icon-toggle-up:before, -.oc-icon-caret-square-o-up:before { content: @caret-square-o-up; } -.oc-icon-toggle-right:before, -.oc-icon-caret-square-o-right:before { content: @caret-square-o-right; } -.oc-icon-euro:before, -.oc-icon-eur:before { content: @eur; } -.oc-icon-gbp:before { content: @gbp; } -.oc-icon-dollar:before, -.oc-icon-usd:before { content: @usd; } -.oc-icon-rupee:before, -.oc-icon-inr:before { content: @inr; } -.oc-icon-cny:before, -.oc-icon-rmb:before, -.oc-icon-yen:before, -.oc-icon-jpy:before { content: @jpy; } -.oc-icon-ruble:before, -.oc-icon-rouble:before, -.oc-icon-rub:before { content: @rub; } -.oc-icon-won:before, -.oc-icon-krw:before { content: @krw; } -.oc-icon-bitcoin:before, -.oc-icon-btc:before { content: @btc; } -.oc-icon-file:before { content: @file; } -.oc-icon-file-text:before { content: @file-text; } -.oc-icon-sort-alpha-asc:before { content: @sort-alpha-asc; } -.oc-icon-sort-alpha-desc:before { content: @sort-alpha-desc; } -.oc-icon-sort-amount-asc:before { content: @sort-amount-asc; } -.oc-icon-sort-amount-desc:before { content: @sort-amount-desc; } -.oc-icon-sort-numeric-asc:before { content: @sort-numeric-asc; } -.oc-icon-sort-numeric-desc:before { content: @sort-numeric-desc; } -.oc-icon-thumbs-up:before { content: @thumbs-up; } -.oc-icon-thumbs-down:before { content: @thumbs-down; } -.oc-icon-youtube-square:before { content: @youtube-square; } -.oc-icon-youtube:before { content: @youtube; } -.oc-icon-xing:before { content: @xing; } -.oc-icon-xing-square:before { content: @xing-square; } -.oc-icon-youtube-play:before { content: @youtube-play; } -.oc-icon-dropbox:before { content: @dropbox; } -.oc-icon-stack-overflow:before { content: @stack-overflow; } -.oc-icon-instagram:before { content: @instagram; } -.oc-icon-flickr:before { content: @flickr; } -.oc-icon-adn:before { content: @adn; } -.oc-icon-bitbucket:before { content: @bitbucket; } -.oc-icon-bitbucket-square:before { content: @bitbucket-square; } -.oc-icon-tumblr:before { content: @tumblr; } -.oc-icon-tumblr-square:before { content: @tumblr-square; } -.oc-icon-long-arrow-down:before { content: @long-arrow-down; } -.oc-icon-long-arrow-up:before { content: @long-arrow-up; } -.oc-icon-long-arrow-left:before { content: @long-arrow-left; } -.oc-icon-long-arrow-right:before { content: @long-arrow-right; } -.oc-icon-apple:before { content: @apple; } -.oc-icon-windows:before { content: @windows; } -.oc-icon-android:before { content: @android; } -.oc-icon-linux:before { content: @linux; } -.oc-icon-dribbble:before { content: @dribbble; } -.oc-icon-skype:before { content: @skype; } -.oc-icon-foursquare:before { content: @foursquare; } -.oc-icon-trello:before { content: @trello; } -.oc-icon-female:before { content: @female; } -.oc-icon-male:before { content: @male; } -.oc-icon-gittip:before, -.oc-icon-gratipay:before { content: @gratipay; } -.oc-icon-sun-o:before { content: @sun-o; } -.oc-icon-moon-o:before { content: @moon-o; } -.oc-icon-archive:before { content: @archive; } -.oc-icon-bug:before { content: @bug; } -.oc-icon-vk:before { content: @vk; } -.oc-icon-weibo:before { content: @weibo; } -.oc-icon-renren:before { content: @renren; } -.oc-icon-pagelines:before { content: @pagelines; } -.oc-icon-stack-exchange:before { content: @stack-exchange; } -.oc-icon-arrow-circle-o-right:before { content: @arrow-circle-o-right; } -.oc-icon-arrow-circle-o-left:before { content: @arrow-circle-o-left; } -.oc-icon-toggle-left:before, -.oc-icon-caret-square-o-left:before { content: @caret-square-o-left; } -.oc-icon-dot-circle-o:before { content: @dot-circle-o; } -.oc-icon-wheelchair:before { content: @wheelchair; } -.oc-icon-vimeo-square:before { content: @vimeo-square; } -.oc-icon-turkish-lira:before, -.oc-icon-try:before { content: @try; } -.oc-icon-plus-square-o:before { content: @plus-square-o; } -.oc-icon-space-shuttle:before { content: @space-shuttle; } -.oc-icon-slack:before { content: @slack; } -.oc-icon-envelope-square:before { content: @envelope-square; } -.oc-icon-wordpress:before { content: @wordpress; } -.oc-icon-openid:before { content: @openid; } -.oc-icon-institution:before, -.oc-icon-bank:before, -.oc-icon-university:before { content: @university; } -.oc-icon-mortar-board:before, -.oc-icon-graduation-cap:before { content: @graduation-cap; } -.oc-icon-yahoo:before { content: @yahoo; } -.oc-icon-google:before { content: @google; } -.oc-icon-reddit:before { content: @reddit; } -.oc-icon-reddit-square:before { content: @reddit-square; } -.oc-icon-stumbleupon-circle:before { content: @stumbleupon-circle; } -.oc-icon-stumbleupon:before { content: @stumbleupon; } -.oc-icon-delicious:before { content: @delicious; } -.oc-icon-digg:before { content: @digg; } -.oc-icon-pied-piper:before { content: @pied-piper; } -.oc-icon-pied-piper-alt:before { content: @pied-piper-alt; } -.oc-icon-drupal:before { content: @drupal; } -.oc-icon-joomla:before { content: @joomla; } -.oc-icon-language:before { content: @language; } -.oc-icon-fax:before { content: @fax; } -.oc-icon-building:before { content: @building; } -.oc-icon-child:before { content: @child; } -.oc-icon-paw:before { content: @paw; } -.oc-icon-spoon:before { content: @spoon; } -.oc-icon-cube:before { content: @cube; } -.oc-icon-cubes:before { content: @cubes; } -.oc-icon-behance:before { content: @behance; } -.oc-icon-behance-square:before { content: @behance-square; } -.oc-icon-steam:before { content: @steam; } -.oc-icon-steam-square:before { content: @steam-square; } -.oc-icon-recycle:before { content: @recycle; } -.oc-icon-automobile:before, -.oc-icon-car:before { content: @car; } -.oc-icon-cab:before, -.oc-icon-taxi:before { content: @taxi; } -.oc-icon-tree:before { content: @tree; } -.oc-icon-spotify:before { content: @spotify; } -.oc-icon-deviantart:before { content: @deviantart; } -.oc-icon-soundcloud:before { content: @soundcloud; } -.oc-icon-database:before { content: @database; } -.oc-icon-file-pdf-o:before { content: @file-pdf-o; } -.oc-icon-file-word-o:before { content: @file-word-o; } -.oc-icon-file-excel-o:before { content: @file-excel-o; } -.oc-icon-file-powerpoint-o:before { content: @file-powerpoint-o; } -.oc-icon-file-photo-o:before, -.oc-icon-file-picture-o:before, -.oc-icon-file-image-o:before { content: @file-image-o; } -.oc-icon-file-zip-o:before, -.oc-icon-file-archive-o:before { content: @file-archive-o; } -.oc-icon-file-sound-o:before, -.oc-icon-file-audio-o:before { content: @file-audio-o; } -.oc-icon-file-movie-o:before, -.oc-icon-file-video-o:before { content: @file-video-o; } -.oc-icon-file-code-o:before { content: @file-code-o; } -.oc-icon-vine:before { content: @vine; } -.oc-icon-codepen:before { content: @codepen; } -.oc-icon-jsfiddle:before { content: @jsfiddle; } -.oc-icon-life-bouy:before, -.oc-icon-life-buoy:before, -.oc-icon-life-saver:before, -.oc-icon-support:before, -.oc-icon-life-ring:before { content: @life-ring; } -.oc-icon-circle-o-notch:before { content: @circle-o-notch; } -.oc-icon-ra:before, -.oc-icon-rebel:before { content: @rebel; } -.oc-icon-ge:before, -.oc-icon-empire:before { content: @empire; } -.oc-icon-git-square:before { content: @git-square; } -.oc-icon-git:before { content: @git; } -.oc-icon-hacker-news:before { content: @hacker-news; } -.oc-icon-tencent-weibo:before { content: @tencent-weibo; } -.oc-icon-qq:before { content: @qq; } -.oc-icon-wechat:before, -.oc-icon-weixin:before { content: @weixin; } -.oc-icon-send:before, -.oc-icon-paper-plane:before { content: @paper-plane; } -.oc-icon-send-o:before, -.oc-icon-paper-plane-o:before { content: @paper-plane-o; } -.oc-icon-history:before { content: @history; } -.oc-icon-genderless:before, -.oc-icon-circle-thin:before { content: @circle-thin; } -.oc-icon-header:before { content: @header; } -.oc-icon-paragraph:before { content: @paragraph; } -.oc-icon-sliders:before { content: @sliders; } -.oc-icon-share-alt:before { content: @share-alt; } -.oc-icon-share-alt-square:before { content: @share-alt-square; } -.oc-icon-bomb:before { content: @bomb; } -.oc-icon-soccer-ball-o:before, -.oc-icon-futbol-o:before { content: @futbol-o; } -.oc-icon-tty:before { content: @tty; } -.oc-icon-binoculars:before { content: @binoculars; } -.oc-icon-plug:before { content: @plug; } -.oc-icon-slideshare:before { content: @slideshare; } -.oc-icon-twitch:before { content: @twitch; } -.oc-icon-yelp:before { content: @yelp; } -.oc-icon-newspaper-o:before { content: @newspaper-o; } -.oc-icon-wifi:before { content: @wifi; } -.oc-icon-calculator:before { content: @calculator; } -.oc-icon-paypal:before { content: @paypal; } -.oc-icon-google-wallet:before { content: @google-wallet; } -.oc-icon-cc-visa:before { content: @cc-visa; } -.oc-icon-cc-mastercard:before { content: @cc-mastercard; } -.oc-icon-cc-discover:before { content: @cc-discover; } -.oc-icon-cc-amex:before { content: @cc-amex; } -.oc-icon-cc-paypal:before { content: @cc-paypal; } -.oc-icon-cc-stripe:before { content: @cc-stripe; } -.oc-icon-bell-slash:before { content: @bell-slash; } -.oc-icon-bell-slash-o:before { content: @bell-slash-o; } -.oc-icon-trash:before { content: @trash; } -.oc-icon-copyright:before { content: @copyright; } -.oc-icon-at:before { content: @at; } -.oc-icon-eyedropper:before { content: @eyedropper; } -.oc-icon-paint-brush:before { content: @paint-brush; } -.oc-icon-birthday-cake:before { content: @birthday-cake; } -.oc-icon-area-chart:before { content: @area-chart; } -.oc-icon-pie-chart:before { content: @pie-chart; } -.oc-icon-line-chart:before { content: @line-chart; } -.oc-icon-lastfm:before { content: @lastfm; } -.oc-icon-lastfm-square:before { content: @lastfm-square; } -.oc-icon-toggle-off:before { content: @toggle-off; } -.oc-icon-toggle-on:before { content: @toggle-on; } -.oc-icon-bicycle:before { content: @bicycle; } -.oc-icon-bus:before { content: @bus; } -.oc-icon-ioxhost:before { content: @ioxhost; } -.oc-icon-angellist:before { content: @angellist; } -.oc-icon-cc:before { content: @cc; } -.oc-icon-shekel:before, -.oc-icon-sheqel:before, -.oc-icon-ils:before { content: @ils; } -.oc-icon-meanpath:before { content: @meanpath; } -.oc-icon-buysellads:before { content: @buysellads; } -.oc-icon-connectdevelop:before { content: @connectdevelop; } -.oc-icon-dashcube:before { content: @dashcube; } -.oc-icon-forumbee:before { content: @forumbee; } -.oc-icon-leanpub:before { content: @leanpub; } -.oc-icon-sellsy:before { content: @sellsy; } -.oc-icon-shirtsinbulk:before { content: @shirtsinbulk; } -.oc-icon-simplybuilt:before { content: @simplybuilt; } -.oc-icon-skyatlas:before { content: @skyatlas; } -.oc-icon-cart-plus:before { content: @cart-plus; } -.oc-icon-cart-arrow-down:before { content: @cart-arrow-down; } -.oc-icon-diamond:before { content: @diamond; } -.oc-icon-ship:before { content: @ship; } -.oc-icon-user-secret:before { content: @user-secret; } -.oc-icon-motorcycle:before { content: @motorcycle; } -.oc-icon-street-view:before { content: @street-view; } -.oc-icon-heartbeat:before { content: @heartbeat; } -.oc-icon-venus:before { content: @venus; } -.oc-icon-mars:before { content: @mars; } -.oc-icon-mercury:before { content: @mercury; } -.oc-icon-transgender:before { content: @transgender; } -.oc-icon-transgender-alt:before { content: @transgender-alt; } -.oc-icon-venus-double:before { content: @venus-double; } -.oc-icon-mars-double:before { content: @mars-double; } -.oc-icon-venus-mars:before { content: @venus-mars; } -.oc-icon-mars-stroke:before { content: @mars-stroke; } -.oc-icon-mars-stroke-v:before { content: @mars-stroke-v; } -.oc-icon-mars-stroke-h:before { content: @mars-stroke-h; } -.oc-icon-neuter:before { content: @neuter; } -.oc-icon-facebook-official:before { content: @facebook-official; } -.oc-icon-pinterest-p:before { content: @pinterest-p; } -.oc-icon-whatsapp:before { content: @whatsapp; } -.oc-icon-server:before { content: @server; } -.oc-icon-user-plus:before { content: @user-plus; } -.oc-icon-user-times:before { content: @user-times; } -.oc-icon-hotel:before, -.oc-icon-bed:before { content: @bed; } -.oc-icon-viacoin:before { content: @viacoin; } -.oc-icon-train:before { content: @train; } -.oc-icon-subway:before { content: @subway; } -.oc-icon-medium:before { content: @medium; } diff --git a/modules/backend/assets/less/core/variables.less b/modules/backend/assets/less/core/variables.less index 40b1770a8..41c70b34d 100644 --- a/modules/backend/assets/less/core/variables.less +++ b/modules/backend/assets/less/core/variables.less @@ -141,12 +141,6 @@ @color-filter-items-bg: #fafafa; @color-filter-items-bg-hover: #4da7e8; -@color-inspector-bg: #f2f2f2; -@color-inspector-active-bg: #ffffff; -@color-inspector-text: #333333; -@color-inspector-grid: #c8cccd; -@color-inspector-changed: #c03f31; - @color-filelist-norecords-text: #666666; @color-filelist-norecords-bg: #eeeeee; @color-filelist-cb-border: #cccccc; diff --git a/modules/backend/assets/less/october.less b/modules/backend/assets/less/october.less index fa6f05897..37ceaad96 100644 --- a/modules/backend/assets/less/october.less +++ b/modules/backend/assets/less/october.less @@ -24,7 +24,6 @@ @import "controls/pagination.less"; @import "controls/scoreboard.less"; @import "controls/charts.less"; -@import "controls/inspector.less"; @import "controls/ballooncontrols.less"; @import "controls/reportwidgets.less"; @import "controls/treelist.less"; @@ -51,6 +50,7 @@ @import "../../../system/assets/ui/less/flag.less"; @import "../../../system/assets/ui/less/form.less"; @import "../../../system/assets/ui/less/list.less"; +@import "../../../system/assets/ui/less/inspector.less"; @import "../../../system/assets/ui/less/progressbar.less"; @import "../../../system/assets/ui/less/dropdown.less"; @import "../../../system/assets/ui/less/loader.less"; diff --git a/modules/system/assets/ui/js/inspector.js b/modules/system/assets/ui/js/inspector.js index 88f0f608b..e04f4c006 100644 --- a/modules/system/assets/ui/js/inspector.js +++ b/modules/system/assets/ui/js/inspector.js @@ -1,3 +1,7 @@ +/* +=require popover.js +*/ + /* * Inspector control * diff --git a/modules/backend/assets/less/controls/inspector.less b/modules/system/assets/ui/less/inspector.less similarity index 94% rename from modules/backend/assets/less/controls/inspector.less rename to modules/system/assets/ui/less/inspector.less index c27342608..3d2df01a0 100644 --- a/modules/backend/assets/less/controls/inspector.less +++ b/modules/system/assets/ui/less/inspector.less @@ -1,3 +1,24 @@ +// +// Dependencies +// -------------------------------------------------- + +@import "global.less"; +@import "popover.less"; + +// +// Inspector +// -------------------------------------------------- + +@color-inspector-bg: #f2f2f2; +@color-inspector-active-bg: #ffffff; +@color-inspector-text: #333333; +@color-inspector-grid: #c8cccd; +@color-inspector-changed: #c03f31; + +// +// Inspector +// -------------------------------------------------- + .inspector-fields { min-width: 220px; border-collapse: collapse;