Skip to content

Commit

Permalink
A first attempt to make termshark themeable
Browse files Browse the repository at this point in the history 
This work is attempting to address issue #95. @kevinhwang91 suggested
making termshark themeable so that colors could line up with other
terminal apps that do support themes.

All of termshark's palette keys are now exposed as theme settings. Below
is an example of using them from my termshark.toml file. This is my
attempt to use the dracula theme's colors (https://draculatheme.com/)
instead of the defaults. It works best in dark mode, I think. The simple
rules are:

- add dark-mode rules under [themes.rules.dark]
- add light mode rules under [themes.rules.light]
- define colors as <name> = <value>. The value can refer to another key,
  or use a syntax like #rrggbb (you can use other gowid color names
  too).
- define theme rules as <name> = [fgcolor, bgcolor]

In the docs I'll explain what all these theme names mean.

[themes]

  [themes.dracula]
    bg = "#282a36"
    bg2 = "#373844"
    bg3 = "#464752"
    bg4 = "#565761"
    black = "themes.dracula.bg"
    comment = "#6272a4"
    current = "#44475a"
    cyan = "#8be9fd"
    fg = "#f8f8f2"
    fg2 = "#e2e2dc"
    fg3 = "#ccccc7"
    fg4 = "#b6b6b2"
    green = "#50fa7b"
    orange = "#ffb86c"
    other-blue = "#0189cc"
    pink = "#ff79c6"
    purple = "#bd93f9"
    red = "#ff5555"
    white = "themes.dracula.fg"
    yellow = "#f1fa8c"

  [themes.rules]

    [themes.rules.dark]
      button = ["themes.dracula.white","themes.dracula.black"]
      button-focus = ["themes.dracula.black","themes.dracula.purple"]
      button-selected = ["themes.dracula.white","themes.dracula.black"]
      cmdline = ["themes.dracula.black","themes.dracula.yellow"]
      cmdline-button = ["themes.dracula.yellow","themes.dracula.black"]
      copy-mode = ["themes.dracula.black","themes.dracula.yellow"]
      copy-mode-alt = ["themes.dracula.yellow","themes.dracula.black"]
      copy-mode-label = ["themes.dracula.white","themes.dracula.red"]
      current-capture = ["themes.dracula.white","themes.unused"]
      default = ["themes.dracula.white","themes.dracula.black"]
      dialog = ["themes.dracula.black","themes.dracula.yellow"]
      dialog-button = ["themes.dracula.yellow","themes.dracula.black"]
      filter-intermediate = ["themes.dracula.black","themes.dracula.orange"]
      filter-invalid = ["themes.dracula.black","themes.dracula.red"]
      filter-menu = ["themes.dracula.white","themes.dracula.black"]
      filter-valid = ["themes.dracula.black","themes.dracula.green"]
      hex-byte-selected = ["themes.dracula.black","themes.dracula.purple"]
      hex-byte-unselected = ["themes.dracula.black","themes.dracula.black"]
      hex-field-selected = ["themes.dracula.black","themes.dracula.cyan"]
      hex-field-unselected = ["themes.dracula.black","themes.dracula.white"]
      hex-interval-selected = ["themes.dracula.white","themes.dracula.bg4"]
      hex-interval-unselected = ["themes.dracula.white","themes.dracula.bg3"]
      hex-layer-selected = ["themes.dracula.white","themes.dracula.bg4"]
      hex-layer-unselected = ["themes.dracula.white","themes.dracula.bg3"]
      packet-list-cell-focus = ["themes.dracula.black","themes.dracula.purple"]
      packet-list-cell-selected = ["themes.dracula.white","themes.dracula.bg4"]
      packet-list-row-focus = ["themes.dracula.bg4","themes.dracula.cyan"]
      packet-list-row-selected = ["themes.dracula.white","themes.dracula.bg3"]
      packet-struct-focus = ["themes.dracula.bg4","themes.dracula.cyan"]
      packet-struct-selected = ["themes.dracula.black","themes.dracula.bg4"]
      progress = ["themes.dracula.white","themes.dracula.black"]
      progress-complete = ["themes.unused","themes.dracula.purple"]
      spinner = ["themes.dracula.yellow","themes.dracula.black"]
      stream-client = ["themes.dracula.black","themes.dracula.red"]
      stream-match = ["themes.dracula.black","themes.dracula.yellow"]
      stream-search = ["themes.dracula.black","themes.dracula.white"]
      stream-server = ["themes.dracula.cyan","themes.dracula.comment"]
      title = ["themes.dracula.red","themes.unused"]

    [themes.rules.light]
      button = ["themes.dracula.black","themes.dracula.white"]
      button-focus = ["themes.dracula.black","themes.dracula.purple"]
      button-selected = ["themes.dracula.black","themes.dracula.fg4"]
      cmdline = ["themes.dracula.black","themes.dracula.yellow"]
      cmdline-button = ["themes.dracula.yellow","themes.dracula.black"]
      copy-mode = ["themes.dracula.white","themes.dracula.yellow"]
      copy-mode-alt = ["themes.dracula.yellow","themes.dracula.white"]
      copy-mode-label = ["themes.dracula.black","themes.dracula.red"]
      current-capture = ["themes.dracula.black","themes.unused"]
      default = ["themes.dracula.black","themes.dracula.white"]
      dialog = ["themes.dracula.black","themes.dracula.yellow"]
      dialog-button = ["themes.dracula.yellow","themes.dracula.black"]
      filter-intermediate = ["themes.dracula.black","themes.dracula.orange"]
      filter-invalid = ["themes.dracula.black","themes.dracula.red"]
      filter-menu = ["themes.dracula.black","themes.dracula.white"]
      filter-valid = ["themes.dracula.black","themes.dracula.green"]
      hex-byte-selected = ["themes.dracula.black","themes.dracula.purple"]
      hex-byte-unselected = ["themes.dracula.black","themes.dracula.white"]
      hex-field-selected = ["themes.dracula.black","themes.dracula.cyan"]
      hex-field-unselected = ["themes.dracula.black","themes.dracula.bg4"]
      hex-interval-selected = ["themes.dracula.white","themes.dracula.bg4"]
      hex-interval-unselected = ["themes.dracula.black","themes.dracula.fg3"]
      hex-layer-selected = ["themes.dracula.white","themes.dracula.bg4"]
      hex-layer-unselected = ["themes.dracula.black","themes.dracula.fg3"]
      packet-list-cell-focus = ["themes.dracula.black","themes.dracula.purple"]
      packet-list-cell-selected = ["themes.dracula.black","themes.dracula.fg4"]
      packet-list-row-focus = ["themes.dracula.black","themes.dracula.cyan"]
      packet-list-row-selected = ["themes.dracula.black","themes.dracula.fg1"]
      packet-struct-focus = ["themes.dracula.black","themes.dracula.cyan"]
      packet-struct-selected = ["themes.dracula.black","themes.dracula.fg3"]
      progress = ["themes.dracula.black","themes.dracula.white"]
      progress-complete = ["themes.unused","themes.dracula.purple"]
      spinner = ["themes.dracula.yellow","themes.dracula.white"]
      stream-client = ["themes.dracula.white","themes.dracula.red"]
      stream-match = ["themes.dracula.white","themes.dracula.yellow"]
      stream-search = ["themes.dracula.white","themes.dracula.black"]
      stream-server = ["themes.dracula.cyan","themes.dracula.comment"]
      title = ["themes.dracula.red","themes.unused"]
  • Loading branch information
