From c0796f1c85edb0a46cab2cbdf7a1e83896d4f54c Mon Sep 17 00:00:00 2001
From: "Jill \"oatmealine\" Monoids" <oatmealine@disroot.org>
Date: Sun, 2 Jan 2022 17:04:11 +0300
Subject: [PATCH] add group icons to sorting menu

---
 src/App.svelte | 12 ++++++++++--
 1 file changed, 10 insertions(+), 2 deletions(-)

diff --git a/src/App.svelte b/src/App.svelte
index 702e4d1..dd0bd1e 100644
--- a/src/App.svelte
+++ b/src/App.svelte
@@ -2,6 +2,8 @@
 	import Panel from './Panel.svelte';
 	import Modfiles from './Modfiles.svelte';
 	import { sort, sortMode, sortingModes, groups, groupsEnabled } from './modfiles';
+	
+	const groupIcons = ['unarchive', 'link'];
 </script>
 
 <style>
@@ -61,6 +63,12 @@
 		color: #000;
     background-position: 0px 0px;
 	}
+	
+	.options button i {
+		display: inline-block;
+		line-height: 1;
+		vertical-align: middle;
+	}
 </style>
 
 <div class="columns">
@@ -86,7 +94,7 @@
 		</div>
 		<b>Include:</b><br>
 		<div class="options">
-			{#each groups as mode, i}<button class:selected={$groupsEnabled[i]} on:click={() => {$groupsEnabled[i] = !$groupsEnabled[i]}}>{mode}</button>{/each}
+			{#each groups as mode, i}<button class:selected={$groupsEnabled[i]} on:click={() => {$groupsEnabled[i] = !$groupsEnabled[i]}}>{#if groupIcons[i]}<i class="material-icons">{groupIcons[i]}</i> {/if}{mode}</button>{/each}
 		</div>
 	</Panel>
-</div>
\ No newline at end of file
+</div>