Solved Templates

CSS and Helix Ultimate default template

Asked by MoneyPeet 3 years ago Last activity 3 years ago

Hello,
just a simple question about CSS and Helix Ultimate.
I am working on this website.

For the menu bar I have added some custom css. I copied a part from another template I downloaded at Joomshaper which was also based on Helix Ultimate. Because I didn't need that extra template anymore I uninstalled it.
Now, in the default template there is no more CSS available. The custom CSS is empty.
But the adaptions still seems to work. But how? I have emptied the Joomla cache and the browser cache. I tried several browsers, but I still can see the changes I made.

Does anyone know what is going on?
If needed I can give Admin access.

Regards, Peter

Accepted answer

Marked as the solution
MoneyPeet Asked this
3 years ago

I don't know what happend. It looks like there was a problem at the hoster. Because yesterday all my websites went down, for five minutes, and after that, suddenly this works also fine.

Anyway, case closed.

13 more replies

Oldest first Newest first Most helpful
Paul Frankowski Senior Staff
3 years ago

Hi Peter,

Maybe you add it inside template Options > Custom Code > Custom CSS

becuase header + menu styles are not used/loaded from custom.css file but inline code.

MoneyPeet Asked this
3 years ago

Hi Paul,

I have checked the custom CSS, and it is empty. See picture.
Also there are no overrides, so where is this coming from?

Thansk for the tip. Didn't use it before, but seems very interesting.

Peter

Ronald Mol
3 years ago

Hi Peter,

Strange issue indeed. Or maybe not.
What css code for example did you add which is not visible anywhere in admin but 'does work' ?

Ronald

Paul Frankowski Senior Staff
3 years ago

Use PHPMyAdmin and search in database selected class name - it may help.

I don't hide the fact that if you added it then you have a better chance of finding it ;p

MoneyPeet Asked this
3 years ago

Hi Ronald,

this is some of the code I have used:



#sp-header .sp-megamenu-parent > li > a {
font-weight: 600;
text-transform: uppercase;
} 

.sp-megamenu-parent > li > a::before, .sp-megamenu-parent > li > span::before {
  content: "";
  position: absolute;
  bottom: 1px;
  height: 2px;
  width: 0;
  background-color: #1e3dba;
  transition: 0.3s;
}

.sp-megamenu-parent > li:hover > a::before, .sp-megamenu-parent > li:focus > a::before, .sp-megamenu-parent > li.active > a::before {
  width: 50%;
}

.sp-megamenu-parent .sp-dropdown li.sp-menu-item >a:hover {
    background: #fcfcfc;
    padding-left: 32px;
}

.sp-megamenu-parent .sp-dropdown li.sp-menu-item >a:before {
    content: "\f0da";
    font-family: "Font Awesome 5 Free";
    font-weight: 600;
    font-size: 16px;
    display: inline-block;
    padding-right: 10px;
    -webkit-transition: .4s;
    transition: .4s;
    opacity: 0;
    width: auto;
    position: absolute;
    left: 22px;
    top: 8px;
}

.sp-megamenu-parent .sp-dropdown li.sp-menu-item > a::before {
    top: 11px;
}

.sp-megamenu-parent .sp-dropdown li.sp-menu-item >a:hover:before {
    opacity: 1;
}

.sp-megamenu-parent .sp-dropdown li.sp-menu-item >a {
    display: block;
    padding: 10px 22px;
    border-top: 1px solid #ededed;
    -webkit-transition: .4s;
    transition: .4s;
    position: relative;
}

When you hover over "Nieuws" and then in the dropdown "Al het nieuws" you see a little triangel. This is not default in the Helix Ultimate, but is part of the "disappeared" CSS.

MoneyPeet Asked this
3 years ago

Hi Paul, I will do a search and let you know the results.

MoneyPeet Asked this
3 years ago

I have inspected the website, and I do see the Custom CSS. It says "inline: 39". When I click on the link, is shows me the missing CSS. All of it is there. So strange!
Because the site is not that big, I think i simply create a new one and start fresh from beginning.

Ronald Mol
3 years ago

Hi Peter,

I do not see the triangle at the point/position you mention..
Maybe that explains it. You look at a cached item and that is why it is not in custom css code?

MoneyPeet Asked this
3 years ago

Hi Ronald,
I have "repaired" some of the settings. Cleared cache etc...
After that I re-inserted the customs CSS and te little triangles should be there. I see them.

Log in to reply.