Hi Adminimal team,

on joined screenshots you notice there's a display issue when using the last Adminimal theme when items are draggable.
I never see that with previous versions.
The draggable symbols are correctly displayed if the Seven theme is used for administration pages.

Could you please tell me how to fix this issue that decreases the usability?

CommentFileSizeAuthor
#20 adminimal_theme-restore_tabledrag_icon-8.x-3061105.patch331 bytesrealkevinoshea
#16 adminimal_theme-restore_tabledrag_icon-3061105-16.patch425 bytesbskibinski
#11 restore_tabledrag_icon-3061105-11.patch557 byteskpaxman
#3 3061105-3.patch710 bytesmahenkvyas22
seven.jpeg8.73 KBwebmestre
adminimal.jpeg6.27 KBwebmestre

Comments

webmestre created an issue. See original summary.

webmestre’s picture

webmestre commented

NO skin displays the icon correctly: default, dark, material, alternative

mahenkvyas22’s picture

mahenkvyas22 commented
StatusFileSize
new 3061105-3.patch710 bytes

@webmestre try this patch.

webmestre’s picture

webmestre commented

Hi Mahenkvyas22,

thanks to be so reactive.
I noticed the display is correct in the core Seven theme. Why do you want to patch the drupal core /modules/system/system.base.css file?

mahenkvyas22’s picture

mahenkvyas22 commented
Status: Active » Needs review
mahenkvyas22’s picture

mahenkvyas22 commented

Hi webmestre,

After this patch drag icon is shown in Adminimal - Responsive Administration Theme.
And it does not affect the core theme.

webmestre’s picture

webmestre commented
Status: Needs review » Active

The proposed changes writen in the #3 patch fixed the display issue.
I applied them manually, not using the patch file.
No secondary issue is produced when using Seven as admin theme.

Question: will you produce a specific patch for the adminimal_theme? Or will I have to patch the drupal core /modules/system/system.base.css file every time?

mahenkvyas22’s picture

mahenkvyas22 commented

@webmestre it's alternative is you need to copy

draggable.png

From

../misc/draggable.png

and past it on your adminmal theme at../../adminimal_theme/css/images/

And add this

a.tabledrag-handle .handle {
  background: url(../../adminimal_theme/css/images/draggable.png) no-repeat 0px 0px;
  margin: 0.2em 0.5em; /* LTR */
}
a.tabledrag-handle-hover .handle {
  background-position: 0px 0px;
}

in your adminimal theme

style.css

file.

Hope so this alternative is working for you in a temporary base.
Thanks.

webmestre’s picture

webmestre commented

Hi,

the #8 solution works fine.
Waiting now for a complete patch in the new release. ;)

Mr. Red’s picture

Mr. Red commented

Add this code to the file ..\sites\default\files\administrative-custom.css, and enable the option "Extend Adminimal with Custom CSS."in theme settings (/admin/appearance/settings/adminimal).

a.tabledrag-handle .handle {
    background-position: 0 0;
    margin: 0.2em 0.5em; /* LTR */
}
a.tabledrag-handle-hover .handle {
    background-position: 0px 0px;
}
kpaxman’s picture

kpaxman commented
Version: 7.x-1.26 » 7.x-1.x-dev
Status: Active » Needs review
StatusFileSize
new restore_tabledrag_icon-3061105-11.patch557 bytes

I've confirmed this issue is still present in the dev branch, so I've updated the version metadata.

Attached is a patch that incorporates the changes from #10, in a way that I think lines up with how the CSS is laid out. With this patch, there should be no need to make changes to core, or to copy images around, as suggested in previous comments.

As this patch seems to fix things for us, setting this issue to "needs review". Please do! (And reply and set this issue to RTBC is you agree that it works.)

kpaxman’s picture

kpaxman commented

It should be noted that this worked in 7.x-1.25, and I did a quick search and couldn't figure out what broke it.

liam morland’s picture

liam morland
Primary language English
Location Ontario, CA 🇨🇦
commented

You could try git bisect.

proteo’s picture

proteo commented
Status: Needs review » Reviewed & tested by the community

Thanks @kpaxman, the patch in #11 fixes the problem.

emerham’s picture

emerham commented

This patch does solve the issue of the table drag handle now showing up on the page. I do have a code standard nitpick in the hover function

.adminimal-theme a.tabledrag-handle-hover .handle {
    background-position: 0px 0px;
}

it should just be 0 0 as the `px` is redundant and follows Drupal's code standards.

bskibinski’s picture

bskibinski
Primary language Dutch
Location Breda, The Netherlands
commented
StatusFileSize
new adminimal_theme-restore_tabledrag_icon-3061105-16.patch425 bytes

Patch #11 breaks hover states.
Also there is a better way: adminimal puts a box-sizing: border-box; on most of the things. This breaks the handles.
Added CSS to make the handles adhere to box-sizing: content;.
This way, we don't override the Drupal core theming should they change the handles, it should still work properly.

box-sizing doesn't need prefixed anymore: http://shouldiprefix.com/#box-sizing

Arguably, perhaps drupal core should be patched too: border-box: border-box; is the 'default' setting these days. If an element needs content-box, it should be attached to it. I'll raise the issue there.

bskibinski’s picture

bskibinski
Primary language Dutch
Location Breda, The Netherlands
commented
Status: Reviewed & tested by the community » Needs review

changed issue to "needs review".

emerham’s picture

emerham commented
Status: Needs review » Reviewed & tested by the community

Tested and it works, hover effects are there. Looks good to me.

phily’s picture

phily
he/him
Primary language French
Location 🇪🇺🇫🇷 Paris, France
commented

Patch #16 works for me using Drupal 7.67 and Adminimal 7.x-1.26
Thanks

Edit: tested over 4 websites with success.

realkevinoshea’s picture

realkevinoshea commented
StatusFileSize
new adminimal_theme-restore_tabledrag_icon-8.x-3061105.patch331 bytes

Same patch rolled for 8.x.

nmangold’s picture

nmangold commented

Confirming patch #16 works for me using Drupal 7.67 and Adminimal 7.x-1.26.

andrtroe’s picture

andrtroe commented
Assigned: Unassigned » andrtroe
.bert’s picture

.bert commented

Also confirming patch #16 works on 7.72 and Adminimal 7.x-1.26. This seems like the best approach to resolve the specific issue.

phily’s picture

phily
he/him
Primary language French
Location 🇪🇺🇫🇷 Paris, France
commented

Patch works but for who not willing/able to patch, this can be solved by editing the adminimal-custom.css file:

  1. go to Adminimal theme settings (admin/appearance/settings/adminimal) to check 'Extend Adminimal with Custom CSS' checkbox
  2. in your site "files" folder create or edit the adminimal-custom.css file and add the following content

.adminimal-theme a.tabledrag-handle .handle { box-sizing: content-box; }

Handles are fixed.

Anonymous’s picture

Anonymous (not verified) commented

Add this code in adminimal.css file

.adminimal a.tabledrag-handle .handle {
  box-sizing: content-box;
}

 .adminimal .link.tabledrag-toggle-weight {
   margin-bottom: 0.3em;
 }