| 1 | .Item:not([hidden]) { |
| 2 | display: flex; |
| 3 | } |
| 4 | |
| 5 | .Name { |
| 6 | color: var(--color-attribute-name-not-editable); |
| 7 | flex: 0 0 auto; |
| 8 | cursor: default; |
| 9 | } |
| 10 | |
| 11 | .EditableName { |
| 12 | color: var(--color-attribute-name); |
| 13 | flex: 0 0 auto; |
| 14 | cursor: default; |
| 15 | } |
| 16 | |
| 17 | .AfterName { |
| 18 | color: var(--color-text); |
| 19 | margin-right: 0.5rem; |
| 20 | } |
| 21 | |
| 22 | .Value { |
| 23 | color: var(--color-attribute-value); |
| 24 | white-space: pre; |
| 25 | overflow: hidden; |
| 26 | text-overflow: ellipsis; |
| 27 | cursor: default; |
| 28 | flex: 1; |
| 29 | } |
| 30 | |
| 31 | .Link { |
| 32 | color: var(--color-link); |
| 33 | white-space: pre; |
| 34 | overflow: hidden; |
| 35 | text-overflow: ellipsis; |
| 36 | flex: 1; |
| 37 | cursor: pointer; |
| 38 | border-radius: 0.125rem; |
| 39 | padding: 0px 2px; |
| 40 | } |
| 41 | |
| 42 | .Link:hover { |
| 43 | background-color: var(--color-background-hover); |
| 44 | } |
| 45 | |
| 46 | |
| 47 | .ExpandCollapseToggleSpacer { |
| 48 | flex: 0 0 1rem; |
| 49 | width: 1rem; |
| 50 | } |
| 51 | |
| 52 | .DeleteArrayItemButton { |
| 53 | padding: 0; |
| 54 | margin-right: 0.125rem; |
| 55 | } |
| 56 | |
| 57 | .HookName { |
| 58 | color: var(--color-component-name); |
| 59 | } |