Drupal
/
drupal
mirror of https://git.drupalcode.org/project/drupal.git
1
0
Fork 0
Code Issues Projects Releases Wiki Activity

Issue #3300941 by mherchel, cindytwilliams, Manibharathi E R, Chi: Claro: Views UI layout is not aligned correctly

merge-requests/2660/head
Lauri Eskola 2022-08-05 15:25:12 +03:00
parent 0603b8c233
commit 1544b1decd
No known key found for this signature in database
GPG Key ID: 382FC0F5B0DF53F8
2 changed files with 24 additions and 13 deletions
Show Stats Download Patch File Download Diff File Expand all files Collapse all files

20
core/themes/claro/css/components/details.css
View File

@ -43,19 +43,25 @@
.claro-details {
display: block;
/* The following width and min-width values ensure that the <details> element
* does not shift widths when opening, in the event that a parent element
* constrains the width. This can happen when toggling the "lazy-load" option
* within an image field. */
width: min-content;
min-width: 100%;
margin-top: var(--space-m);
margin-bottom: var(--space-m);
color: var(--color-text);
border: var(--details-border-size) solid var(--details-border-color);
border-radius: var(--details-border-size-radius);
background-color: var(--color-white);
box-shadow: var(--details-box-shadow);
box-shadow: var(--details-box-shadow)
/*
* The following width and min-width values ensure that the <details> element
* does not shift widths when opening, in the event that a parent table
* element constrains the width. This can happen when toggling the
* "lazy-load" option within an image field.
*/
}
td .claro-details {
width: min-content;
min-width: 100%
}
.claro-details--accordion-item,

17
core/themes/claro/css/components/details.pcss.css
View File

@ -36,12 +36,6 @@
.claro-details {
display: block;
/* The following width and min-width values ensure that the <details> element
* does not shift widths when opening, in the event that a parent element
* constrains the width. This can happen when toggling the "lazy-load" option
* within an image field. */
width: min-content;
min-width: 100%;
margin-top: var(--space-m);
margin-bottom: var(--space-m);
color: var(--color-text);
@ -49,6 +43,17 @@
border-radius: var(--details-border-size-radius);
background-color: var(--color-white);
box-shadow: var(--details-box-shadow);
/*
* The following width and min-width values ensure that the <details> element
* does not shift widths when opening, in the event that a parent table
* element constrains the width. This can happen when toggling the
* "lazy-load" option within an image field.
*/
@nest td & {
width: min-content;
min-width: 100%;
}
}
.claro-details--accordion-item,