/* * 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-olivesvoices-solrsearchcontentsearchresultspagerforsearchpage { margin-bottom: 0; }