Introduction

I configured QuteBrowser to check .home.arpa management and monitoring pages from the keyboard.

Configuration Context

The targets are local services such as the Edge router, Grafana, and Prometheus. Font sizes, scrolling, tab placement, and colors were adjusted for dashboard use.

QuteBrowser Configuration Details (config.py)

Autosave is disabled, and the main monitoring pages open at startup.

  config.load_autoconfig(False)
c.auto_save.session = False
c.url.default_page = "about:blank"
c.url.start_pages = [
    "https://edge.home.arpa",
    "https://desktop.home.arpa:3000",
    "https://storage.home.arpa:9090/targets",
    "http://storage.home.arpa:9080/targets",
]
  

Font and UI Adjustments

The font is Ricty Diminished at a larger size. Tabs sit on the left with an 18% width.

  c.fonts.default_family = "Ricty Diminished"
c.fonts.default_size = "21pt"
c.fonts.statusbar = "28pt"
c.fonts.web.family.standard = "Ricty Diminished"

c.tabs.title.format = "{current_title}"
c.tabs.show = "multiple"
c.tabs.position = "left"
c.tabs.width = "18%"
c.tabs.favicons.scale = 0.9
c.tabs.title.alignment = "left"
c.tabs.max_width = 250
c.tabs.min_width = 180
c.tabs.padding = {"top": 8, "bottom": 8, "left": 12, "right": 12}
c.tabs.indicator.width = 3
c.statusbar.show = "in-mode"
c.zoom.default = "145%"
  

Improving Operability with Keybindings

H/L go back and forward; J/K switch tabs. Larger scroll steps suit the dashboards.

  config.bind("H", "back")
config.bind("L", "forward")
config.bind("J", "tab-prev")
config.bind("K", "tab-next")
config.bind("d", "tab-close")
config.bind("u", "undo")
config.bind("x", "tab-close")
config.bind("X", "undo")

# j/k: Large line scrolling
config.bind("j", "scroll-px 0 200")
config.bind("k", "scroll-px 0 -200")

# Ctrl-F/B: Half-page scrolling
config.bind("<Ctrl-f>", "scroll-page 0 2")
config.bind("<Ctrl-b>", "scroll-page 0 -2")
  

Web Page and Tab Bar Color Settings (Dark Mode)

Forced dark mode is enabled. Tabs and the status bar use black (#000000), and self-signed certificate errors use ask for manual confirmation.

  c.content.cookies.accept = "no-3rdparty"
c.content.javascript.enabled = True
c.content.tls.certificate_errors = "ask"
c.colors.webpage.darkmode.enabled = True
c.colors.webpage.preferred_color_scheme = "dark"
c.scrolling.smooth = False
c.scrolling.bar = "always"
c.content.autoplay = True
c.statusbar.padding = {"top": 8, "bottom": 8, "left": 8, "right": 8}
c.statusbar.position = "bottom"

c.colors.tabs.bar.bg = "#000000"

c.colors.tabs.even.bg = "#000000"
c.colors.tabs.odd.bg = "#000000"
c.colors.tabs.even.fg = "#bbbbbb"
c.colors.tabs.odd.fg = "#bbbbbb"

c.colors.tabs.selected.even.bg = "#111111"
c.colors.tabs.selected.odd.bg = "#111111"
c.colors.tabs.selected.even.fg = "#ffffff"
c.colors.tabs.selected.odd.fg = "#ffffff"

c.colors.tabs.indicator.start = "#000000"
c.colors.tabs.indicator.stop = "#000000"
c.colors.tabs.indicator.error = "#550000"
  

Future Work

The setup supports keyboard navigation between monitoring pages. Session management and more dashboards remain possible additions.