Skins, libary: add focus border to all table cells

9 files changed, 202 insertions, 212 deletions

diff --git a/res/skins/Deere/style.qss b/res/skins/Deere/style.qss
index c636bb3545..d2252f58ac 100644
--- a/res/skins/Deere/style.qss
+++ b/res/skins/Deere/style.qss
@@ -213,17 +213,34 @@
 #LibraryContainer QTableView,
 #LibraryContainer QTreeView {
   color: #d2d2d2;
+  border: 1px solid #1A1A1A;
   background-color: #1F1F1F;
-  selection-background-color: #006596;
+  alternate-background-color: #1A1A1A;
+/* In selected library rows this sets the color of
+  * shapes in star rating delegate
+  * focus border of Cover Art and Color delegates
+   > See src/library/coverartdelegate.cpp: "option.palette.highlightedText().color();" */
   selection-color: #D6D6D6;
-  border: 1px solid #1A1A1A;
-  gridline-color: red;
-  /* Suppresses that selected sidebar item's branch indicator shows wrong color
-     when out of focus, see lp:880588 */
-  show-decoration-selected: 1;
+  /* background of Color delegate in selected row */
+  selection-background-color: #006596;
 }
-#LibraryContainer QTableView {
-  alternate-background-color: #1A1A1A;
+
+/* Selected rows in Tree and Tracks table */
+#LibraryContainer QTableView::item:selected,
+#LibraryContainer QTreeView::item:selected,
+#LibraryBPMButton::item:selected {
+  color: #D6D6D6;
+  background-color: #006596;
+}
+#LibraryContainer QTreeView::item:focus {
+  outline: none;
+}
+/* Use the native focus decoration */
+/* This is for all cells including Played and Location */
+#LibraryContainer QTableView,
+/* This is for the BPM cell */
+#LibraryContainer QTableView QCheckBox:focus {
+  outline: 1px solid #D6D6D6;
 }
 
 #LibraryContainer QTableView:focus,
@@ -232,17 +249,6 @@
   border: 1px solid #FF6600;
 }
 
-/* Colors aren't applied to selected items, define them manually */
-#LibraryContainer QTableView::item:selected,
-#LibraryContainer QTreeView::item:selected,
-#LibraryBPMButton::item:selected,
-#LibraryContainer QTreeView::branch:selected,
-/* This won't style the Preview button */
-#LibraryPreviewButton::item:selected {
-  color: #D6D6D6;
-  background-color: #006596;
-}
-
 /* Table cell in edit mode */
 WLibrary QLineEdit,
 WBeatSpinBox,
@@ -414,8 +420,10 @@ WSearchLineEdit {
   qproperty-layoutSpacing: 0;
 }
 
+#LibraryContainer QTreeView,
+#LibraryContainer QTreeView::item:focus {
+  outline: none;
 /* Spacing between treeview and preview deck/search bar */
-#LibraryContainer QTreeView {
   margin: 0px;
 }
 
diff --git a/res/skins/LateNight/library.xml b/res/skins/LateNight/library.xml
index 361a4ca155..7311eff790 100644
--- a/res/skins/LateNight/library.xml
+++ b/res/skins/LateNight/library.xml
@@ -110,8 +110,6 @@
 
               <!-- Library Table-->
               <Library>
-                <BgColor>#585858</BgColor>
-                <FgColor>#eece33</FgColor>
                 <ShowButtonText>false</ShowButtonText>
                 <TrackTableBackgroundColorOpacity>0.125</TrackTableBackgroundColorOpacity>
               </Library>
