mirror of
https://github.com/facebook/react.git
synced 2025-11-01 09:12:30 +00:00
564a223368
Owners in the list may have been filtered out of the Store, but in the owners list view- it's important to still show them. The frontend cannot do this on its own, so this list needs to come from the renderer interface.
99 lines
2.0 KiB
CSS
99 lines
2.0 KiB
CSS
.OwnerStack {
|
|
max-width: 100%;
|
|
overflow-x: auto;
|
|
flex: 1;
|
|
display: flex;
|
|
align-items: center;
|
|
position: relative;
|
|
}
|
|
|
|
.Component,
|
|
.Component[data-reach-menu-item] {
|
|
font-family: var(--font-family-monospace);
|
|
font-size: var(--font-size-monospace-normal);
|
|
user-select: none;
|
|
white-space: nowrap;
|
|
}
|
|
|
|
.Component[data-reach-menu-item][data-selected],
|
|
.Component[data-reach-menu-item][data-selected]:hover {
|
|
color: var(--color-text-selected);
|
|
background: var(--color-background-selected);
|
|
}
|
|
.Component[data-reach-menu-item][data-selected]:focus {
|
|
outline: none;
|
|
}
|
|
|
|
.Bar {
|
|
display: flex;
|
|
flex: 1 1 auto;
|
|
overflow-x: auto;
|
|
}
|
|
|
|
.VRule {
|
|
flex: 0 0 auto;
|
|
height: 20px;
|
|
width: 1px;
|
|
background-color: var(--color-border);
|
|
margin: 0 0.5rem;
|
|
}
|
|
|
|
.MenuButton {
|
|
border-radius: 0.25rem;
|
|
display: inline-flex;
|
|
align-items: center;
|
|
padding: 0;
|
|
flex: 0 0 auto;
|
|
border: none;
|
|
background: var(--color-button-background);
|
|
color: var(--color-button);
|
|
}
|
|
.MenuButtonContent {
|
|
display: inline-flex;
|
|
align-items: center;
|
|
border-radius: 0.25rem;
|
|
padding: 0.25rem;
|
|
}
|
|
.MenuButton:hover {
|
|
color: var(--color-button-hover);
|
|
}
|
|
.MenuButton[aria-expanded='true'],
|
|
.MenuButton[aria-expanded='true']:active {
|
|
color: var(--color-button-active);
|
|
outline: none;
|
|
}
|
|
|
|
.MenuButton:focus,
|
|
.MenuButtonContent:focus {
|
|
outline: none;
|
|
}
|
|
.MenuButton:focus > .MenuButtonContent {
|
|
background: var(--color-button-background-focus);
|
|
}
|
|
|
|
.Modal[data-reach-menu-list] {
|
|
display: inline-flex;
|
|
flex-direction: column;
|
|
background-color: var(--color-background);
|
|
color: var(--color-button);
|
|
padding: 0.25rem 0;
|
|
padding-right: 0;
|
|
border: 1px solid var(--color-border);
|
|
border-radius: 0.25rem;
|
|
max-height: 10rem;
|
|
overflow: auto;
|
|
|
|
/* Make sure this is above the DevTools, which are above the Overlay */
|
|
z-index: 10000002;
|
|
position: relative;
|
|
|
|
/* Reach UI tries to set its own :( */
|
|
font-family: var(--font-family-monospace);
|
|
font-size: var(--font-size-monospace-normal);
|
|
}
|
|
|
|
.NotInStore,
|
|
.NotInStore:hover {
|
|
color: var(--color-dimmest);
|
|
}
|