79 lines
2.1 KiB
79 lines
2.1 KiB
/* |
|
* DO NOT EDIT THIS FILE. |
|
* See the following change record for more information, |
|
* https://www.drupal.org/node/3084859 |
|
* @preserve |
|
*/ |
|
|
|
/** |
|
* @file |
|
* Responsive styles for views grid horizontal layout. |
|
* |
|
* This creates the correct count of columns and automatically resizes the |
|
* grid-items to fit into it. The grid-items will flow onto the next row when |
|
* they reach the --views-grid-item--min-width value. |
|
*/ |
|
|
|
.views-view-grid { |
|
--views-grid--layout-gap: var(--sp); |
|
--views-grid--column-count: 4; /* Will be overridden by an inline style. */ |
|
--views-grid-item--min-width: 6.25rem; |
|
} |
|
|
|
.views-view-grid--horizontal { |
|
/** |
|
* Calculated values. |
|
*/ |
|
--views-grid--gap-count: calc(var(--views-grid--column-count) - 1); |
|
--views-grid--total-gap-width: calc( |
|
var(--views-grid--gap-count) * var(--views-grid--layout-gap) |
|
); |
|
--views-grid-item--max-width: calc( |
|
(100% - var(--views-grid--total-gap-width)) / |
|
var(--views-grid--column-count) |
|
); |
|
|
|
display: grid; |
|
grid-template-columns: repeat( |
|
auto-fill, |
|
minmax( |
|
max(var(--views-grid-item--min-width), var(--views-grid-item--max-width)), |
|
1fr |
|
) |
|
); |
|
grid-gap: var(--views-grid--layout-gap); |
|
} |
|
|
|
.views-view-grid--vertical { |
|
margin-block-end: calc( |
|
-1 * var(--views-grid--layout-gap) |
|
); /* Offset the bottom row's padding. */ |
|
column-width: var(--views-grid-item--min-width); |
|
column-count: var(--views-grid--column-count); |
|
column-gap: var(--views-grid--layout-gap); |
|
} |
|
|
|
.views-view-grid--vertical .views-view-grid__item > * { |
|
padding-block-end: var(--views-grid--layout-gap); |
|
page-break-inside: avoid; |
|
break-inside: avoid; |
|
} |
|
.view-solr-search-content { |
|
.views-view-grid--horizontal .views-view-grid__item { |
|
border: 1px solid #ccc; |
|
padding: 10px 5px; |
|
justify-content: space-around; |
|
display: flex; |
|
.views-field.views-field-did-image { |
|
display: flex; |
|
justify-content: space-around; |
|
} |
|
.views-field-title { |
|
margin: 1rem 0; |
|
font-weight: bold; |
|
} |
|
} |
|
} |
|
div#block-olivesimagined-solrsearchcontentsearchresultspagerforsearchpage { |
|
margin-bottom: 0; |
|
}
|
|
|