diff --git a/res/skins/LateNight/palemoon/buttons/btn__lib_bpm_locked_orange.svg b/res/skins/LateNight/palemoon/buttons/btn__lib_bpm_locked_blue.svg
index 2f902297b1..2f902297b1 100644
--- a/res/skins/LateNight/palemoon/buttons/btn__lib_bpm_locked_orange.svg
+++ b/res/skins/LateNight/palemoon/buttons/btn__lib_bpm_locked_blue.svg
diff --git a/res/skins/LateNight/palemoon/buttons/btn__lib_bpm_unlocked_black.svg b/res/skins/LateNight/palemoon/buttons/btn__lib_bpm_unlocked_black.svg
deleted file mode 100644
index 68c2429677..0000000000
--- a/res/skins/LateNight/palemoon/buttons/btn__lib_bpm_unlocked_black.svg
+++ /dev/null
@@ -1,5 +0,0 @@
-<svg width="10" height="12" version="1.1" xmlns="http://www.w3.org/2000/svg">
-	<g transform="translate(0,-20)">
-		<path transform="translate(0,20)" d="m4.9766 0c-1.4489.01-2.4418.65947-2.9336 1.4238l1.26172.81059c.2485-.38625.62385-.7271 1.6816-.73438 1.0447-.00718 1.407.31941 1.6699.75781.26297.4384.34296 1.0862.34375 1.5742.0009639.58906.0001684 1.8689 0 2.168h-6.166c-.41667 0-.83398.41498-.83398.83008v4.3398c0 .4151.41732.83008.83398.83008h8.332c.41667 0 .83398-.41498.83398-.83008v-4.3398c0-.4151-.41732-.83008-.83398-.83008h-.66602c.000169-.29836.0009685-1.5773 0-2.1719-.0009966-.61214-.060246-1.5129-.55859-2.3438-.49835-.83081-1.5189-1.4943-2.9648-1.4844zm-2.9766 8h6c.277 0 .5.223.5.5s-.223.5-.5.5h-6c-.277 0-.5-.223-.5-.5s.223-.5.5-.5zm0 2h6c.277 0 .5.223.5.5s-.223.5-.5.5h-6c-.277 0-.5-.223-.5-.5s.223-.5.5-.5z" color="#000001" color-rendering="auto" dominant-baseline="auto" image-rendering="auto" shape-rendering="auto" solid-color="#000001" style="font-feature-settings:normal;font-variant-alternates:normal;font-variant-caps:normal;font-variant-ligatures:normal;font-variant-numeric:normal;font-variant-position:normal;isolation:auto;mix-blend-mode:normal;shape-padding:0;text-decoration-color:#000001;text-decoration-line:none;text-decoration-style:solid;text-indent:0;text-orientation:mixed;text-transform:none;white-space:normal"/>
-	</g>
-</svg>
diff --git a/res/skins/LateNight/style_classic.qss b/res/skins/LateNight/style_classic.qss
index 3d7749c3c0..9613aaafb4 100644
--- a/res/skins/LateNight/style_classic.qss
+++ b/res/skins/LateNight/style_classic.qss
@@ -744,6 +744,11 @@ WLibrary,
   #FxUnitLabel {
     alignment: left;
   }
+#FxUnitHeaderCollapsed[highlight="1"],
+#FxUnitHeaderExpanded[highlight="1"] {
+  border-top: 1px solid #d09300;
+  border-right: 1px solid #d09300;
+}
 
 #FxUnitControlsExpanded,
 #FxUnitControlsCollapsed {
@@ -1031,14 +1036,6 @@ WTrackMenu QMenu QCheckBox,
 #LatencyLabel, WTime {
   color: #f0bb2b;
   }
-  WSearchLineEdit,
-  #LibraryBPMSpinBox,
-  #LibraryBPMButton::item,
-  #LibraryContainer QTableView,
-  #LibraryContainer QTextBrowser,
-  #LibraryContainer QTreeView {
-    selection-color: #f0bb2b;
-  }
   #SkinSettingsNumToggleHeader[displayValue="0"] {
     color: #b9901f;
   }
@@ -1968,43 +1965,55 @@ WLibrary,
     stop:1 #444);
   border-bottom: 1px solid #444;
   border-left: 1px solid #0a0a0a;
