New theme for 'kirby-tabs' field

Plugins
1

Hi,

I made some modifications to the style of the tabs generated with the kirby-tabs field by @1n3JgKl9pQ6cUMrW that – in my eyes – match better the general panel style.

/* SCSS code */
/* add to your custom panel (S)CSS */
.tab-nav {
    border: none;
    li {
        border-radius: 0;
        border-bottom: 4px solid #a5a5a5;
        margin-right: 1em;
        padding: 0 0.25em 0.25em 0.2em;
        font-size: 1em;
        transition: border-color 200ms linear;
        &:focus {
            background: none;
            border-color: #8dae28;
        }
        &:hover {
            background: none;
            border-color: #8dae28;
        }
        &.active {
            background: none;
            color: inherit;
            border-color: #8dae28;
            .fa:before {
                color: #777777;
            }
            box-shadow: none;
        }
    }
    .fa {
        color: #777777;
    }
}

Just thought I leave it here :slight_smile:

5 Likes