Problem/Motivation

When this module is used with the Gin Toolbar module extra space appears above the page in the preview pane (highlighted in red):

Proposed resolution

Tweak the CSS this module provides, to hide the unneeded spaces.

CommentFileSizeAuthor
#17 Screenshot 2023-07-25 at 8.54.57 AM.png2.28 MBmandclu
#17 Screenshot 2023-07-25 at 8.55.35 AM.png1.12 MBmandclu
#11 Screenshot at Jun 09 08-16-27.png353.23 KBbrianperry
Screenshot 2023-03-19 at 4.57.21 AM.png181.67 KBmandclu

Issue fork same_page_preview-3348897

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:

About issue forks

Comments

mandclu created an issue. See original summary.

mandclu opened merge request !17

mandclu’s picture

mandclu commented
Status: Active » Needs review

Turns out the space at the bottom was just the background showing where the node display wasn't long enough to cover, so nothing to worry about. I created a merge request that should remove the unneeded spacing at the top.

brianperry made their first commit to this issue’s fork.

brianperry’s picture

brianperry
he/him
commented

Having trouble duplicating this on the latest 1.0.x. Is there anything non-default about either of these themes?

mandclu’s picture

mandclu commented

I was using the default, vertical toolbar for Gin. I imagine that it would be different if you were using the horizontal toolbar for Gin it might not need this, but not sure.

Theoretically it might be possible to recode this to look for classes that start with the name of the current admin theme, but not sure how many other admin themes would follow this convention.

Certainly wouldn't hurt to leave the issue open for more feedback.

mandclu’s picture

mandclu commented

Oh forgot to mention: part of this patch also removes from the render array a "node_preview" section that in my testing was empty but still had padding, and contributed half of the observed blank space at the top. Since it didn't seem to be doing anything useful (and targetting it via CSS wasn't working for me) I decided to remove it entirely.

mandclu’s picture

mandclu commented
Title: Unnecessary padding when used with the Gin admin theme » Unnecessary padding from toolbar classes

I realized that the extra padding was actually introduced by the Gin Toolbar module instead of the theme itself. So if you're using the theme without the module, that could account for not seeing the extra spacing.

I've update the MR to target the class exclusion based on the word 'toolbar' instead of looking for the 'gin--' pattern.

mandclu’s picture

mandclu commented
Issue summary: View changes
brianperry’s picture

brianperry
he/him
commented

Confirmed that this is still an issue.

brianperry’s picture

brianperry
he/him
commented
Title: Unnecessary padding from toolbar classes » Unnecessary padding from toolbar classes (Gin Toolbar Support)
StatusFileSize
new Screenshot at Jun 09 08-16-27.png353.23 KB

Also noticed that with Gin toolbar disabled the styles on the header of the new window preview are disrupted. Perhaps this could become more of a 'support Gin Toolbar' issue.

DieterHolvoet made their first commit to this issue’s fork.

DieterHolvoet opened merge request !49

dieterholvoet’s picture

dieterholvoet commented

I started a new MR targeting 2.1.x. Since this is now stripping all classes containing the word 'toolbar', including e.g. Admin Toolbar related classes, maybe we should keep this issue focused on that and open any follow-up issues for Gin incompatibilities?

dieterholvoet’s picture

dieterholvoet commented
Version: 1.0.x-dev » 2.1.x-dev
mandclu’s picture

mandclu commented

I agree with the approach of using a separate issue to target Gin compatibility more broadly, and keep this one more focused on toolbar padding specifically.

mandclu’s picture

mandclu commented
Status: Needs review » Needs work
StatusFileSize
new Screenshot 2023-07-25 at 8.55.35 AM.png1.12 MB
new Screenshot 2023-07-25 at 8.54.57 AM.png2.28 MB

With this patch applied, I still see padding at the top of the page in Gin:

The culprit seems to be an empty div for the secondary toolbar, which Gin assigns a height:

dieterholvoet’s picture

dieterholvoet commented
Status: Needs work » Needs review

I rebased the MR, not sure if anything else needs to be done here.

dieterholvoet changed the visibility of the branch 2.1.x to hidden.

dieterholvoet changed the visibility of the branch 3348897-unnecessary-padding-when to hidden.

dieterholvoet’s picture

dieterholvoet commented
Status: Needs review » Closed (outdated)

Seems like this has been added in 3.0.0-beta1:

// Remove toolbar-related CSS classes from body element.
if (isset($variables['attributes']['class'])) {
  $variables['attributes']['class'] = array_filter(
    $variables['attributes']['class'],
    fn($class) => !in_array($class, [
      'toolbar-loading',
      'toolbar-fixed',
      'toolbar-horizontal',
      'toolbar-vertical',
    ])
  );
}

Now that this issue is closed, review the contribution record.

As a contributor, attribute any organization that helped you, or if you volunteered your own time.

Maintainers, credit people who helped resolve this issue.