mirror of
https://github.com/ful1e5/Bibata_Cursor.git
synced 2025-05-24 20:14:29 -04:00
🌈 Custom colors in Bibata's svg
In previous version, svg's colors replaced by batch proccess.Thats also consume more memory. ColoredSvgGenerator class shrink down to simple function.
This commit is contained in:
parent
6ac32d13f3
commit
af55c59c34
3 changed files with 73 additions and 9 deletions
|
@ -1,5 +1,52 @@
|
|||
const main = () => {
|
||||
console.log("Bibata Core");
|
||||
import { Colors } from "./types";
|
||||
|
||||
/**
|
||||
* Default Key Colors for generating colored svg.
|
||||
* base="#00FF00" (Green)
|
||||
* outline="#0000FF" (Blue)
|
||||
* watch.background="#FF0000" (Red)
|
||||
* */
|
||||
const defaultKeyColors: Colors = {
|
||||
base: "#00FF00",
|
||||
outline: "#0000FF",
|
||||
watch: {
|
||||
background: "#FF0000",
|
||||
},
|
||||
};
|
||||
|
||||
export { main };
|
||||
/**
|
||||
* Customize colors of svg code.
|
||||
* @param {string} content SVG code.
|
||||
* @param {Colors} colors Customize colors.
|
||||
* @param {Colors} [keys] Colors Key, That was written SVG code.
|
||||
* @returns {string} SVG code with colors.
|
||||
*/
|
||||
const colorSvg = (
|
||||
content: string,
|
||||
colors: Colors,
|
||||
keys: Colors = defaultKeyColors
|
||||
): string => {
|
||||
content = content
|
||||
.replace(new RegExp(keys.base, "ig"), colors.base)
|
||||
.replace(new RegExp(keys.outline, "ig"), colors.outline);
|
||||
|
||||
try {
|
||||
// === trying to replace `watch` color ===
|
||||
|
||||
if (!colors.watch?.background) {
|
||||
throw new Error("");
|
||||
}
|
||||
const { background: b } = colors.watch;
|
||||
content = content.replace(new RegExp(keys.watch!.background, "ig"), b); // Watch Background
|
||||
} catch (error) {
|
||||
// === on error => replace `watch` color as `base` ===
|
||||
|
||||
content = content.replace(
|
||||
new RegExp(keys.watch!.background, "ig"),
|
||||
colors.base
|
||||
);
|
||||
}
|
||||
return content;
|
||||
};
|
||||
|
||||
export { colorSvg };
|
||||
|
|
20
bitmapper/packages/core/src/types.ts
Normal file
20
bitmapper/packages/core/src/types.ts
Normal file
|
@ -0,0 +1,20 @@
|
|||
/**
|
||||
* Hex Colors in string Format.
|
||||
*
|
||||
* `Example: `"#FFFFFF"
|
||||
*/
|
||||
type HexColor = string;
|
||||
|
||||
/**
|
||||
* @Colors expect `base`, `outline` & `watch-background` colors in **HexColor** Format.
|
||||
* @default background is `base` color.
|
||||
*/
|
||||
type Colors = {
|
||||
base: HexColor;
|
||||
outline: HexColor;
|
||||
watch?: {
|
||||
background: HexColor;
|
||||
};
|
||||
};
|
||||
|
||||
export { Colors };
|
|
@ -1,8 +1,5 @@
|
|||
import { main } from "bibata-core";
|
||||
|
||||
const hmm = async () => {
|
||||
main();
|
||||
console.log("Bibata modern");
|
||||
const main = async () => {
|
||||
console.log("Bibata Modern");
|
||||
};
|
||||
|
||||
hmm();
|
||||
main();
|
||||
|
|
Loading…
Add table
Add a link
Reference in a new issue