Meta Post - Common CSS Hacks

Share & showcase
326

I modified this a bit to make it support both light- and dark-mode themes a bit better. The color scheme for light mode wasn’t really working with the line focus color.

UPDATED: Meta Post - Common CSS Hacks - #543 by Christian

VIM Light + Dark mode line focus

/* Modified by Christian (Chhrriissyy#6548). Original by MooddooM */
/* This version sets the line focus for both edit and insert mode. */
/* If you want to make it edit mode only, add the `.cm-fat-cursor` CSS class selector to both light & dark mode. /*

/* Cursor color in normal vim mode and opacity */
.cm-fat-cursor .CodeMirror-cursor, .cm-animate-fat-cursor {
    width: 0.5em;
    background: #d65d0e;
    opacity: 60% !important;
}

/* LIGHT MODE */
/*if you want the highlight to present in both normal and insert mode of vim*/
.theme-light /* .cm-fat-cursor */ .CodeMirror-activeline .CodeMirror-linebackground{
    background-color: #2f2f2f;
    opacity: 10%
}

/* DARK MODE */
.theme-dark /* .cm-fat-cursor */ .CodeMirror-activeline .CodeMirror-linebackground {
    background-color: #f1f1f1;
    opacity: 30%;
}
3 Likes