sanity-io / orderable-document-list

Drag-and-drop Document Ordering without leaving the Editing surface
MIT License
75 stars 22 forks source link

Studio theme colors are not cohesive on list item hover #60

Closed ndimatteo closed 1 year ago

ndimatteo commented 1 year ago

When hovering over a list item, the studio theme styles are applied but there appears to be a background color applied behind the title + subtitle in the list item (for both light/dark mode):

image image
martinkz commented 1 year ago

I have the same issue (using the latest Sanity studio) and had to create a global css style to override those differences. This is what I put in it in order to make the orderable Document list look like the regular Document lists:

#box-orderable-box-0 {
  max-width: 350px;
}
#box-orderable-box-0 [data-ui='Card'] {
  background-color: transparent;
}

You can import the custom css file in your sanity.config.js:

import './customOverrides.css'
sn4h commented 1 year ago

This probably breaks something but with the same procedure as @martinkz:

[data-ui='Card'],
[data-ui='Flex'] {
    background-color: transparent !important;
}
maxstoyanov commented 1 year ago

Confirmed. The bug appears on the light and dark default theme. (Using version 1.0.4 with studio 3.12.2)