diff options
Diffstat (limited to 'src')
-rw-r--r-- | src/components/PluginSettings/index.tsx | 7 | ||||
-rw-r--r-- | src/components/PluginSettings/styles.css | 19 |
2 files changed, 18 insertions, 8 deletions
diff --git a/src/components/PluginSettings/index.tsx b/src/components/PluginSettings/index.tsx index 687b9ee..3b283d0 100644 --- a/src/components/PluginSettings/index.tsx +++ b/src/components/PluginSettings/index.tsx @@ -152,14 +152,11 @@ function PluginCard({ plugin, disabled, onRestartNeeded, onMouseEnter, onMouseLe onChange={toggleEnabled} disabled={disabled} value={isEnabled()} - note={<Text className={cl("note")} variant="text-md/normal">{plugin.description}</Text>} + note={<Text className={cl("note")} variant="text-sm/normal">{plugin.description}</Text>} hideBorder={true} > <Flex className={cl("flex")}> - <Text - variant="text-md/bold" - className={cl("name")} - > + <Text variant="text-md/bold" className={cl("name")}> {plugin.name}{isNew && <Badge text="NEW" color="#ED4245" />} </Text> <button role="switch" onClick={() => openModal()} className={classes("button-12Fmur", cl("info-button"))}> diff --git a/src/components/PluginSettings/styles.css b/src/components/PluginSettings/styles.css index c48ce0c..fe8dc94 100644 --- a/src/components/PluginSettings/styles.css +++ b/src/components/PluginSettings/styles.css @@ -24,13 +24,21 @@ } .vc-plugins-card { - background-color: var(--background-modifier-selected); + background-color: var(--background-secondary-alt); color: var(--interactive-active); - border-radius: 3px; + border-radius: 8px; display: block; height: 100%; padding: 10px; width: 100%; + transition: 0.1s ease-out; + transition-property: box-shadow, transform, background, opacity; +} + +.vc-plugins-card:hover { + background-color: var(--background-tertiary); + transform: translateY(-1px); + box-shadow: var(--elevation-high); } .vc-plugins-info-button { @@ -41,6 +49,10 @@ margin-right: 8px; } +.vc-plugins-settings-button:hover { + color: var(--interactive-hover); +} + .vc-plugins-filter-controls { display: grid; height: 40px; @@ -61,7 +73,7 @@ } .vc-plugins-note { - height: 40px; + height: 36px; overflow: hidden; text-overflow: ellipsis; display: -webkit-box; @@ -77,6 +89,7 @@ align-items: center; flex-grow: 1; gap: 8px; + cursor: "default"; } .vc-plugins-flex { |