diff --git a/administrator/components/com_banners/tmpl/banner/edit.php b/administrator/components/com_banners/tmpl/banner/edit.php index 1398d77ef26b0..08c4edb1c2dac 100644 --- a/administrator/components/com_banners/tmpl/banner/edit.php +++ b/administrator/components/com_banners/tmpl/banner/edit.php @@ -60,7 +60,7 @@ -
+
form->renderFieldset('otherparams'); ?> diff --git a/administrator/components/com_config/src/Field/FiltersField.php b/administrator/components/com_config/src/Field/FiltersField.php index 021faf918f43b..82981ca73048a 100644 --- a/administrator/components/com_config/src/Field/FiltersField.php +++ b/administrator/components/com_config/src/Field/FiltersField.php @@ -92,7 +92,7 @@ protected function getInput() $html = array(); // Open the table. - $html[] = ''; + $html[] = '
'; // The table heading. $html[] = ' '; diff --git a/administrator/components/com_config/tmpl/application/default_permissions.php b/administrator/components/com_config/tmpl/application/default_permissions.php index 99d77168e799c..57714ca30c8f0 100644 --- a/administrator/components/com_config/tmpl/application/default_permissions.php +++ b/administrator/components/com_config/tmpl/application/default_permissions.php @@ -15,7 +15,7 @@ $this->name = Text::_('COM_CONFIG_PERMISSION_SETTINGS'); $this->description = ''; $this->fieldsname = 'permissions'; -$this->formclass = 'form-no-margin form-no-columns options-form'; +$this->formclass = 'form-no-columns options-form'; $this->showlabel = false; echo LayoutHelper::render('joomla.content.options_default', $this); diff --git a/administrator/components/com_content/tmpl/article/edit.php b/administrator/components/com_content/tmpl/article/edit.php index b90206525aa5e..a2eb6dda2f182 100644 --- a/administrator/components/com_content/tmpl/article/edit.php +++ b/administrator/components/com_content/tmpl/article/edit.php @@ -151,7 +151,7 @@ canDo->get('core.admin') && $params->get('show_configure_edit_options', 1) == 1) : ?> -
+
form->renderFieldset('editorConfig'); ?> diff --git a/administrator/components/com_menus/tmpl/item/edit.php b/administrator/components/com_menus/tmpl/item/edit.php index bddea69e7b3d9..2214c5a05ea04 100644 --- a/administrator/components/com_menus/tmpl/item/edit.php +++ b/administrator/components/com_menus/tmpl/item/edit.php @@ -50,7 +50,7 @@ item->id != 0) : ?> -
+
diff --git a/administrator/components/com_workflow/tmpl/stage/edit.php b/administrator/components/com_workflow/tmpl/stage/edit.php index 48792c3fdf88f..220038f1a04d4 100644 --- a/administrator/components/com_workflow/tmpl/stage/edit.php +++ b/administrator/components/com_workflow/tmpl/stage/edit.php @@ -47,7 +47,7 @@
-
+
form->renderField('published'); ?> form->renderField('default'); ?>
diff --git a/administrator/components/com_workflow/tmpl/workflow/edit.php b/administrator/components/com_workflow/tmpl/workflow/edit.php index 8bda5225d413e..b6863032aa5fc 100644 --- a/administrator/components/com_workflow/tmpl/workflow/edit.php +++ b/administrator/components/com_workflow/tmpl/workflow/edit.php @@ -39,7 +39,7 @@
-
+
form->renderField('description'); ?>
@@ -47,7 +47,7 @@
-
+
form->renderField('published'); ?> form->renderField('default'); ?>
diff --git a/administrator/templates/atum/scss/blocks/_edit.scss b/administrator/templates/atum/scss/blocks/_edit.scss index 1138f22dac5aa..6355fb952976c 100644 --- a/administrator/templates/atum/scss/blocks/_edit.scss +++ b/administrator/templates/atum/scss/blocks/_edit.scss @@ -18,9 +18,6 @@ } .layout-edit { - .control-group { - min-width: (100% / 3); - } .title-alias { box-shadow: $atum-box-shadow; diff --git a/administrator/templates/atum/scss/blocks/_form.scss b/administrator/templates/atum/scss/blocks/_form.scss index b1a6a3e51fe7b..eb466f1778270 100644 --- a/administrator/templates/atum/scss/blocks/_form.scss +++ b/administrator/templates/atum/scss/blocks/_form.scss @@ -6,7 +6,9 @@ } .control-group { - margin-bottom: 18px; + display: flex; + flex-wrap: wrap; + margin: 0 0 1rem 0; > .form-check { display: inline-block; @@ -19,24 +21,25 @@ } .control-label { - float: left; - width: 220px; - padding-top: 5px; - padding-right: 5px; - text-align: left; + width: 240px; + padding: .3rem 0; } .controls { - margin-left: 220px; + position: relative; + flex: 1; + min-width: 210px; - @include media-breakpoint-down(sm) { - margin-left: 0; + + div { + width: 100%; + margin: 5px 0 10px; + } + } - [dir=rtl] & { - margin-right: 0; - } - } + .form-vertical & { + flex-direction: column; } + } .control-group { @@ -45,38 +48,6 @@ } } -.col-md-9 .control-group .switcher__legend, -.col-md-12 .control-group .switcher__legend { - - @include media-breakpoint-down(sm) { - margin-left: 0; - float: none; - - [dir=rtl] & { - margin-right: 0; - } - } -} - -.form-no-margin { - - .control-group { - - .controls { - margin-left: 0; - - .switcher__legend { - float: none; - margin-left: 0; - } - } - - .control-label { - float: none; - } - } -} - .spacer { hr { width: 380px; @@ -136,12 +107,6 @@ legend { opacity: 0.3; } -// Search Input Tooltip -/* make the containers relative */ -.control-group > .controls { - position: relative; -} - /* set up hidden tooltip */ [role="tooltip"]:not(.show) { display: none; diff --git a/administrator/templates/atum/scss/blocks/_utilities.scss b/administrator/templates/atum/scss/blocks/_utilities.scss index fb0cbafb3cc4f..6249484ddd332 100644 --- a/administrator/templates/atum/scss/blocks/_utilities.scss +++ b/administrator/templates/atum/scss/blocks/_utilities.scss @@ -30,7 +30,8 @@ padding-bottom: 1rem; > div { - display: inline-block; + display: inline-flex; + flex-direction: column; break-inside: avoid; width: 100%; diff --git a/administrator/templates/atum/scss/template-rtl.scss b/administrator/templates/atum/scss/template-rtl.scss index 41cc072edb624..0600096e7a5b1 100644 --- a/administrator/templates/atum/scss/template-rtl.scss +++ b/administrator/templates/atum/scss/template-rtl.scss @@ -20,12 +20,6 @@ body { } } -.control-group { - .custom-select { - float: right; - } -} - .dropdown-menu-right { &::after { @@ -49,10 +43,6 @@ body { float: right; } -.form-no-margin .control-group .controls .switcher__legend { - text-align: right; -} - // Alerts .notify-alerts { margin-left: 0; diff --git a/administrator/templates/atum/scss/vendor/bootstrap/_form.scss b/administrator/templates/atum/scss/vendor/bootstrap/_form.scss index c32f2f77984de..580d5a2ee1684 100644 --- a/administrator/templates/atum/scss/vendor/bootstrap/_form.scss +++ b/administrator/templates/atum/scss/vendor/bootstrap/_form.scss @@ -4,73 +4,6 @@ label { margin-bottom: 0; } -.control-group { - margin-bottom: 18px; - - > .form-check { - display: inline-block; - } - - &::after { - display: table; - clear: both; - content: ""; - } - - .control-label { - float: left; - width: 220px; - padding-top: 5px; - padding-right: 5px; - text-align: left; - - [dir=rtl] & { - float: right; - text-align: right; - } - - @include media-breakpoint-down(sm) { - float: none; - width: 100%; - } - } - - .controls { - margin-left: 220px; - - [dir=rtl] & { - margin-right: 220px; - margin-left: 0; - } - - @include media-breakpoint-down(sm) { - margin-left: 0; - - [dir=rtl] & { - margin-right: 0; - } - } - } -} - -.form-no-margin { - - .control-group { - - .controls { - margin-left: 0; - - [dir=rtl] & { - margin-right: auto; - } - } - - .control-label { - float: none; - } - } -} - .spacer { hr { width: 380px; @@ -125,7 +58,7 @@ legend { display: block; } -[aria-grabbed='true'] { +[aria-grabbed="true"] { box-shadow: 0 0 2px 1px var(--atum-bg-dark); } @@ -133,15 +66,6 @@ select.form-control { background-color: $custom-select-bg; } -@include media-breakpoint-down(xs) { - .control-group { - .control-label { - float: none; - max-width: 100%; - } - } -} - .field-media-wrapper { max-width: calc(50vw - 5rem); width: 100%; diff --git a/build/media_source/system/scss/fields/switcher.scss b/build/media_source/system/scss/fields/switcher.scss index 1c5488eafc541..641e1882f52f6 100644 --- a/build/media_source/system/scss/fields/switcher.scss +++ b/build/media_source/system/scss/fields/switcher.scss @@ -1,13 +1,13 @@ $off-background-colour: lightgrey; $on-background-colour: #2f7d32; -$switcher-width: 62px; +$switcher-width: 62px; $switcher-height: 28px; .switcher { position: relative; width: 18rem; height: 28px; - float: left; + margin: 0; } .switcher input { @@ -41,7 +41,7 @@ $switcher-height: 28px; .switcher input:focus ~ .toggle-outside { border-color: var(--focus); - box-shadow: 0 0 0 .2rem rgba(26,70,107,.25); + box-shadow: 0 0 0 .2rem rgba(26, 70, 107, .25); } .switcher label { @@ -74,7 +74,7 @@ $switcher-height: 28px; position: absolute; width: 58px; box-sizing: border-box; - border: 1px solid rgba(0,0,0,.18); + border: 1px solid rgba(0, 0, 0, .18); left: 0; [dir=rtl] & { @@ -83,7 +83,7 @@ $switcher-height: 28px; } } -.switcher input ~ input:checked ~ .toggle-outside{ +.switcher input ~ input:checked ~ .toggle-outside { background: $on-background-colour; } @@ -104,32 +104,5 @@ $switcher-height: 28px; margin-bottom: 1rem; font-size: 1rem; font-weight: 400; - float: left; - width: 220px; - padding-top: 5px; - padding-right: 5px; - text-align: left; - - [dir=rtl] & { - padding-left: 5px; - padding-right: 0; - float: right; - text-align: right; - } -} - -.col-md-9 .control-group .switcher__legend, -.col-md-12 .control-group .switcher__legend { - margin-left: -220px; - - [dir=rtl] & { - margin-left: 0; - margin-right: -220px; - float: right; - text-align: right; - } -} - -.col-md-3 .switcher__legend { - margin-left: 0; + padding: 5px 0; } diff --git a/installation/template/scss/template-rtl.scss b/installation/template/scss/template-rtl.scss index e47966aa6001c..e26d457b8a369 100644 --- a/installation/template/scss/template-rtl.scss +++ b/installation/template/scss/template-rtl.scss @@ -3,6 +3,7 @@ body { direction: rtl; } + // Javascript Warning #javascript-warning { font-size: 16px; @@ -52,14 +53,6 @@ textarea.noResize { } } -.form-no-margin { - .control-group { - .controls { - margin-right: 0; - } - } -} - .checkboxes { .checkbox input { margin-right: 0; @@ -92,7 +85,8 @@ textarea.noResize { .j-install-step-header span { margin-left: 5px; - margin-right: auto; } + margin-right: auto; +} #jform_db_prefix { direction: ltr; diff --git a/installation/template/scss/template.scss b/installation/template/scss/template.scss index 52acd8d95ac69..6f0f0499d73b1 100644 --- a/installation/template/scss/template.scss +++ b/installation/template/scss/template.scss @@ -20,7 +20,9 @@ body { background: var(--atum-bg-light); } -*, *::after, *::before { +*, +*::after, +*::before { box-sizing: border-box; } @@ -28,8 +30,9 @@ body { display: flex; flex-direction: column; min-height: 100vh; + .logo { - width: auto; + width: auto; } } @@ -38,6 +41,7 @@ body { width: 100%; max-width: 40rem; margin: 0 auto; + h1 { color: $dark-blue; text-align: center; @@ -49,13 +53,16 @@ body { margin-bottom: 20px; background-color: #fff; box-shadow: 0 0 2px rgba(52, 58, 67, .1), 0 2px 5px rgba(52, 58, 67, .08), 0 5px 15px rgba(52, 58, 67, .08); + &.active { display: block; } + select { width: 100%; margin-left: 0 !important; } + .btn-block { margin-top: 40px; } @@ -79,6 +86,7 @@ body { .j-install-step-form { padding: 0.65rem 1.2rem 0.65rem; + .btn-block + .btn-block { margin-top: .5rem; } @@ -87,6 +95,7 @@ body { .languageForm { padding: 0 0 30px; + .custom-select { width: 100%; } @@ -101,12 +110,14 @@ body { display: flex; margin: 0 0 20px; background: #fafafa; - border: 1px solid rgba(0,0,0,.1); - box-shadow: 0 0 10px rgba(0,0,0,.05); + border: 1px solid rgba(0, 0, 0, .1); + box-shadow: 0 0 10px rgba(0, 0, 0, .05); + p { margin-bottom: 0; } } + .alert-icon { display: flex; align-items: center; @@ -115,6 +126,7 @@ body { margin-bottom: 0; font-size: 3rem; opacity: .6; + .fa { width: 100%; text-align: center; @@ -126,7 +138,8 @@ body { padding: 10px 20px; } -.hidden, [hidden="hidden"] { +.hidden, +[hidden="hidden"] { display: none; } @@ -165,22 +178,6 @@ body { } } -.form-no-margin { - - .control-group { - - .controls { - margin-left: 0; - } - - .control-label { - float: none; - } - - } - -} - .spacer hr { width: 380px; } @@ -229,28 +226,34 @@ legend { caption { caption-side: top; } + .badge-warning { color: #292b2c; } -.fa-eye:before, .icon-eye-open:before, .icon-eye:before { - font-family:"Font Awesome 5 Free"; +.fa-eye:before, +.icon-eye-open:before, +.icon-eye:before { + font-family: "Font Awesome 5 Free"; cursor: pointer; content: "\f06e"; } -.fa-eye-slash:before, .icon-eye-close:before, .icon-eye-blocked:before, .icon-eye-2:before { - font-family:"Font Awesome 5 Free"; +.fa-eye-slash:before, +.icon-eye-close:before, +.icon-eye-blocked:before, +.icon-eye-2:before { + font-family: "Font Awesome 5 Free"; cursor: pointer; content: "\f070"; } // footer .footer { - position: absolute; - bottom: 0; - left: 0; - box-shadow: 0 0 1px 1px rgba(0, 0, 0, .25); - z-index: $zindex-header; - background-color: $white; + position: absolute; + bottom: 0; + left: 0; + box-shadow: 0 0 1px 1px rgba(0, 0, 0, .25); + z-index: $zindex-header; + background-color: $white; } diff --git a/layouts/joomla/edit/admin_modules.php b/layouts/joomla/edit/admin_modules.php index d1f1ce66135d5..b114e03ed75a1 100644 --- a/layouts/joomla/edit/admin_modules.php +++ b/layouts/joomla/edit/admin_modules.php @@ -38,7 +38,7 @@ } $html = array(); -$html[] = '
'; +$html[] = '
'; foreach ($fields as $field) { diff --git a/layouts/joomla/edit/global.php b/layouts/joomla/edit/global.php index 3349392e48260..ec38709bc167a 100644 --- a/layouts/joomla/edit/global.php +++ b/layouts/joomla/edit/global.php @@ -57,7 +57,7 @@ } $html = array(); -$html[] = '
'; +$html[] = '
'; foreach ($fields as $field) { diff --git a/layouts/joomla/edit/params.php b/layouts/joomla/edit/params.php index 80d7b0e4b098b..f1505629f24d5 100644 --- a/layouts/joomla/edit/params.php +++ b/layouts/joomla/edit/params.php @@ -116,7 +116,7 @@ if (!$isGrandchild && $hasParent) { - echo '
'; + echo '
'; echo '' . $label . ''; echo '
'; } @@ -143,7 +143,7 @@ // Directly add a fieldset if we have no children if (!$hasChildren) { - echo '
'; + echo '
'; echo '' . $label . ''; echo '
'; diff --git a/layouts/joomla/edit/title_alias.php b/layouts/joomla/edit/title_alias.php index 03c865d6b8f39..f232c35eca269 100644 --- a/layouts/joomla/edit/title_alias.php +++ b/layouts/joomla/edit/title_alias.php @@ -14,7 +14,7 @@ $title = $form->getField('title') ? 'title' : ($form->getField('name') ? 'name' : ''); ?> -
+
renderField($title) : ''; ?>
diff --git a/layouts/joomla/form/field/radio/switcher.php b/layouts/joomla/form/field/radio/switcher.php index f238b65a14672..83679299437cc 100644 --- a/layouts/joomla/form/field/radio/switcher.php +++ b/layouts/joomla/form/field/radio/switcher.php @@ -65,7 +65,7 @@ ?>
> - +
diff --git a/libraries/src/Form/Field/RadioField.php b/libraries/src/Form/Field/RadioField.php index ffd4acc146e44..5fb7bf3fabffd 100644 --- a/libraries/src/Form/Field/RadioField.php +++ b/libraries/src/Form/Field/RadioField.php @@ -58,7 +58,6 @@ public function setup(\SimpleXMLElement $element, $value, $group = null) // The layout for Switcher if (!$element['layout'] && strpos(trim($this->class), 'switcher') === 0) { - $this->hiddenLabel = true; $this->layout = 'joomla.form.field.radio.switcher'; } diff --git a/templates/cassiopeia/scss/blocks/_form.scss b/templates/cassiopeia/scss/blocks/_form.scss index 047a9cd1aa151..8ee3b70648a66 100644 --- a/templates/cassiopeia/scss/blocks/_form.scss +++ b/templates/cassiopeia/scss/blocks/_form.scss @@ -18,51 +18,6 @@ } -.control-group::after { - display: table; - clear: both; - content: ""; -} - -form:not(.form-no-margin) { - - .control-group { - margin-bottom: 18px; - - .control-label { - float: left; - width: auto; - padding-top: 5px; - padding-right: 5px; - text-align: left; - } - - .controls { - margin-left: 220px; - } - - } - -} - -.form-no-margin { - - .control-group { - - .controls { - margin-left: 0; - - .switcher__legend { - float: none; - } - } - - .control-label { - float: none; - } - } -} - .spacer hr { width: 380px; } diff --git a/templates/cassiopeia/scss/template-rtl.scss b/templates/cassiopeia/scss/template-rtl.scss index 72950229a4583..30c06cf839f53 100644 --- a/templates/cassiopeia/scss/template-rtl.scss +++ b/templates/cassiopeia/scss/template-rtl.scss @@ -13,23 +13,6 @@ body, float: right !important; } -.control-group, -form:not(.form-no-margin) .control-group { - .control-label { - float: right; - text-align: right; - } - - .controls { - margin-right: 220px; - margin-left: 0; - } - - .custom-select { - float: right; - } -} - .input-group > .input-group-append > .btn, .input-group > .input-group-append > .input-group-text, .input-group > .input-group-prepend:not(:first-child) > .btn,