App Page : Menu / Space Between Sections / Device Sliders

Support Forums for LiveMesh Themes & Plugins Forums Fusion Theme Support App Page : Menu / Space Between Sections / Device Sliders

This topic is: not resolved

This topic contains 15 replies, has 4 voices, and was last updated by Veena Veena 4 months, 1 week ago.

Viewing 15 posts - 1 through 15 (of 16 total)
  • Author
    Posts
  • #20546
    Pragmacloud
    pragmacloud
    Member
    Post count: 6

    Menu / Space between sections:

    I am facing issue with Menu on App Page. When clicks on menu it should got to the corresponding section on the same page. It is working but to see the corresponding section I need to scroll up 2 lines, To avoid this I have added <br/> and padding-top then screen not looks good with more space between each section.

    Device Sliders :

    Device sliding images are not synchronizing with the content slider.

    Can you please check the http://www.pragma.cloud/products-2/ page and please suggest me the solution.

    Thanks,
    Pragma.Cloud

    #20567
    Raghavendra
    Raghavendra
    Moderator
    Post count: 4577

    You need to provide unique ids for all of the sliders (you are repeating features-slider and features-slider1) so that the sync happens right. Pls focus on ids of tab slider, mac slider shortcodes and sync attribute of the tab slider shortcode.

    Regarding the spacing issue, the logo for the site is making the sticky menu to grow. If you can reduce the height of the logo for the sticky menu, things will get better. Pls try the following custom CSS in theme options –

    #site-logo, #header.sticky #site-logo {
     top: 0;
    }
    
    #header.sticky  #site-logo a img.standard-logo {
        max-width: 100px;
    }
    

    That should reveal more of your element when using the internal links.

    #20702
    Pragmacloud
    pragmacloud
    Member
    Post count: 6
    This reply has been marked as private.
    #20716
    Veena
    Veena
    Moderator
    Post count: 7933

    Have you resolved this ?
    If not pls share a temp login to your site as a private msg and also pls mention where and what the exact issue is .

    Thanks.

    #20725
    Pragmacloud
    pragmacloud
    Member
    Post count: 6
    This reply has been marked as private.
    #20741
    Veena
    Veena
    Moderator
    Post count: 7933

    The login details is not working it seems. Pls check .

    #20746
    Pragmacloud
    pragmacloud
    Member
    Post count: 6
    This reply has been marked as private.
    #20774
    Veena
    Veena
    Moderator
    Post count: 7933
    This reply has been marked as private.
    #20775
    Veena
    Veena
    Moderator
    Post count: 7933

    Pls give id for features sliders as #features-slider, #features-slider2, #features-slider3, #features-slider4, #features-slider5 and include the above custom CSS in themeoptions.If you need to add slider 6 then you need to add custom CSS like above for the 6th one also .I have included custom CSS up to features-slider5 .

    #20790
    Pragmacloud
    pragmacloud
    Member
    Post count: 6
    This reply has been marked as private.
    #20821
    Veena
    Veena
    Moderator
    Post count: 7933

    You can try the below custom CSS in themeoptions –

    #post-9024 .app-features-list {
        padding: 30px 0 30px;
    }
    
    #20847
    Pragmacloud
    pragmacloud
    Member
    Post count: 6
    This reply has been marked as private.
    #30662
    Alexander Schneider
    Alexander Schneider
    Participant
    Post count: 6

    Hi Veena, refering to your earlier post: including a third features slider incl. iphone slider crashes design of icons.
    Could you please re-share the custom CSS to include in themeoptions? You were mentioning “include the above custome CSS”, but could not find it in the forum. Maybe you set it to private?
    Thanks so much, Alex

    Pls give id for features sliders as #features-slider, #features-slider2, #features-slider3, #features-slider4, #features-slider5 and include the above custom CSS in themeoptions.If you need to add slider 6 then you need to add custom CSS like above for the 6th one also .I have included custom CSS up to features-slider5 .

    #30677
    Veena
    Veena
    Moderator
    Post count: 7933

    This was the custom CSS –

    #features-slider, #services-slider, #features-slider2, #features-slider3, #features-slider4, #features-slider5 {
      vertical-align: middle; }
      #features-slider ul.tab-list, #services-slider ul.tab-list, #features-slider2 ul.tab-list,#features-slider3 ul.tab-list, #features-slider4 ul.tab-list, #features-slider5 ul.tab-list {
        border: none;
        margin: 0 0 20px 0; }
        #features-slider ul.tab-list li, #services-slider ul.tab-list li, #features-slider2 ul.tab-list li {
          margin: 0 50px 0 0; }
          @media only screen and (max-width: 1140px) {
            #features-slider ul.tab-list li, #services-slider ul.tab-list li, #features-slider2 ul.tab-list li, #features-slider3 ul.tab-list li, #features-slider4 ul.tab-list li, #features-slider5 ul.tab-list li {
              margin: 0 25px 0 0; } }
          @media only screen and (max-width: 479px) {
            #features-slider ul.tab-list li, #services-slider ul.tab-list li, #features-slider2 ul.tab-list li, #features-slider3 ul.tab-list li, #features-slider4 ul.tab-list li, #features-slider5 ul.tab-list li {
              margin: 0 25px 0 0; } }
          #features-slider ul.tab-list li a, #services-slider ul.tab-list li a, #features-slider2 ul.tab-list li a, #features-slider3 ul.tab-list li a, #features-slider4 ul.tab-list li a, #features-slider5 ul.tab-list li a {
            text-align: center; }
            #features-slider ul.tab-list li a i, #features-slider ul.tab-list li a span, #services-slider ul.tab-list li a i, #services-slider ul.tab-list li a span, #features-slider2 ul.tab-list li a i, #features-slider2 ul.tab-list li a span , #features-slider3 ul.tab-list li a i, #features-slider3 ul.tab-list li a span , #features-slider4 ul.tab-list li a i, #features-slider4 ul.tab-list li a span , #features-slider5 ul.tab-list li a i, #features-slider5 ul.tab-list li a span {
              -webkit-transition: color 0.4s ease-in-out 0s;
              -moz-transition: color 0.4s ease-in-out 0s;
              -ms-transition: color 0.4s ease-in-out 0s;
              transition: color 0.4s ease-in-out 0s; }
            #features-slider ul.tab-list li a i, #services-slider ul.tab-list li a i, #features-slider2 ul.tab-list li a i, #features-slider3 ul.tab-list li a i, #features-slider4 ul.tab-list li a i, #features-slider5 ul.tab-list li a i {
              font-size: 60px;
              color: #bbb; }
              @media only screen and (max-width: 767px) {
                #features-slider ul.tab-list li a i, #services-slider ul.tab-list li a i, #features-slider2 ul.tab-list li a i, #features-slider3 ul.tab-list li a i, #features-slider4 ul.tab-list li a i, #features-slider5 ul.tab-list li a i  {
                  font-size: 40px; } }
            #features-slider ul.tab-list li a span, #services-slider ul.tab-list li a span, #features-slider2 ul.tab-list li a span, #features-slider3 ul.tab-list li a span, #features-slider4 ul.tab-list li a span, #features-slider5 ul.tab-list li a span {
              display: block;
              font-size: 16px;
              line-height: 24px;
              font-weight: normal;
              color: #aaa;
              margin-bottom: 30px;
              text-transform: uppercase; }
              @media only screen and (max-width: 479px) {
                #features-slider ul.tab-list li a span, #services-slider ul.tab-list li a span, #features-slider2 ul.tab-list li a span, #features-slider3 ul.tab-list li a span, #features-slider4 ul.tab-list li a span, #features-slider5 ul.tab-list li a span {
                  font-size: 13px;
                  line-height: 22px; } }
          #features-slider ul.tab-list li a:hover i, #features-slider ul.tab-list li a:hover span, #services-slider ul.tab-list li a:hover i, #services-slider ul.tab-list li a:hover span, #features-slider2 ul.tab-list li a:hover i, #features-slider2 ul.tab-list li a:hover span, #features-slider3 ul.tab-list li a:hover i, #features-slider3 ul.tab-list li a:hover span, #features-slider4 ul.tab-list li a:hover i, #features-slider4 ul.tab-list li a:hover span, #features-slider5 ul.tab-list li a:hover i, #features-slider5 ul.tab-list li a:hover span {
            color: #888; }
          #features-slider ul.tab-list li a.visible, #features-slider ul.tab-list li a.flex-active, #services-slider ul.tab-list li a.visible, #services-slider ul.tab-list li a.flex-active, #features-slider2 ul.tab-list li a.visible, #features-slider2 ul.tab-list li a.flex-active, #features-slider3 ul.tab-list li a.visible, #features-slider3 ul.tab-list li a.flex-active, #features-slider4 ul.tab-list li a.visible, #features-slider4 ul.tab-list li a.flex-active, #features-slider5 ul.tab-list li a.visible, #features-slider5 ul.tab-list li a.flex-active {
            border: none; }
            #features-slider ul.tab-list li a.visible i, #features-slider ul.tab-list li a.visible span, #features-slider ul.tab-list li a.flex-active i, #features-slider ul.tab-list li a.flex-active span, #services-slider ul.tab-list li a.visible i, #services-slider ul.tab-list li a.visible span, #services-slider ul.tab-list li a.flex-active i, #services-slider ul.tab-list li a.flex-active span, #features-slider2 ul.tab-list li a.visible i, #features-slider2 ul.tab-list li a.visible span, #features-slider2 ul.tab-list li a.flex-active i, #features-slider2 ul.tab-list li a.flex-active span,#features-slider3 ul.tab-list li a.visible i, #features-slider3 ul.tab-list li a.visible span, #features-slider3 ul.tab-list li a.flex-active i, #features-slider3 ul.tab-list li a.flex-active span,#features-slider4 ul.tab-list li a.visible i, #features-slider4 ul.tab-list li a.visible span, #features-slider4 ul.tab-list li a.flex-active i, #features-slider4 ul.tab-list li a.flex-active span,#features-slider5 ul.tab-list li a.visible i, #features-slider5 ul.tab-list li a.visible span, #features-slider5 ul.tab-list li a.flex-active i, #features-slider5 ul.tab-list li a.flex-active span,  {
              color: #e84a52; }
    
    #30712
    Alexander Schneider
    Alexander Schneider
    Participant
    Post count: 6

    Great, thank you very much. Works perfectly!

    Another question:
    We are using the Polylang Plugin to manage multilanguage of the site. There is only one (hopefully minor) issue:
    We use the language switcher in the header menu, with flag-icon only. When using the option “display language-name” alignment is fine, but using the flag, it is top-aligned instead of vertically centered. How can this be fixed?

    Thanks a lot!
    Alex

    Attachments:
Viewing 15 posts - 1 through 15 (of 16 total)

You must be logged in to reply to this topic.