+  background-color: #0f0f0f;
   alternate-background-color: #1a1a1a;
+/* In selected library rows this sets the color of
+  * shapes in star rating delegate
+  * focus border of Cover Art and Color delegates
+   > See src/library/coverartdelegate.cpp: "option.palette.highlightedText().color();" */
+  selection-color: #fff;
+  /* background of Color delegate in selected row */
   selection-background-color: #5e4507;
 }
-
 #LibraryContainer QTableView:focus,
 #LibraryContainer QTreeView:focus,
 #LibraryContainer QTextBrowser:focus {
   border: 1px solid #d09300;
-  }
-  #FxUnitHeaderCollapsed[highlight="1"],
-  #FxUnitHeaderExpanded[highlight="1"] {
-    border-top: 1px solid #d09300;
-    border-right: 1px solid #d09300;
-  }
-
-#LibraryContainer QTreeView {
-  show-decoration-selected: 0;
 }
 
-/* selected items in Tree and Tracks table */
+/* Selected rows in Tree and Tracks table */
 #LibraryContainer QTreeView::item:selected,
 #LibraryContainer QTableView::item:selected,
 #LibraryBPMButton::item:selected {
-/* this doesn't style BPM value in selected row
-#LibraryContainer QTableView::item:selected #LibraryBPMSpinBox::item:selected,
-#LibraryContainer QTableView::item:selected > #LibraryBPMSpinBox::item:selected */
   color: #fff;
   background-color: #5e4507;
 }
+#LibraryContainer QTreeView::item:focus {
+  outline: none;
+}
+
+/* Use the native focus decoration */
+/* This is for all cells including Played and Location */
+#LibraryContainer QTableView,
+/* This is for the BPM cell */
+#LibraryContainer QTableView QCheckBox:focus {
+  outline: 1px solid #fff;
+}
+
+#LibraryContainer QTreeView {
+  show-decoration-selected: 0;
+}
+#LibraryContainer QTreeView,
+#LibraryContainer QTreeView::item:focus {
+  outline: none;
+}
 
-/* checkbox in library "Played" column */
-#LibraryContainer QTableView::indicator {/*
-  This results in 10x10px + 1px border = 12x12px
+/* This is the only way to select the 'Played' checkbox.
+  Note that this also selects the BPM lock. */
+#LibraryContainer QTableView::indicator {
+/* This results in 10x10px + 1px border = 12x12px
   Omitting this definitions makes the checkbox grow to
-  12x12px + 1px border = 14x14px
-  which also miraculously makes the BPM icon grow to 14x14px
-  Neither checkbox nor BPM icon size have an effect on the size... */
+  12x12px + 1px border = 14x14px */
   width: 10px;
   height: 10px;
   /* border is added to size defined above */
@@ -2012,8 +2021,7 @@ WLibrary,
   margin: 0px;
   padding: 0px;
   }
-  #LibraryContainer QTableView::indicator:checked,
-  #LibraryContainer QTableView::indicator:checked:selected {
+  #LibraryContainer QTableView::indicator:checked {
     image: url(skin:/classic/buttons/btn__lib_checkmark_orange.svg);
     border: 1px solid #ff6600;
     }
@@ -2021,9 +2029,6 @@ WLibrary,
     image: none;
     border: 1px solid rgba(151,151,151,128);
     }
-    #LibraryContainer QTableView::indicator:selected {
-      border: 1px solid #888;
-    }
 
 /* Table cell in edit mode */
 WLibrary QLineEdit,
@@ -2039,32 +2044,31 @@ WLibrary QLineEdit,
 /* Lock icon at the left */
 #LibraryBPMButton::indicator:checked {
   image: url(skin:/classic/buttons/btn__lib_bpm_locked_orange.svg);
-  }
+}
 #LibraryBPMButton::indicator:unchecked {
   image: url(skin:/classic/buttons/btn__lib_bpm_unlocked_grey.svg);
