remove exchange button

custom/script.js

@@ -37,22 +37,28 @@ $(document).ready(function(){
 		}
 	});
 
-	// click button remake
-	$("#btn-remake").click(function(){
+	// change input-lyric
+	$("#input-lyric").on("input", function(){
 		var input = $("#input-lyric").val();
-		if(input != "") {
-			var output = handleRemakeLyric(input);
+		var output = handleRemakeLyric(input);
 
-			setTimeout(function(){
-				$("#output-lyric").val(output);
-			}, 200);
+		setTimeout(function(){
+			$("#output-lyric").val(output);
+		}, 200);
+	});
 
-			toastr.success('Remake done');
-		}else{
-			toastr.error('Input is null');
+	// scroll input-lyric
+	$("#input-lyric").on("scroll", function(){
+		if($("#sync-chk").is(":checked")){
+			syncScroll();
 		}
 	});
 
+	// click sync checkbox
+	$("#sync-chk").click(function(){
+		syncScroll();
+	});
+
 	function handleRemakeLyric(input) {
 		var lines = input.split('\n');
 		var realLength = lines.length;
@@ -114,4 +120,9 @@ $(document).ready(function(){
 		}
 		return strVal.substring(0, strVal.length - 1);
 	}
+
+	function syncScroll() {
+		var scrollPos = $("#input-lyric").scrollTop();
+		$("#output-lyric").scrollTop(scrollPos);
+	}
 });

index.html

@@ -29,9 +29,6 @@ <h5 class="title is-5 mt-4">
 				</div>
 
 				<div class="column is-1">
-					<button id="btn-remake" class="button is-info mb-3">
-						<i class="fa-solid fa-arrows-rotate"></i>
-					</button>
 					<button id="btn-copy" class="button is-success mb-3">
 						<i class="fa-regular fa-copy"></i>
 					</button><br>
@@ -41,6 +38,7 @@ <h5 class="title is-5 mt-4">
 					<button id="btn-clear-output" class="button is-danger mb-5">
 						<i class="fa-solid fa-delete-left" style="transform: rotate(180deg);"></i>
 					</button>
+					<input id="sync-chk" type="checkbox" checked> Sync
 				</div>
 
 				<div class="column is-5">
@@ -50,7 +48,7 @@ <h5 class="title is-5 mt-4">
 
 			<!-- footer -->
 			<div>
-				<small>&copy; 2023 by DuyNLK</small>
+				<small>&copy; 2023 by <b>DuyNLK</b></small>
 			</div>
 		</div>
 	</body>

readme.md

@@ -3,10 +3,10 @@ Make the smooth lyrics for website https://vangson.info
 
 #### Button List:
 
-![arrows-rotate](img/arrows-rotate.svg) - Action to remake
+1. ![acopy](img/copy.svg) - Copy output to clipboard
 
-![acopy](img/copy.svg) - Copy output to clipboard
+2. ![delete-left](img/delete-left.svg) - Empty input/output
 
-![delete-left](img/delete-left.svg) - Empty input/output
+3. "Sync" checkbox: Sync scroll position of input/output
 
 ![capture](capture.png)