PR-4.0-dev

Pending

User tests: Successful: Unsuccessful:

avatar coolcat-creations
coolcat-creations
25 Apr 2020

Pull Request for Issue #25891

Summary of Changes

changed the multi column appearance to a one column appearance with different width settings for the screensizes.

Testing Instructions

Apply patch and see how the parameters appear now in

  • Article Edit view
  • Menu Item Paramenters
  • Module Parameters

Expected result

  • You have now only one column, on xxl devices like a 34" Screen the fields are not full width

Actual result

  • You have 2 or 3 Columns (on large screens) - The input fields are very hard to scan

Documentation Changes Required

no

avatar coolcat-creations coolcat-creations - open - 25 Apr 2020
avatar coolcat-creations coolcat-creations - change - 25 Apr 2020
Status New Pending
avatar joomla-cms-bot joomla-cms-bot - change - 25 Apr 2020
Category Administration com_content Layout
avatar brianteeman
brianteeman - comment - 25 Apr 2020

If accepted then this change would have to be made everywhere not just in this one component

avatar coolcat-creations
coolcat-creations - comment - 25 Apr 2020

If accepted then this change would have to be made everywhere not just in this one component

It's actually a Params.php File that appears to have effect in several components and I changed also the articles edit page which was seperate from the params.php

The PR is for the places where the automatic columns class was set.

avatar coolcat-creations coolcat-creations - change - 25 Apr 2020
Title
Change Column Settings for Parameters in Article Edit and in Params
Change Column Settings for Parameters and Article Edit where column class was set
avatar coolcat-creations coolcat-creations - edited - 25 Apr 2020
avatar coolcat-creations coolcat-creations - change - 25 Apr 2020
Title
Change Column Settings for Parameters and Article Edit where column class was set
[4.0] Atum: Change Column Settings for Parameters and Article Edit where column class was set
avatar coolcat-creations coolcat-creations - edited - 25 Apr 2020
avatar faustonenci
faustonenci - comment - 25 Apr 2020

I have tested this item successfully on 339380c

good now i see only one column
also works on a 17 "monitor bringing the browser with zoom to 30%


This comment was created with the J!Tracker Application at issues.joomla.org/tracker/joomla-cms/28790.

avatar faustonenci faustonenci - test_item - 25 Apr 2020 - Tested successfully
avatar ChristineWk
ChristineWk - comment - 25 Apr 2020

I have tested this item successfully on 339380c


This comment was created with the J!Tracker Application at issues.joomla.org/tracker/joomla-cms/28790.

avatar ChristineWk ChristineWk - test_item - 25 Apr 2020 - Tested successfully
avatar alikon alikon - change - 25 Apr 2020
Status Pending Ready to Commit
avatar alikon
alikon - comment - 25 Apr 2020

RTC


This comment was created with the J!Tracker Application at issues.joomla.org/tracker/joomla-cms/28790.

avatar wilsonge
wilsonge - comment - 25 Apr 2020

Can we keep it dual/three columned on smaller screens - because although this works on my smaller screen'd macbook (13 inch) it makes the page much much longer and requires much more scrolling. On larger screens where you can see more fields I think it's probably fine to do this.

avatar ciar4n
ciar4n - comment - 26 Apr 2020

Using bootstraps grid classes like this is a little strange...

  • This isn't a bootstrap grid
  • Applies flex-basis on non-flex items
  • Adds horizontal padding so slightly missaligned

What is the purpose of these classes? Setting a max-width so label and field wrap?

avatar coolcat-creations
coolcat-creations - comment - 26 Apr 2020

@alikon please remove RTC due to advise from @ciar4n
@ciar4n what would you set here? mw- classes? Thank you!

avatar zero-24 zero-24 - change - 26 Apr 2020
Status Ready to Commit Pending
avatar zero-24
zero-24 - comment - 26 Apr 2020
avatar ciar4n
ciar4n - comment - 26 Apr 2020

@coolcat-creations It depends on your intent. Are you looking to give fields a max width?...

With a max width

image

Without a max width

image

avatar coolcat-creations
coolcat-creations - comment - 26 Apr 2020

@ciar4n yes the initial issue was about the columns and that it's too hard to scan and find the setting with two columns and also about the width. I would go with max-width then

@wilsonge and @brianteeman - I see you prefer the 2 columns approach. wouldn't it be complicated then for users to find their stuff? The initial issue was about the multicolumns and I think if there is a documentation and the documentation highlights the setting you have to look for, it somehow should be at the same place if possible.

Would the solution be to have always 2 columns (1 column on mobile) and max-width set?
Are you agreeing on that?

avatar ciar4n
ciar4n - comment - 26 Apr 2020

I don't see mention of setting a max-width on fields in the issue. Regardless, as mentioned by @brianteeman best apply this globally (control-group)... https://github.com/joomla/joomla-cms/blob/4.0-dev/administrator/templates/atum/scss/blocks/_form.scss#L27

Personally I think not such a great idea. Single column forms on a fluid width UI comes with its own issues as mentioned by @wilsonge. We are fixing one problem by replacing it with another. Single column is best practice but usually used within a fixed width interface.

