Joomla! Issue Tracker - CMS

Download
Launch
Feeling Lucky

[#28627] - [4.0][Atum] Rewrite alert CSS

? ? Pending

User tests: Successful: Unsuccessful:

avatar ciar4n
ciar4n
10 Apr 2020

Rewrites Atums CSS for the alert custom element. Streamlines the CSS and removes the import from upstream.

I don't know if these changes should be made upstream or not. I just went for the easier option.

Apply pr and run node build.js --compile-css to update SCSS. Check alerts display correctly.

avatar ciar4n ciar4n - open - 10 Apr 2020
avatar ciar4n ciar4n - change - 10 Apr 2020
Status New ⇒ Pending
avatar joomla-cms-bot joomla-cms-bot - change - 10 Apr 2020
Category ⇒ Administration Templates (admin)
avatar ciar4n ciar4n - change - 10 Apr 2020
The description was changed
avatar ciar4n ciar4n - edited - 10 Apr 2020
avatar Quy
Quy - comment - 10 Apr 2020

Installing sample data:

BEFORE:
28627-before

AFTER:
28627-after

avatar ciar4n ciar4n - change - 10 Apr 2020
Labels Added: ?
avatar ciar4n
ciar4n - comment - 10 Apr 2020

Ok. So there is 2 different styles of alerts in the same UI.

I've added back in the import. Should be fine now.

avatar ciar4n ciar4n - change - 10 Apr 2020
The description was changed
avatar ciar4n ciar4n - edited - 10 Apr 2020
avatar ciar4n ciar4n - change - 10 Apr 2020
The description was changed
avatar ciar4n ciar4n - edited - 10 Apr 2020
avatar ciar4n ciar4n - change - 10 Apr 2020
The description was changed
avatar ciar4n ciar4n - edited - 10 Apr 2020
avatar jwaisner
jwaisner - comment - 10 Apr 2020

I have tested this item ✅ successfully on 60971ff

Alert messages look good and functionality remains for the rest of the CMS.

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

avatar jwaisner jwaisner - test_item - 10 Apr 2020 - Tested successfully
avatar infograf768
infograf768 - comment - 11 Apr 2020

Close button now misplaced in RTL.

Screen Shot 2020-04-11 at 08 28 27

instead of

Screen Shot 2020-04-11 at 09 05 48

avatar infograf768
infograf768 - comment - 11 Apr 2020

The issue comes from

html[dir=rtl] joomla-alert .joomla-alert--close,
html[dir=rtl] joomla-alert .joomla-alert-button--close {
  right: auto;
  left: -1.25rem;
  float: left; }

which is added by
/node_modules/joomla-ui-custom-elements/dist/css/joomla-alert.css

avatar infograf768
infograf768 - comment - 11 Apr 2020

Also, compiling instead of creating

[dir=rtl] #system-message-container joomla-alert .joomla-alert--close,
[dir=rtl] #system-message-container joomla-alert .joomla-alert-button--close {
      right: auto;
      left: 0; }

Creates

 #system-message-container joomla-alert .joomla-alert--close [dir=rtl],
 #system-message-container joomla-alert .joomla-alert-button--close [dir=rtl] {
      right: auto;
      left: 0; }

which anyway can't work...

b473ffc 11 Apr 2020 avatar ciar4n rtl
avatar ciar4n
ciar4n - comment - 11 Apr 2020

Thx @infograf768. Missing a &.. b473ffc

Should be fine now.

avatar infograf768
infograf768 - comment - 12 Apr 2020

I have tested this item ✅ successfully on b473ffc

RTL solved.

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

avatar infograf768 infograf768 - test_item - 12 Apr 2020 - Tested successfully
avatar infograf768 infograf768 - change - 12 Apr 2020
Status Pending ⇒ Ready to Commit
avatar infograf768
infograf768 - comment - 12 Apr 2020

RTC

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

avatar infograf768
infograf768 - comment - 12 Apr 2020

Restarted drone. Appveyor anyway broken.
@wilsonge

OK to merge

avatar wilsonge wilsonge - change - 12 Apr 2020
Status Ready to Commit ⇒ Fixed in Code Base
Closed_Date 0000-00-00 00:00:00 ⇒ 2020-04-12 14:23:30
Closed_By ⇒ wilsonge
Labels Added: ?
avatar wilsonge wilsonge - close - 12 Apr 2020
avatar wilsonge wilsonge - merge - 12 Apr 2020

Add a Comment

Login with GitHub to post a comment