Make flow ribbons themeable

This commit is contained in:
luisangelsm
2026-03-21 20:45:23 +01:00
parent 5fbd5bc185
commit f65fd08e65
13 changed files with 201 additions and 32 deletions

Binary file not shown.

Before

Width:  |  Height:  |  Size: 2.3 KiB

24
images/readRibbon.svg Normal file
View File

@ -0,0 +1,24 @@
<?xml version="1.0" encoding="UTF-8"?>
<svg id="Layer_1" data-name="Layer 1" xmlns="http://www.w3.org/2000/svg" xmlns:xlink="http://www.w3.org/1999/xlink" viewBox="0 0 100 136">
<defs>
<style>
.cls-1 {
fill: #0ff;
}
.cls-2 {
fill: #f0f;
filter: url(#drop-shadow-1);
}
</style>
<filter id="drop-shadow-1" x="0" y="-1" width="100" height="134" filterUnits="userSpaceOnUse">
<feOffset dx="0" dy="1"/>
<feGaussianBlur result="blur" stdDeviation="2"/>
<feFlood flood-color="#000" flood-opacity=".33"/>
<feComposite in2="blur" operator="in"/>
<feComposite in="SourceGraphic"/>
</filter>
</defs>
<path class="cls-2" d="M90.69,125.14l-38.73-33.45c-1.13-.97-2.8-.97-3.92,0L9.31,125.14c-1.3,1.12-3.31.2-3.31-1.51V8c0-2.21,1.79-4,4-4h80c2.21,0,4,1.79,4,4v115.63c0,1.71-2.01,2.63-3.31,1.51Z"/>
<polygon class="cls-1" points="34.29 52 40 46.29 46 52.29 61 37.29 66.71 43 46 63.71 34.29 52"/>
</svg>

After

Width:  |  Height:  |  Size: 988 B

Binary file not shown.

Before

Width:  |  Height:  |  Size: 2.1 KiB

19
images/readingRibbon.svg Normal file
View File

@ -0,0 +1,19 @@
<?xml version="1.0" encoding="UTF-8"?>
<svg id="Layer_1" data-name="Layer 1" xmlns="http://www.w3.org/2000/svg" xmlns:xlink="http://www.w3.org/1999/xlink" viewBox="0 0 100 136">
<defs>
<style>
.cls-1 {
fill: #f0f;
filter: url(#drop-shadow-2);
}
</style>
<filter id="drop-shadow-2" x="0" y="-1" width="100" height="134" filterUnits="userSpaceOnUse">
<feOffset dx="0" dy="1"/>
<feGaussianBlur result="blur" stdDeviation="2"/>
<feFlood flood-color="#000" flood-opacity=".33"/>
<feComposite in2="blur" operator="in"/>
<feComposite in="SourceGraphic"/>
</filter>
</defs>
<path class="cls-1" d="M90.69,125.14l-38.73-33.45c-1.13-.97-2.8-.97-3.92,0L9.31,125.14c-1.3,1.12-3.31.2-3.31-1.51V8c0-2.21,1.79-4,4-4h80c2.21,0,4,1.79,4,4v115.63c0,1.71-2.01,2.63-3.31,1.51Z"/>
</svg>

After

Width:  |  Height:  |  Size: 845 B