Ticket #7053 (assigned feature)

Opened 4 years ago

Last modified 6 months ago

Widget: Ability to customize style-related CSS classes

Reported by: scott.gonzalez Owned by: petersendidit
Priority: blocker Milestone: 1.12.0
Component: ui.widget Version: 1.8.9
Keywords: Cc:
Blocking: #5901 Blocked by:


Right now there are classes like .ui-corner-all that are hardcoded in widgets. We should remove the hardcoding and add the ability to customize the style-related classes based on the functional classes.

Proposal based on idea from Doug Neiner:

$( "#dialog" ).dialog({
    classes: {
        "ui-dialog": "ui-corner-top",
        "ui-dialog-titlebar": "ui-corner-top awesome-fade-class"
        "ui-dialog-buttonpane": null

The classes option would map functional classes to additional style classes. The existing style classes would become the defaults and the user can completely override the style classes.

Use within a widget could be:

uiDialog.addClass( this._classes( "ui-dialog" ) );

where the call to ._classes() would return "ui-dialog ui-corner-top".

Change History

comment:1 Changed 4 years ago by gf3

Wow what a great idea! Can't wait to see this make it's way into core UI.

comment:2 Changed 3 years ago by joern.zaefferer

  • Priority changed from minor to major
  • Status changed from new to open

comment:3 Changed 2 years ago by scott.gonzalez

  • Milestone changed from 1.9.0 to 1.10.0

comment:4 Changed 2 years ago by petersendidit

  • Owner set to petersendidit
  • Status changed from open to assigned

comment:5 Changed 2 years ago by scott.gonzalez

#8928 is a duplicate of this ticket.

comment:7 Changed 2 years ago by tj.vantoll

  • Milestone changed from 1.10.0 to none

comment:8 Changed 2 years ago by scott.gonzalez

  • Blocking 5901 added

comment:9 Changed 6 months ago by scott.gonzalez

  • Priority changed from major to blocker
  • Milestone changed from none to 1.12.0
Note: See TracTickets for help on using tickets.