Lualine section separators not showing/visible

[BigfootN]

Hello,

I am desperately trying to display the section separators in a certain color with a uniform background. Unfortunately I don't see any. They seem to be invisible (or the same color as the status line background color).

Here is my configuration:

return {
	"nvim-lualine/lualine.nvim",
	lazy = false,
	opts = {
		options = {
			theme = "gruvbox-material",
			icons_enabled = true,
			component_separators = {
				left = "",
				right = "",
			},
			section_separators = {
				left = "",
				right = "",
			},
			draw_empty = true,
			refresh = {
				statusline = 100,
			},
			global_status = true,
		},
		sections = {
			lualine_a = {
				{
					"mode",
					colored = true,
					color = {
						fg = "#ea6962",
					},
				},
			},
			lualine_b = {
				{
					"filename",
					colored = true,
					file_status = true,
					newfile_status = false,
					path = 1,
					shorting_target = 50,
					icons_enabled = true,
					symbols = {
						modified = "",
						readonly = "",
						unnamed = "󱀶",
						newfile = "",
					},
				},
			},
			lualine_c = {
				{
					"diagnostics",
					colored = true,
					sources = { "nvim_lsp", "nvim_diagnostic" },
					sections = {
						"warn",
						"error",
						"hint",
					},
					diagnostics_colors = {
						error = "DiagnosticError",
						warn = "DiagnosticWarn",
						info = "DiagnosticInfo",
						hint = "DiagnosticHint",
					},
					symbols = {
						warn = "󰀪 ",
						error = " ",
						hint = " ",
					},
					separator = "some_separator",
					always_visible = true,
					update_in_insert = true,
				},
			},
			lualine_x = {},
			lualine_y = {
				{
					"branch",
					icons_enabled = true,
					icon = "",
					draw_empty = false,
					colored = true,
					color = {
						bg = "#db4740",
					},
				},
			},
			lualine_z = {
				{
					"progress",
					colored = true,
					icon = {
						"󱨂",
					},
				},
			},
		},
		inactive_sections = {},
	},
	config = function(_, opts)
		local gruvbox_material_theme = require("lualine.themes.gruvbox-material")

		local lualine_bg = "#504945"

		-- a region
		local region_a_fg = "#ea6962"
		gruvbox_material_theme.insert.a = { bg = lualine_bg, fg = region_a_fg }
		gruvbox_material_theme.normal.a = { bg = lualine_bg, fg = region_a_fg }
		gruvbox_material_theme.visual.a = { bg = lualine_bg, fg = region_a_fg }
		gruvbox_material_theme.inactive.a = { bg = lualine_bg, fg = region_a_fg }

		-- b region
		local region_b_fg = "#d8a657"
		gruvbox_material_theme.insert.b = { bg = lualine_bg, fg = region_b_fg }
		gruvbox_material_theme.normal.b = { bg = lualine_bg, fg = region_b_fg }
		gruvbox_material_theme.visual.b = { bg = lualine_bg, fg = region_b_fg }
		gruvbox_material_theme.inactive.b = { bg = lualine_bg, fg = region_b_fg }

		-- middle / c region
		gruvbox_material_theme.insert.c = { bg = lualine_bg, fg = "#928374" }
		gruvbox_material_theme.normal.c = { bg = lualine_bg, fg = "#928374" }
		gruvbox_material_theme.visual.c = { bg = lualine_bg, fg = "#928374" }
		gruvbox_material_theme.inactive.c = { bg = lualine_bg, fg = "#928374" }

		opts.options.theme = gruvbox_material_theme

		require("lualine").setup(opts)
	end,
}

Here is what I get:

Here is what I would like to have (without images, just text):

[section_a] > [section_b] > [section_c] .......... [section_z]

But like you can see in the image, I don't see any separators.

Thank you very much in advance for any help

[iton0]

In command mode, the section separators are visible, but the component separator isn't. It appears that the section separators are using the background color of LuaLine A. A quick fix could be adjusting the background of LuaLine A. I noticed two more things:

• it should be globalstatus instead of global_status
• since you are setting the theme in your custom config with opt.option.theme = gruvbox_material_theme you can take out theme = 'gruvbox-material

Hope this can provide some insight.

