[Resolved] Table of Content on the Side

Home Forums Support [Resolved] Table of Content on the Side

Home Forums Support Table of Content on the Side

Viewing 7 posts - 16 through 22 (of 22 total)
  • Author
    Posts
  • #1871651
    David
    Staff
    Customer Support
    #1871876
    Atif

    Alright done. I have added the snippet.

    #1871955
    David
    Staff
    Customer Support

    Ok, so now try adding this CSS – note the screen has to be 1500px for it to move the ToC from the Content to the sticky left side:

    @media(min-width: 1500px) {
        .single-post #page {
            max-width: 1500px;
            padding-left: 300px;
            position: relative;
        }
        
        div#ez-toc-container {
            position: absolute;
            top: 14px;
            left: 0;
            bottom: 0;
            max-width: 300px;
            background-color: transparent !important;
            border: none !important;
            width: 100%;
            z-index: 1;
            display: flex;
            flex-direction: column;
            border: none;
        }
    
        .custom-toc-wrapper,
        .ez-toc-title-container {
            position: -webkit-sticky;
            position: sticky;
            top: 90px;
            border-radius: 10px;
            border: 2px solid #000;
            box-shadow: 5px 0 #b20c20;
            border-style: dashed;
            background-color: #fff;
            overflow: hidden !important;
        }
    
        .ez-toc-title-container {
            top: 20px;
            padding: 20px;
            border-radius: 10px 10px 0 0;
            border-bottom-width: 0;
        }
        div#ez-toc-container p.ez-toc-title {
            font-size: 17px !important;
        }
        #ez-toc-container ul {
            margin: 20px !important;
        }
    }
    #1873644
    Atif

    This looks awesome. Just as I wanted.

    There is one very slight issue. The containers i.e the title and list container tend to overlap when I scroll. Not a huge issue, but I am afraid that this may cause CLS issues with Core Web Vitals scores.

    #1873887
    Elvin
    Staff
    Customer Support

    Hi there,

    I checked the site and I didn’t see any overlap. But in case I’ve missed it, can you provide a screen recording of its occurrence? Is this happening on mobile as well? if yes, can you share the device you’ve checked it on?

    Let us know. ๐Ÿ˜€

    A wise man once said:
    "Have you cleared your cache?"

    #1876403
    Atif

    Yes nevermind, I checked again, looks good.

    You guys are awesome. Thank you so much for helping me out with this.

    Best Regards
    Atif

    #1876466
    Elvin
    Staff
    Customer Support

    No problem. Glad to be of any help. ๐Ÿ˜€

    A wise man once said:
    "Have you cleared your cache?"

Viewing 7 posts - 16 through 22 (of 22 total)
  • You must be logged in to reply to this topic.