✨ Changelog improvements

Author: SnaveSutit

src/components/changelogDialog.svelte

@@ -1,5 +1,6 @@
 <script lang="ts">
 	import changelog from '../pluginPackage/changelog.json'
+	import AnimatedJavaIcon from '../assets/animated_java_icon.svg'
 
 	function formatDateFull(date: string) {
 		// @ts-expect-error
@@ -40,10 +41,13 @@
 </script>
 
 <div class="content plugin_browser_tabbed_page" id="plugin_browser_changelog">
-	{#each Object.values(changelog) as versions}
-		<h3>
-			{versions.title}
-		</h3>
+	{#each Object.values(changelog).reverse() as versions}
+		<div class="title-container">
+			<img src={AnimatedJavaIcon} alt="" />
+			<h3>
+				{versions.title}
+			</h3>
+		</div>
 		<!-- svelte-ignore a11y-label-has-associated-control -->
 		<label class="plugin_changelog_author">{versions.author}</label>
 		<!-- svelte-ignore a11y-label-has-associated-control -->
@@ -83,4 +87,22 @@
 		border-radius: 3px;
 		font-size: 0.8em;
 	}
+	img {
+		border-radius: 4px;
+		width: 24px;
+		height: 24px;
+		margin-left: 0.5px;
+		box-shadow: 1px 1px 1px #000000aa;
+	}
+	.title-container h3 {
+		margin-left: 8px;
+		margin-top: 0;
+	}
+	.title-container {
+		display: flex;
+		flex-direction: row;
+		justify-content: flex-start;
+		align-items: center;
+		margin-top: 8px;
+	}
 </style>

src/lang/en.yml

@@ -33,7 +33,7 @@ animated_java.dialog.about.title: About Animated Java
 animated_java.dialog.about.close_button: Close
 
 ## Changelog
-animated_java.dialog.changelog_dialog.title: Changelog
+animated_java.dialog.changelog_dialog.title: Animated Java Changelog
 
 ## Unexpected Error Dialog
 animated_java.dialog.unexpected_error.title: An Unexpected Error Occurred!