Mirrors/catppuccin
2
0
Fork 0
mirror of https://github.com/catppuccin/catppuccin synced 2024-11-10 06:04:21 +00:00
Code Issues Projects Releases Packages Wiki Activity

docs(style-guide): spaces > tabs (#2338)

Browse source
This commit is contained in:
Hammy 2024-03-29 04:29:33 +00:00 committed by GitHub
parent 09e9638d7d
commit 034a15835a
No known key found for this signature in database
GPG key ID: B5690EEEBB952194
1 changed files with 450 additions and 450 deletions
Show stats Download patch file Download diff file Expand all files Collapse all files

900
docs/style-guide.md
View file

@ -603,435 +603,435 @@
> defined below.
<table>
<tr>
<td>
<table>
<tr>
<th colspan="3" align="center">
<h4>Language Defaults</h4>
</th>
</tr>
<tr>
<th>Syntax</th>
<th colspan="2">Color</th>
</tr>
<tr>
<td>Keyword</td>
<td>Mauve</td>
<td>
<img src="../assets/palette/circles/latte_mauve.png" height="16" width="16"/>
<img src="../assets/palette/circles/frappe_mauve.png" height="16" width="16"/>
<img src="../assets/palette/circles/macchiato_mauve.png" height="16" width="16"/>
<img src="../assets/palette/circles/mocha_mauve.png" height="16" width="16"/>
</td>
</tr>
<tr>
<td>Strings</td>
<td>Green</td>
<td>
<img src="../assets/palette/circles/latte_green.png" height="16" width="16"/>
<img src="../assets/palette/circles/frappe_green.png" height="16" width="16"/>
<img src="../assets/palette/circles/macchiato_green.png" height="16" width="16"/>
<img src="../assets/palette/circles/mocha_green.png" height="16" width="16"/>
</td>
</tr>
<tr>
<td>
Escape Sequences<br>
Regex
</td>
<td>Pink</td>
<td>
<img src="../assets/palette/circles/latte_pink.png" height="16" width="16"/>
<img src="../assets/palette/circles/frappe_pink.png" height="16" width="16"/>
<img src="../assets/palette/circles/macchiato_pink.png" height="16" width="16"/>
<img src="../assets/palette/circles/mocha_pink.png" height="16" width="16"/>
</td>
</tr>
<tr>
<td>Comments</td>
<td>Overlay 0</td>
<td>
<img src="../assets/palette/circles/latte_overlay0.png" height="16" width="16"/>
<img src="../assets/palette/circles/frappe_overlay0.png" height="16" width="16"/>
<img src="../assets/palette/circles/macchiato_overlay0.png" height="16" width="16"/>
<img src="../assets/palette/circles/mocha_overlay0.png" height="16" width="16"/>
</td>
</tr>
<tr>
<td>Constants, Numbers</td>
<td>Peach</td>
<td>
<img src="../assets/palette/circles/latte_peach.png" height="16" width="16"/>
<img src="../assets/palette/circles/frappe_peach.png" height="16" width="16"/>
<img src="../assets/palette/circles/macchiato_peach.png" height="16" width="16"/>
<img src="../assets/palette/circles/mocha_peach.png" height="16" width="16"/>
</td>
</tr>
<tr>
<td>Operators</td>
<td>Sky</td>
<td>
<img src="../assets/palette/circles/latte_sky.png" height="16" width="16"/>
<img src="../assets/palette/circles/frappe_sky.png" height="16" width="16"/>
<img src="../assets/palette/circles/macchiato_sky.png" height="16" width="16"/>
<img src="../assets/palette/circles/mocha_sky.png" height="16" width="16"/>
</td>
</tr>
<tr>
<td>Braces, Delimiters</td>
<td>Overlay 2</td>
<td>
<img src="../assets/palette/circles/latte_overlay2.png" height="16" width="16"/>
<img src="../assets/palette/circles/frappe_overlay2.png" height="16" width="16"/>
<img src="../assets/palette/circles/macchiato_overlay2.png" height="16" width="16"/>
<img src="../assets/palette/circles/mocha_overlay2.png" height="16" width="16"/>
</td>
</tr>
<tr>
<td>Methods, Functions</td>
<td>Blue</td>
<td>
<img src="../assets/palette/circles/latte_blue.png" height="16" width="16"/>
<img src="../assets/palette/circles/frappe_blue.png" height="16" width="16"/>
<img src="../assets/palette/circles/macchiato_blue.png" height="16" width="16"/>
<img src="../assets/palette/circles/mocha_blue.png" height="16" width="16"/>
</td>
</tr>
<tr>
<td>Parameters</td>
<td>Maroon</td>
<td>
<img src="../assets/palette/circles/latte_maroon.png" height="16" width="16"/>
<img src="../assets/palette/circles/frappe_maroon.png" height="16" width="16"/>
<img src="../assets/palette/circles/macchiato_maroon.png" height="16" width="16"/>
<img src="../assets/palette/circles/mocha_maroon.png" height="16" width="16"/>
</td>
</tr>
<tr>
<td>Builtins</td>
<td>Red</td>
<td>
<img src="../assets/palette/circles/latte_red.png" height="16" width="16"/>
<img src="../assets/palette/circles/frappe_red.png" height="16" width="16"/>
<img src="../assets/palette/circles/macchiato_red.png" height="16" width="16"/>
<img src="../assets/palette/circles/mocha_red.png" height="16" width="16"/>
</td>
</tr>
<tr>
<td>Classes, Metadata</td>
<td>Yellow</td>
<td>
<img src="../assets/palette/circles/latte_yellow.png" height="16" width="16"/>
<img src="../assets/palette/circles/frappe_yellow.png" height="16" width="16"/>
<img src="../assets/palette/circles/macchiato_yellow.png" height="16" width="16"/>
<img src="../assets/palette/circles/mocha_yellow.png" height="16" width="16"/>
</td>
</tr>
<tr>
<td>Enum Variants</td>
<td>Teal</td>
<td>
<img src="../assets/palette/circles/latte_teal.png" height="16" width="16"/>
<img src="../assets/palette/circles/frappe_teal.png" height="16" width="16"/>
<img src="../assets/palette/circles/macchiato_teal.png" height="16" width="16"/>
<img src="../assets/palette/circles/mocha_teal.png" height="16" width="16"/>
</td>
</tr>
</table>
</td>
<td>
<table>
<tr>
<th colspan="3" align="center">
<h4>General</h4>
</th>
</tr>
<tr>
<th>Syntax</th>
<th colspan="2">Color</th>
</tr>
<tr>
<td>Cursor</td>
<td>Rosewater</td>
<td>
<img src="../assets/palette/circles/latte_rosewater.png" height="16" width="16"/>
<img src="../assets/palette/circles/frappe_rosewater.png" height="16" width="16"/>
<img src="../assets/palette/circles/macchiato_rosewater.png" height="16" width="16"/>
<img src="../assets/palette/circles/mocha_rosewater.png" height="16" width="16"/>
</td>
</tr>
<tr>
<td>
Normal Links<br>
Followed Links<br>
On Hover Links
</td>
<td>
Blue<br>
Lavender<br>
Sky
</td>
<td>
<img src="../assets/palette/circles/latte_blue.png" height="16" width="16"/>
<img src="../assets/palette/circles/frappe_blue.png" height="16" width="16"/>
<img src="../assets/palette/circles/macchiato_blue.png" height="16" width="16"/>
<img src="../assets/palette/circles/mocha_blue.png" height="16" width="16"/><br>
<img src="../assets/palette/circles/latte_lavender.png" height="16" width="16"/>
<img src="../assets/palette/circles/frappe_lavender.png" height="16" width="16"/>
<img src="../assets/palette/circles/macchiato_lavender.png" height="16" width="16"/>
<img src="../assets/palette/circles/mocha_lavender.png" height="16" width="16"/><br>
<img src="../assets/palette/circles/latte_sky.png" height="16" width="16"/>
<img src="../assets/palette/circles/frappe_sky.png" height="16" width="16"/>
<img src="../assets/palette/circles/macchiato_sky.png" height="16" width="16"/>
<img src="../assets/palette/circles/mocha_sky.png" height="16" width="16"/>
</td>
</tr>
<tr>
<td>
Search FG<br>
Search BG<br>
Active Search FG<br>
Active Search BG
</td>
<td>
Text<br>
Teal<br>
Text<br>
Red
</td>
<td>
<img src="../assets/palette/circles/latte_text.png" height="16" width="16"/>
<img src="../assets/palette/circles/frappe_text.png" height="16" width="16"/>
<img src="../assets/palette/circles/macchiato_text.png" height="16" width="16"/>
<img src="../assets/palette/circles/mocha_text.png" height="16" width="16"/><br>
<img src="../assets/palette/circles/latte_teal.png" height="16" width="16"/>
<img src="../assets/palette/circles/frappe_teal.png" height="16" width="16"/>
<img src="../assets/palette/circles/macchiato_teal.png" height="16" width="16"/>
<img src="../assets/palette/circles/mocha_teal.png" height="16" width="16"/><br>
<img src="../assets/palette/circles/latte_text.png" height="16" width="16"/>
<img src="../assets/palette/circles/frappe_text.png" height="16" width="16"/>
<img src="../assets/palette/circles/macchiato_text.png" height="16" width="16"/>
<img src="../assets/palette/circles/mocha_text.png" height="16" width="16"/><br>
<img src="../assets/palette/circles/latte_red.png" height="16" width="16"/>
<img src="../assets/palette/circles/frappe_red.png" height="16" width="16"/>
<img src="../assets/palette/circles/macchiato_red.png" height="16" width="16"/>
<img src="../assets/palette/circles/mocha_red.png" height="16" width="16"/>
</td>
</tr>
<tr>
<td>Errors</td>
<td>Red</td>
<td>
<img src="../assets/palette/circles/latte_red.png" height="16" width="16"/>
<img src="../assets/palette/circles/frappe_red.png" height="16" width="16"/>
<img src="../assets/palette/circles/macchiato_red.png" height="16" width="16"/>
<img src="../assets/palette/circles/mocha_red.png" height="16" width="16"/>
</td>
</tr>
<tr>
<td>Warnings</td>
<td>Yellow<br>Peach</td>
<td>
<img src="../assets/palette/circles/latte_yellow.png" height="16" width="16"/>
<img src="../assets/palette/circles/frappe_yellow.png" height="16" width="16"/>
<img src="../assets/palette/circles/macchiato_yellow.png" height="16" width="16"/>
<img src="../assets/palette/circles/mocha_yellow.png" height="16" width="16"/><br>
<img src="../assets/palette/circles/latte_peach.png" height="16" width="16"/>
<img src="../assets/palette/circles/frappe_peach.png" height="16" width="16"/>
<img src="../assets/palette/circles/macchiato_peach.png" height="16" width="16"/>
<img src="../assets/palette/circles/mocha_peach.png" height="16" width="16"/>
</td>
</tr>
<tr>
<td>Information</td>
<td>Teal</td>
<td>
<img src="../assets/palette/circles/latte_teal.png" height="16" width="16"/>
<img src="../assets/palette/circles/frappe_teal.png" height="16" width="16"/>
<img src="../assets/palette/circles/macchiato_teal.png" height="16" width="16"/>
<img src="../assets/palette/circles/mocha_teal.png" height="16" width="16"/>
</td>
</tr>
</table>
</td>
</tr>
<tr>
<td>
<table>
<tr>
<th colspan="3" align="center">
<h4>Language Defaults</h4>
</th>
</tr>
<tr>
<th>Syntax</th>
<th colspan="2">Color</th>
</tr>
<tr>
<td>Keyword</td>
<td>Mauve</td>
<td>
<img src="../assets/palette/circles/latte_mauve.png" height="16" width="16"/>
<img src="../assets/palette/circles/frappe_mauve.png" height="16" width="16"/>
<img src="../assets/palette/circles/macchiato_mauve.png" height="16" width="16"/>
<img src="../assets/palette/circles/mocha_mauve.png" height="16" width="16"/>
</td>
</tr>
<tr>
<td>Strings</td>
<td>Green</td>
<td>
<img src="../assets/palette/circles/latte_green.png" height="16" width="16"/>
<img src="../assets/palette/circles/frappe_green.png" height="16" width="16"/>
<img src="../assets/palette/circles/macchiato_green.png" height="16" width="16"/>
<img src="../assets/palette/circles/mocha_green.png" height="16" width="16"/>
</td>
</tr>
<tr>
<td>
Escape Sequences<br>
Regex
</td>
<td>Pink</td>
<td>
<img src="../assets/palette/circles/latte_pink.png" height="16" width="16"/>
<img src="../assets/palette/circles/frappe_pink.png" height="16" width="16"/>
<img src="../assets/palette/circles/macchiato_pink.png" height="16" width="16"/>
<img src="../assets/palette/circles/mocha_pink.png" height="16" width="16"/>
</td>
</tr>
<tr>
<td>Comments</td>
<td>Overlay 0</td>
<td>
<img src="../assets/palette/circles/latte_overlay0.png" height="16" width="16"/>
<img src="../assets/palette/circles/frappe_overlay0.png" height="16" width="16"/>
<img src="../assets/palette/circles/macchiato_overlay0.png" height="16" width="16"/>
<img src="../assets/palette/circles/mocha_overlay0.png" height="16" width="16"/>
</td>
</tr>
<tr>
<td>Constants, Numbers</td>
<td>Peach</td>
<td>
<img src="../assets/palette/circles/latte_peach.png" height="16" width="16"/>
<img src="../assets/palette/circles/frappe_peach.png" height="16" width="16"/>
<img src="../assets/palette/circles/macchiato_peach.png" height="16" width="16"/>
<img src="../assets/palette/circles/mocha_peach.png" height="16" width="16"/>
</td>
</tr>
<tr>
<td>Operators</td>
<td>Sky</td>
<td>
<img src="../assets/palette/circles/latte_sky.png" height="16" width="16"/>
<img src="../assets/palette/circles/frappe_sky.png" height="16" width="16"/>
<img src="../assets/palette/circles/macchiato_sky.png" height="16" width="16"/>
<img src="../assets/palette/circles/mocha_sky.png" height="16" width="16"/>
</td>
</tr>
<tr>
<td>Braces, Delimiters</td>
<td>Overlay 2</td>
<td>
<img src="../assets/palette/circles/latte_overlay2.png" height="16" width="16"/>
<img src="../assets/palette/circles/frappe_overlay2.png" height="16" width="16"/>
<img src="../assets/palette/circles/macchiato_overlay2.png" height="16" width="16"/>
<img src="../assets/palette/circles/mocha_overlay2.png" height="16" width="16"/>
</td>
</tr>
<tr>
<td>Methods, Functions</td>
<td>Blue</td>
<td>
<img src="../assets/palette/circles/latte_blue.png" height="16" width="16"/>
<img src="../assets/palette/circles/frappe_blue.png" height="16" width="16"/>
<img src="../assets/palette/circles/macchiato_blue.png" height="16" width="16"/>
<img src="../assets/palette/circles/mocha_blue.png" height="16" width="16"/>
</td>
</tr>
<tr>
<td>Parameters</td>
<td>Maroon</td>
<td>
<img src="../assets/palette/circles/latte_maroon.png" height="16" width="16"/>
<img src="../assets/palette/circles/frappe_maroon.png" height="16" width="16"/>
<img src="../assets/palette/circles/macchiato_maroon.png" height="16" width="16"/>
<img src="../assets/palette/circles/mocha_maroon.png" height="16" width="16"/>
</td>
</tr>
<tr>
<td>Builtins</td>
<td>Red</td>
<td>
<img src="../assets/palette/circles/latte_red.png" height="16" width="16"/>
<img src="../assets/palette/circles/frappe_red.png" height="16" width="16"/>
<img src="../assets/palette/circles/macchiato_red.png" height="16" width="16"/>
<img src="../assets/palette/circles/mocha_red.png" height="16" width="16"/>
</td>
</tr>
<tr>
<td>Classes, Metadata</td>
<td>Yellow</td>
<td>
<img src="../assets/palette/circles/latte_yellow.png" height="16" width="16"/>
<img src="../assets/palette/circles/frappe_yellow.png" height="16" width="16"/>
<img src="../assets/palette/circles/macchiato_yellow.png" height="16" width="16"/>
<img src="../assets/palette/circles/mocha_yellow.png" height="16" width="16"/>
</td>
</tr>
<tr>
<td>Enum Variants</td>
<td>Teal</td>
<td>
<img src="../assets/palette/circles/latte_teal.png" height="16" width="16"/>
<img src="../assets/palette/circles/frappe_teal.png" height="16" width="16"/>
<img src="../assets/palette/circles/macchiato_teal.png" height="16" width="16"/>
<img src="../assets/palette/circles/mocha_teal.png" height="16" width="16"/>
</td>
</tr>
</table>
</td>
<td>
<table>
<tr>
<th colspan="3" align="center">
<h4>General</h4>
</th>
</tr>
<tr>
<th>Syntax</th>
<th colspan="2">Color</th>
</tr>
<tr>
<td>Cursor</td>
<td>Rosewater</td>
<td>
<img src="../assets/palette/circles/latte_rosewater.png" height="16" width="16"/>
<img src="../assets/palette/circles/frappe_rosewater.png" height="16" width="16"/>
<img src="../assets/palette/circles/macchiato_rosewater.png" height="16" width="16"/>
<img src="../assets/palette/circles/mocha_rosewater.png" height="16" width="16"/>
</td>
</tr>
<tr>
<td>
Normal Links<br>
Followed Links<br>
On Hover Links
</td>
<td>
Blue<br>
Lavender<br>
Sky
</td>
<td>
<img src="../assets/palette/circles/latte_blue.png" height="16" width="16"/>
<img src="../assets/palette/circles/frappe_blue.png" height="16" width="16"/>
<img src="../assets/palette/circles/macchiato_blue.png" height="16" width="16"/>
<img src="../assets/palette/circles/mocha_blue.png" height="16" width="16"/><br>
<img src="../assets/palette/circles/latte_lavender.png" height="16" width="16"/>
<img src="../assets/palette/circles/frappe_lavender.png" height="16" width="16"/>
<img src="../assets/palette/circles/macchiato_lavender.png" height="16" width="16"/>
<img src="../assets/palette/circles/mocha_lavender.png" height="16" width="16"/><br>
<img src="../assets/palette/circles/latte_sky.png" height="16" width="16"/>
<img src="../assets/palette/circles/frappe_sky.png" height="16" width="16"/>
<img src="../assets/palette/circles/macchiato_sky.png" height="16" width="16"/>
<img src="../assets/palette/circles/mocha_sky.png" height="16" width="16"/>
</td>
</tr>
<tr>
<td>
Search FG<br>
Search BG<br>
Active Search FG<br>
Active Search BG
</td>
<td>
Text<br>
Teal<br>
Text<br>
Red
</td>
<td>
<img src="../assets/palette/circles/latte_text.png" height="16" width="16"/>
<img src="../assets/palette/circles/frappe_text.png" height="16" width="16"/>
<img src="../assets/palette/circles/macchiato_text.png" height="16" width="16"/>
<img src="../assets/palette/circles/mocha_text.png" height="16" width="16"/><br>
<img src="../assets/palette/circles/latte_teal.png" height="16" width="16"/>
<img src="../assets/palette/circles/frappe_teal.png" height="16" width="16"/>
<img src="../assets/palette/circles/macchiato_teal.png" height="16" width="16"/>
<img src="../assets/palette/circles/mocha_teal.png" height="16" width="16"/><br>
<img src="../assets/palette/circles/latte_text.png" height="16" width="16"/>
<img src="../assets/palette/circles/frappe_text.png" height="16" width="16"/>
<img src="../assets/palette/circles/macchiato_text.png" height="16" width="16"/>
<img src="../assets/palette/circles/mocha_text.png" height="16" width="16"/><br>
<img src="../assets/palette/circles/latte_red.png" height="16" width="16"/>
<img src="../assets/palette/circles/frappe_red.png" height="16" width="16"/>
<img src="../assets/palette/circles/macchiato_red.png" height="16" width="16"/>
<img src="../assets/palette/circles/mocha_red.png" height="16" width="16"/>
</td>
</tr>
<tr>
<td>Errors</td>
<td>Red</td>
<td>
<img src="../assets/palette/circles/latte_red.png" height="16" width="16"/>
<img src="../assets/palette/circles/frappe_red.png" height="16" width="16"/>
<img src="../assets/palette/circles/macchiato_red.png" height="16" width="16"/>
<img src="../assets/palette/circles/mocha_red.png" height="16" width="16"/>
</td>
</tr>
<tr>
<td>Warnings</td>
<td>Yellow<br>Peach</td>
<td>
<img src="../assets/palette/circles/latte_yellow.png" height="16" width="16"/>
<img src="../assets/palette/circles/frappe_yellow.png" height="16" width="16"/>
<img src="../assets/palette/circles/macchiato_yellow.png" height="16" width="16"/>
<img src="../assets/palette/circles/mocha_yellow.png" height="16" width="16"/><br>
<img src="../assets/palette/circles/latte_peach.png" height="16" width="16"/>
<img src="../assets/palette/circles/frappe_peach.png" height="16" width="16"/>
<img src="../assets/palette/circles/macchiato_peach.png" height="16" width="16"/>
<img src="../assets/palette/circles/mocha_peach.png" height="16" width="16"/>
</td>
</tr>
<tr>
<td>Information</td>
<td>Teal</td>
<td>
<img src="../assets/palette/circles/latte_teal.png" height="16" width="16"/>
<img src="../assets/palette/circles/frappe_teal.png" height="16" width="16"/>
<img src="../assets/palette/circles/macchiato_teal.png" height="16" width="16"/>
<img src="../assets/palette/circles/mocha_teal.png" height="16" width="16"/>
</td>
</tr>
</table>
</td>
</tr>
</table>
<table>
<tr>
<td>
<table>
<tr>
<th colspan="3" align="center">
<h4>
<tr>
<td>
<table>
<tr>
<th colspan="3" align="center">
<h4>
Rainbow Highlights<br>
(Brackets, Headings, etc.)
</h4>
</th>
</tr>
<tr>
<th>Syntax</th>
<th colspan="2">Color</th>
</tr>
<tr>
<td>Color #1</td>
<td>Red</td>
<td>
<img src="../assets/palette/circles/latte_red.png" height="16" width="16"/>
<img src="../assets/palette/circles/frappe_red.png" height="16" width="16"/>
<img src="../assets/palette/circles/macchiato_red.png" height="16" width="16"/>
<img src="../assets/palette/circles/mocha_red.png" height="16" width="16"/>
</td>
</tr>
<tr>
<td>Color #2</td>
<td>Peach</td>
<td>
<img src="../assets/palette/circles/latte_peach.png" height="16" width="16"/>
<img src="../assets/palette/circles/frappe_peach.png" height="16" width="16"/>
<img src="../assets/palette/circles/macchiato_peach.png" height="16" width="16"/>
<img src="../assets/palette/circles/mocha_peach.png" height="16" width="16"/>
</td>
</tr>
<tr>
<td>Color #3</td>
<td>Yellow</td>
<td>
<img src="../assets/palette/circles/latte_yellow.png" height="16" width="16"/>
<img src="../assets/palette/circles/frappe_yellow.png" height="16" width="16"/>
<img src="../assets/palette/circles/macchiato_yellow.png" height="16" width="16"/>
<img src="../assets/palette/circles/mocha_yellow.png" height="16" width="16"/>
</td>
</tr>
<tr>
<td>Color #4</td>
<td>Green</td>
<td>
<img src="../assets/palette/circles/latte_green.png" height="16" width="16"/>
<img src="../assets/palette/circles/frappe_green.png" height="16" width="16"/>
<img src="../assets/palette/circles/macchiato_green.png" height="16" width="16"/>
<img src="../assets/palette/circles/mocha_green.png" height="16" width="16"/>
</td>
</tr>
<tr>
<td>Color #5</td>
<td>Sapphire</td>
<td>
<img src="../assets/palette/circles/latte_sapphire.png" height="16" width="16"/>
<img src="../assets/palette/circles/frappe_sapphire.png" height="16" width="16"/>
<img src="../assets/palette/circles/macchiato_sapphire.png" height="16" width="16"/>
<img src="../assets/palette/circles/mocha_sapphire.png" height="16" width="16"/>
</td>
</tr>
</th>
</tr>
<tr>
<td>Color #6</td>
<td>Lavender</td>
<td>
<img src="../assets/palette/circles/latte_lavender.png" height="16" width="16"/>
<img src="../assets/palette/circles/frappe_lavender.png" height="16" width="16"/>
<img src="../assets/palette/circles/macchiato_lavender.png" height="16" width="16"/>
<img src="../assets/palette/circles/mocha_lavender.png" height="16" width="16"/>
</td>
</tr>
</table>
</td>
<td>
<table>
<tr>
<th colspan="3" align="center">
<h4>Rainbow Parameters &<br/> Local Variables</h4>
</th>
</tr>
<tr>
<th>Syntax</th>
<th colspan="2">Color</th>
</tr>
<tr>
<td>Color #1</td>
<td>60% Text/Red Mix</td>
<td>
<th>Syntax</th>
<th colspan="2">Color</th>
</tr>
<tr>
<td>Color #1</td>
<td>Red</td>
<td>
<img src="../assets/palette/circles/latte_red.png" height="16" width="16"/>
<img src="../assets/palette/circles/frappe_red.png" height="16" width="16"/>
<img src="../assets/palette/circles/macchiato_red.png" height="16" width="16"/>
<img src="../assets/palette/circles/mocha_red.png" height="16" width="16"/>
</td>
</tr>
<tr>
<td>Color #2</td>
<td>Peach</td>
<td>
<img src="../assets/palette/circles/latte_peach.png" height="16" width="16"/>
<img src="../assets/palette/circles/frappe_peach.png" height="16" width="16"/>
<img src="../assets/palette/circles/macchiato_peach.png" height="16" width="16"/>
<img src="../assets/palette/circles/mocha_peach.png" height="16" width="16"/>
</td>
</tr>
<tr>
<td>Color #3</td>
<td>Yellow</td>
<td>
<img src="../assets/palette/circles/latte_yellow.png" height="16" width="16"/>
<img src="../assets/palette/circles/frappe_yellow.png" height="16" width="16"/>
<img src="../assets/palette/circles/macchiato_yellow.png" height="16" width="16"/>
<img src="../assets/palette/circles/mocha_yellow.png" height="16" width="16"/>
</td>
</tr>
<tr>
<td>Color #4</td>
<td>Green</td>
<td>
<img src="../assets/palette/circles/latte_green.png" height="16" width="16"/>
<img src="../assets/palette/circles/frappe_green.png" height="16" width="16"/>
<img src="../assets/palette/circles/macchiato_green.png" height="16" width="16"/>
<img src="../assets/palette/circles/mocha_green.png" height="16" width="16"/>
</td>
</tr>
<tr>
<td>Color #5</td>
<td>Sapphire</td>
<td>
<img src="../assets/palette/circles/latte_sapphire.png" height="16" width="16"/>
<img src="../assets/palette/circles/frappe_sapphire.png" height="16" width="16"/>
<img src="../assets/palette/circles/macchiato_sapphire.png" height="16" width="16"/>
<img src="../assets/palette/circles/mocha_sapphire.png" height="16" width="16"/>
</td>
</tr>
<tr>
<td>Color #6</td>
<td>Lavender</td>
<td>
<img src="../assets/palette/circles/latte_lavender.png" height="16" width="16"/>
<img src="../assets/palette/circles/frappe_lavender.png" height="16" width="16"/>
<img src="../assets/palette/circles/macchiato_lavender.png" height="16" width="16"/>
<img src="../assets/palette/circles/mocha_lavender.png" height="16" width="16"/>
</td>
</tr>
</table>
</td>
<td>
<table>
<tr>
<th colspan="3" align="center">
<h4>Rainbow Parameters &<br/> Local Variables</h4>
</th>
</tr>
<tr>
<th>Syntax</th>
<th colspan="2">Color</th>
</tr>
<tr>
<td>Color #1</td>
<td>60% Text/Red Mix</td>
<td>
<img src="../assets/palette/circles/semantic/latte_semantic_red.png" height="16" width="16"/>
<img src="../assets/palette/circles/semantic/frappe_semantic_red.png" height="16" width="16"/>
<img src="../assets/palette/circles/semantic/macchiato_semantic_red.png" height="16" width="16"/>
<img src="../assets/palette/circles/semantic/mocha_semantic_red.png" height="16" width="16"/>
<img src="../assets/palette/circles/semantic/frappe_semantic_red.png" height="16" width="16"/>
<img src="../assets/palette/circles/semantic/macchiato_semantic_red.png" height="16" width="16"/>
<img src="../assets/palette/circles/semantic/mocha_semantic_red.png" height="16" width="16"/>
</td>
</tr>
<tr>
<td>Color #2</td>
<td>60% Text/Yellow Mix</td>
<td>
<img src="../assets/palette/circles/semantic/latte_semantic_yellow.png" height="16" width="16"/>
<img src="../assets/palette/circles/semantic/frappe_semantic_yellow.png" height="16" width="16"/>
<img src="../assets/palette/circles/semantic/macchiato_semantic_yellow.png" height="16" width="16"/>
<img src="../assets/palette/circles/semantic/mocha_semantic_yellow.png" height="16" width="16"/>
</td>
</tr>
<tr>
<td>Color #3</td>
<td>60% Text/Green Mix</td>
<td>
<img src="../assets/palette/circles/semantic/latte_semantic_green.png" height="16" width="16"/>
<img src="../assets/palette/circles/semantic/frappe_semantic_green.png" height="16" width="16"/>
<img src="../assets/palette/circles/semantic/macchiato_semantic_green.png" height="16" width="16"/>
<img src="../assets/palette/circles/semantic/mocha_semantic_green.png" height="16" width="16"/>
</td>
</tr>
</tr>
<tr>
<td>Color #4</td>
<td>60% Text/Teal Mix</td>
<td>
<td>Color #2</td>
<td>60% Text/Yellow Mix</td>
<td>
<img src="../assets/palette/circles/semantic/latte_semantic_yellow.png" height="16" width="16"/>
<img src="../assets/palette/circles/semantic/frappe_semantic_yellow.png" height="16" width="16"/>
<img src="../assets/palette/circles/semantic/macchiato_semantic_yellow.png" height="16" width="16"/>
<img src="../assets/palette/circles/semantic/mocha_semantic_yellow.png" height="16" width="16"/>
</td>
</tr>
<tr>
<td>Color #3</td>
<td>60% Text/Green Mix</td>
<td>
<img src="../assets/palette/circles/semantic/latte_semantic_green.png" height="16" width="16"/>
<img src="../assets/palette/circles/semantic/frappe_semantic_green.png" height="16" width="16"/>
<img src="../assets/palette/circles/semantic/macchiato_semantic_green.png" height="16" width="16"/>
<img src="../assets/palette/circles/semantic/mocha_semantic_green.png" height="16" width="16"/>
</td>
</tr>
<tr>
<td>Color #4</td>
<td>60% Text/Teal Mix</td>
<td>
<img src="../assets/palette/circles/semantic/latte_semantic_teal.png" height="16" width="16"/>
<img src="../assets/palette/circles/semantic/frappe_semantic_teal.png" height="16" width="16"/>
<img src="../assets/palette/circles/semantic/macchiato_semantic_teal.png" height="16" width="16"/>
<img src="../assets/palette/circles/semantic/mocha_semantic_teal.png" height="16" width="16"/>
<img src="../assets/palette/circles/semantic/frappe_semantic_teal.png" height="16" width="16"/>
<img src="../assets/palette/circles/semantic/macchiato_semantic_teal.png" height="16" width="16"/>
<img src="../assets/palette/circles/semantic/mocha_semantic_teal.png" height="16" width="16"/>
</td>
</tr>
<tr>
<td>Color #5</td>
<td>60% Text/Blue Mix</td>
<td>
</tr>
<tr>
<td>Color #5</td>
<td>60% Text/Blue Mix</td>
<td>
<img src="../assets/palette/circles/semantic/latte_semantic_blue.png" height="16" width="16"/>
<img src="../assets/palette/circles/semantic/frappe_semantic_blue.png" height="16" width="16"/>
<img src="../assets/palette/circles/semantic/macchiato_semantic_blue.png" height="16" width="16"/>
<img src="../assets/palette/circles/semantic/mocha_semantic_blue.png" height="16" width="16"/>
<img src="../assets/palette/circles/semantic/frappe_semantic_blue.png" height="16" width="16"/>
<img src="../assets/palette/circles/semantic/macchiato_semantic_blue.png" height="16" width="16"/>
<img src="../assets/palette/circles/semantic/mocha_semantic_blue.png" height="16" width="16"/>
</td>
</tr>
<tr>
<td>Color #6</td>
<td>60% Text/Mauve Mix</td>
<td>
</tr>
<tr>
<td>Color #6</td>
<td>60% Text/Mauve Mix</td>
<td>
<img src="../assets/palette/circles/semantic/latte_semantic_mauve.png" height="16" width="16"/>
<img src="../assets/palette/circles/semantic/frappe_semantic_mauve.png" height="16" width="16"/>
<img src="../assets/palette/circles/semantic/macchiato_semantic_mauve.png" height="16" width="16"/>
<img src="../assets/palette/circles/semantic/mocha_semantic_mauve.png" height="16" width="16"/>
<img src="../assets/palette/circles/semantic/frappe_semantic_mauve.png" height="16" width="16"/>
<img src="../assets/palette/circles/semantic/macchiato_semantic_mauve.png" height="16" width="16"/>
<img src="../assets/palette/circles/semantic/mocha_semantic_mauve.png" height="16" width="16"/>
</td>
</tr>
</table>
</td>
</tr>
</tr>
</table>
</td>
</tr>
</table>
<table>
<tr>
<th colspan="3" align="center">
<h4>Diff & Merge</h4>
</th>
</tr>
<tr>
<th>Function</th>
<th colspan="2">Color</th>
</tr>
<tr>
<td>
<tr>
<th colspan="3" align="center">
<h4>Diff & Merge</h4>
</th>
</tr>
<tr>
<th>Function</th>
<th colspan="2">Color</th>
</tr>
<tr>
<td>
Changed Text BG<br>
Changed Line BG
</td>
<td>
<td>
Blue <strong>(10% - 20% Opacity)</strong><br>
Blue <strong>(15% - 25% Opacity)</strong>
</td>
<td>
<td>
<img src="../assets/palette/circles/latte_blue.png" height="16" width="16"/>
<img src="../assets/palette/circles/frappe_blue.png" height="16" width="16"/>
<img src="../assets/palette/circles/macchiato_blue.png" height="16" width="16"/>
@ -1040,18 +1040,18 @@
<img src="../assets/palette/circles/frappe_blue.png" height="16" width="16"/>
<img src="../assets/palette/circles/macchiato_blue.png" height="16" width="16"/>
<img src="../assets/palette/circles/mocha_blue.png" height="16" width="16"/>
</td>
</tr>
</td>
</tr>
<tr>
<td>
<td>
Inserted Text BG<br>
Inserted Line BG
</td>
<td>
<td>
Green <strong>(10% - 20% Opacity)</strong><br>
Green <strong>(15% - 25% Opacity)</strong>
</td>
<td>
<td>
<img src="../assets/palette/circles/latte_green.png" height="16" width="16"/>
<img src="../assets/palette/circles/frappe_green.png" height="16" width="16"/>
<img src="../assets/palette/circles/macchiato_green.png" height="16" width="16"/>
@ -1060,18 +1060,18 @@
<img src="../assets/palette/circles/frappe_green.png" height="16" width="16"/>
<img src="../assets/palette/circles/macchiato_green.png" height="16" width="16"/>
<img src="../assets/palette/circles/mocha_green.png" height="16" width="16"/>
</td>
</tr>
</td>
</tr>
<tr>
<td>
<td>
Removed Text BG<br>
Removed Line BG
</td>
<td>
<td>
Red <strong>(10% - 20% Opacity)</strong><br>
Red <strong>(15% - 25% Opacity)</strong>
</td>
<td>
<td>
<img src="../assets/palette/circles/latte_red.png" height="16" width="16"/>
<img src="../assets/palette/circles/frappe_red.png" height="16" width="16"/>
<img src="../assets/palette/circles/macchiato_red.png" height="16" width="16"/>
@ -1080,44 +1080,44 @@
<img src="../assets/palette/circles/frappe_red.png" height="16" width="16"/>
<img src="../assets/palette/circles/macchiato_red.png" height="16" width="16"/>
<img src="../assets/palette/circles/mocha_red.png" height="16" width="16"/>
</td>
</tr>
</td>
</tr>
</table>
<table>
<tr>
<th colspan="3" align="center">
<h4>Debugging</h4>
</th>
</tr>
<tr>
<th>Function</th>
<th colspan="2">Color</th>
</tr>
<tr>
<td>Breakpoint Icon</td>
<td>Red</td>
<td>
<img src="../assets/palette/circles/latte_red.png" height="16" width="16"/>
<img src="../assets/palette/circles/frappe_red.png" height="16" width="16"/>
<img src="../assets/palette/circles/macchiato_red.png" height="16" width="16"/>
<img src="../assets/palette/circles/mocha_red.png" height="16" width="16"/>
</td>
</tr>
<tr>
<td>Breakpoint Line</td>
<td>Transparent</td>
<td>--------------</td>
</tr>
<tr>
<td>Breakpoint Line During Execution</td>
<td>Yellow<br><strong>15% Opacity</strong></td>
<td>
<img src="../assets/palette/circles/latte_yellow.png" height="16" width="16"/>
<img src="../assets/palette/circles/frappe_yellow.png" height="16" width="16"/>
<img src="../assets/palette/circles/macchiato_yellow.png" height="16" width="16"/>
<img src="../assets/palette/circles/mocha_yellow.png" height="16" width="16"/>
</td>
</tr>
<tr>
<th colspan="3" align="center">
<h4>Debugging</h4>
</th>
</tr>
<tr>
<th>Function</th>
<th colspan="2">Color</th>
</tr>
<tr>
<td>Breakpoint Icon</td>
<td>Red</td>
<td>
<img src="../assets/palette/circles/latte_red.png" height="16" width="16"/>
<img src="../assets/palette/circles/frappe_red.png" height="16" width="16"/>
<img src="../assets/palette/circles/macchiato_red.png" height="16" width="16"/>
<img src="../assets/palette/circles/mocha_red.png" height="16" width="16"/>
</td>
</tr>
<tr>
<td>Breakpoint Line</td>
<td>Transparent</td>
<td>--------------</td>
</tr>
<tr>
<td>Breakpoint Line During Execution</td>
<td>Yellow<br><strong>15% Opacity</strong></td>
<td>
<img src="../assets/palette/circles/latte_yellow.png" height="16" width="16"/>
<img src="../assets/palette/circles/frappe_yellow.png" height="16" width="16"/>
<img src="../assets/palette/circles/macchiato_yellow.png" height="16" width="16"/>
<img src="../assets/palette/circles/mocha_yellow.png" height="16" width="16"/>
</td>
</tr>
</table>