add dialog skins

change_logs/release_v0.21.6.md

@@ -12,29 +12,30 @@ On Slack? Please join us [K9slackers](https://join.slack.com/t/k9sers/shared_inv
 
 ---
 
-## First A Word From Our Sponsors...
+## New Skins On The Block. Part Duh!
 
-First off, I would like to send a `Big Thank You` to the following generous K9s friends for joining our sponsorship program and supporting this project!
+In this drop, we've added a new skin configuration for table's cursor namely `cursorFgColor` and `cursorBgColor` as well as the ability to skin your dialogs:
-
-* [Drew](https://github.com/ScubaDrew)
-* [Vladimir Rybas](https://github.com/vrybas)
-
-Contrarily to popular belief, OSS is not free! We've now reached 8k stars and 270k downloads! As you all know, this project is not pimped out by a big company with deep pockets or a large team. This project is complex and does demand a lot of my time. So if k9s is useful to you and part of your daily lifecycle. Please contribute! Your contribution whether financial, PRs, issues or shout-outs on social/blogs are crucial to keep K9s growing and powerful for all of us!
-Don't let OSS by individual contributors become an oxymoron...
-
-## New Skins On The Block!
-
-In this drop, big thanks are in effect for [Dan Mikita](https://github.com/danmikita) for contributing a new K9s [solarized theme](https://github.com/derailed/k9s/tree/master/skins)!
-
-Also we've added a new skin configuration for table's cursor namely `cursorFgColor` and `cursorBgColor`:
 
 ```yaml
   # skin.yml
+k9s:
+  ...
+  # Note: You can now skin your dialogs.
+  dialog:
+    fgColor: *foreground
+    bgColor: *background
+    buttonFgColor: *foreground
+    buttonBgColor: *magenta
+    buttonFocusFgColor: white
+    buttonFocusBgColor: *cyan
+    labelFgColor: *orange
+    fieldFgColor: *foreground
   ...
   views:
     table:
       fgColor: *foreground
       bgColor: *background
+      # Note! new tags
       cursorFgColor: *foreground
       cursorBgColor: *current_line
       header:
@@ -46,7 +47,7 @@ Also we've added a new skin configuration for table's cursor namely `cursorFgCol
 
 ## Resolved Bugs/Features/PRs
 
-Maintenance Release
+* [Issue #795](https://github.com/derailed/k9s/issues/795)
 
 ---
 

go.mod

@@ -2,12 +2,10 @@ module github.com/derailed/k9s
 
 go 1.14
 
-replace github.com/derailed/tview => /Users/fernand/go_wk/derailed/src/github.com/derailed/tview
-
 require (
 	github.com/atotto/clipboard v0.1.2
 	github.com/derailed/popeye v0.8.8
-	github.com/derailed/tview v0.4.1
+	github.com/derailed/tview v0.4.2
 	github.com/drone/envsubst v1.0.2 // indirect
 	github.com/fatih/color v1.9.0
 	github.com/fsnotify/fsnotify v1.4.7

go.sum

@@ -151,6 +151,8 @@ github.com/derailed/tview v0.4.0 h1:PQIuBqU9+XxiPjQ+7tJKyoxIMm/cZErqY4sZgJjxhL8=
 github.com/derailed/tview v0.4.0/go.mod h1:GJ3k/TIzEE+sj1L09/usk6HrkjsdadSsb03eHgPbcII=
 github.com/derailed/tview v0.4.1 h1:SJNEgmXxmbxKgaW9g0SfwsqNAPwKDpjyx7u4IFJ18Hc=
 github.com/derailed/tview v0.4.1/go.mod h1:GJ3k/TIzEE+sj1L09/usk6HrkjsdadSsb03eHgPbcII=
+github.com/derailed/tview v0.4.2 h1:sOeYbUjvNUHD6UCBsXdmVL1qFbKDC321y/98KXpJIiU=
+github.com/derailed/tview v0.4.2/go.mod h1:GJ3k/TIzEE+sj1L09/usk6HrkjsdadSsb03eHgPbcII=
 github.com/dgrijalva/jwt-go v0.0.0-20170104182250-a601269ab70c/go.mod h1:E3ru+11k8xSBh+hMPgOLZmtrrCbhqsmaPHjLKYnJCaQ=
 github.com/dgrijalva/jwt-go v3.2.0+incompatible h1:7qlOGliEKZXTDg6OTjfoBKDXWrumCAMpl/TFQ4/5kLM=
 github.com/dgrijalva/jwt-go v3.2.0+incompatible/go.mod h1:E3ru+11k8xSBh+hMPgOLZmtrrCbhqsmaPHjLKYnJCaQ=

internal/config/styles.go

@@ -33,10 +33,11 @@ type (
 
 	// Style tracks K9s styles.
 	Style struct {
-		Body  Body  `yaml:"body"`
+		Body   Body   `yaml:"body"`
-		Frame Frame `yaml:"frame"`
+		Frame  Frame  `yaml:"frame"`
-		Info  Info  `yaml:"info"`
+		Info   Info   `yaml:"info"`
-		Views Views `yaml:"views"`
+		Views  Views  `yaml:"views"`
+		Dialog Dialog `yaml:"dialog"`
 	}
 
 	// Body tracks body styles.
@@ -46,6 +47,18 @@ type (
 		LogoColor Color `yaml:"logoColor"`
 	}
 
+	// Dialog tracks dialog styles.
+	Dialog struct {
+		FgColor            Color `yaml:"fgColor"`
+		BgColor            Color `yaml:"bgColor"`
+		ButtonFgColor      Color `yaml:"buttonFgColor"`
+		ButtonBgColor      Color `yaml:"buttonBgColor"`
+		ButtonFocusFgColor Color `yaml:"buttonFocusFgColor"`
+		ButtonFocusBgColor Color `yaml:"buttonFocusBgColor"`
+		LabelFgColor       Color `yaml:"labelFgColor"`
+		FieldFgColor       Color `yaml:"fieldFgColor"`
+	}
+
 	// Frame tracks frame styles.
 	Frame struct {
 		Title  Title  `yaml:"title"`
@@ -208,10 +221,24 @@ func (c Colors) Colors() []tcell.Color {
 
 func newStyle() Style {
 	return Style{
-		Body:  newBody(),
+		Body:   newBody(),
-		Frame: newFrame(),
+		Frame:  newFrame(),
-		Info:  newInfo(),
+		Info:   newInfo(),
-		Views: newViews(),
+		Views:  newViews(),
+		Dialog: newDialog(),
+	}
+}
+
+func newDialog() Dialog {
+	return Dialog{
+		FgColor:            "cadetBlue",
+		BgColor:            "black",
+		ButtonBgColor:      "darkslateblue",
+		ButtonFgColor:      "black",
+		ButtonFocusBgColor: "dodgerblue",
+		ButtonFocusFgColor: "black",
+		LabelFgColor:       "white",
+		FieldFgColor:       "white",
 	}
 }
 
@@ -440,6 +467,11 @@ func (s *Styles) Charts() Charts {
 	return s.K9s.Views.Charts
 }
 
+// Dialog returns dialog styles.
+func (s *Styles) Dialog() Dialog {
+	return s.K9s.Dialog
+}
+
 // Table returns table styles.
 func (s *Styles) Table() Table {
 	return s.K9s.Views.Table

internal/ui/dialog/confirm.go

@@ -1,9 +1,9 @@
 package dialog
 
 import (
+	"github.com/derailed/k9s/internal/config"
 	"github.com/derailed/k9s/internal/ui"
 	"github.com/derailed/tview"
-	"github.com/gdamore/tcell"
 )
 
 const confirmKey = "confirm"
@@ -13,14 +13,14 @@ type (
 )
 
 // ShowConfirm pops a confirmation dialog.
-func ShowConfirm(pages *ui.Pages, title, msg string, ack confirmFunc, cancel cancelFunc) {
+func ShowConfirm(styles config.Dialog, pages *ui.Pages, title, msg string, ack confirmFunc, cancel cancelFunc) {
 	f := tview.NewForm()
 	f.SetItemPadding(0)
 	f.SetButtonsAlign(tview.AlignCenter).
-		SetButtonBackgroundColor(tview.Styles.PrimitiveBackgroundColor).
+		SetButtonBackgroundColor(styles.ButtonBgColor.Color()).
-		SetButtonTextColor(tview.Styles.PrimaryTextColor).
+		SetButtonTextColor(styles.ButtonFgColor.Color()).
-		SetLabelColor(tcell.ColorAqua).
+		SetLabelColor(styles.LabelFgColor.Color()).
-		SetFieldTextColor(tcell.ColorOrange)
+		SetFieldTextColor(styles.FieldFgColor.Color())
 	f.AddButton("Cancel", func() {
 		dismissConfirm(pages)
 		cancel()
@@ -30,9 +30,19 @@ func ShowConfirm(pages *ui.Pages, title, msg string, ack confirmFunc, cancel can
 		dismissConfirm(pages)
 		cancel()
 	})
+	for i := 0; i < 2; i++ {
+		b := f.GetButton(i)
+		if b == nil {
+			continue
+		}
+		b.SetBackgroundColorActivated(styles.ButtonFocusBgColor.Color())
+		b.SetLabelColorActivated(styles.ButtonFocusFgColor.Color())
+	}
 
 	modal := tview.NewModalForm("<"+title+">", f)
 	modal.SetText(msg)
+	modal.SetTextColor(styles.FgColor.Color())
+	modal.SetBackgroundColor(styles.BgColor.Color())
 	modal.SetDoneFunc(func(int, string) {
 		dismissConfirm(pages)
 		cancel()

internal/ui/dialog/confirm_test.go

@@ -3,6 +3,7 @@ package dialog
 import (
 	"testing"
 
+	"github.com/derailed/k9s/internal/config"
 	"github.com/derailed/k9s/internal/ui"
 	"github.com/derailed/tview"
 	"github.com/stretchr/testify/assert"
@@ -19,7 +20,7 @@ func TestConfirmDialog(t *testing.T) {
 	caFunc := func() {
 		assert.True(t, true)
 	}
-	ShowConfirm(p, "Blee", "Yo", ackFunc, caFunc)
+	ShowConfirm(config.Dialog{}, p, "Blee", "Yo", ackFunc, caFunc)
 
 	d := p.GetPrimitive(confirmKey).(*tview.ModalForm)
 	assert.NotNil(t, d)

internal/ui/dialog/delete.go

@@ -1,9 +1,9 @@
 package dialog
 
 import (
+	"github.com/derailed/k9s/internal/config"
 	"github.com/derailed/k9s/internal/ui"
 	"github.com/derailed/tview"
-	"github.com/gdamore/tcell"
 )
 
 const deleteKey = "delete"
@@ -14,15 +14,15 @@ type (
 )
 
 // ShowDelete pops a resource deletion dialog.
-func ShowDelete(pages *ui.Pages, msg string, ok okFunc, cancel cancelFunc) {
+func ShowDelete(styles config.Dialog, pages *ui.Pages, msg string, ok okFunc, cancel cancelFunc) {
 	cascade, force := true, false
 	f := tview.NewForm()
 	f.SetItemPadding(0)
 	f.SetButtonsAlign(tview.AlignCenter).
-		SetButtonBackgroundColor(tview.Styles.PrimitiveBackgroundColor).
+		SetButtonBackgroundColor(styles.ButtonBgColor.Color()).
-		SetButtonTextColor(tview.Styles.PrimaryTextColor).
+		SetButtonTextColor(styles.ButtonFgColor.Color()).
-		SetLabelColor(tcell.ColorAqua).
+		SetLabelColor(styles.LabelFgColor.Color()).
-		SetFieldTextColor(tcell.ColorOrange)
+		SetFieldTextColor(styles.FieldFgColor.Color())
 	f.AddCheckbox("Cascade:", cascade, func(checked bool) {
 		cascade = checked
 	})
@@ -39,8 +39,12 @@ func ShowDelete(pages *ui.Pages, msg string, ok okFunc, cancel cancelFunc) {
 		cancel()
 	})
 	for i := 0; i < 2; i++ {
-		f.GetButton(i).SetBackgroundColorActivated(tcell.ColorWhite)
+		b := f.GetButton(i)
-		f.GetButton(i).SetLabelColorActivated(tcell.ColorRed)
+		if b == nil {
+			continue
+		}
+		b.SetBackgroundColorActivated(styles.ButtonFocusBgColor.Color())
+		b.SetLabelColorActivated(styles.ButtonFocusFgColor.Color())
 	}
 	f.SetFocus(2)
 

internal/ui/dialog/delete_test.go

@@ -3,6 +3,7 @@ package dialog
 import (
 	"testing"
 
+	"github.com/derailed/k9s/internal/config"
 	"github.com/derailed/k9s/internal/ui"
 	"github.com/derailed/tview"
 	"github.com/stretchr/testify/assert"
@@ -18,7 +19,7 @@ func TestDeleteDialog(t *testing.T) {
 	caFunc := func() {
 		assert.True(t, true)
 	}
-	ShowDelete(p, "Yo", okFunc, caFunc)
+	ShowDelete(config.Dialog{}, p, "Yo", okFunc, caFunc)
 
 	d := p.GetPrimitive(deleteKey).(*tview.ModalForm)
 	assert.NotNil(t, d)

internal/view/actions.go

@@ -149,7 +149,7 @@ func pluginAction(r Runner, p config.Plugin) ui.ActionHandler {
 		}
 		if p.Confirm {
 			msg := fmt.Sprintf("Run?\n%s %s", p.Command, strings.Join(args, " "))
-			dialog.ShowConfirm(r.App().Content.Pages, "Confirm "+p.Description, msg, cb, func() {})
+			dialog.ShowConfirm(r.App().Styles.Dialog(), r.App().Content.Pages, "Confirm "+p.Description, msg, cb, func() {})
 			return nil
 		}
 		cb()

internal/view/browser.go

@@ -482,7 +482,7 @@ func (b *Browser) namespaceActions(aa ui.KeyActions) {
 }
 
 func (b *Browser) simpleDelete(selections []string, msg string) {
-	dialog.ShowConfirm(b.app.Content.Pages, "Confirm Delete", msg, func() {
+	dialog.ShowConfirm(b.app.Styles.Dialog(), b.app.Content.Pages, "Confirm Delete", msg, func() {
 		b.ShowDeleted()
 		if len(selections) > 1 {
 			b.app.Flash().Infof("Delete %d marked %s", len(selections), b.GVR())
@@ -506,7 +506,7 @@ func (b *Browser) simpleDelete(selections []string, msg string) {
 }
 
 func (b *Browser) resourceDelete(selections []string, msg string) {
-	dialog.ShowDelete(b.app.Content.Pages, msg, func(cascade, force bool) {
+	dialog.ShowDelete(b.app.Styles.Dialog(), b.app.Content.Pages, msg, func(cascade, force bool) {
 		b.ShowDeleted()
 		if len(selections) > 1 {
 			b.app.Flash().Infof("Delete %d marked %s", len(selections), b.GVR())

internal/view/dir.go

@@ -174,7 +174,7 @@ func (d *Dir) delCmd(evt *tcell.EventKey) *tcell.EventKey {
 	d.Stop()
 	defer d.Start()
 	msg := fmt.Sprintf("Delete resource(s) in manifest %s", sel)
-	dialog.ShowConfirm(d.App().Content.Pages, "Confirm Delete", msg, func() {
+	dialog.ShowConfirm(d.App().Styles.Dialog(), d.App().Content.Pages, "Confirm Delete", msg, func() {
 		args := make([]string, 0, 10)
 		args = append(args, "delete")
 		args = append(args, "-f")

internal/view/node.go

@@ -114,7 +114,7 @@ func (n *Node) toggleCordonCmd(cordon bool) func(evt *tcell.EventKey) *tcell.Eve
 			title, msg = title+"Uncordon", "Uncordon "
 		}
 		msg += path + "?"
-		dialog.ShowConfirm(n.App().Content.Pages, title, msg, func() {
+		dialog.ShowConfirm(n.App().Styles.Dialog(), n.App().Content.Pages, title, msg, func() {
 			res, err := dao.AccessorFor(n.App().factory, n.GVR())
 			if err != nil {
 				n.App().Flash().Err(err)

internal/view/pf_dialog.go

@@ -17,15 +17,16 @@ type PortForwardCB func(v ResourceViewer, path, co string, mapper []client.PortT
 
 // ShowPortForwards pops a port forwarding configuration dialog.
 func ShowPortForwards(v ResourceViewer, path string, ports []string, okFn PortForwardCB) {
-	styles := v.App().Styles
+	styles := v.App().Styles.Dialog()
 
 	f := tview.NewForm()
 	f.SetItemPadding(0)
 	f.SetButtonsAlign(tview.AlignCenter).
-		SetButtonBackgroundColor(styles.BgColor()).
+		SetButtonBackgroundColor(styles.ButtonBgColor.Color()).
-		SetButtonTextColor(styles.FgColor()).
+		SetButtonTextColor(styles.ButtonFgColor.Color()).
-		SetLabelColor(styles.K9s.Info.FgColor.Color()).
+		SetLabelColor(styles.LabelFgColor.Color()).
-		SetFieldTextColor(styles.K9s.Info.SectionColor.Color())
+		SetFieldTextColor(styles.FieldFgColor.Color()).
+		SetFieldBackgroundColor(styles.BgColor.Color())
 
 	address := v.App().Config.CurrentCluster().PortForwardAddress
 	p1, p2 := ports[0], extractPort(ports[0])
@@ -38,8 +39,14 @@ func ShowPortForwards(v ResourceViewer, path string, ports []string, okFn PortFo
 	f.AddInputField("Address:", address, 30, nil, func(h string) {
 		address = h
 	})
-
+	for i := 0; i < 3; i++ {
-	pages := v.App().Content.Pages
+		field, ok := f.GetFormItem(i).(*tview.InputField)
+		if !ok {
+			continue
+		}
+		field.SetLabelColor(styles.LabelFgColor.Color())
+		field.SetFieldTextColor(styles.FieldFgColor.Color())
+	}
 
 	f.AddButton("OK", func() {
 		pp1 := strings.Split(p1, ",")
@@ -48,7 +55,6 @@ func ShowPortForwards(v ResourceViewer, path string, ports []string, okFn PortFo
 			v.App().Flash().Err(fmt.Errorf("container to local port mismatch"))
 			return
 		}
-
 		var tt []client.PortTunnel
 		for i := range pp1 {
 			tt = append(tt, client.PortTunnel{
@@ -59,12 +65,23 @@ func ShowPortForwards(v ResourceViewer, path string, ports []string, okFn PortFo
 		}
 		okFn(v, path, extractContainer(pp1[0]), tt)
 	})
+	pages := v.App().Content.Pages
 	f.AddButton("Cancel", func() {
 		DismissPortForwards(v, pages)
 	})
+	for i := 0; i < 2; i++ {
+		b := f.GetButton(i)
+		if b == nil {
+			continue
+		}
+		b.SetBackgroundColorActivated(styles.ButtonFocusBgColor.Color())
+		b.SetLabelColorActivated(styles.ButtonFocusFgColor.Color())
+	}
 
 	modal := tview.NewModalForm(fmt.Sprintf("<PortForward on %s>", path), f)
 	modal.SetText("Exposed Ports: " + strings.Join(ports, ","))
+	modal.SetTextColor(styles.FgColor.Color())
+	modal.SetBackgroundColor(styles.BgColor.Color())
 	modal.SetDoneFunc(func(_ int, b string) {
 		DismissPortForwards(v, pages)
 	})

internal/view/restart_extender.go

@@ -43,7 +43,7 @@ func (r *RestartExtender) restartCmd(evt *tcell.EventKey) *tcell.EventKey {
 	if len(paths) > 1 {
 		msg = fmt.Sprintf("Restart %d deployments?", len(paths))
 	}
-	dialog.ShowConfirm(r.App().Content.Pages, "Confirm Restart", msg, func() {
+	dialog.ShowConfirm(r.App().Styles.Dialog(), r.App().Content.Pages, "Confirm Restart", msg, func() {
 		ctx, cancel := context.WithTimeout(context.Background(), r.App().Conn().Config().CallTimeout())
 		defer cancel()
 		for _, path := range paths {

internal/view/xray.go

@@ -642,7 +642,7 @@ func (x *Xray) styleTitle() string {
 }
 
 func (x *Xray) resourceDelete(gvr client.GVR, spec *xray.NodeSpec, msg string) {
-	dialog.ShowDelete(x.app.Content.Pages, msg, func(cascade, force bool) {
+	dialog.ShowDelete(x.app.Styles.Dialog(), x.app.Content.Pages, msg, func(cascade, force bool) {
 		x.app.Flash().Infof("Delete resource %s %s", spec.GVR(), spec.Path())
 		accessor, err := dao.AccessorFor(x.app.factory, gvr)
 		if err != nil {

skins/black_and_wtf.yml

@@ -20,6 +20,15 @@ k9s:
   info:
     fgColor: *text
     sectionColor: *fg
+  dialog:
+    fgColor: *fg
+    bgColor: *bg
+    buttonFgColor: *fg
+    buttonBgColor: *bg
+    buttonFocusFgColor: *slate
+    buttonFocusBgColor: *white
+    labelFgColor: *ghost
+    fieldFgColor: *white
   frame:
     border:
       fgColor: *fg

skins/dracula.yml

@@ -23,6 +23,16 @@ k9s:
   info:
     fgColor: *pink
     sectionColor: *foreground
+  # Dialog styles.
+  dialog:
+    fgColor: *foreground
+    bgColor: *background
+    buttonFgColor: *foreground
+    buttonBgColor: *purple
+    buttonFocusFgColor: *yellow
+    buttonFocusBgColor: *pink
+    labelFgColor: *orange
+    fieldFgColor: *foreground
   frame:
     # Borders styles.
     border:

skins/in_the_navy.yml

@@ -26,6 +26,15 @@ k9s:
   info:
     fgColor: *sky
     sectionColor: *steel
+  dialog:
+    fgColor: *fg
+    bgColor: *bg
+    buttonFgColor: *fg
+    buttonBgColor: *powder
+    buttonFocusFgColor: white
+    buttonFocusBgColor: *aqua
+    labelFgColor: *mslate
+    fieldFgColor: *fg
   frame:
     border:
       fgColor: *fg

skins/kiss.yml

@@ -7,6 +7,15 @@ k9s:
   info:
     fgColor: default
     sectionColor: default
+  dialog:
+    fgColor: default
+    bgColor: default
+    buttonFgColor: default
+    buttonBgColor: default
+    buttonFocusFgColor: default
+    buttonFocusBgColor: default
+    labelFgColor: default
+    fieldFgColor: default
   frame:
     border:
       fgColor: default

skins/snazzy.yml

@@ -6,6 +6,15 @@ k9s:
   info:
     fgColor: white
     sectionColor: "#5af78e"
+  dialog:
+    fgColor: "#97979b"
+    bgColor: "#282a36"
+    buttonFgColor: "#97979b"
+    buttonBgColor: "#282a36"
+    buttonFocusFgColor: "#97979b"
+    buttonFocusBgColor: "#5af78e"
+    labelFgColor: "#97979b"
+    fieldFgColor: "#5af78e"
   frame:
     border:
       fgColor: "#5af78e"

skins/solarized_dark.yml

@@ -19,6 +19,15 @@ k9s:
   info:
     fgColor: *magenta
     sectionColor: *foreground
+  dialog:
+    fgColor: *foreground
+    bgColor: *background
+    buttonFgColor: *foreground
+    buttonBgColor: *magenta
+    buttonFocusFgColor: white
+    buttonFocusBgColor: *cyan
+    labelFgColor: *orange
+    fieldFgColor: *foreground
   frame:
     border:
       fgColor: *selection

skins/stock.yml

@@ -6,6 +6,15 @@ k9s:
   info:
     fgColor: white
     sectionColor: dodgerblue
+  dialog:
+    fgColor: dodgerblue
+    bgColor: black
+    buttonFgColor: black
+    buttonBgColor: dodgerblue
+    buttonFocusFgColor: white
+    buttonFocusBgColor: fuchsia
+    labelFgColor: fuchsia
+    fieldFgColor: dodgerblue
   frame:
     border:
       fgColor: dodgerblue