@gcla
gcla committed Sep 7, 2020
1 parent 50f7642 commit e073727
Show file tree
Hide file tree
Showing 6 changed files with 290 additions and 170 deletions.
8 changes: 4 additions & 4 deletions pdmltree/pdmltree.go
View file
Expand Up @@ -90,16 +90,16 @@ func (n *Model) HexLayers(pos int, includeFirst bool) []hexdumper2.LayerStyler {
res = append(res, hexdumper2.LayerStyler{
Start: c.Pos,
End: c.Pos + c.Size,
ColUnselected: "hex-bottom-unselected",
ColSelected: "hex-bottom-selected",
ColUnselected: "hex-layer-unselected",
ColSelected: "hex-layer-selected",
})
for _, c2 := range c.Children_ {
if c2.Pos <= pos && pos < c2.Pos+c2.Size {
res = append(res, hexdumper2.LayerStyler{
Start: c2.Pos,
End: c2.Pos + c2.Size,
ColUnselected: "hex-top-unselected",
ColSelected: "hex-top-selected",
ColUnselected: "hex-field-unselected",
ColSelected: "hex-field-selected",
})
}
}
Expand Down
12 changes: 6 additions & 6 deletions ui/convsui.go
View file
Expand Up @@ -708,10 +708,10 @@ func (w *ConvsUiWidget) OnData(data string, app gowid.IApp) {
TableSeparator: divider.NewUnicode(),
VerticalSeparator: nil,
CellStyleProvided: true,
CellStyleSelected: gowid.MakePaletteRef("pkt-list-cell-selected"),
CellStyleFocus: gowid.MakePaletteRef("pkt-list-cell-focus"),
CellStyleSelected: gowid.MakePaletteRef("packet-list-cell-selected"),
CellStyleFocus: gowid.MakePaletteRef("packet-list-cell-focus"),
HeaderStyleProvided: true,
HeaderStyleFocus: gowid.MakePaletteRef("pkt-list-cell-focus"),
HeaderStyleFocus: gowid.MakePaletteRef("packet-list-cell-focus"),
},
Layout: table.LayoutOptions{
Widths: wids,
Expand All @@ -720,7 +720,7 @@ func (w *ConvsUiWidget) OnData(data string, app gowid.IApp) {

ptblModel := psmlmodel.New(
tblModel,
gowid.MakePaletteRef("pkt-list-row-focus"),
gowid.MakePaletteRef("packet-list-row-focus"),
)

if currentShortName, ok := convs.OfficialNameToType[cur]; ok {
Expand All @@ -736,8 +736,8 @@ func (w *ConvsUiWidget) OnData(data string, app gowid.IApp) {

boundedTbl := NewRowFocusTableWidget(
tbl,
"pkt-list-row-selected",
"pkt-list-row-focus",
"packet-list-row-selected",
"packet-list-row-focus",
)

var _ list.IWalker = boundedTbl
Expand Down

0 comments on commit e073727

Please sign in to comment.