J4 Issue ?
avatar Scrabble96
Scrabble96
9 Sep 2019

Steps to reproduce the issue

1: create a custom module with some content and assign it to banner position, or
2: create a banner component and banner module and assign it to the banner position

Expected result

Completely visible banner module

Actual result

  1. Custom modules assigned to the banner position are overlayed with a grey shadow and also the wavy cut-out:

1-custom-banner-added-shadow

with the shadow removed (using FF inspector) it looks like this:

2-custom-banner-header-shadow-removed

And with .header-shape-bottom removed it looks like this:
3-custom-banner-no-shadow-no-shape

Which is probably how it should look.

  1. A banner component in a banner module does not display at all. All you see is the header shadow, no banner content and a large 3em margin:

4-banner-component

Although there are two classes added, i.e. <div class="mod-banners bannergroup"> those classes are empty as they do not exist in the css.

What purpose does the .header-shadow serve? It is only applied to the container-banner. Why would you want to cover up a banner with a shadow? The code is here:

.header-shadow {
display: none;
pointer-events: none;
.container-banner + & {
position: absolute;
right: 0;
bottom: 0;
left: 0;
display: block;
height: 180px;
content: "";
background-image: linear-gradient(0deg, rgba(0,0,0,.5) 0%, transparent 100%);
}
}

As well as the shadow and the wavy line, there must be several other pieces of code that are interfering with the display of banners as seems also to have a height of 0 which is coming from somewhere.

System information (as much as possible)

Alpha12Dev nightly update 09.09.19

Additional comments

avatar Scrabble96 Scrabble96 - open - 9 Sep 2019
avatar joomla-cms-bot joomla-cms-bot - change - 9 Sep 2019
Labels Added: ?
avatar joomla-cms-bot joomla-cms-bot - labeled - 9 Sep 2019
avatar Scrabble96 Scrabble96 - change - 9 Sep 2019
The description was changed
avatar Scrabble96 Scrabble96 - edited - 9 Sep 2019
avatar franz-wohlkoenig franz-wohlkoenig - change - 9 Sep 2019
Labels Added: J4 Issue
avatar franz-wohlkoenig franz-wohlkoenig - labeled - 9 Sep 2019
avatar franz-wohlkoenig franz-wohlkoenig - change - 9 Sep 2019
Status New Discussion
avatar mbabker
mbabker - comment - 9 Sep 2019

It sounds like that spot is meant to be a hero image type deal, not an advertisement banner as you would get with the banners component.

avatar Scrabble96
Scrabble96 - comment - 9 Sep 2019

...not an advertisement banner as you would get with the banners component.

So there are, in fact, two issues here:

  1. Anything placed in the banner module position is overlayed by an unnecessary semi-transparent grey div and also the curvy Cassiopeia cut-out.
  2. A banner component placed in another position, e.g. top-a, still does not show anything. Could it be that there is a chrome missing?
avatar Scrabble96
Scrabble96 - comment - 9 Sep 2019

and
3. If the banner module position is just a 'hero' position, then it should be called something else - 'Promo', for instance - so as not to confuse anyone wanting to use the banner component.

avatar Quy
Quy - comment - 19 Jan 2020

Please test PR #27566

avatar joomla-cms-bot joomla-cms-bot - change - 19 Jan 2020
Status Discussion Closed
Closed_Date 0000-00-00 00:00:00 2020-01-19 11:49:19
Closed_By joomla-cms-bot
avatar joomla-cms-bot joomla-cms-bot - close - 19 Jan 2020
avatar alikon alikon - change - 19 Jan 2020
Closed_By joomla-cms-bot alikon
avatar joomla-cms-bot
joomla-cms-bot - comment - 19 Jan 2020

Set to "closed" on behalf of @alikon by The JTracker Application at issues.joomla.org/joomla-cms/26228

avatar alikon
alikon - comment - 19 Jan 2020

closing as we have a pr


This comment was created with the J!Tracker Application at issues.joomla.org/tracker/joomla-cms/26228.

Add a Comment

Login with GitHub to post a comment