Tuber - Question | JoomShaper
Back to the questions

Tuber

TH

Tilen Harc

Template 5 days ago

Hi guys! I am building a webpage, using TUBER template. I has everything working, but I do not know where I made a mistake, that the look of this segment is not correct: The DEMO: https://ibb.co/ds71dbvF My PAGE (https://lex-pixel.si/mi2new2026/index.php/zgodba): https://ibb.co/6c63rhdG

I tried to change this:

.fun-fact:after {
    content: "";
    position: absolute;
    width: 60px;
    height: 60px;
    bottom: 0px;
    right: -60px;
    border-radius: 45%;
    box-shadow: -20px 20px 0px var(--sppb-bg-primary);
    border-bottom-right-radius: 0;
    border-top-left-radius: 0px;
    z-index: -1;
}

so that the color of the box-shadow is black - so I changed only this value: box-shadow: -20px 20px 0px var(--sppb-color-primary);

And it worked fine - but after that the nice curve edge is gone... Can someone point me in the right direction? Also I think that the custom.css is not called up... I have it it "/templates/tuber/css/custom.css"

0
5 Answers
Order by
Oldest Newest Votes
Ziaul Kabir
Ziaul Kabir
Accepted Answer
Support Agent 4 days ago #219433

Hello Tilen,

Thanks for reaching out to us.

Issues is that, the fun-fact class is misisng in style -> class, please add this class. for example: https://prnt.sc/3dOJ-yZmgxUe

Please, let me know the update.

Thanks

0
TH
Tilen Harc
Accepted Answer
4 days ago #219448

Hi, yes - you are correct. That was the problem. But I still have an ongoing problem with the custom.css file. If you see the photo: https://ibb.co/LDbJdDdh you will see that there is the code for the border radius applied, but it does not show up. A similar problem is seen on this photo: https://ibb.co/b5fLgMLK --> I added the code:

.no-cap {
  text-transform: none !important;
}

to the custom.css file, but the css style is loaded only if the code (snippet) is also pasted in the Custom CSS box - why is it not enought to have it in the custom.css and just add the CSS class? Is t here a problem with loading the custom.css? I also tried with the override.css (on your page) and notjing changed...

Please, help is really appreciated.

0
Ziaul Kabir
Ziaul Kabir
Accepted Answer
Support Agent 4 days ago #219451

For border radius, you applied background color on column, so use this css:

div#column-id-06d67511-b2af-4dd4-b7f3-476a98a00a36{
border-top-right-radius: 30px;
}
.fun-fact:after {
    box-shadow: -20px 20px 0px #000000;
}

Also for text transform use this

#addonId .no-cap {
  text-transform: none !important;
}

#addonId will take no-cap class parent dynamic id and placed into it.

Thanks

0
TH
Tilen Harc
Accepted Answer
4 days ago #219481

You are a true master. After removing the background color of the column, I need only to add this code:

.fun-fact:after {
    box-shadow: -20px 20px 0px #000000;
}

Thank you!!!!

0
Ziaul Kabir
Ziaul Kabir
Accepted Answer
Support Agent 3 days ago #219531

You are welcome. We greatly value your opinion and would love to hear your feedback about SP Page Builder. If you could spare a moment, it would mean a lot to us!

You can share your review here:

Joomla Extensions Directory

Trustpilot

0