? Pending

User tests: Successful: Unsuccessful:

avatar ciar4n
ciar4n
9 Apr 2020

This PR rewrites the CSS for searchtools. The current CSS is a bit of a mess and hugely excessive. Here we remove 300+ lines of SCSS. Style changes are minimal but in general, should look the same.

Apply this patch and run node build.js --compile-css for updating the changed SCSS. Check searchtools are displaying correctly.

image

avatar ciar4n ciar4n - open - 9 Apr 2020
avatar ciar4n ciar4n - change - 9 Apr 2020
Status New Pending
avatar joomla-cms-bot joomla-cms-bot - change - 9 Apr 2020
Category Administration Templates (admin) Front End com_config Layout
avatar ciar4n ciar4n - change - 9 Apr 2020
The description was changed
avatar ciar4n ciar4n - edited - 9 Apr 2020
avatar brianteeman
brianteeman - comment - 9 Apr 2020

Can you look at some of the changes I made here #28461

Obviously not the code but the results

avatar ciar4n
ciar4n - comment - 9 Apr 2020

Can you look at some of the changes I made here #28461
Obviously not the code but the results

Probably outside the scope of this PR. I can take look after this if you wish. Currently, I count 4 different types of downward chevrons in the J4 admin.

avatar ciar4n ciar4n - change - 9 Apr 2020
Labels Added: ?
avatar brianteeman
brianteeman - comment - 9 Apr 2020

The reason for the suggestion is to make all the selects in the searchtools have a similar look

avatar ciar4n
ciar4n - comment - 9 Apr 2020

The reason for the suggestion is to make all the selects in the searchtools have a similar look

Your suggestion makes sense. I think all chevrons throughout the UI should look the same, so whatever that is, lets replicate everywhere,

avatar brianteeman
brianteeman - comment - 9 Apr 2020

Agreed. I tried with the chevrons, border-radius, focus etc but its a bit beyond me to do it as efficiently as you.

avatar infograf768
infograf768 - comment - 9 Apr 2020

Note: the xtd are also using searchtools in cassiopea.

avatar wilsonge wilsonge - change - 9 Apr 2020
Status Pending Fixed in Code Base
Closed_Date 0000-00-00 00:00:00 2020-04-09 13:11:25
Closed_By wilsonge
avatar wilsonge wilsonge - close - 9 Apr 2020
avatar wilsonge wilsonge - merge - 9 Apr 2020
avatar wilsonge
wilsonge - comment - 9 Apr 2020

Merging this as a start point. If you could review the chevrons to be consistent that would be excellent.

avatar ciar4n
ciar4n - comment - 9 Apr 2020

Note: the xtd are also using searchtools in cassiopea.

I create a separate PR for the frontend. Any idea why this is separate CSS?

avatar richard67
richard67 - comment - 9 Apr 2020

@wilsonge Merging this has broken npm ci:

Error: Undefined variable: "$white".
        on line 34 of administrator/templates/atum/scss/system/searchtools/searchtools.scss
>>     background-color: $white;

   ----------------------^

Segmentation fault (core dumped)

The reason is that this PR here has removed the import for variables.scss from the top of the searcthools.scss file but still uses a variable $white.

@ciar4n Please advise so I can make PR, or please make PR yourself: Shall we add back the import of "../../variables" or shall we change the variable to a hard-coded value?

avatar Fedik
Fedik - comment - 9 Apr 2020

Any idea why this is separate CSS?

@ciar4n you can find the pull #27416 and a reason somewhere in discussion there #27384 😉

avatar ciar4n
ciar4n - comment - 9 Apr 2020

Thx @Fedik 👍

avatar ciar4n
ciar4n - comment - 9 Apr 2020

@richard67 Replacing $white with white should be fine. That or add back in the variables import. I'll create a PR later if not fixed in the meantime (afk).

avatar ciar4n
ciar4n - comment - 9 Apr 2020
avatar ciar4n
ciar4n - comment - 9 Apr 2020

Anyone have any idea how to display the 'searchtools' in the frontend?

avatar brianteeman
brianteeman - comment - 9 Apr 2020

when you are editing an article in the frontend click on one of the xtd-editor buttons eg menu link

avatar ciar4n
ciar4n - comment - 9 Apr 2020

Thanks 👍

avatar infograf768
infograf768 - comment - 10 Apr 2020

@ciar4n
See #28248 and follow-up PRs where I added searchtools

avatar ciar4n
ciar4n - comment - 10 Apr 2020

PR for frontend searchtools... #28622

avatar infograf768
infograf768 - comment - 11 Apr 2020

@ciar4n
Is this responsible for Menu Items manager
Screen Shot 2020-04-11 at 09 19 32
and the Clear button same colour as Filter Options when a filter is applied?
Screen Shot 2020-04-11 at 09 22 11

avatar infograf768
infograf768 - comment - 11 Apr 2020

It also gives same oddity when using the menus xtd

reverting the PR solves the issues.

avatar ciar4n
ciar4n - comment - 11 Apr 2020

Thx @infograf768. #28644 should resolve these issues.

Add a Comment

Login with GitHub to post a comment