Node-RED CSS Migration guide
 Share
The version of the browser you are using is no longer supported. Please upgrade to a supported browser.Dismiss

View only
 
ABCDEFGHIJKLMNOPQRSTUVWXYZ
1
This is a list of changed CSS classes and element IDs in the Node-RED editor.

A small number of classes have been deprecated in favour of the new name, but the old class still works. This is because we believe they are classes that 3rd party nodes may legitimately be using.
2
Old NameNew Name
3
.bidiAware.red-ui-text-bidi-aware
4
.clipboard-dialog-tab-clipboard.red-ui-clipboard-dialog-tab-clipboard
5
.clipboard-dialog-tab-library.red-ui-clipboard-dialog-tab-library
6
.clipboard-dialog-tabs-content.red-ui-clipboard-dialog-tabs-content
7
.clipboard-import-error.red-ui-clipboard-import-error
8
.component-shade.red-ui-shade
9
.config_node_none.red-ui-palette-node-config-none
10
.config_node_type.red-ui-palette-node-config-type
11
.config_node_unused.red-ui-palette-node-config-unused
12
.config_node.red-ui-palette-node-config
13
.config-node-filter-info.red-ui-sidebar-node-config-filter-info
14
.config-node-list.red-ui-sidebar-node-config-list
15
.debug-content-list.red-ui-debug-content-list
16
.debug-content-table.red-ui-debug-content-table
17
.debug-content.red-ui-debug-content
18
.debug-filter-box.red-ui-debug-filter-box
19
.debug-filter-row.red-ui-debug-filter-row
20
.debug-message-array-rows.red-ui-debug-msg-array-rows
21
.debug-message-buffer-opts.red-ui-debug-msg-buffer-opts
22
.debug-message-buffer-raw.red-ui-debug-msg-buffer-raw
23
.debug-message-buffer-string.red-ui-debug-msg-buffer-string
24
.debug-message-date.red-ui-debug-msg-date
25
.debug-message-element.red-ui-debug-msg-element
26
.debug-message-expandable.red-ui-debug-msg-expandable
27
.debug-message-hover.red-ui-debug-msg-hover
28
.debug-message-level-20.red-ui-debug-msg-level-20
29
.debug-message-level-30.red-ui-debug-msg-level-30
30
.debug-message-level-log.red-ui-debug-msg-level-log
31
.debug-message-meta.red-ui-debug-msg-meta
32
.debug-message-name.red-ui-debug-msg-name
33
.debug-message-object-entry.red-ui-debug-msg-object-entry
34
.debug-message-object-handle.red-ui-debug-msg-object-handle
35
.debug-message-object-key.red-ui-debug-msg-object-key
36
.debug-message-object-type-header.red-ui-debug-msg-object-type-header
37
.debug-message-object-value.red-ui-debug-msg-object-value
38
.debug-message-payload.red-ui-debug-msg-payload
39
.debug-message-row-pinned.red-ui-debug-msg-row-pinned
40
.debug-message-row.red-ui-debug-msg-row
41
.debug-message-string-rows.red-ui-debug-msg-string-rows
42
.debug-message-tools-copy.red-ui-debug-msg-tools-copy
43
.debug-message-tools-other.red-ui-debug-msg-tools-other
44
.debug-message-tools-pin.red-ui-debug-msg-tools-pin
45
.debug-message-tools.red-ui-debug-msg-tools
46
.debug-message-top-level.red-ui-debug-msg-top-level
47
.debug-message-topic.red-ui-debug-msg-topic
48
.debug-message-type-string-swatch.red-ui-debug-msg-type-string-swatch
49
.debug-message.red-ui-debug-msg
50
.debug-window.red-ui-debug-window
51
.deploy-button-content.red-ui-deploy-button-content
52
.deploy-button-group.red-ui-deploy-button-group
53
.deploy-button-spinner.red-ui-deploy-button-spinner
54
.deploy-button.red-ui-deploy-button
55
.divider.red-ui-menu-divider
56
.drag_line.red-ui-flow-drag-line
57
.dropdown-menu.red-ui-menu-dropdown
58
.dropdown-submenu.red-ui-menu-dropdown-submenu
59
.editor-button-small.red-ui-button-small
60
.editor-button.red-ui-button
61
.editor-tray-body-wrapper.red-ui-tray-body-wrapper
62
.editor-tray-body.red-ui-tray-body
.editor-tray-body still set for backwards compatibility, but is deprecated
63
.editor-tray-breadcrumbs.red-ui-tray-breadcrumbs
64
.editor-tray-content.red-ui-tray-content
65
.editor-tray-footer.red-ui-tray-footer
.editor-tray-footer still set for backwards compatibility, but is deprecated
66
.editor-tray-header.red-ui-tray-header
.editor-tray-header still set for backwards compatibility, but is deprecated
67
.editor-tray-resize-button.red-ui-tray-resize-button
68
.editor-tray-resize-handle.red-ui-tray-resize-handle
69
.editor-tray-resize-maximised.red-ui-tray-resize-maximised
70
.editor-tray-titlebar.red-ui-tray-titlebar
71
.editor-tray-toolbar.red-ui-tray-toolbar
72
.editor-tray.red-ui-tray
73
.flow-diff.red-ui-diff-flow-diff
74
.header-toolbar.red-ui-header-toolbar
75
.link_background.red-ui-flow-link-background
76
.link_group_active.red-ui-flow-link-group-active
77
.link_group.red-ui-flow-link-group
78
.link_line.red-ui-flow-link-line
79
.link_link.red-ui-flow-link-link
80
.link_outline.red-ui-flow-link-outline
81
.link_port.red-ui-flow-link-port
82
.link_port.red-ui-flow-link-port
83
.link_selected.red-ui-flow-link-selected
84
.link_splice.red-ui-flow-link-splice
85
.link_subflow.red-ui-flow-subflow-link
86
.link_unknown.red-ui-flow-link-unknown
87
.menu-label-container.red-ui-menu-label-container
88
.menu-label.red-ui-menu-label
89
.menu-sublabel.red-ui-menu-sublabel
90
.node_badge_label.red-ui-flow-node-error
91
.node_badge.red-ui-flow-port
92
.node-button-button.red-ui-flow-node-button-button
93
.node_button.red-ui-flow-node-button
94
.node_highlighted.red-ui-flow-node-highlighted
95
.node_label_italic.red-ui-flow-node-label-italic
96
.node_label_white.red-ui-flow-node-label-white
97
.node_label.red-ui-flow-node-label
98
.node_placeholder.red-ui-flow-node-placeholder
99
.node_selected.red-ui-flow-node-selected
100
.node_status_label.red-ui-flow-node-status-label
Loading...