Joomla Templates Club 406,261 posts

[woluweb Friend woluwebJoin date: October 2012Posts: 196Downloads:18Uploads:69 Thanks: 68 Thanked: 31 times in 3 posts]

#188397

Hi there,

I am developing now a site using Brisk.

I use the Masshead module and I noticed the Masshead would not show in Tablet & Mobile layouts.
After closer look, I discovered that it was not the consequence of some “display: none” code… but that it was simply shown BEHIND the header. Which is not very useful 🙂

Then I had a look at the demonstration of JA Brisk. Exactly same behaviour :
http://joomla25-templates.joomlart.com/ja_brisk/contact.html

So so, how do I make the Masshead module simply just *under* the header in Mobile & Tablet layout ?

Txs,

Marc

[trungnq Friend trungnqJoin date: November 2008Posts: 7Downloads:0Uploads:0 Thanked: 1 times in 2 posts]

#496692

Dear woluweb

Please follow this

1. Go to Administrator –> Extensions –> Template Manage –> Please click “JA Brisk – Default”

2. Please see the Responsive layout tab http://prntscr.com/1bmrn3

You will config this Masshead module for Mobile or Tablet .. layout

[woluweb Friend woluwebJoin date: October 2012Posts: 196Downloads:18Uploads:69 Thanks: 68 Thanked: 31 times in 3 posts]

#496829

Hi @quartermainTR,

Txs very much for the suggestion but I am afraid this will not do the trick.

The masshead is indeed perfectly set as visible in Template Manager > Layout, as can be seen on this screenshot :

The thing is, it is positioned *behind* the header (if I set a big-big font size for the text for example, I even can see the end of it appearing under the header).
The same behaviour can be seen as I mentioned on the demo of JA Brisk :
http://joomla25-templates.joomlart.com/ja_brisk/contact.html

I guess some class must be added or deleted, either in PHP files or in Module Class of the Module.
But I don’t see what and where 🙂

---

Attachments:

1. 

[trungnq Friend trungnqJoin date: November 2008Posts: 7Downloads:0Uploads:0 Thanked: 1 times in 2 posts]

#497010

Hi woluweb

If possible, PM me super admin and FTP account of your site. I need a closer look to check further for you.

[woluweb Friend woluwebJoin date: October 2012Posts: 196Downloads:18Uploads:69 Thanks: 68 Thanked: 31 times in 3 posts]

#497234

Txs @quartermainTR for your proposition to help.

As I mentionned, the problem arises even in the “basic” installation of Brisk.
So here are the access to play & test it (just adjust size of text in masshead & you will see it appear eventually just under the header) :

• Site id: ja-brisk-j311372347866808
• Site name: ja-brisk-j311372347866808
• Admin user: admin
• Admin password: MassHead1
You can visit your site at: http://ja-brisk-j311372347866808.joomweb.com
Manage your site at: http://ja-brisk-j311372347866808.joomweb.com/administrator/

Txs,
Marc

[woluweb Friend woluwebJoin date: October 2012Posts: 196Downloads:18Uploads:69 Thanks: 68 Thanked: 31 times in 3 posts]

#497261

Sorry I realise I posted my msg without the last details :
on the demo site of the template, you can find a Masshead on the “contact” page for example

Just change the title* (via Firebug or alike) from
<h3 class=”jamasshead-title”>Contact Us</h3>
to
<h3 class=”jamasshead-title”>Contact Us Lorem Ipsum Lorem Ipsum Lorem Ipsum Lorem Ipsum Lorem Ipsum Lorem Ipsum Lorem Ipsum</h3>
and you will see : in mobile version, the end of the masshead starts to appear just under the header

* alternatively, you can of course change the font-size (in the mobile layout)

[woluweb Friend woluwebJoin date: October 2012Posts: 196Downloads:18Uploads:69 Thanks: 68 Thanked: 31 times in 3 posts]

#499986

Hi everybody in general, and hi Joomlart in particular !

Almost one month there has been no reaction on this thread.
Still I need to get this solved now 🙂

So, why this “bug” ?
Why is the masshead “hiding” behind the header in smartphone view ?
(it is indeed “displaid”, but you can’t see it because of a bad positioning or something. Just make the test by typing a verrry long text in the masshead : you will see the end of that text displaid under the header).

Txs in advance for your help !

Marc

[woluweb Friend woluwebJoin date: October 2012Posts: 196Downloads:18Uploads:69 Thanks: 68 Thanked: 31 times in 3 posts]

#512022

More than three months and the masshead still does not display correctly on JA Brisk (not even on the Demo version on Joomlart website…).

So please can somebody of Joomlart or some other smart guy out there give the trick to correct this bug (most probably some LESS or CSS file badly written).

Txs a lot in advance !

Marc

[phong nam Friend phong namJoin date: May 2015Posts: 3779Downloads:1Uploads:587 Thanks: 499 Thanked: 974 times in 888 posts]

#512181

Hi Marc,

We are sorry for being late on this case. This is a bug of Masshead title on JA Beranis when viewing on mobile landscape and table view. You can solve this issue by putting below css styles into the end of templates/ja_beranis/less/styles.less file:

//Adjust the masshead title on mobile landscape and tablet view

@media (min-width:480px ) and (max-width: 768px) {
.ja-masshead {
margin-top: 90px;
h3 {
padding: 20px;
}
}

.container {
&.ja-mainbody {
margin-top: 0;
}
}
}


Then Compile Less to Css in Template Manager, but make sure that you do backup your modifications in .css files.

1 user says Thank You to phong nam for this useful post

1. woluweb

[woluweb Friend woluwebJoin date: October 2012Posts: 196Downloads:18Uploads:69 Thanks: 68 Thanked: 31 times in 3 posts]

#512213

Txs Leo !
My template was JA Brisk, not JA Beranis.
And putting the code into “style.less” did not correct the behaviour of the Masshead.

But still I thank you very much 🙂 because you put me on the right way :
maybe the reason is that I use a Theme. Let’s name it “mytheme”.

Actually, putting your code into templates/ja_brisk/less/themes/mytheme/template-responsive.less did already improve the behaviour.

Still there was some display problem (size of font, …).
So I took what was under “.ja-masshead” in my template.less file and merged it with your code.

With other words, putting this did the trick :


@media (min-width:480px ) and (max-width: 768px) {
.ja-masshead {
margin-top: 90px;
h3 {
padding: 20px;
// taken from template.less
// begin
color: @white;
font-family: 'robotobold';
font-size: ( @BaseFontSize + 7 );
font-size: normal;
padding: @BaseLineHeight/4 0;
text-shadow: 1px 1px 0 darken @BaseColor, 10%);
// end
}
}

Now, would you please ask the developers to correct the LESS files directly in JA Brisk so that people don’t have to play with these manual corrections ?
(just see the demo on Joomlart’s website : same problem arises. So it is a problem for every single one)

1 user says Thank You to woluweb for this useful post

1. phong nam

[phong nam Friend phong namJoin date: May 2015Posts: 3779Downloads:1Uploads:587 Thanks: 499 Thanked: 974 times in 888 posts]

#512277

Hi Marc,

Sure. I will remind our devs to include these LESS in next update of JA Brisk.

1 user says Thank You to phong nam for this useful post

1. woluweb

[woluweb Friend woluwebJoin date: October 2012Posts: 196Downloads:18Uploads:69 Thanks: 68 Thanked: 31 times in 3 posts]

#514409

IN the meantime, has been solved with latest updates of T3 & Template 🙂
txs

1 user says Thank You to woluweb for this useful post

1. JA Developer

[Author]

Posts