Joomla Templates Club 406,261 posts

[ipromenta Friend ipromentaJoin date: August 2014Posts: 12Downloads:36Uploads:1 Thanks: 2 Thanked: 2 times in 2 posts]

#984221

Hi,

In my site http://www.junnikkala.fi slideshow cuts description digits in mobile and tablet view!
How to solve this problem?

[Pankaj Sharma Moderator Pankaj SharmaJoin date: February 2015Posts: 24589Downloads:144Uploads:202 Thanks: 127 Thanked: 4196 times in 4019 posts]

#984329

Hi
slideshow does not fully support the module view , due to its design .
You can apply below tweak to make it good .
Ipad : http://prntscr.com/d4gxqy
Add this code in/css/custom.css file

@media (max-width:768px) {
.ja-slidewrap .maskDesc .ja-slide-desc a {
     font-size: 15px!important;
    }}

this will reduce the font size , so it will fit in the smaller view .

[ipromenta Friend ipromentaJoin date: August 2014Posts: 12Downloads:36Uploads:1 Thanks: 2 Thanked: 2 times in 2 posts]

#984511

Hi again,
How can i change

font size smaller in max660px view? Button that should be visible in every device view is hidden in smaller view handsets!
Thanks!

[Pankaj Sharma Moderator Pankaj SharmaJoin date: February 2015Posts: 24589Downloads:144Uploads:202 Thanks: 127 Thanked: 4196 times in 4019 posts]

#984522

Hi
just change the media query as

@media (max-width:660px) {
.ja-slidewrap .maskDesc .ja-slide-desc a {
     font-size: 15px!important;
    }}

To hide the button use this code in custom.css file

@media (max-width:660px) {
.ja-slidewrap .maskDesc .ja-slide-desc a.readon {
     display: none!important;
    }}

[ipromenta Friend ipromentaJoin date: August 2014Posts: 12Downloads:36Uploads:1 Thanks: 2 Thanked: 2 times in 2 posts]

#984528

Hi, now there is a missunderstanding 🙂
I really want the button to show in smaller handsets!

[Pankaj Sharma Moderator Pankaj SharmaJoin date: February 2015Posts: 24589Downloads:144Uploads:202 Thanks: 127 Thanked: 4196 times in 4019 posts]

#984653

ipromenta wrote:

Hi, now there is a missunderstanding
I really want the button to show in smaller handsets!

Remove the suggested code frim custom.css file and button appears again.

[ipromenta Friend ipromentaJoin date: August 2014Posts: 12Downloads:36Uploads:1 Thanks: 2 Thanked: 2 times in 2 posts]

#984737

This is really getting frustrating!
I really want to see all of description field in all mobile views!
Slide title is too big and desription field is cut in small handset views!
How can i modify this css to make them visible and smaller?
I need answer ASAP!!
Thanks!

[Pankaj Sharma Moderator Pankaj SharmaJoin date: February 2015Posts: 24589Downloads:144Uploads:202 Thanks: 127 Thanked: 4196 times in 4019 posts]

#984757

Hi
Sorry in your last post it does not appear there is any issue .
First, you have to remove the unwanted code from custom.css file .
You added too much custom code in custom.css file .
After this add my below code in custom.css file

@media (max-width:768px){.ja-slidewrap .maskDesc .ja-slide-desc a{font-size:10px!important;padding-bottom: 15px!important;}

.ja-slidewrap .maskDesc .ja-slide-desc a.readon {font-size:10px!important;top:100%!important;padding-bottom: 20px!important;margin-top: 13px;}

 }

After this step go to
/templates/ja_biz/local/css/themes/junnikkala/mod_jaslideshow.css
Add below code at the end of file

@media screen and (max-width: 768px) {.ja-slidewrap .maskDesc {   width: 80% !important;}}

Save file , clean Joomla and browser cache and check the site .

[Author]

Posts