Fascinated/Vencord
1
0
Fork 0
Code Issues Pull Requests 1 Actions Packages Projects Releases Wiki Activity

make plugin cards prettier (#389)

Browse Source 
Co-authored-by: Ven <vendicated@riseup.net>
This commit is contained in:
Swishilicous 2023-01-13 17:25:24 -06:00 committed by GitHub
parent 7582feb603
commit 0e5b8b07c9
No known key found for this signature in database
GPG Key ID: 4AEE18F83AFDEB23
2 changed files with 18 additions and 8 deletions
Show Stats Download Patch File Download Diff File Expand all files Collapse all files

7
src/components/PluginSettings/index.tsx
View File

@ -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"))}>

19
src/components/PluginSettings/styles.css
View File

@ -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 {