Category Object

Category Object

.pi-style__category-objects-panel

Applies to the category object panel on the right hand side.

Screenshot from 2025-04-25 16-46-02.png


.pi-style__category-objects-panel .pi-style__category-objects__section-header

Applies to each header / category that has category objects applied. The styling is only available if you have category objects defined at the parent level and they are not hidden.

Screenshot from 2025-05-02 15-01-25.png

 


.pi-style__category-objects-panel .section-panel__subhead-content

Applies to each sub-header / object name of the category objects applied. The styling is only available if you have category objects defined at the parent level and they are not hidden.

Screenshot from 2025-05-02 15-04-03.png


.pi-style__category-objects-panel .pi-input.searchable-multi-select-multi-rows-input

Applies to a container where all selected items are displayed for the multi-picker category object type.

Screenshot from 2025-05-16 13-35-47.png

 

.pi-style__category-objects-slider.category-object-slider .pi_style__slider-generic-definition

This will alter the style of the slider when the category object panel is open.

 

.pi-style_category-objects-top-panel

Applies to the container (including buttons) that holds category objects on a dashboard screen when the category objects have been set to display on the top of the page.

.pi-style_category-objects-top-panel .category-object-area-inputs

Applies to the text colour of the container (excluding buttons) that holds category objects on a dashboard screen when the category objects have been set to display on the top of the page.

.pi-style_category-objects-top-panel a

The buttons or links that are displayed inside the category objects panel when it’s displayed at the top of the page.

.pi-style_category-objects-top-panel a:hover

The buttons or links that are displayed inside the category objects panel when it’s displayed at the top of the page when hovered over with the mouse.

.pi-style_category-objects-top-panel .pi-input

The input field of category objects when the category objects panel is displayed at the top of the page.

.pi-style_category-objects-top-panel .pi-input[disabled]

The input field (when disabled) of category objects when the category objects panel is displayed at the top of the page.

 

.pi-style__category-objects-top-panel .section-panel__subhead

The background colour of the Category Object label.

 

.pi-style__category-objects-top-panel .category-object-button-panel

The background colour of the Category Object button panel.

 

.pi-style__category-objects-top-panel .section-panel__body

The background colour of the Category Object field.

 

.pi-style__category-objects-top-panel .section-panel__subhead

The background colour of the Category Object label.

 

.pi-style__category-objects-panel .pi-style__category-object__open-date-range-panel-btn

Applies to a button to open a date range panel.

Screenshot from 2025-05-02 15-38-31.png

 

.pi-style__date-range-panel

Applies to the body of the date range panel used to display date values.

Screenshot from 2025-05-02 15-46-04.png

 

.pi-style__date-range-panel .pi-style__date-range-panel__date-selection

Applies to the calendar component of the date range panel.

Screenshot from 2025-05-02 15-47-29.png

 

.pi-style__date-range-panel .pi-style__date-range-panel__date-selection__date-input

Applies to calendar input fields in the date range panel

Screenshot from 2025-05-02 15-48-55.png

 

.pi-style__date-range-panel .pi-style__date-range-panel__quick-selection

Applies to quick selection buttons to select a value in the date range panel.

Screenshot from 2025-05-02 15-49-58.png

 

.pi-style__date-range-panel .pi-style__date-range-panel__quick-selection-button

Applies to all selection buttons available in the date range panel.

Screenshot from 2025-05-16 13-39-42.png

 

.pi-style__date-range-panel .pi-style__date-range-panel__quick-selection-button:hover, .pi-style__date-range-panel .pi-style__date-range-panel_quick-selection-button:focus

Applies when the user hovers over any selection buttons in the date range panel.

 

.pi-style__date-range-panel .pi-style__date-range-panel__quick-selection-button:active

Applies when the selection buttons become active / selected in the date range panel.

 

.pi-style__category-objects-panel .pi-style__category-object__add-btn

Applies to an ‘add’ button to add a temporary category object.

Screenshot from 2025-05-02 15-10-25.png

 

.pi-style__category-objects-panel .pi-style__category-object__add-btn:hover, .pi-style__category-objects-panel .pi-style__category-object__add-btn:focus

Applies when a user hovers over an ‘add’ button to add a temporary category object.

 

.pi-style__category-objects-panel .pi-style__category-object__add-btn:active

Applies when a ‘add’ button to add temporary category object is active.

 

.pi-style__category-objects-panel .pi-style__category-object__remove-btn

Applies to ‘remove’ button to remove a temporary category object.

Screenshot from 2025-05-02 15-13-41.png

 

.pi-style__category-objects-panel .pi-style__category-object__remove-btn:hover, .pi-style__category-objects-panel .pi-style__category-object__remove-btn:focus

Applies when a user hovers over a ‘remove’ button to remove a temporary category object.

 

.pi-style__category-objects-panel .pi-style__category-object__remove-btn:active

Applies when a ‘remove’ button to remove temporary category object is active.

 

.pi-style__category-objects-panel .pi-style__category-object__apply-btn

Applies to an ‘apply’ button to apply the selected category objects in the category object panel.

Screenshot from 2025-05-02 15-15-02.png

 

.pi-style__category-objects-panel .pi-style__category-object__apply-btn[disabled]

Applies to a disabled ‘apply’ button in the category object panel.

 

.pi-style__category-objects-panel .pi-style__category-object__apply-btn:hover, .pi-style__category-objects-panel .pi-style__category-object__apply-btn:focus

Applies when a user hovers over an ‘apply’ button to apply selected category objects in the category object panel.

 

.pi-style__category-objects-panel .pi-style__category-object__apply-btn:active

Applies when an ‘apply’ button to apply selected category objects become active.

 

.pi-style__category-objects-panel .pi-style__category-object__apply-btn[disabled]:hover, .pi-style__category-objects-panel .pi-style__category-object__apply-btn[disabled]:focus

Applies when a user hovers over a disabled ‘apply’ button to apply selected category objects in the category object panel.

 

.pi-style__category-objects-panel .pi-style__category-object__cancel-btn

Applies to a ‘cancel’ button to cancel selection category object selection in the category object panel.

Screenshot from 2025-05-02 15-36-27.png

 

.pi-style__category-objects-panel .pi-style__category-object__cancel-btn[disabled]

Applies to a disabled ‘cancel’ button in the category object panel.

 

.pi-style__category-objects-panel .pi-style__category-object__cancel-btn:hover, .pi-style__category-objects-panel .pi-style__category-object__cancel-btn:focus

Applies when a user hovers over a ‘cancel’ button to cancel selection category object selection in the category object panel.

 

.pi-style__category-objects-panel .pi-style__category-object__cancel-btn:active

Applies when a ‘cancel’ button to cancel category object selection becomes active.

 

.pi-style__category-objects-panel .pi-style__category-object__cancel-btn[disabled]:hover, .pi-style__category-objects-panel .pi-style__category-object__cancel-btn[disabled]:focus

Applies when a user hovers over a disabled ‘cancel’ button in the category object panel.

 

.pi-style__category-objects-panel .pi-style__category-object__pin-btn

Applies to a ‘pin’ button to pin the category objects panel.

Screenshot from 2025-05-02 15-37-52.png

 

.pi-style__category-objects-panel .pi-style__category-object__pin-btn:hover, .pi-style__category-objects-panel .pi-style__category-object__pin-btn:focus

Applies when a user hovers over a ‘pin’ button to pin the category objects panel.

 

.pi-style__category-objects-panel .pi-style__category-object__pin-btn:active

Applies to when a ‘pin’ button to pin the category objects panel becomes active