-  }
+}
 /* BPM value */
 #LibraryBPMButton::item {
-  }
+}
+/* BPM spinbox in edit mode */
 #LibraryBPMSpinBox {
   border-left: 0px;
-}
-/* When activated, the left border of the spinbox shows an
-  artefact of the inactive BPM value. */
-#LibraryBPMSpinBox::up-button,
-#LibraryBPMSpinBox::down-button {
-  margin-right: 3px;
-  background-color: #382904;
   }
-  #LibraryBPMSpinBox::up-button {
-    image: url(skin:/classic/buttons/btn__lib_bpm_up.svg) no-repeat;
-    }
+  /* When activated, the left border of the spinbox shows an
+    artefact of the inactive BPM value. */
+  #LibraryBPMSpinBox::up-button,
   #LibraryBPMSpinBox::down-button {
-    image: url(skin:/classic/buttons/btn__lib_bpm_down.svg) no-repeat;
+    margin-right: 3px;
+    background-color: #382904;
+    }
+    #LibraryBPMSpinBox::up-button {
+      image: url(skin:/classic/buttons/btn__lib_bpm_up.svg) no-repeat;
+    }
+    #LibraryBPMSpinBox::down-button {
+      image: url(skin:/classic/buttons/btn__lib_bpm_down.svg) no-repeat;
     }
-/* remove OS focus indicator from BPM cell */
-WLibrary QCheckBox,
-#LibraryBPMButton::item:selected,
+
 WCueMenuPopup QPushButton:focus {
   outline: none;
 }
@@ -2339,9 +2343,6 @@ WTrackMenu QMenu {
 #CrossfaderButtonContainer_Deck,
 #CrossfaderButtonContainer_Aux,
 WPushButton#CrossfaderButton[value="0"],
-#LibraryContainer QTableView,
-#LibraryContainer QTextBrowser,
-#LibraryContainer QTreeView,
 QToolTip,
 WBeatSpinBox QMenu,
   WCueMenuPopup,
diff --git a/res/skins/LateNight/style_palemoon.qss b/res/skins/LateNight/style_palemoon.qss
index dc69f84154..b1977ec290 100644
--- a/res/skins/LateNight/style_palemoon.qss
+++ b/res/skins/LateNight/style_palemoon.qss
@@ -1213,14 +1213,6 @@ WTrackMenu QMenu,
 WTrackMenu QMenu QCheckBox {
   color: #c2b3a5;
   }
-  WSearchLineEdit,
-  #LibraryBPMSpinBox,
-  #LibraryBPMButton::item,
-  #LibraryContainer QTableView,
-  #LibraryContainer QTextBrowser,
-  #LibraryContainer QTreeView {
-    selection-color: #c2b3a5;
-  }
   /* dim ivory / light brown */
   #Deck1 WStarRating, #DeckCompact1 WStarRating,
   #Deck2 WStarRating, #DeckCompact2 WStarRating,
@@ -1464,8 +1456,8 @@ WEffectSelector,
   }
 
   #LibraryContainer QHeaderView {
-    border-bottom-right-radius: 1px solid #000; /*
-    outline: none;
+    border-bottom-right-radius: 1px solid #000;
+    outline: none; /*
     border-width: 1px 0px 1px 0px;
     border-image: url(skin:/palemoon/buttons/btn_embedded_library_header.svg) 1 1 1 1;  */
   }
@@ -1476,8 +1468,8 @@ WEffectSelector,
   }
   #LibraryContainer QHeaderView::up-arrow,
   #LibraryContainer QHeaderView::down-arrow {
-    /* ToDo: restore image
     outline: none;
+    /* ToDo: restore image
     border-width: 1px 2px 1px 0px;
     border-image: url(skin:/palemoon/buttons/btn_embedded_library_header_sort.svg) 1 2 1 1; */
   }
