Add: BetterSyntax plugin for BetterDiscord
This commit is contained in:
parent
884f4f39af
commit
a2f4d73cc7
1 changed files with 531 additions and 0 deletions
531
Configs/BetterDiscord/plugins/BetterSyntax.plugin.js
Normal file
531
Configs/BetterDiscord/plugins/BetterSyntax.plugin.js
Normal file
|
@ -0,0 +1,531 @@
|
|||
/**
|
||||
* @name BetterSyntax
|
||||
* @author TheCommieAxolotl#0001
|
||||
* @description Lets you edit Syntax Highlighting with an easy interface and adds some useful buttons.
|
||||
* @version 2.1.3
|
||||
* @authorId 538487970408300544
|
||||
* @invite 5BSWtSM3XU
|
||||
* @source https://github.com/TheCommieAxolotl/BetterDiscord-Stuff/tree/main/BetterSyntax
|
||||
* @updateurl https://raw.githubusercontent.com/TheCommieAxolotl/BetterDiscord-Stuff/main/BetterSyntax/BetterSyntax.plugin.js
|
||||
* @donate https://github.com/sponsors/thecommieaxolotl
|
||||
*/
|
||||
|
||||
module.exports = (() => {
|
||||
const nordTheme = `.hljs-addition,.hljs-keyword,.hljs-selector-tag{color:#81A1C1 !important}.hljs-function .hljs-title{color:#8FBCBB !important}code.hljs{background-color:#2E343F}.hljs-selector-class{color:#8FBCBB}.hljs-number{color:#B48EAD}.hljs-attribute{color:#D8DEE9}.hljs-built_in{color:#88C0D0}.hljs, .hljs + .bettersyntax-buttons{color:#81A1C1}.hljs-meta{color:#81A1C1}.hljs-string{color:#A3BE8C}.hljs-literal{color:#81A1C1}.hljs-selector-pseudo{color:#8FBCBB}.hljs-comment{color:#616E88}.hljs-bullet,.hljs-link,.hljs-selector-attr,.hljs-subst,.hljs-symbol{color:#8FBCBB}`;
|
||||
const gruvboxTheme = `.hljs-addition,.hljs-keyword,.hljs-selector-tag{color:#FB4934 !important}.hljs-title{color:#FABD2F !important}.hljs-function .hljs-title{color:#FABD2F !important}code.hljs{background-color:#282828}.hljs-selector-class{color:#B8BB26}.hljs-number{color:#D3869B}.hljs-attribute{color:#FE8019}.hljs-built_in{color:#FB4934}.hljs, .hljs + .bettersyntax-buttons{color:#EBDBB2}.hljs-meta{color:#FB4934}.hljs-string{color:#B8BB26}.hljs-literal{color:#FB4934}.hljs-selector-pseudo{color:#FABD2F}.hljs-comment{color:#928374}.hljs-doctag{color:#83A598}.hljs-bullet,.hljs-link,.hljs-selector-attr,.hljs-subst,.hljs-symbol{color:#FB4934}`;
|
||||
const tokyonightTheme = `.hljs-addition,.hljs-keyword,.hljs-selector-tag{color:#BB9AF7 !important}.hljs-function .hljs-title{color:#7AA2F7 !important}code.hljs{background-color:#1A1B26}.hljs-selector-class{color:#9ECE6A}.hljs-number{color:#FF9E64}.hljs-attribute{color:#7AA2F7}.hljs-built_in:not(.hljs-params *) {color: #0DB9D7;}.hljs-params, .hljs-params * {color: #E0AF68 !important;}.hljs, .hljs + .bettersyntax-buttons{color:#C0CAF5}.hljs-meta{color:#81A1C1}.hljs-string{color:#9ECE6A}.hljs-literal{color:#81A1C1}.hljs-selector-pseudo{color:#BB9AF7}.hljs-comment{color:#444B6A}.hljs-link,.hljs-selector-attr,.hljs-subst,.hljs-symbol,.hljs-bullet{color:#BB9AF7}`;
|
||||
const onedarkTheme = `.hljs, .hljs + .bettersyntax-buttons{color:#abb2bf;background:#282c34 !important;}.hljs-comment,.hljs-quote{color:#5c6370;font-style:italic}.hljs-doctag,.hljs-formula,.hljs-keyword{color:#c678dd}.hljs-deletion,.hljs-name,.hljs-section,.hljs-selector-tag,.hljs-subst{color:#e06c75}.hljs-literal{color:#56b6c2}.hljs-addition,.hljs-attribute,.hljs-meta .hljs-string,.hljs-regexp,.hljs-string{color:#98c379}.hljs-attr,.hljs-number,.hljs-selector-attr,.hljs-selector-class,.hljs-selector-pseudo,.hljs-template-variable,.hljs-type,.hljs-variable{color:#d19a66}.hljs-bullet,.hljs-link,.hljs-meta,.hljs-selector-id,.hljs-symbol,.hljs-title{color:#61aeee}.hljs-class .hljs-title,.hljs-title.class_{color:#e6c07b}.hljs-built_in:not(.hljs-params *){color:#E06C75}.hljs-params, .hljs-params *{color: #61AFEF !important}.hljs-function{color:#E5C07B}`;
|
||||
const ultraTheme = `.hljs, .hljs + .bettersyntax-buttons{color:#dcddde;background:#17161b !important;}.hljs-comment,.hljs-quote{color:#b9bbbe;font-style:italic}.hljs-doctag,.hljs-formula,.hljs-keyword{color:#6e6af6}.hljs-deletion,.hljs-name,.hljs-section,.hljs-selector-tag,.hljs-subst{color:#eb8181}.hljs-literal{color:#ffce97}.hljs-addition,.hljs-attribute,.hljs-meta .hljs-string,.hljs-regexp,.hljs-string{color:#97ffa5}.hljs-attr,.hljs-number,.hljs-selector-attr,.hljs-selector-class,.hljs-selector-pseudo,.hljs-template-variable,.hljs-type,.hljs-variable{color:#fdff97}.hljs-bullet,.hljs-link,.hljs-meta,.hljs-selector-id,.hljs-symbol,.hljs-title{color:#97aaff}.hljs-built_in,.hljs-class .hljs-title,.hljs-title.class_{color:#e6c07b}`;
|
||||
|
||||
const Themes = [
|
||||
{ name: "Default", desc: "Discord's default colors", value: "default", css: "" },
|
||||
{ name: "Nord Theme", value: "nord", css: nordTheme },
|
||||
{ name: "Gruvbox Theme", value: "gruvbox", css: gruvboxTheme },
|
||||
{ name: "OneDark Theme", value: "onedark", css: onedarkTheme },
|
||||
{ name: "Tokyo Night Theme", value: "tokyonight", css: tokyonightTheme },
|
||||
{ name: "Ultra Theme", value: "ultra", css: ultraTheme },
|
||||
];
|
||||
|
||||
const config = {
|
||||
info: {
|
||||
name: "BetterSyntax",
|
||||
authors: [
|
||||
{
|
||||
name: "TheCommieAxolotl",
|
||||
discord_id: "538487970408300544",
|
||||
},
|
||||
],
|
||||
github_raw: "https://raw.githubusercontent.com/TheCommieAxolotl/BetterDiscord-Stuff/main/BetterSyntax/BetterSyntax.plugin.js",
|
||||
version: "2.1.3",
|
||||
description: "Lets you edit Syntax Highlighting with an easy interface and adds some useful buttons.",
|
||||
},
|
||||
|
||||
defaultConfig: [
|
||||
{
|
||||
type: "category",
|
||||
id: "categoryPresets",
|
||||
name: "Presets",
|
||||
collapsible: true,
|
||||
shown: true,
|
||||
settings: [
|
||||
{
|
||||
type: "switch",
|
||||
id: "enablePresets",
|
||||
name: "Enable Preset Module",
|
||||
note: "Without this, nothing in this category will apply.",
|
||||
value: true,
|
||||
},
|
||||
{
|
||||
name: "",
|
||||
id: "theme",
|
||||
type: "radio",
|
||||
options: Themes,
|
||||
value: "default",
|
||||
},
|
||||
],
|
||||
},
|
||||
{
|
||||
type: "category",
|
||||
id: "categoryEditor",
|
||||
name: "Editor",
|
||||
collapsible: true,
|
||||
shown: true,
|
||||
settings: [
|
||||
{
|
||||
type: "switch",
|
||||
id: "enableEditor",
|
||||
name: "Enable Editor Module",
|
||||
note: "Without this, nothing in this category will apply.",
|
||||
value: false,
|
||||
},
|
||||
{
|
||||
type: "textbox",
|
||||
id: "background",
|
||||
name: "Code Background Color",
|
||||
note: "Default: var(--background-secondary)",
|
||||
value: "var(--background-secondary)",
|
||||
},
|
||||
{
|
||||
type: "textbox",
|
||||
id: "defaultColor",
|
||||
name: "Default Color",
|
||||
note: "Default: #b9bbbe",
|
||||
value: "#b9bbbe",
|
||||
},
|
||||
{
|
||||
type: "textbox",
|
||||
id: "stringColor",
|
||||
name: "String Color",
|
||||
note: "Default: #2aa198",
|
||||
value: "#2aa198",
|
||||
},
|
||||
{
|
||||
type: "textbox",
|
||||
id: "commentColor",
|
||||
name: "Comment Color",
|
||||
note: "Default: #4f545c",
|
||||
value: "#4f545c",
|
||||
},
|
||||
{
|
||||
type: "textbox",
|
||||
id: "color1",
|
||||
name: "Keyword Color",
|
||||
note: "Default: #859900",
|
||||
value: "#859900",
|
||||
},
|
||||
{
|
||||
type: "textbox",
|
||||
id: "color2",
|
||||
name: "Fucntion Title Color",
|
||||
note: "Default: #268bd2",
|
||||
value: "#268bd2",
|
||||
},
|
||||
{
|
||||
type: "textbox",
|
||||
id: "color3",
|
||||
name: "BuiltIn Color",
|
||||
note: "Default: #F7768E",
|
||||
value: "#F7768E",
|
||||
},
|
||||
{
|
||||
type: "textbox",
|
||||
id: "color4",
|
||||
name: "CSS BuiltIn Color",
|
||||
note: "Default: #F7768E",
|
||||
value: "#F7768E",
|
||||
},
|
||||
{
|
||||
type: "textbox",
|
||||
id: "color5",
|
||||
name: "Selector Color",
|
||||
note: "Default: #268bd2",
|
||||
value: "#268bd2",
|
||||
},
|
||||
{
|
||||
type: "textbox",
|
||||
id: "color6",
|
||||
name: "Number Color",
|
||||
note: "Default: #2aa198",
|
||||
value: "#2aa198",
|
||||
},
|
||||
{
|
||||
type: "textbox",
|
||||
id: "color7",
|
||||
name: "Attribute Color",
|
||||
note: "Default: #b58900",
|
||||
value: "#b58900",
|
||||
},
|
||||
{
|
||||
type: "textbox",
|
||||
id: "color8",
|
||||
name: "Meta Color",
|
||||
note: "Default: #cb4b16",
|
||||
value: "#cb4b16",
|
||||
},
|
||||
{
|
||||
type: "textbox",
|
||||
id: "color9",
|
||||
name: "Literal Color",
|
||||
note: "Default: #cb4b16",
|
||||
value: "#cb4b16",
|
||||
},
|
||||
{
|
||||
type: "textbox",
|
||||
id: "color10",
|
||||
name: "Pseudo Selector Color",
|
||||
note: "Default: #cb4b16",
|
||||
value: "#cb4b16",
|
||||
},
|
||||
{
|
||||
type: "textbox",
|
||||
id: "other",
|
||||
name: "Other Color",
|
||||
note: "Default: #cb4b16",
|
||||
value: "#cb4b16",
|
||||
},
|
||||
],
|
||||
},
|
||||
{
|
||||
type: "category",
|
||||
id: "categoryLink",
|
||||
name: "Link Stylesheet",
|
||||
collapsible: true,
|
||||
shown: true,
|
||||
settings: [
|
||||
{
|
||||
type: "switch",
|
||||
id: "enableLink",
|
||||
name: "Enable Link Module",
|
||||
note: "Without this, nothing in this category will apply.",
|
||||
value: false,
|
||||
},
|
||||
{
|
||||
type: "textbox",
|
||||
placeholder: "https://styles.com/hljs.css",
|
||||
id: "link",
|
||||
name: "Link",
|
||||
note: "Link to a hljs stylesheet",
|
||||
value: "",
|
||||
},
|
||||
],
|
||||
},
|
||||
{
|
||||
type: "category",
|
||||
id: "categoryFile",
|
||||
name: "Link CSS File",
|
||||
collapsible: true,
|
||||
shown: true,
|
||||
settings: [
|
||||
{
|
||||
type: "switch",
|
||||
id: "enableFile",
|
||||
name: "Enable File Module",
|
||||
note: "Without this, nothing in this category will apply.",
|
||||
value: false,
|
||||
},
|
||||
{
|
||||
type: "textbox",
|
||||
placeholder: "C:/User/Desktop/hljs.css",
|
||||
id: "filePath",
|
||||
name: "File Path",
|
||||
note: "Path to a hljs stylesheet",
|
||||
value: "",
|
||||
},
|
||||
],
|
||||
},
|
||||
{
|
||||
type: "textbox",
|
||||
placeholder: "Source Code Pro",
|
||||
id: "fontName",
|
||||
name: "Font Name",
|
||||
note: "Exact Font Name",
|
||||
value: "Source Code Pro",
|
||||
},
|
||||
{
|
||||
type: "textbox",
|
||||
placeholder: "https://fonts.googleapis.com/css2?family=Source+Code+Pro:wght@550&display=swap",
|
||||
id: "fontImport",
|
||||
name: "Font Import",
|
||||
note: "URL to import",
|
||||
value: "",
|
||||
},
|
||||
{
|
||||
type: "textbox",
|
||||
placeholder: "0.875rem",
|
||||
id: "fontSize",
|
||||
name: "Font Size",
|
||||
note: "Number. Default: 0.875rem",
|
||||
value: "0.875rem",
|
||||
},
|
||||
],
|
||||
|
||||
changelog: [
|
||||
{
|
||||
title: "New Feature",
|
||||
type: "added",
|
||||
items: ["Added feature to load CSS from local file"],
|
||||
},
|
||||
],
|
||||
};
|
||||
|
||||
return !global.ZeresPluginLibrary
|
||||
? class {
|
||||
constructor() {
|
||||
this._config = config;
|
||||
}
|
||||
getName() {
|
||||
return config.info.name;
|
||||
}
|
||||
getAuthor() {
|
||||
return config.info.authors.map((a) => a.name).join(", ");
|
||||
}
|
||||
getDescription() {
|
||||
return config.info.description;
|
||||
}
|
||||
getVersion() {
|
||||
return config.info.version;
|
||||
}
|
||||
load() {
|
||||
BdApi.showConfirmationModal("Library Missing", `The library plugin needed for **${config.info.name}** is missing. Please click Download Now to install it.`, {
|
||||
confirmText: "Download Now",
|
||||
cancelText: "Cancel",
|
||||
onConfirm: () => {
|
||||
require("request").get("https://rauenzi.github.io/BDPluginLibrary/release/0PluginLibrary.plugin.js", async (error, response, body) => {
|
||||
if (error) return require("electron").shell.openExternal("https://betterdiscord.app/Download?id=9");
|
||||
await new Promise((r) => require("fs").writeFile(require("path").join(BdApi.Plugins.folder, "0PluginLibrary.plugin.js"), body, r));
|
||||
});
|
||||
},
|
||||
});
|
||||
}
|
||||
start() {}
|
||||
stop() {}
|
||||
}
|
||||
: (([Plugin, Api]) => {
|
||||
const plugin = (Plugin, Api) => {
|
||||
const { Logger, Patcher, DCM, WebpackModules } = Api;
|
||||
const { React, Webpack, ContextMenu } = BdApi;
|
||||
const { Filters } = Webpack;
|
||||
|
||||
const Tooltip = BdApi.Components.Tooltip;
|
||||
|
||||
return class BetterSyntax extends Plugin {
|
||||
async onStart() {
|
||||
this.injectCSS();
|
||||
this.addButtons();
|
||||
this.patchContext();
|
||||
}
|
||||
async onStop() {
|
||||
Themes.forEach((theme) => BdApi.clearCSS(theme.value));
|
||||
|
||||
BdApi.clearCSS("BetterSyntaxCSS");
|
||||
BdApi.clearCSS("BetterSyntaxButtons");
|
||||
BdApi.clearCSS("BetterSyntaxEditorTheme");
|
||||
BdApi.clearCSS("BetterSyntaxHljsLink");
|
||||
BdApi.clearCSS("BetterSyntaxHljsFile");
|
||||
|
||||
Patcher.unpatchAll();
|
||||
this.contextpatch();
|
||||
}
|
||||
|
||||
async patchContext() {
|
||||
this.contextpatch = ContextMenu.patch("message", (tree, _) => {
|
||||
tree.props.children.push(
|
||||
ContextMenu.buildItem({ type: "separator" }),
|
||||
ContextMenu.buildItem({
|
||||
label: "BetterSyntax",
|
||||
type: "submenu",
|
||||
id: "context-bettersyntax",
|
||||
children: [
|
||||
ContextMenu.buildItem({
|
||||
label: "Change Theme",
|
||||
type: "text",
|
||||
action: () => {
|
||||
this.showSettingsModal();
|
||||
},
|
||||
}),
|
||||
],
|
||||
})
|
||||
);
|
||||
});
|
||||
}
|
||||
|
||||
getSettingsPanel() {
|
||||
const panel = this.buildSettingsPanel();
|
||||
const tip = document.createElement("div");
|
||||
|
||||
tip.innerHTML = "TIP - if you don't like any of the preset themes, you can make your own in the Editor!";
|
||||
tip.classList.add("bettersyntax-tip");
|
||||
|
||||
panel.addListener(() => {
|
||||
this.injectCSS();
|
||||
});
|
||||
|
||||
let newPanel = panel.getElement();
|
||||
newPanel.insertBefore(tip, newPanel.firstChild);
|
||||
|
||||
return newPanel;
|
||||
}
|
||||
|
||||
injectCSS() {
|
||||
const editorTheme = `.hljs-addition,.hljs-keyword,.hljs-selector-tag{color:${this.settings.categoryEditor.color1}!important}.hljs-function .hljs-title{color:${this.settings.categoryEditor.color2}!important}code.hljs{background-color:${this.settings.categoryEditor.background}}.hljs-selector-class{color:${this.settings.categoryEditor.color5}}.hljs-number{color:${this.settings.categoryEditor.color6}}.hljs-attribute{color:${this.settings.categoryEditor.color7}}.hljs-built_in{color:${this.settings.categoryEditor.color3}}.css .hljs-built_in{color:${this.settings.categoryEditor.color4}}.hljs, .hljs + .bettersyntax-buttons{color:${this.settings.categoryEditor.defaultColor}}.hljs-meta{color:${this.settings.categoryEditor.color8}}.hljs-string{color:${this.settings.categoryEditor.stringColor}}.hljs-literal{color:${this.settings.categoryEditor.color9}}.hljs-selector-pseudo{color:${this.settings.categoryEditor.color10}}.hljs-comment{color:${this.settings.categoryEditor.commentColor}}.hljs-bullet,.hljs-link,.hljs-selector-attr,.hljs-subst,.hljs-symbol{color:${this.settings.categoryEditor.other}}`;
|
||||
const BetterSyntaxCSS = `@import url("https://fonts.googleapis.com/css2?family=Source+Code+Pro:wght@550&display=swap");@import url("${
|
||||
this.settings.fontImport
|
||||
}");.bettersyntax-tip{color:var(--header-secondary);font-weight:500;font-family:var(--font-display);text-transform:uppercase;font-size:12px;margin-bottom:10px}code.hljs{font-size:${
|
||||
this.settings.fontSize || "0.875rem"
|
||||
};font-family:"${
|
||||
this.settings.fontName
|
||||
}"}.hljs{border-radius:4px;margin-bottom:10px !important;border:none !important}.collapsed > .hljs,.collapsed > .hljs *{color:transparent !important}.collapsed > .hljs{min-height:28px;max-height:28px;font-size:0;display:flex}.collapsed > .hljs .bettersyntax-buttons{margin-right:7px;margin-top:6px;pointer-events:all;top:10px}.collapsed > .hljs::before{color:white;content:"Collapsed codeblock";width:76%;height:28px;text-align:center;font-size:10pt;position:absolute;padding-top:5.5px;font-family:var(--font-primary);font-weight:500}.layerContainer-2v_Sit code.hljs{margin:15px}`;
|
||||
|
||||
BdApi.injectCSS("BetterSyntaxCSS", BetterSyntaxCSS);
|
||||
|
||||
if (this.settings.categoryPresets.enablePresets) {
|
||||
Themes.forEach((theme) => {
|
||||
if (this.settings.categoryPresets.theme == theme.value) {
|
||||
BdApi.injectCSS(theme.value, theme.css);
|
||||
} else {
|
||||
BdApi.clearCSS(theme.value);
|
||||
}
|
||||
});
|
||||
} else {
|
||||
Themes.forEach((theme) => BdApi.clearCSS(theme.value));
|
||||
}
|
||||
|
||||
if (this.settings.categoryEditor.enableEditor) {
|
||||
BdApi.injectCSS("BetterSyntaxEditorTheme", editorTheme);
|
||||
} else {
|
||||
BdApi.clearCSS("BetterSyntaxEditorTheme");
|
||||
}
|
||||
|
||||
if (this.settings.categoryLink.enableLink) {
|
||||
BdApi.injectCSS("BetterSyntaxHljsLink", `@import url("${this.settings.categoryLink.link}");`);
|
||||
} else {
|
||||
BdApi.clearCSS("BetterSyntaxHljsLink");
|
||||
}
|
||||
|
||||
if (this.settings.categoryFile.enableFile && this.settings.categoryFile.filePath) {
|
||||
const fs = require("fs");
|
||||
|
||||
let css = "";
|
||||
if (fs.existsSync(this.settings.categoryFile.filePath)) {
|
||||
css = fs.readFileSync(this.settings.categoryFile.filePath, { encoding: "utf8" });
|
||||
}
|
||||
|
||||
BdApi.injectCSS("BetterSyntaxHljsFile", css);
|
||||
} else {
|
||||
BdApi.clearCSS("BetterSyntaxHljsFile");
|
||||
}
|
||||
}
|
||||
|
||||
async addButtons() {
|
||||
const { codeBlock } = Webpack.getModule(Filters.byProps("parse", "parseTopic")).defaultRules;
|
||||
Patcher.after(codeBlock, "react", (_, [props], res) => {
|
||||
if (props.type !== "codeBlock") return;
|
||||
|
||||
Patcher.after(res.props.children, "type", (_, __, nestedRes) => {
|
||||
nestedRes.props.className = "bettersyntax-pre";
|
||||
|
||||
nestedRes.props.children = [
|
||||
nestedRes.props.children,
|
||||
React.createElement("div", {
|
||||
className: "bettersyntax-buttons",
|
||||
children: [
|
||||
React.createElement(Tooltip, {
|
||||
text: props.lang ? `Language: ${props.lang.toUpperCase()}` : "Unknown Language",
|
||||
children: (p) =>
|
||||
React.createElement("div", {
|
||||
...p,
|
||||
className: "code-button bettersyntax-lang",
|
||||
onClick: () => {
|
||||
DiscordNative.clipboard.copy(props.lang);
|
||||
BdApi.showToast("Copied Language", { type: "success" });
|
||||
},
|
||||
children: [
|
||||
React.createElement("svg", {
|
||||
className: "icon",
|
||||
viewBox: "2 2 20 20",
|
||||
children: [
|
||||
React.createElement("path", {
|
||||
fill: "currentColor",
|
||||
d: "M6.5 8Q6.5 7 7.5 7L11.5 7Q12.5 7 12.5 8T11.5 9L7.5 9Q6.5 9 6.5 8M13.5 8Q13.5 7 14.5 7 15.5 7 15.5 8T14.5 9 13.5 8zM6.5 11Q6.5 10 7.5 10L8.5 10Q9.5 10 9.5 11T8.5 12L7.5 12Q6.5 12 6.5 11M10.5 11Q10.5 10 11.5 10L15.5 10Q16.5 10 16.5 11T15.5 12L11.5 12Q10.5 12 10.5 11M6.5 14Q6.5 13 7.5 13L11.5 13Q12.5 13 12.5 14T11.5 15L7.5 15Q6.5 15 6.5 14M13.5 14Q13.5 13 14.5 13L17.5 13Q18.5 13 18.5 14T17.5 15L14.5 15Q13.5 15 13.5 14M6.5 17Q6.5 16 7.5 16L9.5 16Q10.5 16 10.5 17T9.5 18L7.5 18Q6.5 18 6.5 17",
|
||||
}),
|
||||
],
|
||||
}),
|
||||
],
|
||||
}),
|
||||
}),
|
||||
React.createElement(Tooltip, {
|
||||
text: `Copy Code`,
|
||||
children: (p) =>
|
||||
React.createElement("div", {
|
||||
...p,
|
||||
className: "code-button bettersyntax-copy",
|
||||
onClick: () => {
|
||||
DiscordNative.clipboard.copy(props.content);
|
||||
BdApi.showToast("Copied", { type: "success" });
|
||||
},
|
||||
children: [
|
||||
React.createElement("svg", {
|
||||
className: "icon",
|
||||
viewBox: "2 2 20 20",
|
||||
children: [
|
||||
React.createElement("path", {
|
||||
fill: "currentColor",
|
||||
d: "M12 2ZM7 19Q6 19 6 18C6 8 6 10 6 6Q6 5 7 5h6q1 0 1 1L15 6h2q1 0 1 1v11q0 1-1 1c-2 0-2 0-3 0m0-2h1q1 0 1-1V15 9Q16 8 15 8h-1m-3 9q1 0 1-1V8Q12 7 11 7H9Q8 7 8 8v8q0 1 1 1z",
|
||||
}),
|
||||
],
|
||||
}),
|
||||
],
|
||||
}),
|
||||
}),
|
||||
React.createElement(Tooltip, {
|
||||
text: `Toggle Collapse`,
|
||||
children: (p) =>
|
||||
React.createElement("div", {
|
||||
...p,
|
||||
className: "code-button bettersyntax-collapse",
|
||||
onClick: (ele) => {
|
||||
BdApi.showToast("Toggled Collapse");
|
||||
if (ele.target.tagName == "svg") {
|
||||
if (!ele.target.parentNode.parentNode.parentNode.classList.contains("collapsed")) {
|
||||
ele.target.parentNode.parentNode.parentNode.classList.add("collapsed");
|
||||
} else {
|
||||
ele.target.parentNode.parentNode.parentNode.classList.remove("collapsed");
|
||||
}
|
||||
} else if (ele.target.tagName == "path") {
|
||||
if (!ele.target.parentNode.parentNode.parentNode.parentNode.classList.contains("collapsed")) {
|
||||
ele.target.parentNode.parentNode.parentNode.parentNode.classList.add("collapsed");
|
||||
} else {
|
||||
ele.target.parentNode.parentNode.parentNode.parentNode.classList.remove("collapsed");
|
||||
}
|
||||
}
|
||||
},
|
||||
children: [
|
||||
React.createElement("svg", {
|
||||
className: "icon",
|
||||
viewBox: "2 2 20 20",
|
||||
children: [
|
||||
React.createElement("path", {
|
||||
fill: "currentColor",
|
||||
d: "M6 9h12l-6 7z",
|
||||
}),
|
||||
],
|
||||
}),
|
||||
],
|
||||
}),
|
||||
}),
|
||||
],
|
||||
}),
|
||||
];
|
||||
});
|
||||
});
|
||||
|
||||
const buttonsCSS = `.code-button .icon > path {color: var(--background-primary);}.code-button {background: currentColor;border-radius: 10px;}.bettersyntax-buttons{margin-left:auto;margin-top:3px;height:17.5px;width:fit-content}.code-button{display:inline-flex;background-repeat:no-repeat;cursor:pointer;height:17.5px;width:17.5px}.code-button:not(.code-button:nth-child(3)){margin-right:5px}.bettersyntax-collapse{transition:transform 0.2s ease}.collapsed .bettersyntax-collapse{transform:rotate(180deg)}pre code.hljs + .bettersyntax-buttons{background:transparent !important}`;
|
||||
BdApi.injectCSS("BetterSyntaxButtons", buttonsCSS);
|
||||
}
|
||||
};
|
||||
};
|
||||
|
||||
return plugin(Plugin, Api);
|
||||
})(global.ZeresPluginLibrary.buildPlugin(config));
|
||||
})();
|
||||
/*@end@*/
|
Loading…
Reference in a new issue