Hero Slideshow Not: Page 2 - Support Central

Hero Slideshow Not

app1cker

This message is visible to Moderators only

hidden content

dominic

Hi app1cker,
You can copy the video folder from the ja-tour/acm folder to the ja-findus/acm folder and add the following CSS code to the ja-findus/acm/video/css/style.scc file:

.acm-video.style-1 .video-description {
  padding: 200px 150px; }
  @media (max-width: 1419.98px) {
    .acm-video.style-1 .video-description {
      padding: 90px; } }
  @media (max-width: 767.98px) {
    .acm-video.style-1 .video-description {
      padding: 60px 30px; } }
  @media (max-width: 767.98px) {
    .acm-video.style-1 .video-description .text-white {
      font-size: 26px; } }
  .acm-video.style-1 .video-description .btn-actions {
    margin-top: 90px; }
    @media (max-width: 1419.98px) {
      .acm-video.style-1 .video-description .btn-actions {
        margin-top: 30px; } }

.acm-video.style-1 .video-item {
  position: relative; }
  .acm-video.style-1 .video-item .ft-bg {
    background-size: cover;
    background-position: center center;
    position: absolute;
    top: 0;
    left: 0;
    height: 100%;
    min-height: 400px;
    width: 100%; }
    @media (max-width: 1199.98px) {
      .acm-video.style-1 .video-item .ft-bg {
        position: static; } }
    @media (max-width: 767.98px) {
      .acm-video.style-1 .video-item .ft-bg {
        min-height: 250px; } }
  .acm-video.style-1 .video-item .play-icon {
    position: absolute;
    top: 50%;
    left: 0;
    margin-top: -60px;
    margin-left: -60px; }
    @media (max-width: 1199.98px) {
      .acm-video.style-1 .video-item .play-icon {
        left: 50%; } }
    @media (max-width: 767.98px) {
      .acm-video.style-1 .video-item .play-icon {
        margin-top: -40px;
        margin-left: -40px; } }

app1cker

This message is visible to Moderators only

hidden content

dominic

Hi app1cker,

You can add the following CSS code to the ja-findus/acm/video/css/style.css file:

.no-gutters > .col, .no-gutters > [class*="col-"] {
    padding-right: 0;
    padding-left: 0;
}

.acm-video.style-1 .video-description {
  background: #30408d;
}

.play-icon a {
  background: #fff;
  -webkit-box-align: center;
  -ms-flex-align: center;
  align-items: center;
  border-radius: 50%;
  color: #F6376A !important;
  display: -webkit-box;
  display: -ms-flexbox;
  display: flex;
  font-size: 25px;
  -webkit-box-pack: center;
  -ms-flex-pack: center;
  justify-content: center;
  position: relative;
  text-indent: 3px;
  height: 120px;
  width: 120px; }
  .play-icon a:before, .play-icon a:after {
    border: 1px solid #fff;
    content: "";
    position: absolute;
    z-index: 0;
    left: 50%;
    top: 50%;
    -webkit-transform: translateX(-50%) translateY(-50%);
    -ms-transform: translateX(-50%) translateY(-50%);
    transform: translateX(-50%) translateY(-50%);
    display: block;
    width: 120px;
    height: 120px;
    background: transparent;
    border-radius: 50%;
    -webkit-animation: pulse-border 2200ms ease-out infinite;
    animation: pulse-border 2200ms ease-out infinite; }
  .play-icon a:after {
    -webkit-animation-delay: 600ms;
    animation-delay: 600ms; }
    @media screen and (-ms-high-contrast: active), (-ms-high-contrast: none) {
      .play-icon a:after {
        display: none; } }
  .play-icon a:hover {
    background: #F4F4F5;
    text-decoration: none; }
  @media (max-width: 767.98px) {
    .play-icon a {
      height: 80px;
      width: 80px; }
      .play-icon a:before, .play-icon a:after {
        height: 80px;
        width: 80px; } }

@-webkit-keyframes pulse-border {
  0% {
    -webkit-transform: translateX(-50%) translateY(-50%) translateZ(0) scale(1);
    transform: translateX(-50%) translateY(-50%) translateZ(0) scale(1);
    opacity: 1; }
  100% {
    -webkit-transform: translateX(-50%) translateY(-50%) translateZ(0) scale(1.3);
    transform: translateX(-50%) translateY(-50%) translateZ(0) scale(1.3);
    opacity: 0; } }

