diff --git a/modules/backend/assets/css/october.css b/modules/backend/assets/css/october.css index 607e72633..c3824a6fe 100644 --- a/modules/backend/assets/css/october.css +++ b/modules/backend/assets/css/october.css @@ -8978,7 +8978,9 @@ label { margin-top: -5px; } .form-group.no-padding.span-left, -.form-group.no-padding.span-right { +.form-group.field-slim.span-left, +.form-group.no-padding.span-right, +.form-group.field-slim.span-right { width: 50%; } .form-group.input-sidebar-control { @@ -10013,10 +10015,10 @@ table.table.data tr.list-tree-level-25 td.list-cell-index-1 { .report-widget .table-container table.table.data tbody tr:nth-child(even) th { background-color: transparent; } -#layout-flash-messages + .list-header { +.list-header:first-of-type { margin-top: -20px; } -#layout-flash-messages + .list-header > .control-toolbar { +.list-header:first-of-type > .control-toolbar { padding-top: 20px; } @media only screen and (max-width: 960px) { @@ -11780,6 +11782,12 @@ body.dropdown-open .dropdown-overlay { .control-tabs > div.tab-content > div.tab-pane.active.layout-cell { display: table-cell; } +.control-tabs > div.tab-content > div.tab-pane.pane-compact { + padding: 0; +} +.control-tabs > div.tab-content > div.tab-pane.pane-padded { + padding: 20px 20px 0 20px; +} .control-tabs[data-closable] > ul.nav-tabs > li, .control-tabs[data-closable] > div > ul.nav-tabs > li, .control-tabs[data-closable] > div > div > ul.nav-tabs > li { @@ -11788,8 +11796,8 @@ body.dropdown-open .dropdown-overlay { .control-tabs[data-closable] > ul.nav-tabs > li a, .control-tabs[data-closable] > div > ul.nav-tabs > li a, .control-tabs[data-closable] > div > div > ul.nav-tabs > li a { - padding-left: 20px!important; - padding-right: 0!important; + padding-left: 20px !important; + padding-right: 0 !important; } .control-tabs[data-closable] > ul.nav-tabs > li span.tab-close, .control-tabs[data-closable] > div > ul.nav-tabs > li span.tab-close, @@ -11980,6 +11988,12 @@ body.dropdown-open .dropdown-overlay { background-position: -61px 0; z-index: 107; } +.control-tabs.primary.tabs-offset > ul.nav-tabs, +.control-tabs.primary.tabs-offset > div > ul.nav-tabs, +.control-tabs.primary.tabs-offset > div > div > ul.nav-tabs { + margin-left: 0; + margin-right: 0; +} .control-tabs.secondary > ul.nav-tabs > li, .control-tabs.secondary > div > ul.nav-tabs > li, .control-tabs.secondary > div > div > ul.nav-tabs > li { @@ -12623,7 +12637,8 @@ ul.status-list li span.status.info { .control-breadcrumb + .padded-container { margin-top: -20px; } -.control-breadcrumb.no-bottom-margin { +.control-breadcrumb.no-bottom-margin, +.control-breadcrumb.breadcrumb-flush { margin-bottom: 0; } body.slim-container .control-breadcrumb { @@ -13344,8 +13359,8 @@ div.popover-overlay { .fancy-layout.control-tabs.primary > .tab-content > .tab-pane { padding: 15px 15px 0 15px; } -.fancy-layout .control-tabs.primary > .tab-content > .tab-pane.full-size, -.fancy-layout.control-tabs.primary > .tab-content > .tab-pane.full-size { +.fancy-layout .control-tabs.primary > .tab-content > .tab-pane.pane-compact, +.fancy-layout.control-tabs.primary > .tab-content > .tab-pane.pane-compact { padding: 0; } .fancy-layout .control-tabs.primary > .tab-content > .tab-pane .form-control, diff --git a/modules/backend/assets/js/october.popover.js b/modules/backend/assets/js/october.popover.js index 3a7399607..f6f91fcd4 100644 --- a/modules/backend/assets/js/october.popover.js +++ b/modules/backend/assets/js/october.popover.js @@ -62,7 +62,7 @@ return this.$container.removeClass('in') - this.$overlay.removeClass('in') + if (this.$overlay) this.$overlay.removeClass('in') $.support.transition && this.$container.hasClass('fade') ? this.$container @@ -148,7 +148,7 @@ * Display the popover */ this.$container.addClass('in') - this.$overlay.addClass('in') + if (this.$overlay) this.$overlay.addClass('in') $(document.body).addClass('popover-open') var showEvent = jQuery.Event('show.oc.popover', { relatedTarget: this.$container.get(0) }) diff --git a/modules/backend/assets/less/controls/breadcrumb.less b/modules/backend/assets/less/controls/breadcrumb.less index 17b078f58..2b15e0030 100644 --- a/modules/backend/assets/less/controls/breadcrumb.less +++ b/modules/backend/assets/less/controls/breadcrumb.less @@ -44,7 +44,9 @@ margin-top: -20px; } - &.no-bottom-margin { + // Breadcrumb to sit flush to the element below + &.no-bottom-margin, // @deprecated remove if year >= 2015 + &.breadcrumb-flush { margin-bottom: 0; } } diff --git a/modules/backend/assets/less/controls/fancylayout.less b/modules/backend/assets/less/controls/fancylayout.less index e8fc91eb0..da89c3291 100644 --- a/modules/backend/assets/less/controls/fancylayout.less +++ b/modules/backend/assets/less/controls/fancylayout.less @@ -293,12 +293,12 @@ > div > ul.nav-tabs { background: @color-fancy-form-tabless-fields-bg; - + > li { a { color: white; } - + &.active a { color: #2b3e50; } @@ -384,7 +384,7 @@ > .tab-content > .tab-pane { padding: 15px 15px 0 15px; - &.full-size { + &.pane-compact { padding: 0; } diff --git a/modules/backend/assets/less/controls/forms.less b/modules/backend/assets/less/controls/forms.less index 74ffd403a..8d60b19f5 100644 --- a/modules/backend/assets/less/controls/forms.less +++ b/modules/backend/assets/less/controls/forms.less @@ -140,7 +140,8 @@ label { margin-top: -5px; } - &.no-padding { + &.no-padding, // @deprecated remove if year >= 2015 + &.field-slim { &.span-left, &.span-right { width: 50%; } diff --git a/modules/backend/assets/less/controls/lists.less b/modules/backend/assets/less/controls/lists.less index 20f61199c..eb69c768e 100644 --- a/modules/backend/assets/less/controls/lists.less +++ b/modules/backend/assets/less/controls/lists.less @@ -404,7 +404,7 @@ table.table.data { } } -#layout-flash-messages + .list-header { +.list-header:first-of-type { margin-top: -20px; > .control-toolbar { padding-top: 20px; diff --git a/modules/backend/assets/less/controls/tab.less b/modules/backend/assets/less/controls/tab.less index b3a85e520..92fc7c61c 100644 --- a/modules/backend/assets/less/controls/tab.less +++ b/modules/backend/assets/less/controls/tab.less @@ -101,6 +101,13 @@ display: table-cell; } } + + &.pane-compact { + padding: 0; + } + &.pane-padded { + padding: 20px 20px 0 20px; + } } } @@ -110,8 +117,8 @@ margin-right: 5px; a { - padding-left: 20px!important; - padding-right: 0!important; + padding-left: 20px !important; + padding-right: 0 !important; } span.tab-close { @@ -123,7 +130,7 @@ left: -5px; text-align: right; font-size: 12px; - color: @color-tab-inactive-text!important; + color: @color-tab-inactive-text !important; cursor: pointer; i { display: inline-block; @@ -167,7 +174,7 @@ } &.active { - a {border-bottom: @color-tab-active-border 4px solid;} + a { border-bottom: @color-tab-active-border 4px solid; } } } } @@ -262,18 +269,18 @@ background-color: @color-body-bg; } - &.active a{ + &.active a { z-index: 107; > span.title { z-index: 105; border-top-color: #d6d6d6; - + &:before { background-position: left 0; z-index: 107; } - + &:after { background-position: -61px 0; z-index: 107; @@ -285,6 +292,14 @@ > div.tab-content { } + + // Tabs to sit in by the standard offset (0px) + &.tabs-offset { + > ul.nav-tabs, > div > ul.nav-tabs, > div > div > ul.nav-tabs { + margin-left: 0; + margin-right: 0; + } + } } &.secondary { @@ -397,7 +412,9 @@ &.hide-tabs { .control-tabs { - ul.nav-tabs {display: none;} + ul.nav-tabs { + display: none; + } > div.tab-content > div.tab-pane { padding-top: 0; @@ -411,4 +428,4 @@ background: transparent; } } -} \ No newline at end of file +} diff --git a/modules/backend/assets/less/layout/layout.less b/modules/backend/assets/less/layout/layout.less index 4e7102586..a2fe5abaf 100644 --- a/modules/backend/assets/less/layout/layout.less +++ b/modules/backend/assets/less/layout/layout.less @@ -47,12 +47,14 @@ body { vertical-align: top; height: 100%; - &.width-100 {width: 100px;} - &.width-120 {width: 120px;} - &.width-200 {width: 200px;} - &.width-300 {width: 300px;} + &.width-100 { width: 100px; } + &.width-120 { width: 120px; } + &.width-200 { width: 200px; } + &.width-300 { width: 300px; } - &.layout-container, .layout-container, &.padded-container, .padded-container {padding: 20px 20px 0 20px;} + &.layout-container, .layout-container, &.padded-container, .padded-container { + padding: 20px 20px 0 20px; + } .layout-relative { position: relative; diff --git a/modules/backend/behaviors/FormController.php b/modules/backend/behaviors/FormController.php index ad7631c66..506b0b068 100644 --- a/modules/backend/behaviors/FormController.php +++ b/modules/backend/behaviors/FormController.php @@ -432,7 +432,7 @@ class FormController extends ControllerBehavior * Helper for custom layouts. Renders Secondary Tabs. * @return string The tab HTML markup. */ - public function formRenderSecondaryTabs($suppressTabs = false) + public function formRenderSecondaryTabs() { return $this->formRender(['section' => 'secondary']); } diff --git a/modules/backend/classes/FormField.php b/modules/backend/classes/FormField.php index e472b659a..9d24646f6 100644 --- a/modules/backend/classes/FormField.php +++ b/modules/backend/classes/FormField.php @@ -275,7 +275,6 @@ class FormField if (isset($config['path'])) { $this->path = $config['path']; } - if (array_key_exists('required', $config)) { $this->required = $config['required']; } diff --git a/modules/backend/classes/FormTabs.php b/modules/backend/classes/FormTabs.php new file mode 100644 index 000000000..1972959fb --- /dev/null +++ b/modules/backend/classes/FormTabs.php @@ -0,0 +1,176 @@ +section = strtolower($section) ?: $this->section; + $this->config = $this->evalConfig($config); + + if ($this->section == self::SECTION_OUTSIDE) { + $this->suppressTabs = true; + } + } + + /** + * Process options and apply them to this object. + * @param array $config + * @return array + */ + protected function evalConfig($config) + { + if (array_key_exists('stretch', $config)) { + $this->stretch = $config['stretch']; + } + + if (array_key_exists('suppressTabs', $config)) { + $this->suppressTabs = $config['suppressTabs']; + } + + if (array_key_exists('cssClass', $config)) { + $this->cssClass = $config['cssClass']; + } + } + + /** + * Add a field to the collection of tabs. + * @param string $name + * @param FormField $field + * @param string $tab + */ + public function addField($name, FormField $field, $tab = null) + { + if (!$tab) { + $tab = Lang::get('backend::lang.form.undefined_tab'); + } + + $this->fields[$tab][$name] = $field; + } + + /** + * Returns an array of the registered fields, without tabs. + * @return array + */ + public function getFields() + { + $tablessFields = []; + + foreach ($this->getTabs() as $tab) { + $tablessFields += $tab; + } + + return $tablessFields; + } + + public function hasFields() + { + return count($this->fields) > 0; + } + + /** + * Returns an array of the registered fields. + * @return array + */ + public function getTabs() + { + return $this->fields; + } + + /** + * Get an iterator for the items. + * @return ArrayIterator + */ + public function getIterator() + { + return new ArrayIterator($this->suppressTabs + ? $this->getFields() + : $this->getTabs() + ); + } + + /** + * ArrayAccess implementation + */ + public function offsetSet($offset, $value) + { + $this->fields[$offset] = $value; + } + + /** + * ArrayAccess implementation + */ + public function offsetExists($offset) + { + return isset($this->fields[$offset]); + } + + /** + * ArrayAccess implementation + */ + public function offsetUnset($offset) + { + unset($this->fields[$offset]); + } + + /** + * ArrayAccess implementation + */ + public function offsetGet($offset) + { + return isset($this->fields[$offset]) ? $this->fields[$offset] : null; + } + +} \ No newline at end of file diff --git a/modules/backend/controllers/editorpreferences/index.htm b/modules/backend/controllers/editorpreferences/index.htm index 948d944ef..7777036c4 100644 --- a/modules/backend/controllers/editorpreferences/index.htm +++ b/modules/backend/controllers/editorpreferences/index.htm @@ -1,38 +1,40 @@ fatalError): ?> - = Form::open(['class'=>'layout-item stretch layout-column']) ?> + = Form::open(['class'=>'layout']) ?> -