<commit_before># XSL Transformation 

## Install:

Add the code from [snippet-icon.xsl](snippet-icon.xsl) to your XSL or add this file and link to it with this code:

`<xsl:import href="snippet-icon.xsl"/>`

## Why use a transformation

The final code looks something like this: `<i class="material-icons xl gold">account_balance_wallet</i>`. The WYSIWYG editor does not do well with `div`s especially when trying to add content before or after. Many times the mouse click will click inside of the div and this content will not be displayed.

## Why an Image?

The original idea was a table transformation but a table is a block element and by using an image, users can add icons as inline elements. This also allows the end user the ability to modify the icon after the image has been added:

![Insert/Edit Image][edit-image.jpg]

* ** Source ** - placeholder image
* ** Description ** - icon name
* ** Class ** - material-icons will be in all icons, then the size and color can be modified from here.<commit_msg>fix image url.<commit_after># XSL Transformation 

## Install:

Add the code from [snippet-icon.xsl](snippet-icon.xsl) to your XSL or add this file and link to it with this code:

`<xsl:import href="snippet-icon.xsl"/>`

## Why use a transformation

The final code looks something like this: `<i class="material-icons xl gold">account_balance_wallet</i>`. The WYSIWYG editor does not do well with `div`s especially when trying to add content before or after. Many times the mouse click will click inside of the div and this content will not be displayed.

## Why an Image?

The original idea was a table transformation but a table is a block element and by using an image, users can add icons as inline elements. This also allows the end user the ability to modify the icon after the image has been added:

![Insert/Edit Image][https://raw.githubusercontent.com/jessgusclark/gadget-material-icons/master/xsl/edit-image.jpg]

* ** Source ** - placeholder image
* ** Description ** - icon name
* ** Class ** - material-icons will be in all icons, then the size and color can be modified from here.
{'fraction_non_alphanumeric': 0.08297771455666192, 'fraction_numerical': 0.0, 'mean_word_length': 4.261845386533666, 'pattern_counts': {'":': 0, '<': 9, '<?xml version=': 0, '>': 9, 'https://': 1, 'lorem ipsum': 0, 'www.': 0, 'xml': 0}, 'pii_count': 0, 'substrings_counts': 0, 'word_list_counts': {'cursed_substrings.json': 0, 'profanity_word_list.json': 0, 'sexual_word_list.json': 0, 'zh_pornsignals.json': 0}}
{'dir': 'git-commits-cleaned', 'id': '6148740', 'n_tokens_mistral': 583, 'n_tokens_neox': 569, 'n_words': 297}