Can you create an actual legend key for the colors?

Really thrilled with this module - thank you! To give back just a little bit, here's a screenshot along with a text file of the HTML and CSS I wrote to create it. (This is for a political site - make changes as desired.)

Yeah, it was a manual thing to create it, but considering how well the module works, I'm not complaining! Thanks and enjoy...

Hi,

I have developed a module that it provides a block where it appears a legend with a list of terms of taxonomy with the colors for each term of taxonomy.

Cool Calendar Extras →

You can customize/override the twig template for your convinence.

I hope it would be useful and you can take some idea.

Regards

I have tried both @KarinG's method and @bcobin's, and wasn't able to get either to work. The text shows up in each case, but the colors don't appear in either one. I thought that the issue with @KarinG's segment might have been the missing fc-event-dot section in CSS, but @bcobin's includes the complete CSS, and yet I get the same result in both instances. (see attachments)

OK. I've found a part of the problem... not sure of the cause...

The fingers were working faster than the brain; I'd been modifying and repasting updated code, overwriting what was there/not working, so I wasn't looking at what was there... but when I did stop to look, I find that the reason the colors aren't showing up on mine is, for some reason, Drupal is stripping out a lot of the code. I paste in @KarinG's sample,
<p><span class="fc-event-dot" style="background-color:#99cc33"></span> Slalom&nbsp;&nbsp;<span class="fc-event-dot" style="background-color:#c58917"></span>&nbsp;Freestyle&nbsp;&nbsp;<span class="fc-event-dot" style="background-color:#f24fe7"></span> Leader/Instructor/Coach Development&nbsp;&nbsp;<span class="fc-event-dot" style="background-color:#800080"></span> Multi-Discipline&nbsp;&nbsp;<span class="fc-event-dot" style="background-color:#555555"></span> Other&nbsp;&nbsp;<span class="fc-event-dot" style="background-color:#ff6600"></span> Festivals&nbsp;&nbsp;<span class="fc-event-dot" style="background-color:#3366ff"></span> Paddler Development&nbsp;&nbsp;<span class="fc-event-dot" style="background-color:#c11b17"></span> Club Events&nbsp;&nbsp;<span class="fc-event-dot" style="background-color:#066066"></span> Canoe Polo&nbsp;&nbsp;</p>

and save it, and when I come back and look at the source that was saved, what is there is:

<p>
    Slalom&nbsp; &nbsp;Freestyle&nbsp; &nbsp;Leader/Instructor/Coach Development&nbsp; &nbsp;Multi-Discipline&nbsp; &nbsp;Other&nbsp; &nbsp;Festivals&nbsp; &nbsp;Paddler Development&nbsp; &nbsp;Club Events&nbsp; &nbsp;Canoe Polo&nbsp;&nbsp;
</p>

Drupal is stripping out all of the necessary information. I have this set as FULL HTML format in the editor, so I'm not sure why it is stripping out all of the information. So I've found the CAUSE, now I just need to figure out the solution.

As an update, it appears that CKEditor 5 doesn't like an "empty" span tag, as @KarinG has in her example.

When I change the code to

<style>
.legend-dot {
font-size:3rem;
text-align: middle;
}
</style>
<p><span class="legend-dot" style="color:#b51616">•</span> Slalom&nbsp;&nbsp;<span class="legend-dot" style="color: #cc9900">•</span> Freestyle&nbsp;&nbsp;

Drupal retains the <span> tags. But when I use the <span></span> tag, Drupal/CKEditor strips the span out every time.