Chagned owner div to be actual button
Brian Vaughn committed
Apr 4, 2019 at 08:35 UTC
8c3a97401f883308a53e8e2759736fce35d5b705
2 files changed
+12
-16
src/devtools/views/Components/SelectedElement.css
+10
-1
@@ -59,8 +59,17 @@
59
}
60
61
.Owner {
62
- padding-left: 0.75rem;
62
+ border-radius: 0.25rem;
63
+ padding: 0.125rem 0.25rem;
64
+ margin-left: 0.5rem;
65
cursor: pointer;
66
+ background: none;
67
+ border: none;
68
+ display: block;
69
+}
70
+.Owner:focus {
71
+ outline: none;
72
+ background-color: var(--color-button-background-focus);
73
}
74
75
.Loading {
src/devtools/views/Components/SelectedElement.js
+2
-15
@@ -206,28 +206,15 @@ function OwnerView({ displayName, id }: { displayName: string, id: number }) {
206
selectElementByID,
207
]);
208
209
- const handleKeyPress = useCallback(
210
- e => {
211
- if (e.key === ' ' || e.key === 'Enter') {
212
- e.preventDefault();
213
- selectElementByID(id);
214
- }
215
- },
216
- [id, selectElementByID]
217
- );
218
-
209
return (
220
- <div
210
+ <button
211
key={id}
212
className={styles.Owner}
213
onClick={handleClick}
224
- onKeyPress={handleKeyPress}
214
title={displayName}
226
- tabIndex={0}
227
- role="button"
215
>
216
{displayName}
230
- </div>
217
+ </button>
218
);
219
}
220