Remove "%" from NVerticalPill add force close option to it too

NVerticalPill: add force close option
Any vertical bar widget: remove "%" display to have nice horizontal text
BarTab: add "always hide percentage" option so the pills will never
expand (opposite of always show percentage)

Modules/SettingsPanel/Bar/WidgetSettings/VolumeSettings.qml

@@ -14,17 +14,33 @@ ColumnLayout {
   property var widgetMetadata: null
 
   // Local state
-  property bool valueAlwaysShowPercentage: widgetData.alwaysShowPercentage !== undefined ? widgetData.alwaysShowPercentage : widgetMetadata.alwaysShowPercentage
+  property string valueDisplayMode: widgetData.displayMode !== undefined ? widgetData.displayMode : widgetMetadata.displayMode
 
   function saveSettings() {
     var settings = Object.assign({}, widgetData || {})
-    settings.alwaysShowPercentage = valueAlwaysShowPercentage
+    settings.displayMode = valueDisplayMode
     return settings
   }
 
-  NToggle {
-    label: "Always show percentage"
-    checked: valueAlwaysShowPercentage
-    onToggled: checked => valueAlwaysShowPercentage = checked
+  NComboBox {
+    label: "Display mode"
+    description: "Choose how the percentage is displayed."
+    minimumWidth: 134 * scaling
+    model: ListModel {
+      ListElement {
+        key: "normal"
+        name: "Normal"
+      }
+      ListElement {
+        key: "alwaysShow"
+        name: "Always Show"
+      }
+      ListElement {
+        key: "alwaysHide"
+        name: "Always Hide"
+      }
+    }
+    currentKey: valueDisplayMode
+    onSelected: key => valueDisplayMode = key
   }
 }