Generated: 10/15/2026, 1:56:10 PM
Comparison between: graphwise-styleguide@1.3.0 (local) and graphwise-styleguide@1.2.3 (npm)
Total: 156
| Theme | CSS Variable | Status | Old Value | New Value |
|---|---|---|---|---|
| variables-dark.css | --gw-list-padding | Changed | 0.25 0.25remrem | 0.25rem 0.25rem |
| variables-dark.css | --gw-list-header-padding | Changed | 0.5 0.75rem 0.25rem 0.75remrem | 0.5rem 0.75rem 0.25rem 0.75rem |
| variables-dark.css | --gw-list-option-padding | Changed | 0.5 0.75remrem | 0.5rem 0.75rem |
| variables-dark.css | --gw-list-option-group-padding | Changed | 0.5 0.75remrem | 0.5rem 0.75rem |
| variables-dark.css | --gw-sidenav-list-padding | Changed | 0.25 0.25remrem | 0.25rem 0.25rem |
| variables-dark.css | --gw-sidenav-menuitem-padding | Changed | 0.5 1remrem | 0.5rem 1rem |
| variables-dark.css | --gw-sidenav-submenuitem-padding | Changed | 0.5 1remrem | 0.5rem 1rem |
| variables-dark.css | --gw-panel-footer-padding | Changed | 0 1.125 1.125rem 1.125remrem | 0 1.125rem 1.125rem 1.125rem |
| variables-dark.css | --gw-datepicker-select-month-padding | Changed | 0.25 0.5remrem | 0.25rem 0.5rem |
| variables-dark.css | --gw-datepicker-select-year-padding | Changed | 0.25 0.5remrem | 0.25rem 0.5rem |
| variables-dark.css | --gw-datepicker-day-view-margin | Changed | 0.5rem | 0.5rem 0 0 0 |
| variables-dark.css | --gw-datepicker-month-view-margin | Changed | 0.5rem | 0.5rem 0 0 0 |
| variables-dark.css | --gw-datepicker-year-view-margin | Changed | 0.5rem | 0.5rem 0 0 0 |
| variables-dark.css | --gw-datepicker-buttonbar-padding | Changed | 0.5rem | 0.5rem 0 0 0 |
| variables-dark.css | --gw-datepicker-time-picker-padding | Changed | 0.5rem | 0.5rem 0 0 0 |
| variables-dark.css | --gw-dialog-content-padding | Changed | 0 1 1rem 1remrem | 0 1rem 1rem 1rem |
| variables-dark.css | --gw-message-content-padding | Changed | 0.5 0.75remrem | 0.5rem 0.75rem |
| variables-dark.css | --gw-message-content-sm-padding | Changed | 0.375 0.625remrem | 0.375rem 0.625rem |
| variables-dark.css | --gw-message-content-lg-padding | Changed | 0.625 0.875remrem | 0.625rem 0.875rem |
| variables-dark.css | --gw-togglebutton-content-padding | Changed | 0.25 0.75remrem | 0.25rem 0.75rem |
| variables-dark.css | --gw-togglebutton-content-sm-padding | Changed | 0.25 0.75remrem | 0.25rem 0.75rem |
| variables-dark.css | --gw-togglebutton-content-lg-padding | Changed | 0.25 0.75remrem | 0.25rem 0.75rem |
| variables-dark.css | --gw-dataview-header-padding | Changed | 0.75 1remrem | 0.75rem 1rem |
| variables-dark.css | --gw-dataview-footer-padding | Changed | 0.75 1remrem | 0.75rem 1rem |
| variables-dark.css | --gw-divider-horizontal-margin | Changed | 1rem | 1rem 0 |
| variables-dark.css | --gw-divider-vertical-content-padding | Changed | 0.5rem | 0.5rem 0 |
| variables-dark.css | --gw-fieldset-legend-padding | Changed | 0.25 0.5remrem | 0.25rem 0.5rem |
| variables-dark.css | --gw-tabs-tabpanel-padding | Changed | 0.875 1.125rem 1.125rem 1.125remrem | 0.875rem 1.125rem 1.125rem 1.125rem |
| variables-dark.css | --gw-tooltip-padding | Changed | 0.25 0.75remrem | 0.25rem 0.75rem |
| variables-dark.css | --gw-megamenu-horizontal-orientation-padding | Changed | 0.5 0.75remrem | 0.5rem 0.75rem |
| variables-dark.css | --gw-menubar-padding | Changed | 0.5 0.75remrem | 0.5rem 0.75rem |
| variables-dark.css | --gw-panelmenu-panel-padding | Changed | 0.25 0.25remrem | 0.25rem 0.25rem |
| variables-dark.css | --gw-organizationchart-node-padding | Changed | 0.75 1remrem | 0.75rem 1rem |
| variables-dark.css | --gw-organizationchart-node-toggleable-padding | Changed | 0.75 1rem 1.25rem 1remrem | 0.75rem 1rem 1.25rem 1rem |
| variables-dark.css | --gw-paginator-padding | Changed | 0.5 1remrem | 0.5rem 1rem |
| variables-dark.css | --gw-datatable-header-padding | Changed | 0.75 1remrem | 0.75rem 1rem |
| variables-dark.css | --gw-datatable-header-sm-padding | Changed | 0.375 0.5remrem | 0.375rem 0.5rem |
| variables-dark.css | --gw-datatable-header-lg-padding | Changed | 1 1.25remrem | 1rem 1.25rem |
| variables-dark.css | --gw-datatable-footer-padding | Changed | 0.75 1remrem | 0.75rem 1rem |
| variables-dark.css | --gw-datatable-footer-sm-padding | Changed | 0.375 0.5remrem | 0.375rem 0.5rem |
| variables-dark.css | --gw-datatable-footer-lg-padding | Changed | 1 1.25remrem | 1rem 1.25rem |
| variables-dark.css | --gw-timeline-horizontal-event-content-padding | Changed | 1rem | 1rem 0 |
| variables-dark.css | --gw-tree-node-padding | Changed | 0.25 0.5remrem | 0.25rem 0.5rem |
| variables-dark.css | --gw-treetable-header-padding | Changed | 0.75 1remrem | 0.75rem 1rem |
| variables-dark.css | --gw-treetable-header-cell-padding | Changed | 0.75 1remrem | 0.75rem 1rem |
| variables-dark.css | --gw-treetable-body-cell-padding | Changed | 0.75 1remrem | 0.75rem 1rem |
| variables-dark.css | --gw-treetable-footer-cell-padding | Changed | 0.75 1remrem | 0.75rem 1rem |
| variables-dark.css | --gw-treetable-footer-padding | Changed | 0.75 1remrem | 0.75rem 1rem |
| variables-dark.css | --gw-galleria-thumbnails-content-padding | Changed | 1 0.25remrem | 1rem 0.25rem |
| variables-dark.css | --gw-fileupload-content-padding | Changed | 0 1.125 1.125rem 1.125remrem | 0 1.125rem 1.125rem 1.125rem |
| variables-dark.css | --gw-stepper-step-padding | Changed | 0.5rem | 0.5rem 1rem 0.5rem 0 |
| variables-dark.css | --gw-stepper-steppanels-padding | Changed | 0.875 0.5rem 1.125rem 0.5remrem | 0.875rem 0.5rem 1.125rem 0.5rem |
| variables-dark.css | --gw-terminal-command-response-margin | Changed | 2rem | 2px 0 |
| variables-dark.css | --gw-datepicker-date-border-radius | Changed | var(--gw-datepicker-date-width) / 2 | calc(var(--gw-datepicker-date-width) / 2) |
| variables-dark.css | --gw-slider-handle-border-radius | Changed | var(--gw-slider-handle-width) / 2 | calc(var(--gw-slider-handle-width) / 2) |
| variables-dark.css | --gw-slider-handle-content-border-radius | Changed | var(--gw-slider-handle-content-width) / 2 | calc(var(--gw-slider-handle-content-width) / 2) |
| variables-dark.css | --gw-megamenu-mobile-button-border-radius | Changed | var(--gw-megamenu-mobile-button-size) / 2 | calc(var(--gw-megamenu-mobile-button-size) / 2) |
| variables-dark.css | --gw-menubar-mobile-button-border-radius | Changed | var(--gw-menubar-mobile-button-size) / 2 | calc(var(--gw-menubar-mobile-button-size) / 2) |
| variables-dark.css | --gw-organizationchart-node-toggle-button-border-radius | Changed | var(--gw-organizationchart-node-toggle-button-size) / 2 | calc(var(--gw-organizationchart-node-toggle-button-size) / 2) |
| variables-dark.css | --gw-paginator-nav-button-border-radius | Changed | var(--gw-paginator-nav-button-width) / 2 | calc(var(--gw-paginator-nav-button-width) / 2) |
| variables-dark.css | --gw-timeline-event-marker-border-radius | Changed | var(--gw-timeline-event-marker-size) / 2 | calc(var(--gw-timeline-event-marker-size) / 2) |
| variables-dark.css | --gw-timeline-event-marker-content-border-radius | Changed | var(--gw-timeline-event-marker-content-size) / 2 | calc(var(--gw-timeline-event-marker-content-size) / 2) |
| variables-dark.css | --gw-tree-node-toggle-button-border-radius | Changed | var(--gw-tree-node-toggle-button-size) / 2 | calc(var(--gw-tree-node-toggle-button-size) / 2) |
| variables-dark.css | --gw-image-action-border-radius | Changed | var(--gw-image-action-size) / 2 | calc(var(--gw-image-action-size) / 2) |
| variables-dark.css | --gw-treetable-node-toggle-button-border-radius | Changed | var(--gw-treetable-node-toggle-button-size) / 2 | calc(var(--gw-treetable-node-toggle-button-size) / 2) |
| variables-dark.css | --gw-toast-close-button-border-radius | Changed | var(--gw-toast-close-button-width) / 2 | calc(var(--gw-toast-close-button-width) / 2) |
| variables-dark.css | --gw-galleria-nav-button-prev-border-radius | Changed | var(--gw-galleria-nav-button-size) / 2 | calc(var(--gw-galleria-nav-button-size) / 2) |
| variables-dark.css | --gw-galleria-nav-button-next-border-radius | Changed | var(--gw-galleria-nav-button-size) / 2 | calc(var(--gw-galleria-nav-button-size) / 2) |
| variables-dark.css | --gw-galleria-indicator-button-border-radius | Changed | var(--gw-galleria-indicator-button-width) / 2 | calc(var(--gw-galleria-indicator-button-width) / 2) |
| variables-dark.css | --gw-galleria-close-button-border-radius | Changed | var(--gw-galleria-close-button-size) / 2 | calc(var(--gw-galleria-close-button-size) / 2) |
| variables-dark.css | --gw-stepper-step-number-border-radius | Changed | var(--gw-stepper-step-number-size) / 2 | calc(var(--gw-stepper-step-number-size) / 2) |
| variables-dark.css | --gw-imagecompare-handle-border-radius | Changed | var(--gw-imagecompare-handle-size) / 2 | calc(var(--gw-imagecompare-handle-size) / 2) |
| variables-dark.css | --gw-focus-ring-stroke-width | Changed | var(--gw-focus-ring-offset) + var(--gw-focus-ring-width) | calc(var(--gw-focus-ring-offset) + var(--gw-focus-ring-width)) |
| variables-dark.css | --gw-button-label-typography-line-height | Changed | var(--gw-xs-line-height)*var(--gw-button-label-font-size) | calc(var(--gw-xs-line-height)*var(--gw-button-label-font-size)) |
| variables-dark.css | --gw-label-base-regular-line-height | Changed | var(--gw-xs-line-height) * var(--gw-base-font-size) | calc(var(--gw-xs-line-height) * var(--gw-base-font-size)) |
| variables-dark.css | --gw-label-base-medium-line-height | Changed | var(--gw-xxs-line-height) * var(--gw-base-font-size) | calc(var(--gw-xxs-line-height) * var(--gw-base-font-size)) |
| variables-dark.css | --gw-label-base-bold-line-height | Changed | var(--gw-xxs-line-height) * var(--gw-base-font-size) | calc(var(--gw-xxs-line-height) * var(--gw-base-font-size)) |
| variables-dark.css | --gw-datatable-row-toggle-button-border-radius | Changed | var(--gw-datatable-row-toggle-button-size) / 2 | calc(var(--gw-datatable-row-toggle-button-size) / 2) |
| variables-light.css | --gw-list-padding | Changed | 0.25 0.25remrem | 0.25rem 0.25rem |
| variables-light.css | --gw-list-header-padding | Changed | 0.5 0.75rem 0.25rem 0.75remrem | 0.5rem 0.75rem 0.25rem 0.75rem |
| variables-light.css | --gw-list-option-padding | Changed | 0.5 0.75remrem | 0.5rem 0.75rem |
| variables-light.css | --gw-list-option-group-padding | Changed | 0.5 0.75remrem | 0.5rem 0.75rem |
| variables-light.css | --gw-sidenav-list-padding | Changed | 0.25 0.25remrem | 0.25rem 0.25rem |
| variables-light.css | --gw-sidenav-menuitem-padding | Changed | 0.5 1remrem | 0.5rem 1rem |
| variables-light.css | --gw-sidenav-submenuitem-padding | Changed | 0.5 1remrem | 0.5rem 1rem |
| variables-light.css | --gw-panel-footer-padding | Changed | 0 1.125 1.125rem 1.125remrem | 0 1.125rem 1.125rem 1.125rem |
| variables-light.css | --gw-datepicker-select-month-padding | Changed | 0.25 0.5remrem | 0.25rem 0.5rem |
| variables-light.css | --gw-datepicker-select-year-padding | Changed | 0.25 0.5remrem | 0.25rem 0.5rem |
| variables-light.css | --gw-datepicker-day-view-margin | Changed | 0.5rem | 0.5rem 0 0 0 |
| variables-light.css | --gw-datepicker-month-view-margin | Changed | 0.5rem | 0.5rem 0 0 0 |
| variables-light.css | --gw-datepicker-year-view-margin | Changed | 0.5rem | 0.5rem 0 0 0 |
| variables-light.css | --gw-datepicker-buttonbar-padding | Changed | 0.5rem | 0.5rem 0 0 0 |
| variables-light.css | --gw-datepicker-time-picker-padding | Changed | 0.5rem | 0.5rem 0 0 0 |
| variables-light.css | --gw-dialog-content-padding | Changed | 0 1 1rem 1remrem | 0 1rem 1rem 1rem |
| variables-light.css | --gw-message-content-padding | Changed | 0.5 0.75remrem | 0.5rem 0.75rem |
| variables-light.css | --gw-message-content-sm-padding | Changed | 0.375 0.625remrem | 0.375rem 0.625rem |
| variables-light.css | --gw-message-content-lg-padding | Changed | 0.625 0.875remrem | 0.625rem 0.875rem |
| variables-light.css | --gw-togglebutton-content-padding | Changed | 0.25 0.75remrem | 0.25rem 0.75rem |
| variables-light.css | --gw-togglebutton-content-sm-padding | Changed | 0.25 0.75remrem | 0.25rem 0.75rem |
| variables-light.css | --gw-togglebutton-content-lg-padding | Changed | 0.25 0.75remrem | 0.25rem 0.75rem |
| variables-light.css | --gw-dataview-header-padding | Changed | 0.75 1remrem | 0.75rem 1rem |
| variables-light.css | --gw-dataview-footer-padding | Changed | 0.75 1remrem | 0.75rem 1rem |
| variables-light.css | --gw-divider-horizontal-margin | Changed | 1rem | 1rem 0 |
| variables-light.css | --gw-divider-vertical-content-padding | Changed | 0.5rem | 0.5rem 0 |
| variables-light.css | --gw-fieldset-legend-padding | Changed | 0.25 0.5remrem | 0.25rem 0.5rem |
| variables-light.css | --gw-tabs-tabpanel-padding | Changed | 0.875 1.125rem 1.125rem 1.125remrem | 0.875rem 1.125rem 1.125rem 1.125rem |
| variables-light.css | --gw-tooltip-padding | Changed | 0.25 0.75remrem | 0.25rem 0.75rem |
| variables-light.css | --gw-megamenu-horizontal-orientation-padding | Changed | 0.5 0.75remrem | 0.5rem 0.75rem |
| variables-light.css | --gw-menubar-padding | Changed | 0.5 0.75remrem | 0.5rem 0.75rem |
| variables-light.css | --gw-panelmenu-panel-padding | Changed | 0.25 0.25remrem | 0.25rem 0.25rem |
| variables-light.css | --gw-organizationchart-node-padding | Changed | 0.75 1remrem | 0.75rem 1rem |
| variables-light.css | --gw-organizationchart-node-toggleable-padding | Changed | 0.75 1rem 1.25rem 1remrem | 0.75rem 1rem 1.25rem 1rem |
| variables-light.css | --gw-paginator-padding | Changed | 0.5 1remrem | 0.5rem 1rem |
| variables-light.css | --gw-datatable-header-padding | Changed | 0.75 1remrem | 0.75rem 1rem |
| variables-light.css | --gw-datatable-header-sm-padding | Changed | 0.375 0.5remrem | 0.375rem 0.5rem |
| variables-light.css | --gw-datatable-header-lg-padding | Changed | 1 1.25remrem | 1rem 1.25rem |
| variables-light.css | --gw-datatable-footer-padding | Changed | 0.75 1remrem | 0.75rem 1rem |
| variables-light.css | --gw-datatable-footer-sm-padding | Changed | 0.375 0.5remrem | 0.375rem 0.5rem |
| variables-light.css | --gw-datatable-footer-lg-padding | Changed | 1 1.25remrem | 1rem 1.25rem |
| variables-light.css | --gw-timeline-horizontal-event-content-padding | Changed | 1rem | 1rem 0 |
| variables-light.css | --gw-tree-node-padding | Changed | 0.25 0.5remrem | 0.25rem 0.5rem |
| variables-light.css | --gw-treetable-header-padding | Changed | 0.75 1remrem | 0.75rem 1rem |
| variables-light.css | --gw-treetable-header-cell-padding | Changed | 0.75 1remrem | 0.75rem 1rem |
| variables-light.css | --gw-treetable-body-cell-padding | Changed | 0.75 1remrem | 0.75rem 1rem |
| variables-light.css | --gw-treetable-footer-cell-padding | Changed | 0.75 1remrem | 0.75rem 1rem |
| variables-light.css | --gw-treetable-footer-padding | Changed | 0.75 1remrem | 0.75rem 1rem |
| variables-light.css | --gw-galleria-thumbnails-content-padding | Changed | 1 0.25remrem | 1rem 0.25rem |
| variables-light.css | --gw-fileupload-content-padding | Changed | 0 1.125 1.125rem 1.125remrem | 0 1.125rem 1.125rem 1.125rem |
| variables-light.css | --gw-stepper-step-padding | Changed | 0.5rem | 0.5rem 1rem 0.5rem 0 |
| variables-light.css | --gw-stepper-steppanels-padding | Changed | 0.875 0.5rem 1.125rem 0.5remrem | 0.875rem 0.5rem 1.125rem 0.5rem |
| variables-light.css | --gw-terminal-command-response-margin | Changed | 2rem | 2px 0 |
| variables-light.css | --gw-datepicker-date-border-radius | Changed | var(--gw-datepicker-date-width) / 2 | calc(var(--gw-datepicker-date-width) / 2) |
| variables-light.css | --gw-slider-handle-border-radius | Changed | var(--gw-slider-handle-width) / 2 | calc(var(--gw-slider-handle-width) / 2) |
| variables-light.css | --gw-slider-handle-content-border-radius | Changed | var(--gw-slider-handle-content-width) / 2 | calc(var(--gw-slider-handle-content-width) / 2) |
| variables-light.css | --gw-megamenu-mobile-button-border-radius | Changed | var(--gw-megamenu-mobile-button-size) / 2 | calc(var(--gw-megamenu-mobile-button-size) / 2) |
| variables-light.css | --gw-menubar-mobile-button-border-radius | Changed | var(--gw-menubar-mobile-button-size) / 2 | calc(var(--gw-menubar-mobile-button-size) / 2) |
| variables-light.css | --gw-organizationchart-node-toggle-button-border-radius | Changed | var(--gw-organizationchart-node-toggle-button-size) / 2 | calc(var(--gw-organizationchart-node-toggle-button-size) / 2) |
| variables-light.css | --gw-paginator-nav-button-border-radius | Changed | var(--gw-paginator-nav-button-width) / 2 | calc(var(--gw-paginator-nav-button-width) / 2) |
| variables-light.css | --gw-timeline-event-marker-border-radius | Changed | var(--gw-timeline-event-marker-size) / 2 | calc(var(--gw-timeline-event-marker-size) / 2) |
| variables-light.css | --gw-timeline-event-marker-content-border-radius | Changed | var(--gw-timeline-event-marker-content-size) / 2 | calc(var(--gw-timeline-event-marker-content-size) / 2) |
| variables-light.css | --gw-tree-node-toggle-button-border-radius | Changed | var(--gw-tree-node-toggle-button-size) / 2 | calc(var(--gw-tree-node-toggle-button-size) / 2) |
| variables-light.css | --gw-image-action-border-radius | Changed | var(--gw-image-action-size) / 2 | calc(var(--gw-image-action-size) / 2) |
| variables-light.css | --gw-treetable-node-toggle-button-border-radius | Changed | var(--gw-treetable-node-toggle-button-size) / 2 | calc(var(--gw-treetable-node-toggle-button-size) / 2) |
| variables-light.css | --gw-toast-close-button-border-radius | Changed | var(--gw-toast-close-button-width) / 2 | calc(var(--gw-toast-close-button-width) / 2) |
| variables-light.css | --gw-galleria-nav-button-prev-border-radius | Changed | var(--gw-galleria-nav-button-size) / 2 | calc(var(--gw-galleria-nav-button-size) / 2) |
| variables-light.css | --gw-galleria-nav-button-next-border-radius | Changed | var(--gw-galleria-nav-button-size) / 2 | calc(var(--gw-galleria-nav-button-size) / 2) |
| variables-light.css | --gw-galleria-indicator-button-border-radius | Changed | var(--gw-galleria-indicator-button-width) / 2 | calc(var(--gw-galleria-indicator-button-width) / 2) |
| variables-light.css | --gw-galleria-close-button-border-radius | Changed | var(--gw-galleria-close-button-size) / 2 | calc(var(--gw-galleria-close-button-size) / 2) |
| variables-light.css | --gw-stepper-step-number-border-radius | Changed | var(--gw-stepper-step-number-size) / 2 | calc(var(--gw-stepper-step-number-size) / 2) |
| variables-light.css | --gw-imagecompare-handle-border-radius | Changed | var(--gw-imagecompare-handle-size) / 2 | calc(var(--gw-imagecompare-handle-size) / 2) |
| variables-light.css | --gw-focus-ring-stroke-width | Changed | var(--gw-focus-ring-offset) + var(--gw-focus-ring-width) | calc(var(--gw-focus-ring-offset) + var(--gw-focus-ring-width)) |
| variables-light.css | --gw-button-label-typography-line-height | Changed | var(--gw-xs-line-height)*var(--gw-button-label-font-size) | calc(var(--gw-xs-line-height)*var(--gw-button-label-font-size)) |
| variables-light.css | --gw-label-base-regular-line-height | Changed | var(--gw-xs-line-height) * var(--gw-base-font-size) | calc(var(--gw-xs-line-height) * var(--gw-base-font-size)) |
| variables-light.css | --gw-label-base-medium-line-height | Changed | var(--gw-xxs-line-height) * var(--gw-base-font-size) | calc(var(--gw-xxs-line-height) * var(--gw-base-font-size)) |
| variables-light.css | --gw-label-base-bold-line-height | Changed | var(--gw-xxs-line-height) * var(--gw-base-font-size) | calc(var(--gw-xxs-line-height) * var(--gw-base-font-size)) |
| variables-light.css | --gw-datatable-row-toggle-button-border-radius | Changed | var(--gw-datatable-row-toggle-button-size) / 2 | calc(var(--gw-datatable-row-toggle-button-size) / 2) |