vim-airline / vim-airline-themes

A collection of themes for vim-airline
MIT License
2.05k stars 350 forks source link

Is it possible to make command mode look different from Normal mode #164

Closed drew1kun closed 5 years ago

drew1kun commented 5 years ago

Hello. Just think it may be a good place to ask this question which freaks me out. Does anyone know here how can I customize the Command mode (when the one just presses : key), so it has for example colour different from Normal mode. Is it even possible with Airline?

I can customize the color of the INSERT mode: screen shot 2019-01-14 at 11 27 43 pm

The VISUAL mode: screen shot 2019-01-14 at 11 29 40 pm

Even REPLACE mode: screen shot 2019-01-14 at 11 30 26 pm

NORMAL mode: screen shot 2019-01-14 at 11 32 07 pm

But the COMMAND mode stays the same as NORMAL in all the airline-themes I have seen so far:

screen shot 2019-01-14 at 11 39 23 pm

Would be nice to know how this could be changed. Thanks

drew1kun commented 5 years ago

Well, I guess this was a "gimme de codez" kinda question lol.

Found how to do it myself. Leaving the way how I've found the answer here, just in case it will help somebody...

Here is the chain which led me to figuring this out..

Accidentally I have specified the airline-theme which did not exist. Vim argued about it and switched to some theme which actually does exactly what I wanted.

:help airlne and then search for /current told me that :AirlineTheme can show the name of current airline theme. So it's name was 'dark', but it was not in my themes directory... I even grepped for dark the whole themes dir but found only two themes with dark word in their names (dark_minimal and onedark) which were totally separate themes and unfortunately did not change the color when switching from Normal to Command mode..(((.

Quick google led me to this theme which contains this comment: "source: https://github.com/bling/vim-airline/blob/master/autoload/airline/themes/dark.vim"

So I followed the white rabbit and searching for word command found this part of code:

" For commandline mode, we use the colors from normal mode, except the mode
" indicator should be colored differently, e.g. blue on light green
let s:airline_a_commandline = [ '#0000ff' , '#0cff00' , 63  , 40 ]
let s:airline_b_commandline = [ '#ffffff' , '#444444' , 255 , 238 ]
let s:airline_c_commandline = [ '#9cffd3' , '#202020' , 85  , 234 ]
let g:airline#themes#dark#palette.commandline = airline#themes#generate_color_map(s:airline_a_commandline, s:airline_b_commandline, s:airline_c_commandline)

Ahaaaa! So this is how they do it!

And finally it took just a couple of minutes to adapt it to airline-solarized theme code style, transform this code into the following and put this in appropriate places:

  " Command mode
  let s:C1 = [s:N1[0], s:yellow, 'bold']
  let s:C2 = s:N2
  let s:C3 = s:N3
  let s:CF = s:NF
  let s:CM = s:NM

and:

  let g:airline#themes#solarized_custom#palette.commandline = airline#themes#generate_color_map(
        \ [s:C1[0].g, s:C1[1].g, s:C1[0].t, s:C1[1].t, s:C1[2]],
        \ [s:C2[0].g, s:C2[1].g, s:C2[0].t, s:C2[1].t, s:C2[2]],
        \ [s:C3[0].g, s:C3[1].g, s:C3[0].t, s:C3[1].t, s:C3[2]])

  let g:airline#themes#solarized_custom#palette.commandline.airline_warning =
        \ g:airline#themes#solarized_custom#palette.normal.airline_warning

  let g:airline#themes#solarized_custom#palette.commandline_modified = {
        \ 'airline_c': [s:RM[0].g, s:RM[1].g,
        \ s:RM[0].t, s:RM[1].t, s:RM[2]]}

  let g:airline#themes#solarized_custom#palette.replace_modified.airline_warning =
        \ g:airline#themes#solarized_custom#palette.normal.airline_warning

And voila!!!!

screen shot 2019-01-15 at 10 08 53 pm