@@ -2438,16 +2430,28 @@ WColorPicker QPushButton[checked="true"] {
 
 #LibraryContainer QTableView,
 #LibraryContainer QTextBrowser,
-#LibraryContainer QTreeView { /*
-  border-top: 1px solid #0a0a0a;
-  border-right: 1px solid qlineargradient(x1:0, y1:0, x2:0, y2:1,
-    stop:0 #333,
-    stop:1 #444);
-  border-bottom: 1px solid #444;
-  border-left: 1px solid #0a0a0a; */
+#LibraryContainer QTreeView {
+  background-color: #0f0f0f;
   alternate-background-color: #0a0a0a;
+/* In selected library rows this sets the color of
+  * shapes in star rating delegate
+  * focus border of Cover Art and Color delegates
+   > See src/library/coverartdelegate.cpp: "option.palette.highlightedText().color();" */
+  selection-color: #fff;
+  /* background of Color delegate in selected row */
   selection-background-color: #2c454f;
 }
+/* Selected rows in Tree and Tracks table */
+#LibraryContainer QTreeView::item:selected,
+#LibraryContainer QTableView::item:selected,
+#LibraryBPMButton::item:selected {
+  color: #fff;
+  background-color: #2c454f;
+}
+#LibraryContainer QTreeView,
+#LibraryContainer QTreeView::item:focus {
+  outline: none;
+}
 
 #LibraryContainer QTableView:focus,
 #LibraryContainer QTreeView:focus,
@@ -2459,21 +2463,20 @@ WColorPicker QPushButton[checked="true"] {
   show-decoration-selected: 0;
 }
 
-/* selected items in Tree and Tracks table */
-#LibraryContainer QTreeView::item:selected,
-#LibraryContainer QTableView::item:selected,
-#LibraryBPMButton::item:selected {
-  color: #fff;
-  background-color: #2c454f;
+/* Use the native focus decoration */
+/* This is for all cells including Played and Location */
+#LibraryContainer QTableView,
+/* This is for the BPM cell */
+#LibraryContainer QTableView QCheckBox:focus {
+  outline: 1px solid #fff;
 }
 
-/* checkbox in library "Played" column */
-#LibraryContainer QTableView::indicator {/*
-  This results in 10x10px + 1px border = 12x12px
+/* This is the only way to select the 'Played' checkbox.
+  Note that this also selects the BPM lock. */
+#LibraryContainer QTableView::indicator {
+/* This results in 10x10px + 1px border = 12x12px
   Omitting this definitions makes the checkbox grow to
-  12x12px + 1px border = 14x14px
-  which also miraculously makes the BPM icon grow to 14x14px
-  Neither checkbox nor BPM icon size have an effect on the size... */
+  12x12px + 1px border = 14x14px */
   width: 10px;
   height: 10px;
   /* border is added to size defined above */
@@ -2483,11 +2486,11 @@ WColorPicker QPushButton[checked="true"] {
   }
   #LibraryContainer QTableView::indicator:checked {
     image: url(skin:/palemoon/buttons/btn__lib_checkmark_blue.svg);
-    }
+  }
   #LibraryContainer QTableView::indicator:unchecked {
     image: none;
     border: 1px solid rgba(151,151,151,128);
-    }
+  }
 
 /* Table cell in edit mode */
 WLibrary QLineEdit,
@@ -2502,30 +2505,29 @@ WLibrary QLineEdit,
 /* Entire BPM cell */
 /* Lock icon at the left */
 #LibraryBPMButton::indicator:checked {
-  image: url(skin:/palemoon/buttons/btn__lib_bpm_locked_orange.svg);
+  image: url(skin:/palemoon/buttons/btn__lib_bpm_locked_blue.svg);
   }
 #LibraryBPMButton::indicator:unchecked {
   image: url(skin:/palemoon/buttons/btn__lib_bpm_unlocked_grey.svg);
   }
 /* BPM value */
