moving layout styling from grid to layout. Fix spacing above message box

[hans2103]

Pull Request for Issue #115 .

Summary of Changes

• Moves layout styling from grid.scss to layout.scss
• Apply margin-top to first child of .container-component, .container-sidebar-left and .container-sidebar-right
• Added display:none on system-message:empty. To get this working I've created [4.0] wrap message container output in an array and implode it so it prevents obsolete spaces joomla-cms#30760 to change start and closing of <?php ?> in order to remove obsolete spacing.

Testing Instructions

Repeat changes stated in #115

Expected result

Actual result

as shown in #115

ALERT

Please have a look at joomla/joomla-cms#30760
It will solve the obsolete spacing above the alert when no alert has to be shown.

[richard67]

This PR also changes file administrator/templates/atum/scss/vendor/joomla-custom-elements/joomla-alert.scss. Has anyone tested if that has any unwanted effects in the backend?

[richard67]

And shall we really change atum files in this project?

[richard67]

Up to now we don't modify and files belonging to the backend template with our works, and I don't wanna start with it now.

If we change backend template stuff with a CMS PR for the frontend template it will be hardly accepted.

@hans2103 Can we make things work for Cassiopeia without the change in file administrator/templates/atum/scss/vendor/joomla-custom-elements/joomla-alert.scss? If so, please do so. Thanks in advance.

[hans2103]

@richard67 I agree and reverted the Atum change

[richard67]

@drmenzelit Can you do also a real, visual test (review approval means for me only code review)? If so, report back if it was ok or not. Thanks in advance.

[drmenzelit]

I have now too much space above the breadcrumbs

[richard67]

I have now too much space above the breadcrumbs

@drmenzelit I think this is related to following item in the description of this PR:

• Added display:none on system-message:empty. To get this working I've created [4.0] wrap message container output in an array and implode it so it prevents obsolete spaces joomla-cms#30760 to change start and closing of <?php ?> in order to remove obsolete spacing.

Unfortunately I'm not sure if that PR joomla/joomla-cms#30760 will make it in the CMS. There is an ongoing discussion in it.

[hans2103]

I cannot reproduce issue with too many spacing above breadcrumbs.
Not anymore... in branch development the messages have been moved below the breadcrumbs

I do see too much spacing between breadcrumbs and output of component.
That is due to the the obsolete spacing in an empty system-message. Trying to solve it in joomla/joomla-cms#30760

[drmenzelit]

Ok, in my installation the message was above the bredcrumbs. Then is the PR ok.

[richard67]

I have tested this PR ✅ with success.

Since there were changes meanwhile, the breadcrumbs comes before the message container now, so this PR solves the issue with missing spacing above the bradcrumbs and not as described with the message container.

[richard67]

Thanks!

[Scrabble96]

On the Cassiopeia PR #48 installation as of 20th Oct (I am assuming that this build included the above merge) there is no longer any padding above the system message. However, there is a margin top of 1em above the system-message-container. Perhaps this should be moved to the system-message div inside, so when/if they sort out the do-not-display-when-empty issue, there will be no surplus margin.