Docs

[arthurdupuy]

Hello X,

Here is the webpage I’m building: http://www.alveusclub.com/college-lycee-v2 (password : arthure)

1) Could you give me a code to have the blue arrow (one the yellow part) like the image as you can see attached :

2) Is it possible to have the yellow part with a fixed height (blue part height) ?

3) How can i have title at the top of the each table (like image attached) ?

Thank you very much !

Arthur

[Christian]

Hey Arthur,

Regretfully, those aren’t features of Cornerstone. It is possible with custom development which is outside of the scope we can offer. You might want to contact our trusted partners who caters X setup and customization needs. Please see https://community.theme.co/custom-development/

Thank you for understanding.

[arthurdupuy]

Thank you for your answer, you don’t have solution even for the small blue arrow…?

Please !
Thank you

Arthur

[Nabeel A]

Hi again,

For blue arrow you can add the following code in your Customizer via Appearance > Customize > Custom > Edit Global CSS:

.x-nav-tabs-item a:hover:after {
    width: 0;
    height: 0;
    border-top: 28px solid transparent;
    border-bottom: 28px solid transparent;
    border-left: 28px solid #08203b;
    content: '';
    position: absolute;
    right: -28px;
    z-index: 9;
    top: 1px;
}
.x-nav-tabs.left>.x-nav-tabs-item, .x-nav-tabs.right>.x-nav-tabs-item {
    position: relative !important;
}

Further customization from here would be getting into custom development, which is outside the scope of support we can offer. If you need more in depth changes, you may wish to consult with a developer. X is quite extensible with child themes, so there are plenty of possibilities.

Thanks for understanding.

[arthurdupuy]

You ‘re really great Nabeel !!
It works perfectly.

However, is it possible to have those arrows on hover and ACTIVE item ?

Thanks again !

[Thai]

Hi There,

Please update the previous CSS to this:

.x-nav-tabs-item a:hover:after,
.x-nav-tabs-item.active a:after {
    width: 0;
    height: 0;
    border-top: 28px solid transparent;
    border-bottom: 28px solid transparent;
    border-left: 28px solid #08203b;
    content: '';
    position: absolute;
    right: -28px;
    z-index: 9;
    top: 1px;
}
.x-nav-tabs.left>.x-nav-tabs-item, .x-nav-tabs.right>.x-nav-tabs-item {
    position: relative !important;
}
#x-section-3 > div:nth-child(2) > div > ul > li:nth-child(3) > a:after {
    border-top: 37px solid transparent;
    border-bottom: 37px solid transparent;
}

Hope it helps 🙂

[arthurdupuy]

Thank you !!

[Lely]

You’re welcome!

Cheers!

[Author]

Posts