Forum Support

 
Advanced Search


[1]

Offline gabriela
Free Member
Posts: 13
Posted on: July 20, 2015, 12:51:07 PM

Hi
I installed S5 Photo Showcase for to replace the HTML module in home page, in top_row1_1 position. My problem is with mobile view. The module shows good the images and the text in desktop, but it shows the texts too big and high on the ipad and iphone, until they disappear from the picture frame. I think this must be something with css style, but I have the configuration's module in ""Plain text - Module adds styling" for to set my css style because when I set  "HTML - I will provide the styling" nothing shows. Please I need your help. The site is http://www.primusasesores.cl/
Logged

Offline mikek
Free Member
Posts: 28743 WWW
Posted on: July 21, 2015, 07:40:06 AM

Hello,

I don't see the photo showcase module published to your site. Please post a url to where the module is published.
Logged

Offline gabriela
Free Member
Posts: 13
Posted on: July 21, 2015, 07:41:18 AM

The module is the first slideshow in home page: http://www.primusasesores.cl/index.php
« Last Edit: July 21, 2015, 07:49:55 AM by gabriela »
Logged

Offline mikek
Free Member
Posts: 28743 WWW
Posted on: July 22, 2015, 07:37:58 AM

Hello,

You have a class on your text that has a very large margin on the bottom:

.slideshow_tit {
    background: rgba(0, 0, 0, 0) none repeat scroll 0 0;
    color: #ffffff;
    font-size: 1em;
    font-weight: 600;
    line-height: 135%;
    margin-bottom: 153px;
    text-align: center;
}

That margin-bottom is almost as tall as the module itself on mobile screens so it's pushing it out of view.

I don't recognize this css, is this something you added? We don't provide support on custom css. If you're trying to align the text in the center there are several methods given here:

http://www.w3.org/Style/Examples/007/center.en.html
Logged

Offline gabriela
Free Member
Posts: 13
Posted on: July 27, 2015, 08:58:47 AM

Thanks, I have reviewed the css you indicate me and I corrected some errors with width and height.
That was one of many attempts to find the css to fit the text.
I modified the style also compared with the style html css demo video module on the homepage.
I used the style demo "video_overlay_text_wrap_inner" for the div, but not the style for text h2, behold used its own style.

.video_overlay_text_wrap_inner {
    margin: 0;
    position: absolute;
    top: 0%;
    transform: translate (0px, -50%);
    -ms-transform: translate (0px, -50%);
    -webkit-transform: translate (0px, -20%);
    text-align: center;
    max-width: 80%;
    Color: #FFFFFF;
    left: 0;
    right: 0;
    margin-left: auto;
    margin-right: auto;
}


I do not know how to make the text is responsive and call certain styles in s5.responsive.css as "media screen and (max-width: 579px)."
I need that texts more smaller in view of the iphone.
One thing strikes me: In the demo slideshow S5 Photo Showcase, the texts do not fit, they disappear, please look at: http://www.shape5.com/demo/photobox/index.php/extensions/s5 -Photo-showcase
Does the slideshow has a disability with texts ?.
I need texts look smaller in the slideshow at the phones.
Furthermore, in normal view slideshow I need texts more above. I can not set it better because it deconfigure view in iphone.
Thanks, I hope your help!
Logged

Offline mikek
Free Member
Posts: 28743 WWW
Posted on: July 28, 2015, 07:27:04 AM

Hello,

The text was stylized to disappear on the Photobox template for mobile, but that's specific to that template.

We don't provide support for customizing the look of the module. If you just want to reduce the font size you can do something like this:

@media screen and (max-width: 970px){
#s5_photo_showcase_conent_wrap_inner2 {
font-size:0.7em;
}
}

You can add that to custom.css. Just make sure you are using "em" font-sizes on your content.
Logged

Offline gabriela
Free Member
Posts: 13
Posted on: July 28, 2015, 07:54:36 AM

Yes, I'm using "em" font size.
How can I disable  the text for to show in devices? I don't want to have more problems.
Thanks!
Logged

Offline mikek
Free Member
Posts: 28743 WWW
Posted on: July 29, 2015, 07:33:40 AM

Hello,

You can use a display:none call for the ID of the text that you want to remove within your own set media query width.

@media screen and (max-width: 970px){
#s5_photo_showcase_conent_wrap_inner2 {
display:none;
}
}
Logged

Offline gabriela
Free Member
Posts: 13
Posted on: July 29, 2015, 07:56:42 AM

O.K! Thanks you very much!
Logged
[1]

Jump to:  


Powered by SMF | SMF © 2013, Simple Machines
Joomla Bridge by JoomlaHacks.com
Page created in 0.025 seconds with 20 queries.
Need some help getting your site up and running? Be sure to check out our tutorials area, post on the forum or hire us
Send Us An Email
Please send us your questions and we will email you back as soon as we can. Product support questions should be posted in our support forums under the Help menu. Our staff will assist you from there.