-#LibraryBPMButton::item {
-  }
+#LibraryBPMButton::item {}
+/* BPM spinbox in edit mode */
 #LibraryBPMSpinBox {
   border-width: 1px 2px 1px 0px;
-}
-/* When activated, the left border of the spinbox shows an
-  artefact of the inactive BPM value. */
-#LibraryBPMSpinBox::up-button,
-#LibraryBPMSpinBox::down-button {
-  margin-right: 2px;  /*
-  background-color: #19272d;  */
   }
-  #LibraryBPMSpinBox::up-button {
-    image: url(skin:/palemoon/buttons/btn__lib_spinbox_up.svg) no-repeat center center;
-    }
+  /* When activated, the left border of the spinbox shows an
+    artefact of the inactive BPM value. A small margin eliminates that.*/
+  #LibraryBPMSpinBox::up-button,
   #LibraryBPMSpinBox::down-button {
-    image: url(skin:/palemoon/buttons/btn__lib_spinbox_down.svg) no-repeat center center;
+    margin-right: 2px;
     }
+    #LibraryBPMSpinBox::up-button {
+      image: url(skin:/palemoon/buttons/btn__lib_spinbox_up.svg) no-repeat center center;
+      }
+    #LibraryBPMSpinBox::down-button {
+      image: url(skin:/palemoon/buttons/btn__lib_spinbox_down.svg) no-repeat center center;
+      }
 
 /* Button in library "Preview" column */
 #LibraryPreviewButton {
@@ -2886,8 +2888,8 @@ WEffectSelector::item,
     outline: none;
   }
   /* remove OS focus indicator from some buttons */
-  #LibraryBPMButton::item:selected,
   WLibrary QCheckBox,
+  #LibraryBPMButton::item:selected,
   WCueMenuPopup QPushButton:focus {
     outline: none;
   }
diff --git a/res/skins/Shade/style.qss b/res/skins/Shade/style.qss
index 437ead43c2..6718007399 100644
--- a/res/skins/Shade/style.qss
+++ b/res/skins/Shade/style.qss
@@ -456,25 +456,36 @@ WLibrary WColorPicker QPushButton {
   color: #9e9e9e;
   background-color: #0f0f0f;
   alternate-background-color: #1a1a1a;
-  selection-color: #e6e6e6;
-  selection-background-color: #666;
-  }
-  QTextBrowser {
-    padding-left: 5px;
-  }
+/* In selected library rows this sets the color of
+  * shapes in star rating delegate  */
+  selection-color: #000;
+  /* background of Color delegate in selected row */
+  selection-background-color: #656d75;
+}
+
+QTextBrowser {
+  padding-left: 5px;
+}
 
 #LibraryContainer QTableView::item:selected,
 #LibraryContainer QTreeView::item:selected,
 #LibraryContainer QTreeView::branch:selected,
 #LibraryBPMButton::item:selected {
-  border-image: none;
-  background-image: none;
-  color: #fff;
+  color: #000;
   background-color: #656d75;
-  }
+}
+#LibraryContainer QTreeView,
+#LibraryContainer QTreeView::item:focus {
+  outline: none;
+}
 
-#LibraryContainer QTreeView::item:!selected {
-  }
+/* Use the native focus decoration */
+/* This is for all cells including Played and Location */
+#LibraryContainer QTableView,
+/* This is for the BPM cell */
+#LibraryContainer QTableView QCheckBox:focus {
+  outline: 1px solid #c9c9c9;
+}
 
   /* Table cell in edit mode */
   WLibrary QLineEdit,
@@ -496,9 +507,10 @@ WLibrary WColorPicker QPushButton {
   #LibraryBPMButton::item {
     color: #cfcfcf;
     }