[BigfootN]

Thank you very much for your quick reply.

A quick fix could be adjusting the background of LuaLine A

So I suppose that what I wish to achieve isn't possible since I wish to have a uniform background color (same background for all components, sections and statusline) ?

Thank you for your time and help

[iton0]

I am not sure. Hopefully someone else or a contributor could provide more insight.

[BigfootN]

Thank you for your honesty and help

[iton0]

I actually make have come up with a solution, a little tedious but should work. Here is an updated config:

-- New components
local left_component_separator = {
  function()
    return ''
  end,
  color = { fg = 'RED' },
  padding = { left = 0, right = 0 },
}

local right_component_separator = {
  function()
    return ''
  end,
  color = { fg = 'RED' },
  padding = { left = 0, right = 0 },
}

return {
  'nvim-lualine/lualine.nvim',
  lazy = false,
  opts = {
    options = {
      icons_enabled = true,
      component_separators = {
        left = '',
        right = '',
      },
      section_separators = {
        left = '',
        right = '',
      },
      draw_empty = true,
      refresh = {
        statusline = 100,
      },
      globalstatus = true,
    },
    sections = {
      lualine_a = {
        {
          'mode',
          colored = true,
          color = {
            fg = '#ea6962',
          },
        },
      },
      lualine_b = {
        left_component_separator,
        {
          'filename',
          colored = true,
          file_status = true,
          newfile_status = false,
          path = 1,
          shorting_target = 50,
          icons_enabled = true,
          symbols = {
            modified = '',
            readonly = '',
            unnamed = '󱀶',
            newfile = '',
          },
        },
      },
      lualine_c = {
        left_component_separator,
        {
          'diagnostics',
          colored = true,
          sources = { 'nvim_lsp', 'nvim_diagnostic' },
          sections = {
            'warn',
            'error',
            'hint',
          },
          diagnostics_colors = {
            error = 'DiagnosticError',
            warn = 'DiagnosticWarn',
            info = 'DiagnosticInfo',
            hint = 'DiagnosticHint',
          },
          symbols = {
            warn = '󰀪 ',
            error = ' ',
            hint = ' ',
          },
          separator = 'some_separator',
          always_visible = true,
          update_in_insert = true,
        },
      },
      lualine_x = {},
      lualine_y = {
        {
          'branch',
          icons_enabled = true,
          icon = '',
          draw_empty = false,
          colored = true,
          color = {
            bg = '#db4740',
          },
        },
      },
      lualine_z = {
        right_component_separator,
        {
          'progress',
          colored = true,
          icon = {
            '󱨂',
          },
        },
      },
    },
    inactive_sections = {},
  },
  config = function(_, opts)
    local gruvbox_material_theme = require('lualine.themes.gruvbox-material')

    local lualine_bg = '#504945'

    -- a region
    local region_a_fg = '#ea6962'
    gruvbox_material_theme.insert.a = { bg = lualine_bg, fg = region_a_fg }
    gruvbox_material_theme.normal.a = { bg = lualine_bg, fg = region_a_fg }
    gruvbox_material_theme.visual.a = { bg = lualine_bg, fg = region_a_fg }
    gruvbox_material_theme.inactive.a = { bg = lualine_bg, fg = region_a_fg }

    -- b region
    local region_b_fg = '#d8a657'
    gruvbox_material_theme.insert.b = { bg = lualine_bg, fg = region_b_fg }
    gruvbox_material_theme.normal.b = { bg = lualine_bg, fg = region_b_fg }
    gruvbox_material_theme.visual.b = { bg = lualine_bg, fg = region_b_fg }
    gruvbox_material_theme.inactive.b = { bg = lualine_bg, fg = region_b_fg }

    -- middle / c region
    gruvbox_material_theme.insert.c = { bg = lualine_bg, fg = '#928374' }
    gruvbox_material_theme.normal.c = { bg = lualine_bg, fg = '#928374' }
    gruvbox_material_theme.visual.c = { bg = lualine_bg, fg = '#928374' }
    gruvbox_material_theme.inactive.c = { bg = lualine_bg, fg = '#928374' }

    opts.options.theme = gruvbox_material_theme

    require('lualine').setup(opts)
  end,
}