Shopify example...

image

avatar coolcat-creations
coolcat-creations - comment - 27 Apr 2020

@ciar4n
Did I understand you right: so you would make it always single column and the width of the inputs to 100% ? Just to be sure...

avatar ciar4n
ciar4n - comment - 28 Apr 2020

Honestly, I dont know what is the best solution. For me a single column form on a fluid width UI results in to much whitespace...

image

Personally I prefer a fixed-width UI but I don't think that is going to happen. The next alternative is 2 column similar J3.

avatar coolcat-creations
coolcat-creations - comment - 28 Apr 2020

I don't think whitespace is bad by default. I am actually fan of whitespace where it makes sense.

Can I ask for:

  • Likes for 1 Column Max Width on every device
    or for
  • Dislikes for 2 Columns Max width on screens above tablet
  • and the "eyes" emoticon for "none of them" ?

Just to know where I should move to...
@brianteeman @ciar4n @zero-24 @wilsonge @faustonenci @ChristineWk

avatar ciar4n
ciar4n - comment - 28 Apr 2020

I don't think whitespace is bad by default. I am actually fan of whitespace where it makes sense.

True, but for me at least, this whitespace does not seem right.

avatar coolcat-creations
coolcat-creations - comment - 28 Apr 2020

I don't think whitespace is bad by default. I am actually fan of whitespace where it makes sense.

True, but for me at least, this whitespace does not seem right.

No problem, I made kind of a small voting above to know what I should change it to :-) I have no issues with 2 columns too - 3 columns might be bit hard to scan.

avatar ChristineWk
ChristineWk - comment - 28 Apr 2020

As compromise: I'm voting for 2 columns :-)

avatar micker
micker - comment - 28 Apr 2020

2 columns for me... We have more 16:9 screen

avatar brianteeman
brianteeman - comment - 28 Apr 2020

I'm all for sticking withe template design teams 3 columns

avatar coolcat-creations
coolcat-creations - comment - 28 Apr 2020

@brianteeman I am a bit confused, didn't you comment in #25891 that 3 columns are confusing for you too? Maybe I completely misunderstood the issue or the topic, can you clarify?

avatar wilsonge
wilsonge - comment - 8 May 2020

I personally like the 2 columns

avatar coolcat-creations coolcat-creations - change - 9 May 2020
Labels Added: PR-4.0-dev
avatar coolcat-creations
coolcat-creations - comment - 9 May 2020

So I just removed the 3-Columns layout now, is that fine?

avatar ChristineWk
ChristineWk - comment - 9 May 2020

I think, it's OK now :-) but not sure. Found this here:

pr28790

avatar coolcat-creations
coolcat-creations - comment - 9 May 2020

Good finding... Thank you @ChristineWk
I have no idea how to solve that to be honest. Anyone?

avatar ChristineWk
ChristineWk - comment - 9 May 2020

menue_layout
maybe it helps

avatar coolcat-creations
coolcat-creations - comment - 9 May 2020

Thank you! But I have no idea how to solve it technically in the right way for a backend. If someone knows and can give me a hint, I'd appreciate help, otherwise I'd close the PR...

avatar ciar4n
ciar4n - comment - 10 May 2020

You can probably just remove the spacer from the xml.

avatar coolcat-creations
coolcat-creations - comment - 10 May 2020

You can probably just remove the spacer from the xml.

@ciar4n - Hm, not sure because we have also the descriptions that can cause an unwanted misalign in the colums. And the spacers are there to separate some fields logically?

avatar ciar4n
ciar4n - comment - 10 May 2020

For you what would be the ideal solution? The current does not offer much control where a column break should happen

avatar johndeutesfeld johndeutesfeld - test_item - 4 Aug 2020 - Tested successfully
avatar johndeutesfeld
johndeutesfeld - comment - 4 Aug 2020

I have tested this item successfully on d14bac8

I tested it on a wide screen and got the desired 2 column layout.

Maybe the expected result in the original post should be updated so new testers don't get confused.


This comment was created with the J!Tracker Application at issues.joomla.org/tracker/joomla-cms/28790.

avatar vlaucht vlaucht - test_item - 4 Aug 2020 - Tested successfully
avatar vlaucht
vlaucht - comment - 4 Aug 2020

I have tested this item successfully on d14bac8

2 column layout was displayed correctly.
Labels should be in one line to prevent layout issues
alignment


This comment was created with the J!Tracker Application at issues.joomla.org/tracker/joomla-cms/28790.

avatar roland-d
roland-d - comment - 5 Aug 2020

@coolcat-creations What do you think of the screenshot by @vlaucht ? Doesn't look pretty I think :)

avatar coolcat-creations
coolcat-creations - comment - 5 Aug 2020

@roland-d
no it does not... I am unfortunately not able to work on this because of my Joomla teaching activy right now :-( Anyway I am not sure if this PR should not even be closed because I think we need something like a Colum Break marker in the XML or something to define where the colums may begin first... ?

Add a Comment

Login with GitHub to post a comment