Created
April 3, 2024 07:08
-
-
Save SuperOleg39/52ae6be7bcc6034429a588f8e7f2f63b to your computer and use it in GitHub Desktop.
This file contains hidden or bidirectional Unicode text that may be interpreted or compiled differently than what appears below. To review, open the file in an editor that reveals hidden Unicode characters.
Learn more about bidirectional Unicode characters
| // оборачиваем в минимальный svg, обработанный https://www.npmjs.com/package/mini-svg-data-uri | |
| const imgBlurDataURL = `%3Csvg xmlns='http://www.w3.org/2000/svg' %3E%3Cfilter id='b' color-interpolation-filters='sRGB'%3E%3CfeGaussianBlur stdDeviation='20'/%3E%3CfeColorMatrix values='1 0 0 0 0 0 1 0 0 0 0 0 1 0 0 0 0 0 100 -1' result='s'/%3E%3CfeFlood x='0' y='0' width='100%25' height='100%25'/%3E%3CfeComposite operator='out' in='s'/%3E%3CfeComposite in2='SourceGraphic'/%3E%3CfeGaussianBlur stdDeviation='20'/%3E%3C/filter%3E%3Cimage width='100%25' height='100%25' x='0' y='0' preserveAspectRatio='none' style='filter: url(%23b);' href='${base64Image}'/%3E%3C/svg%3E`; | |
| // и используем как background image | |
| const backgroundImage = `url("data:image/svg+xml;charset=utf-8,${imgBlurDataURL}")` |
Sign up for free
to join this conversation on GitHub.
Already have an account?
Sign in to comment