@keyframes pulse-border {
  0% {
    -webkit-transform: translateX(-50%) translateY(-50%) translateZ(0) scale(1);
    transform: translateX(-50%) translateY(-50%) translateZ(0) scale(1);
    opacity: 1; }
  100% {
    -webkit-transform: translateX(-50%) translateY(-50%) translateZ(0) scale(1.3);
    transform: translateX(-50%) translateY(-50%) translateZ(0) scale(1.3);
    opacity: 0; } }

2/ Yes, all you need to copy is child folders in the ACM module folder, js folder, and assets.json and global.json files.

app1cker

This message is visible to Moderators only

hidden content

dominic

Hi app1cker,
Could you give me the site URL? I can not access the site that you provided previously.

app1cker

This message is visible to Moderators only

hidden content

dominic

Hi app1cker,
Have you checked the CSS code? I don't see the CSS that I provided for this module on your site, or I think because you have enabled the minify CSS.
You can exclude this file style.
Give me the admin account if you still face this issue.

app1cker

This message is visible to Moderators only

hidden content

dominic

Hi app1cker,
Have you checked this option from Backend > Site template styles > ja findus > global settings?
Also, I can access your backend. Please check the admin account.

app1cker

This message is visible to Moderators only

hidden content

app1cker

This message is visible to Moderators only

hidden content

dominic

Hi app1cker,
I have excluded the CSS file of the acm module and the slider showing well now.

dominic

Hi app1cker,
I have updated the CSS code, in the ‎/templates/ja_findus/acm/slideshow/css/style.css file.
About the pricing, you should copy the CSS code and language from the Ja coach as I have guided in the previous answer.

I have added the following CSS code to the Backend > site template styles > ja findus > tools > Custom CSS:

.acm-pricing.style-1 .pricing-item {
    background: #fff;
    border: 2px solid #eee;
    border-radius: 3px);
    padding: 64px;
}

@media (max-width: 1199.98px) {
    .acm-pricing.style-1 .pricing-item {
        padding:32px;
    }
}

.acm-pricing.style-1 .pricing-item .h1 span {
    font-size: 18px;
}

.acm-pricing.style-1 .pricing-item .plan-description {
    border-top: 1px solid var(--border-color);
    padding-top: 1.6rem;
    margin-top: 1.6rem;
}

@media (max-width: 575.98px) {
    .acm-pricing.style-1 .pricing-item .plan-description {
        padding-top:.5rem;
        margin-top: .5rem;
    }
}

.acm-pricing.style-1 .pricing-item .plan-description ul {
    padding: 0;
    margin: 1.6rem 0 0;
    list-style: none;
}

.acm-pricing.style-1 .pricing-item .plan-description ul li {
    color: #212121;
    font-weight: 600;
}

.acm-pricing.style-1 .pricing-item .plan-description ul li+li {
    margin-top: 16px;
}

.acm-pricing.style-1 .pricing-item .plan-description ul li:before {
    color: #2c6ce8;
    content: "\f058";
    font-family: "Font Awesome 5 Free";
    font-weight: 900;
    margin-right: 8px;
}

.acm-pricing.style-1 .pricing-item .plan-action {
    margin-top: 2rem;
}

@media (max-width: 1199.98px) {
    .acm-pricing.style-1 .pricing-item .plan-action {
        margin-top:1rem;
    }
}

.acm-pricing.style-1 .pricing-item.plan-highlight {
    border-color:  #2c6ce8;
    box-shadow: 0 0 32px rgba(0,0,0,.05);
}

app1cker

This message is visible to Moderators only

hidden content

dominic

Hi app1cker,
Yes, you need to copy the CSS code from the /templates/ja_templates/acm/types(pricing,hero..)/css folder.

app1cker

This message is visible to Moderators only

hidden content

dominic

Hi app1cker,
Some templates (acm/type) won't add the CSS to the acm/type/css/style.css file.
In this case, you can use F12/ inspect to find the CSS code from the frontend then add it to the acm/type/css/style.css file.

app1cker

This message is visible to Moderators only

hidden content

dominic

Hi app1cker,
Have you excluded the following CSS file?

I can not access your site, could you provide the admin account?

app1cker

This message is visible to Moderators only

hidden content

« Previous Page Next Page »