Problem/Motivation

The view content is set as display: grid due to changes from 3365367 in views.css which breaks views layout with pager. example on the screehshot.

Steps to reproduce:
- Standard Drupal 10.3.1 installation with Olivero as default theme
- Create multiple nodes (e.g., of type Basic page)
- Create a view of content (Basic page), it could be Page or Block (have not tried others)
- Set the pager to full pager and maintain the 'number of items per page', making sure you have more nodes than fit on one page
- The display Format style doesn't matter - it can be table or content output
- Look at the view output in Olivero with full pager and then with mini
- Add an exposed filter to the view display
- Add header with "Global: Text area (Global: Text area)" with random text to the view
- Look again at the view output in Olivero with full pager and then with mini

Proposed resolution

Remove display:grid and its related props from views.css

Remaining tasks

User interface changes

Before:

After:

Issue fork drupal-3465399

Command icon Show commands

Start within a Git clone of the project using the version control instructions.

Or, if you do not have SSH keys set up on git.drupalcode.org:

Comments

SergeyShadrin created an issue. See original summary.

ahsannazir’s picture

Not able to reproduce the issue at my end. Can you please add the detailed steps to reproduce the issue.

cilefen’s picture

Status: Active » Postponed (maintainer needs more info)
Issue tags: -views +Needs steps to reproduce
aschiwi’s picture

StatusFileSize
new251.87 KB
new162.42 KB
new209.82 KB
new831.24 KB

The same problem brings me here.
To reproduce:

- Standard Drupal 10.3.1 installation with Olivero as default theme
- Create three nodes of type Basic page
- Create a view of content (Basic page), it could be Page or Block (have not tried others)
- Set the pager to full pager and show two items
- It doesn't matter if it's a table or content output
- I do not have a filter
- Look at the view output in Olivero with full pager and then with mini

I have attached screenshots:
- Output with mini pager
- Output with full pager
- My simple view configuration to reproduce

aschiwi’s picture

Status: Postponed (maintainer needs more info) » Active
Issue tags: -Needs steps to reproduce

Setting status to Active and removing the issue tag because I think it can be reproduced with my info.

ahsannazir’s picture

Status: Active » Needs review
StatusFileSize
new399.32 KB
new172.48 KB

Removed the display:grid styles from .view, .view-content.

manibharathi ezhimalai ravi’s picture

StatusFileSize
new306.8 KB
new333.72 KB

Hi,
I've reviewed the MR !9173 on Drupal 10.3.

Testing Steps:

  1. Create a view of content, it could be Page or Block
  2. Set the pager to full pager and show two items
  3. Look at the view output in Olivero with full pager and then with mini

Test Results

Content are looking properly displaying inline in the mini pager and Full pager settings.

smustgrave’s picture

Version: 10.3.x-dev » 11.x-dev
Status: Needs review » Needs work
Issue tags: +Needs issue summary update

Issue summary is incomplete. Should follow standard template

ahsannazir’s picture

Issue summary: View changes
ahsannazir’s picture

Status: Needs work » Needs review
dishakatariya’s picture

Hi, I have verified this issue in the D11.x-dev version with latest MR applied cleanly and working as expected.

Testing Steps:
1. Standard Drupal 11.x-dev vesrion installation with Olivero as default theme
2. Create three or more nodes of type Basic page
3. Create a view of content (Basic page), it could be Page or Block (have not tried others)
4. Set the pager to full pager and show two items
5. It doesn't matter if it's a table or content output
6. Look at the view output in Olivero with full pager and then with mini

Testing Results:
Content are looking properly displaying inline in the Full pager settings with the two paged items.

Attaching the screenshots.

Keeping in the needs review for the detail review of the summary and code.

dishakatariya’s picture

StatusFileSize
new106.62 KB
new55.31 KB
marc.bau’s picture

You patch helped a bit, but I see more issues - if full pager is shown. With mini pager the issues are not shown.

  1. Create a view with a header "Global: Text area (Global: Text area)" - this is not required, but makes it more worse.
  2. Set one Filter criteria "exposed" (required)
  3. Output a table with one or more columns
  4. and a full pager (required) - the pager must be shown - otherwise you do not see the broken page.

Tested with 10.3.2

smustgrave’s picture

Status: Needs review » Needs work

Per #14

ahsannazir’s picture

@marc.bau I have followed the steps mentioned in #14 but was not able to reproduce it.
Could you please add a screen capture to see what exactly looks broken

shweta__sharma’s picture

As per #16 adding tag STR

marc.bau’s picture

StatusFileSize
new132.21 KB
  1. Install 10.3.2 with Umami Profile
  2. Switch theme to oliviero
  3. Create test view as page with FULL pager at path "/test-1"
  4. Edit "content type" to be EXPOSED in the view
  5. Add header with "Global: Text area (Global: Text area)" with random text to the view
  6. Save
  7. Open "/test-1" path

Test

krisahil’s picture

Attaching static patch from the state of the MR https://git.drupalcode.org/project/drupal/-/merge_requests/9173 today (at commit 3fe50913). (I prefer a static patch because, if you link directly to the patch endpoint on Gitlab (e.g., https://git.drupalcode.org/project/drupal/-/merge_requests/9173.patch), you might get newer commits that you don't want).

nikhil_110’s picture

I am confused about whom to provide the steps to, as the steps have already been provided, and now that I have added the STR tag according to point #17, the process of conversion is confusing because the two Drupal profiles involved are different, and I am unsure how to proceed with the conversion due to these differences, so I would appreciate it if you could provide the correct details and further clarification on how to handle this situation appropriately.

brookfield’s picture

I'm uncertain if this is helpful because it repeats the finding of @marc.bau.
Drupal 10.4.0
Create view with header content, exposed filter, table, full pager.
before
After commenting line 15 of views.css in either Firefox or Edge
after

quietone credited boobaa.

quietone credited yuvania.

quietone’s picture

johnv’s picture

Title: Views incorrect display with filters, table and full pager » Olivero Full pager display incorrect on table with filters
johnv’s picture

Issue summary: View changes
Status: Needs work » Needs review
Issue tags: -Needs issue summary update, -Needs steps to reproduce

The following issues are duplicates, having competing solution proposals:

I cannot judge which solution proposal is best. I guess the second one.

Issue summary is now updated with better screenshots and steps to reproduce, so removing tags.

smustgrave’s picture

Status: Needs review » Needs work

Fixes should be in correct MR

catch’s picture

Status: Needs work » Reviewed & tested by the community
catch’s picture

Status: Reviewed & tested by the community » Closed (duplicate)

Actually moving to duplicate now. Trying out the new 'assign credit on closed issues' rather than transferring over.