Files
TheWitness 6bbfb58492 Fit status pills to label text and toggle-clear the status filter on second click (#854)
The status pills were being clipped to a fixed width because the single-class theme rules (e.g. .deviceUpFull width:14%, padding:3px) outranked the equal-specificity .thold-pill shape rule, so long labels such as 'Not Monitored' overflowed the coloured pill on the Device Status page. Element-qualify the selector (span.thold-pill) so the shape rule wins and the pill hugs its label in every theme.

Also make a second click on an already-selected status pill clear that filter (reset the Status select to All, value -1) instead of re-applying the same value. Applied to all three thold_graph.php sub-tabs (Thresholds, Device Status, Threshold Log) and the matching Thresholds console page (thold.php).
2026-10-09 09:32:34 -04:00

38 lines
1.9 KiB
CSS

/*
+-------------------------------------------------------------------------+
| Copyright (C) 2004-2025 The Cacti Group |
| |
| This program is free software; you can redistribute it and/or |
| modify it under the terms of the GNU General Public License |
| as published by the Free Software Foundation; either version 2 |
| of the License, or (at your option) any later version. |
| |
| This program is distributed in the hope that it will be useful, |
| but WITHOUT ANY WARRANTY; without even the implied warranty of |
| MERCHANTABILITY or FITNESS FOR A PARTICULAR PURPOSE. See the |
| GNU General Public License for more details. |
+-------------------------------------------------------------------------+
| Cacti: The Complete RRDtool-based Graphing Solution |
+-------------------------------------------------------------------------+
| This code is designed, written, and maintained by the Cacti Group. See |
| about.php and/or the AUTHORS file for specific developer information. |
+-------------------------------------------------------------------------+
| http://www.cacti.net/ |
+-------------------------------------------------------------------------+
*/
/* Threshold status pills - shape only; per-theme .thold<State> rules supply the colours */
/* Element-qualified to outrank single-class theme rules (e.g. .deviceUpFull width:14%) so the pill hugs its label. */
span.thold-pill {
display: inline-block;
width: auto;
padding: 1px 9px;
border-radius: 10px;
font-size: 11px;
font-weight: 600;
line-height: 16px;
text-align: center;
white-space: nowrap;
cursor: pointer;
}