-    /* remove OS focus indicator from BPM cell */
-    WLibrary QCheckBox:focus {
-      outline: none;
+    WLibrary QCheckBox {
+      text-align: right;
+      alignment: right;
+      qproperty-alignment: 'AlignRight';
     }
 
   #LibraryBPMSpinBox {
@@ -594,10 +606,7 @@ WSearchLineEdit {
   }
   #LibraryContainer QTableView:focus,
   #LibraryContainer QTreeView:focus,
-  #LibraryContainer QTextBrowser:focus { /*
-    New Library navigation COs only work if TreeView or TableView have focus.
-    Clicking on buttons, sliders and visuals elsewhere removes focus from Library.
-    In conjunction with [Library],MoveFocusBackward/..Forward, this helps a lot. */
+  #LibraryContainer QTextBrowser:focus {
     border-color: #ff6600;
   }
 
@@ -799,7 +808,6 @@ WLibrary { margin: 2px 3px 0px 0px; }
 
 WLibrary QRadioButton {
   margin: 0px 3px 3px 3px;
-  outline: none;
 }
 /* Center QLabels */
 WLibrary QLabel { margin: 0px 3px 3px 0px; }
diff --git a/res/skins/Shade/style_dark.qss b/res/skins/Shade/style_dark.qss
index 5284cebc5e..c32a731d2a 100644
--- a/res/skins/Shade/style_dark.qss
+++ b/res/skins/Shade/style_dark.qss
@@ -123,6 +123,12 @@ WOverview #PassthroughLabel {
 }
 
 
+#LibraryContainer QTableView,
+#LibraryContainer QTreeView {
+  /* background of Color delegate in selected row */
+  selection-background-color: #666;
+  /*outline: 1px solid yellow;*/
+}
 
 #LibraryContainer QTableView:focus,
 #LibraryContainer QTreeView:focus,
@@ -141,11 +147,21 @@ WSearchLineEdit QToolButton:focus {
 #LibraryContainer QTableView::item:selected,
 #LibraryContainer QTreeView::branch:selected,
 #LibraryBPMButton::item:selected {
-  border-image: none;
-  background-image: none;
   color: #000;
+  selection-color: #000;
   background-color: #666;
-  }
+}
+#LibraryContainer QTreeView,
+#LibraryContainer QTreeView::item:focus {
+  outline: none;
+}
+/* Use the native focus decoration */
+/* This is for all cells including Played and Location */
+#LibraryContainer QTableView,
+/* This is for the BPM cell */
+#LibraryContainer QTableView QCheckBox:focus {
+  outline: 1px solid #ccc;
+}
 
   /* Table cell in edit mode */
   WLibrary QLineEdit,
diff --git a/res/skins/Tango/style.qss b/res/skins/Tango/style.qss
index 1e96f0c75b..4d76d3f0a3 100644
--- a/res/skins/Tango/style.qss
+++ b/res/skins/Tango/style.qss
@@ -2250,8 +2250,6 @@ WTrackMenu QMenu::indicator{
   background-color: #0f0f0f;
   border: 1px solid #333;
   border-radius: 1px;
-  /* remove OS focus indicator */
-  outline: none;
   }
   #LibraryContainer QMenu QCheckBox::indicator:checked,
   WTrackMenu QCheckBox::indicator:checked,
@@ -2343,27 +2341,6 @@ WTrackMenu QMenu::right-arrow {
   padding: 2px;
 }
 
-#TEST {
-  background-color: #451278;
-}
-#TEST2 {
-  background-color: #127845;
-}
-#TEST_skin {
-  qproperty-layoutAlignment: 'AlignRight | AlignTop';
-  margin-left: 2000px;
-}
-#SizeTest {
-  background-color: qlineargradient(x1: 0, y1: 0, x2: 1, y2: 0,
-    stop: 0 #0f0f0f,
-    stop: 1 #006596);
-}
-#SizeTest2 {
-  background-color: qlineargradient(x1: 0, y1: 0, x2: 1, y2: 0,
-    stop: 0 #0f0f0f,
-    stop: 1 #991245);
-}
-
 #AlignTop {
   qproperty-layoutAlignment: 'AlignTop';
 }
