Files
react/src/devtools/views/TabBar.css
T

88 lines
1.2 KiB
CSS

.Tab,
.TabCurrent,
.TabDisabled {
height: 100%;
display: flex;
align-items: center;
cursor: pointer;
border-top: 3px solid transparent;
border-bottom: 3px solid transparent;
cursor: pointer;
user-select: none;
color: var(--color-text-color);
}
.Tab:hover,
.TabCurrent:hover {
background-color: var(--color-hover-background);
}
.Tab:focus-within,
.TabCurrent:focus-within {
background-color: var(--color-hover-background);
}
.TabCurrent {
border-bottom: 3px solid var(--color-selected-border);
}
.TabDisabled {
color: var(--color-dim);
cursor: default;
}
.TabSizeLarge {
padding: 0.5rem 1rem;
}
.TabSizeSmall {
padding: 0.25rem 0.5rem;
}
.Input {
width: 0;
margin: 0;
opacity: 0;
}
.IconSizeLarge,
.IconSizeSmall {
margin-right: 0.5rem;
color: var(--color-button);
}
.IconDisabled {
color: var(--color-dim);
}
.IconSizeLarge {
width: 1.5rem;
height: 1.5rem;
}
.IconSizeSmall {
width: 1rem;
height: 1rem;
}
.TabLabelLarge,
.TabLabelSmall {
}
@media screen and (max-width: 900px) {
.TabLabelSmall {
display: none;
}
.IconSizeSmall {
margin-right: 0;
}
}
@media screen and (max-width: 600px) {
.IconSizeLarge {
margin-right: 0;
}
.TabLabelLarge {
display: none;
}
}