fix: scope media missing widget styles
This commit is contained in:
1 parent
6bb5ce4db1
commit
b40468f37c
2 files changed
+6
-8
No files matched your search
@@ -4,8 +4,7 @@
|
|||||||
display: flex;
|
display: flex;
|
||||||
text-decoration: none;
|
text-decoration: none;
|
||||||
color: inherit;
|
color: inherit;
|
||||||
border: 1px solid
|
border: 1px solid rgb(from var(--mantine-color-default-border) r g b / calc(var(--opacity, 1) * 0.45));
|
||||||
rgb(from var(--mantine-color-default-border) r g b / calc(var(--opacity, 1) * 0.45));
|
|
||||||
background-color: transparent;
|
background-color: transparent;
|
||||||
transition:
|
transition:
|
||||||
border-color 120ms ease,
|
border-color 120ms ease,
|
||||||
@@ -14,9 +13,7 @@
|
|||||||
&:hover,
|
&:hover,
|
||||||
&:focus-visible {
|
&:focus-visible {
|
||||||
border-color: var(--mantine-primary-color-filled);
|
border-color: var(--mantine-primary-color-filled);
|
||||||
background-color: rgb(
|
background-color: rgb(from var(--mantine-color-default-hover) r g b / calc(var(--opacity, 1) * 0.14));
|
||||||
from var(--mantine-color-default-hover) r g b / calc(var(--opacity, 1) * 0.14)
|
|
||||||
);
|
|
||||||
}
|
}
|
||||||
|
|
||||||
&:focus-visible {
|
&:focus-visible {
|
||||||
@@ -25,12 +22,12 @@
|
|||||||
}
|
}
|
||||||
}
|
}
|
||||||
|
|
||||||
:global(.mediaMissing-wrapper) :global(.mantine-SimpleGrid-root) > :global(.mantine-Paper-root) {
|
.root :global(.mantine-SimpleGrid-root) > :global(.mantine-Paper-root) {
|
||||||
border-color: rgb(from var(--mantine-color-default-border) r g b / calc(var(--opacity, 1) * 0.45));
|
border-color: rgb(from var(--mantine-color-default-border) r g b / calc(var(--opacity, 1) * 0.45));
|
||||||
background-color: transparent;
|
background-color: transparent;
|
||||||
}
|
}
|
||||||
|
|
||||||
:global(.mediaMissing-wrapper) :global(.mantine-Tabs-list) {
|
.root :global(.mantine-Tabs-list) {
|
||||||
--tab-border-color: rgb(from var(--mantine-color-default-border) r g b / calc(var(--opacity, 1) * 0.45));
|
--tab-border-color: rgb(from var(--mantine-color-default-border) r g b / calc(var(--opacity, 1) * 0.45));
|
||||||
--tab-hover-color: rgb(from var(--mantine-color-default-hover) r g b / calc(var(--opacity, 1) * 0.14));
|
--tab-hover-color: rgb(from var(--mantine-color-default-hover) r g b / calc(var(--opacity, 1) * 0.14));
|
||||||
}
|
}
|
||||||
|
|||||||
@@ -165,7 +165,7 @@ export default function MediaMissingWidget({
|
|||||||
);
|
);
|
||||||
if (isAdvanced) {
|
if (isAdvanced) {
|
||||||
return (
|
return (
|
||||||
<Stack h="100%" gap={0}>
|
<Stack className={classes.root} h="100%" gap={0}>
|
||||||
{partialFailures}
|
{partialFailures}
|
||||||
<SimpleGrid cols={enabledPanelCount} spacing="sm" p="sm" style={{ flex: 1, minHeight: 0 }}>
|
<SimpleGrid cols={enabledPanelCount} spacing="sm" p="sm" style={{ flex: 1, minHeight: 0 }}>
|
||||||
{showMissing && (
|
{showMissing && (
|
||||||
@@ -197,6 +197,7 @@ export default function MediaMissingWidget({
|
|||||||
|
|
||||||
return (
|
return (
|
||||||
<Tabs
|
<Tabs
|
||||||
|
className={classes.root}
|
||||||
value={activeTab}
|
value={activeTab}
|
||||||
keepMounted={false}
|
keepMounted={false}
|
||||||
onChange={(value) => {
|
onChange={(value) => {
|
||||||
|
|||||||
Reference in new issue
Block a user