@@ -2453,11 +2430,13 @@ WTrackMenu QMenu::right-arrow {
   color: #9e9e9e;
   background-color: #0f0f0f;
   alternate-background-color: #1a1a1a;
-  /* unfocused Stars in selected row
-  selection-color: #D32323; */
-  /* empty CoverArt cell in selected row until
-    daschuer:lp1773709 402483053e3ebd224cce83f1cb0bde361ada1aa8
-  selection-background-color: #3B9097; */
+  /* In selected library rows this sets the color of
+    * shapes in star rating delegate
+    * focus border of Cover Art and Color delegates
+     > See src/library/coverartdelegate.cpp: "option.palette.highlightedText().color();" */
+  selection-color: #fff;
+  /* background of Color delegate in selected row */
+  selection-background-color: #555;
 }
 
 /* selected table row */
@@ -2465,22 +2444,20 @@ WTrackMenu QMenu::right-arrow {
 #LibraryBPMButton::item:selected {
   color: #fff;
   background-color: #555;
-  /* overrides color:
-  selection-color: #ff5411;
-  not applied anywhere:
-  selection-background-color: #125454; */
-  }
-  /* focused cell */
-  #LibraryContainer QTableView::item:focus {/*
-    background-color: #666; */
-    /* overrides font color:
-    selection-color: #ff5411; */
-    /* not applied anywhere:
-    selection-background-color: #125454; */
-    /* this outer border is drawn in addition to inner (dotted)
-      focus border defined by OS theme
-    border: 1px solid #ccc; */
-  }
+}
+#LibraryContainer QTreeView,
+#LibraryContainer QTreeView::item:focus {
+  outline: none;
+}
+
+/* Use the native focus decoration */
+/* This is for all cells including Played and Location */
+#LibraryContainer QTableView,
+/* This is for the BPM cell */
+#LibraryContainer QTableView QCheckBox:focus {
+    outline: 1px solid #fff;
+}
+
   /* Table cell in edit mode */
   WLibrary QLineEdit,
   #LibraryBPMSpinBox {
@@ -2505,9 +2482,8 @@ WTrackMenu QMenu::right-arrow {
   #LibraryContainer QTableView:focus,
   #LibraryContainer QTreeView:focus,
   #LibraryContainer QTableView:focus,
-  #LibraryContainer WSearchLineEdit:focus { /*
-  #LibraryContainer QTextBrowser:focus { /*
-    New Library navigation COs only work if TreeView or TableView have focus.
+  #LibraryContainer WSearchLineEdit:focus {
+  /* New Library navigation COs only work if TreeView or TableView have focus.
     Clicking on buttons, sliders and visuals elsewhere removes focus from Library.
     In conjunction with [Library],MoveFocusBackward/..Forward, some highlight
     helps a lot. */
@@ -2781,16 +2757,7 @@ WLibrary QPushButton {
     background-color: #a90000;
     border: 1px solid #ca0000;
   }
-  WLibrary QPushButton:focus,
-  #fadeModeCombobox:focus {
-    border: 1px solid #bbb;
-    outline: none;
-  }
-  WLibrary QPushButton:checked:focus
-  #pushButtonAutoDJ:checked:focus,
-  #pushButtonRepeatPlaylist:checked:focus {
-    border: 1px solid #fff;
-  }
+
   /* make library action buttons bold */
   QPushButton#pushButtonAutoDJ,
   QPushButton#pushButtonRecording,
@@ -2898,11 +2865,6 @@ QPushButton#pushButtonRepeatPlaylist:!checked {
       image: url(skin:/buttons/btn_lib_spinbox_down_white.svg) no-repeat;
     }
 
-    /* remove OS focus indicator from BPM cell */
-    WLibrary QCheckBox {
-      outline: none;
-    }
-
   /* Button in library "Preview" column */
   #LibraryPreviewButton {
     background: transparent;