fbpx

Missed the Birthday Party? Still You Can Enjoy the PartyView Deal

Welcome, Guest
Username: Password: Remember me

TOPIC: JD Services module

JD Services module 1 year 5 months ago #12024

  • poselziobro1
  • poselziobro1's Avatar
  • Offline
  • Premium Member
  • Posts: 93
  • Thank you received: 8
  • Karma: 0
Hi
I would like to get the same effect on my website with the JD Services module as it is in the Seattle template
I can not find the class responsible for the blue background and white frames on the mouse hover.
kkskoluszki.kylos.pl/test6/
The administrator has disabled public write access.

JD Services module 1 year 5 months ago #12045

  • chandandeep
  • chandandeep's Avatar
  • Offline
  • Administrator
  • Posts: 3651
  • Thank you received: 555
  • Karma: 97
Hello,

I've shared the CSS code used in the JD Seattle template. Please add it.

.features-box-icon-wrapper {
   background: #fff;
   position: relative;
   transition: all 0.4s linear;
}

.features-box-icon-wrapper.shadow-lg {
   box-shadow: 0px 10px 50px 0px rgba(0, 0, 0, 0.07) !important;
}

.features-box-icon-wrapper:before,
.features-box-icon-wrapper:after {
   content: "";
   display: block;
   position: absolute;
   height: 40px;
   width: 40px;
   opacity: 0;
   transition: all 0.4s linear;
}

.features-box-icon-wrapper:before {
   top: 7px;
   left: 7px;
   border-left: 1px solid #fff;
   border-top: 1px solid #fff;
}

.features-box-icon-wrapper:after {
   bottom: 7px;
   right: 7px;
   border-right: 1px solid #fff;
   border-bottom: 1px solid #fff;
}

.features-box-icon-wrapper .features-box-icon {
   font-size: 42px;
   position: relative;
   z-index: 1;
}

.features-box-icon-wrapper .features-box-content {
   position: relative;
   z-index: 1;
}

.features-box-icon-wrapper:focus,
.features-box-icon-wrapper:hover {
   background: #1c60ff;
   color: #fff;
}

.features-box-icon-wrapper:focus:before,
.features-box-icon-wrapper:focus:after,
.features-box-icon-wrapper:hover:before,
.features-box-icon-wrapper:hover:after {
   opacity: 1;
}

.features-box-icon-wrapper:focus:before,
.features-box-icon-wrapper:hover:before {
   width: 70%;
   height: 60px;
}

.features-box-icon-wrapper:focus:after,
.features-box-icon-wrapper:hover:after {
   height: 60px;
   width: 70%;
}

.features-box-icon-wrapper:focus h4,
.features-box-icon-wrapper:focus p,
.features-box-icon-wrapper:hover h4,
.features-box-icon-wrapper:hover p {
   color: #fff;
}

.features-box-icon-wrapper.features-box-hover-none {
   background: #fff;
}

.features-box-icon-wrapper.features-box-hover-none:before,
.features-box-icon-wrapper.features-box-hover-none:after {
   border-color: #1c60ff;
}

.features-box-icon-wrapper.features-box-hover-none:focus p,
.features-box-icon-wrapper.features-box-hover-none:hover p {
   color: #333;
}


Thanks,
Chandan
Thank You,
If you like our support and products, tweet us at joomdev and let the world know about it.

To know more about products check out the their documentation.
The administrator has disabled public write access.

JD Services module 1 year 5 months ago #12050

  • poselziobro1
  • poselziobro1's Avatar
  • Offline
  • Premium Member
  • Posts: 93
  • Thank you received: 8
  • Karma: 0
thanks for the answer
I have already downloaded qucikinstall seattle.
I copied ccs. and I just get something like that (under main menu)

kkskoluszki.kylos.pl/test6/
The administrator has disabled public write access.

JD Services module 1 year 5 months ago #12076

  • chandandeep
  • chandandeep's Avatar
  • Offline
  • Administrator
  • Posts: 3651
  • Thank you received: 555
  • Karma: 97
JD Seattle and JD Medical CSS conflict with each other. That's why it looks so.
Thank You,
If you like our support and products, tweet us at joomdev and let the world know about it.

To know more about products check out the their documentation.
The administrator has disabled public write access.
Moderators: chandandeep
Time to create page: 0.302 seconds