From bb0ef46e6bd90807b76e39504b43d9ed8e6247cb Mon Sep 17 00:00:00 2001 From: Thomasorus Date: Mon, 8 Mar 2021 01:21:52 +0100 Subject: [PATCH 1/3] fixed broken tag --- dist/moyo.svg | 2 +- moyo.mjs | 2 +- 2 files changed, 2 insertions(+), 2 deletions(-) diff --git a/dist/moyo.svg b/dist/moyo.svg index 9fd6b3d..715ca94 100644 --- a/dist/moyo.svg +++ b/dist/moyo.svg @@ -110,7 +110,7 @@ - + diff --git a/moyo.mjs b/moyo.mjs index 0d6b0fb..73f99e1 100644 --- a/moyo.mjs +++ b/moyo.mjs @@ -131,7 +131,7 @@ const patterns = [ `, - ` + ` From 3fb11d24bd0a7712c7241a7f9a185edd07585e39 Mon Sep 17 00:00:00 2001 From: Thomasorus Date: Sat, 17 Aug 2024 17:43:42 +0200 Subject: [PATCH 2/3] Update moyo.svg --- dist/moyo.svg | 363 ++++++++++++++++++++++++-------------------------- 1 file changed, 175 insertions(+), 188 deletions(-) diff --git a/dist/moyo.svg b/dist/moyo.svg index 715ca94..7562b57 100644 --- a/dist/moyo.svg +++ b/dist/moyo.svg @@ -1,188 +1,175 @@ - \ No newline at end of file + From ad61fcaf01ddccfd3fe0c5bdec6cf5615339f333 Mon Sep 17 00:00:00 2001 From: Thomasorus Date: Sat, 17 Aug 2024 17:45:54 +0200 Subject: [PATCH 3/3] Update README.md --- README.md | 13 ++++++++++--- 1 file changed, 10 insertions(+), 3 deletions(-) diff --git a/README.md b/README.md index 45b3bc2..a507570 100644 --- a/README.md +++ b/README.md @@ -24,13 +24,20 @@ For example this SVG will be be a rectangle (`` tag) of 100 pixels width a ``` -Almost all SVG patterns come with no colors defined, which means colors will be automatically defined by two CSS rules: the `color` value and the `background` value on your `` element. +Colors are automatically defined by two CSS rules: the color value of the text (aka currentColor) and the background value on the div containing them (if none, the ). + +Two patterns (seigaiha and yinyang) default to a white background, which can be changed by using a css custom property. + +```css +#seigaiha, #yinyang { + --background: red; +} +``` -If you change those colors (for themes or dark mode), the patterns colors will change too accordingly. ## CSS Version -The CSS version uses the SVGs as base64 background images. Just include the classname to your existing html element and the pattern should appear. Please note that since this is a base64 encoding, you cannot change the colors when using the CSS version. +The CSS version is deprecated, and uses the SVGs as base64 background images. Include the classname to your existing html element and the pattern should appear. Please note that since this is a base64 encoding, you cannot change the colors when using the CSS version. ## License