[4.0] switcher legend alignment

[brianteeman]

make sure that the switcher is always left aligned

before

after

[brianteeman]

updated branch to trigger appveyor to run again as the error in appveyor was infrastructure and nothing to do with this pr

[infograf768]

We need specific switcher css for rtl as it is really broken in rtl (same in new admintemplate)

[brianteeman]

Everything in the new admin template is broken. There is no point doing any RTL fixes until they finish deciding what a form should look like.

[infograf768]

FYI, we also have issue concerning LTR for the existing code here.

.col-md-9 .switcher__legend {
   margin-left: -220px;
 }

breaks the switcher in new admin template when editing a module:

If taken away, we rightfully get

Therefore is it really useful to correct anything concerning switcher in this branch?

[brianteeman]

Already raised am issue on their repo. But as their repo is pretty messed up it's probably a waste of time

[chmst]

I have tested this item ✅ successfully on fe6a353

Can you give me the link to your issue on "their" repo?

---

_{This comment was created with the J!Tracker Application at issues.joomla.org/tracker/joomla-cms/24802.}

[brianteeman]

joomla/backend-template#170 (comment)

[chmst]

thx

[richard67]

I have tested this item ✅ successfully on fe6a353

---

_{This comment was created with the J!Tracker Application at issues.joomla.org/tracker/joomla-cms/24802.}

[ghost]

Status "Ready To Commit".

[brianteeman]

Thanks

[Quy]

Please fix the switcher alignment when in the sidebar (ie edit article).

[ghost]

@Quy can you please open a new Issue?

[infograf768]

PR should be simple (for the admin template we have now...)
Move in switcher.scss

.col-md-3 .switcher__legend {
  margin-left: 0;
}

after

.col-md-9 .switcher__legend,
.col-md-12 .switcher__legend {
  margin-left: -220px;
}

[chmst]

It is fixed. Did you run npm i?

[brianteeman]

you beat me too it @chmst

[infograf768]

I did
As I said, the order counts.

[brianteeman]

Works for me

[infograf768]

I use firefox macintosh and this is what exactly happens:

.col-md-9 .switcher__legend,
.col-md-12 .switcher__legend {
  margin-left: -220px;
}

is overriding .col-md-3

[brianteeman]

I can see it now after another rebuild
I will take a look at why later today. It makes no sense that that css is being used when it is a col-md-3

[infograf768]

Apologies are accepted.

[infograf768]

No need to look why. It is pretty obvious
Basically, as

.col-md-12 .switcher__legend {
  margin-left: -220px;
}

is loaded after col-md-3
it overrides it.

[brianteeman]

Not obvious to me as col-md-3 is more specific so should be the one used as far as I understand CSS. I will not submit a pr myself without understanding why

[Bakual]

The problem is likely that there is also an element with col_md-12 somewhere up the tree. In this case both CSS rules have the same specificity (a class as the child of another class). It doesn't matter which parent class is "closer" in the tree.
And since they are equal, the later wins.

[infograf768]

Exact. Creating patch now

[infograf768]

See #24993