edit readme

README.md

@@ -1,6 +1,22 @@
 # Group Randomizer
 
-Write something...
+A group randomizer for [Lohit Club](https://www.instagram.com/lohitclub.chula?utm_source=ig_web_button_share_sheet&igsh=ZDNlZDc0MzIxNw==) (Suksa Circles)
+
+## How to use it
+
+1. **Input Format.** This web only accept file in `.xlsx` (excel) format with the following conditions:
+   - There is a sheet named `database` with names of members start from Cell A2 (the first column and second row) until it found an empty cell.
+2. Select the number of groups and days.
+   - The number of groups are mandated to be prime numbers due to Technical conditions.
+   - The number of days are any integer from 1 to (the number of groups - 1). i.e. If the number of group is 13, then the maximum number of days is 12.
+3. Checkboxes have 2 options:
+   - **Download minimal version** - check this to download only the minimal version of the randomized groups. (Does not contain `control` sheet)
+   - **Enable Forbidden Pairs** - check this to add forbidden pairs to the randomized groups. [(See below for more information)](#forbidden-pairs)
+
+## Forbidden Pairs
+
+- It is **not guaranteed** that all of the forbidden pairs will not be in the same group. The algorithm will try to avoid the pairs that are on the top of the forbidden-pairs input list first. (If you do not want person A and B in the same group more than person C and D. Then, put pairs A and B on top of the list.)
+- Forbidden pairs are pairs of members that should not be in the same group.
 
 ## Developing
 

src/components/GroupInformation.svelte

@@ -14,15 +14,15 @@
 		type="number"
 		bind:value={$data_store.length}
 		disabled
-		class="p-2 ml-2 rounded grow"
+		class="p-2 ml-2 rounded grow disabled: bg-gray-100"
 		id="n_member"
 	/>
 	<label class="py-3 text-xl flex font-bold" for="n_group">Number of groups :</label>
 	<select
 		bind:value={group_cnt}
-		class="p-2 ml-2 rounded grow"
-		id="n_group"
 		disabled={!$data_store.length}
+		class="p-2 ml-2 rounded grow disabled: bg-gray-100"
+		id="n_group"
 	>
 		{#each PRIMES as prime}
 			<option value={prime}>{prime}</option>
@@ -35,7 +35,7 @@
 		disabled={!group_cnt}
 		min="1"
 		max={group_cnt - 1}
-		class="p-2 ml-2 rounded grow"
+		class="p-2 ml-2 rounded grow disabled: bg-gray-100"
 		id="n_day"
 	/>
 	<div class="flex justify-between gap-4 items-center">
@@ -46,12 +46,13 @@
 			class="p-2 ml-2 rounded grow mt-1"
 			id="control_sheet"
 		/>
-		<label class="py-3 text-xl flex font-bold" for="control_sheet">Don't generate template</label>
+		<label class="py-3 text-xl flex font-bold" for="control_sheet">Download minimal version</label>
 	</div>
 	<div class="flex justify-between gap-4 items-center">
 		<input
 			type="checkbox"
 			bind:checked={enableForbiddenPairs}
+			disabled={!group_cnt}
 			class="p-2 ml-2 rounded grow mt-1"
 			id="control_sheet"
 		/>