PluginsTab: Dont Use Discord's CL
This commit is contained in:
parent
479bc354aa
commit
7ea2824dd3
3 changed files with 51 additions and 83 deletions
|
|
@ -214,7 +214,7 @@ export default function PluginModal({ plugin, onRestartNeeded, onClose, transiti
|
|||
<Tooltip text="Reset to default settings" shouldShow={!isObjectEmpty(pluginSettings)}>
|
||||
{({ onMouseEnter, onMouseLeave }) => (
|
||||
<Button
|
||||
className="button-danger-background"
|
||||
className={cl("disable-warning")}
|
||||
size={Button.Sizes.SMALL}
|
||||
color={Button.Colors.BRAND}
|
||||
onClick={handleResetClick}
|
||||
|
|
@ -312,10 +312,6 @@ export function openWarningModal(plugin: Plugin, pluginModalProps: ModalProps, o
|
|||
<ModalContent>
|
||||
<Forms.FormSection>
|
||||
<Flex className="vc-warning-info">
|
||||
<img
|
||||
src="https://media.tenor.com/hapjxf8y50YAAAAi/stop-sign.gif"
|
||||
alt="Warning"
|
||||
/>
|
||||
<Text className="text-normal">
|
||||
You are about to reset all settings for <strong>{plugin.name}</strong> to their default values.
|
||||
</Text>
|
||||
|
|
@ -330,19 +326,19 @@ export function openWarningModal(plugin: Plugin, pluginModalProps: ModalProps, o
|
|||
</ModalContent>
|
||||
<ModalFooter className="modal-footer">
|
||||
<Flex className="button-container">
|
||||
<Button
|
||||
size={Button.Sizes.SMALL}
|
||||
color={Button.Colors.PRIMARY}
|
||||
onClick={warningModalProps.onClose}
|
||||
look={Button.Looks.LINK}
|
||||
>
|
||||
Cancel
|
||||
</Button>
|
||||
<Flex className="button-group">
|
||||
<Button
|
||||
size={Button.Sizes.SMALL}
|
||||
color={Button.Colors.PRIMARY}
|
||||
onClick={warningModalProps.onClose}
|
||||
look={Button.Looks.FILLED}
|
||||
>
|
||||
Cancel
|
||||
</Button>
|
||||
{!Settings.ignoreResetWarning && (
|
||||
<Button
|
||||
size={Button.Sizes.SMALL}
|
||||
className="button-danger-background"
|
||||
className={cl("disable-warning")}
|
||||
onClick={() => {
|
||||
Settings.ignoreResetWarning = true;
|
||||
}}
|
||||
|
|
@ -350,21 +346,15 @@ export function openWarningModal(plugin: Plugin, pluginModalProps: ModalProps, o
|
|||
Disable Warning Forever
|
||||
</Button>
|
||||
)}
|
||||
<Tooltip text="This action cannot be undone. Are you sure?" shouldShow={true}>
|
||||
{({ onMouseEnter, onMouseLeave }) => (
|
||||
<Button
|
||||
size={Button.Sizes.SMALL}
|
||||
onClick={() => {
|
||||
resetSettings(plugin, pluginModalProps, pluginModalProps, onRestartNeeded);
|
||||
}}
|
||||
onMouseEnter={onMouseEnter}
|
||||
onMouseLeave={onMouseLeave}
|
||||
className="button-danger-background-no-margin"
|
||||
>
|
||||
Confirm Reset
|
||||
</Button>
|
||||
)}
|
||||
</Tooltip>
|
||||
<Button
|
||||
size={Button.Sizes.SMALL}
|
||||
onClick={() => {
|
||||
resetSettings(plugin, pluginModalProps, pluginModalProps, onRestartNeeded);
|
||||
}}
|
||||
className={cl("confirm-reset")}
|
||||
>
|
||||
Confirm Reset
|
||||
</Button>
|
||||
</Flex>
|
||||
</Flex>
|
||||
</ModalFooter>
|
||||
|
|
|
|||
|
|
@ -82,7 +82,7 @@ function ReloadRequiredCard({ required, enabledPlugins, openDisablePluginsModal,
|
|||
{enabledPlugins.length > 0 && !required && (
|
||||
<Button
|
||||
size={Button.Sizes.SMALL}
|
||||
className="button-danger-background disable-all-button"
|
||||
className={cl("disable-warning")}
|
||||
onClick={() => {
|
||||
if (Settings.ignoreResetWarning) return resetCheckAndDo();
|
||||
|
||||
|
|
@ -337,19 +337,18 @@ export default function PluginSettings() {
|
|||
</ModalContent>
|
||||
<ModalFooter className="modal-footer">
|
||||
<Flex className="button-container">
|
||||
<Button
|
||||
size={Button.Sizes.SMALL}
|
||||
color={Button.Colors.PRIMARY}
|
||||
onClick={warningModalProps.onClose}
|
||||
look={Button.Looks.LINK}
|
||||
>
|
||||
Cancel
|
||||
</Button>
|
||||
<Flex className="button-group">
|
||||
<Button
|
||||
size={Button.Sizes.SMALL}
|
||||
color={Button.Colors.PRIMARY}
|
||||
onClick={warningModalProps.onClose}
|
||||
>
|
||||
Cancel
|
||||
</Button>
|
||||
{!Settings.ignoreResetWarning && (
|
||||
<Button
|
||||
size={Button.Sizes.SMALL}
|
||||
className="button-danger-background"
|
||||
className={cl("disable-warning")}
|
||||
onClick={() => {
|
||||
Settings.ignoreResetWarning = true;
|
||||
}}
|
||||
|
|
@ -357,19 +356,14 @@ export default function PluginSettings() {
|
|||
Disable Warning Forever
|
||||
</Button>
|
||||
)}
|
||||
<Tooltip text="This action cannot be undone. Are you sure?" shouldShow={true}>
|
||||
{({ onMouseEnter, onMouseLeave }) => (
|
||||
<Button
|
||||
size={Button.Sizes.SMALL}
|
||||
className="button-danger-background-no-margin"
|
||||
onClick={resetCheckAndDo}
|
||||
onMouseEnter={onMouseEnter}
|
||||
onMouseLeave={onMouseLeave}
|
||||
>
|
||||
Disable All
|
||||
</Button>
|
||||
)}
|
||||
</Tooltip>
|
||||
|
||||
<Button
|
||||
size={Button.Sizes.SMALL}
|
||||
className={cl("confirm-reset")}
|
||||
onClick={resetCheckAndDo}
|
||||
>
|
||||
Disable All
|
||||
</Button>
|
||||
</Flex>
|
||||
</Flex>
|
||||
</ModalFooter>
|
||||
|
|
|
|||
|
|
@ -166,33 +166,32 @@
|
|||
margin-bottom: 10px;
|
||||
}
|
||||
|
||||
.button-danger-background {
|
||||
background-color: var(--background-color) !important;
|
||||
.vc-plugins-disable-warning,
|
||||
.vc-plugin-modal-disable-warning {
|
||||
background-color: color-mix(in srgb, var(--button-danger-background) 10%, transparent) !important;
|
||||
border-style: solid !important;
|
||||
border-width: .1rem !important;
|
||||
border-color: var(--button-outline-danger-border) !important;
|
||||
border-color: color-mix(in srgb, var(--button-danger-background) 80%, transparent) !important;
|
||||
border-radius: 5px !important;
|
||||
color: color-mix(in srgb, var(--button-danger-background) 100%, transparent) !important;
|
||||
align-self: flex-end !important;
|
||||
}
|
||||
|
||||
.button-danger-background.top-margin {
|
||||
margin-top: 10px;
|
||||
.vc-plugins-disable-warning:hover,
|
||||
.vc-plugin-modal-disable-warning:hover {
|
||||
background-color: color-mix(in srgb, var(--button-danger-background-hover) 40%, transparent) !important;
|
||||
}
|
||||
|
||||
.button-danger-background:hover {
|
||||
background-color: var(--button-outline-danger-background-hover) !important;
|
||||
border-style: solid;
|
||||
border-width: .1rem;
|
||||
border-color: var(--button-outline-danger-border) !important;
|
||||
}
|
||||
|
||||
.button-danger-background-no-margin {
|
||||
.vc-plugins-confirm-reset,
|
||||
.vc-plugin-modal-confirm-reset {
|
||||
background-color: var(--button-danger-background) !important;
|
||||
color: var(--header-primary);
|
||||
}
|
||||
|
||||
.button-danger-background-no-margin:hover {
|
||||
.vc-plugins-confirm-reset:hover,
|
||||
.vc-plugin-modal-confirm-reset:hover {
|
||||
background-color: var(--button-danger-background-hover) !important;
|
||||
filter: saturate(75%);
|
||||
filter: saturate(80%);
|
||||
}
|
||||
|
||||
.vc-modal-close-button {
|
||||
|
|
@ -207,17 +206,10 @@
|
|||
}
|
||||
|
||||
.modal-footer .button-container {
|
||||
display: flex !important;
|
||||
justify-content: space-between;
|
||||
align-items: center;
|
||||
width: 100%;
|
||||
}
|
||||
|
||||
.button-group {
|
||||
display: flex !important;
|
||||
gap: 10px;
|
||||
align-items: center;
|
||||
justify-content: end !important;
|
||||
justify-content: space-between !important;
|
||||
}
|
||||
|
||||
/* Specific to disable all modal */
|
||||
|
|
@ -232,13 +224,6 @@
|
|||
text-decoration: underline;
|
||||
}
|
||||
|
||||
.disable-all-button {
|
||||
color: var(--header-primary);
|
||||
width: 150px;
|
||||
margin-left: auto;
|
||||
margin-right: 4.5px !important;
|
||||
}
|
||||
|
||||
.visual-refresh .button-danger-background {
|
||||
font-size: 16px;
|
||||
background-color: rgb(240 71 71 / 10%) !important;
|
||||
|
|
@ -248,7 +233,6 @@
|
|||
font-weight: 500;
|
||||
padding: 6px 10px;
|
||||
text-align: center;
|
||||
margin-top: 10px;
|
||||
}
|
||||
|
||||
.visual-refresh .button-danger-background:hover {
|
||||
|
|
|
|||
Loading…
Add table
Reference in a new issue