diff --git a/Changelog.ma b/.archive/Changelog.md
similarity index 83%
rename from Changelog.ma
rename to .archive/Changelog.md
index 4783f93..875b0f6 100644
--- a/Changelog.ma
+++ b/.archive/Changelog.md
@@ -4,8 +4,10 @@ Date: 08/12/2022 - 1h
 
 Fr_Dae
 
-    - Modification du fichier CSS BuildComponent & ChangeComponent
-    - Ajout du changelog.ma
+    - Modification of the CSS BuildComponent file (value version_number, )
+	- Modification of the CSS ChangeComponent file (value pr_number)
+    - Add changelog.ma
+	- add classNameIcon which allows to change the colour of an icon
     
 ------------------------------------------------------
 Version 1.1.0
diff --git a/components/changelog/ChangeComponent.tsx b/components/changelog/ChangeComponent.tsx
index d3ed9a0..f5476df 100644
--- a/components/changelog/ChangeComponent.tsx
+++ b/components/changelog/ChangeComponent.tsx
@@ -8,21 +8,35 @@ const ChangeComponent = (props: Change) => {
         <li className={'py-3 sm:py-4'}>
             <div className={'flex items-center space-x-4'}>
                 <div className={'shrink-0'}>
-                    <FontAwesomeIcon className={'text-xl'} icon={determineIcon(category)}></FontAwesomeIcon>
+                    <FontAwesomeIcon className={`text-xl ${determineClassNameIcon(category)}`} icon={determineIcon(category)}></FontAwesomeIcon>
                 </div>
                 <div className={'min-w-0 flex-1'}>
                     <p className={'text-sm font-medium text-white-900'}>
                         {description}
                     </p>
                     <p className="text-sm text-gray-400">
-                        contributed by <a href={author_url} className={'text-gray-400 hover:text-gray-500 hover:underline'}>{author_username}</a> in <a href={pr_url} className={'text-gray-400 hover:text-gray-500 hover:underline'}>PR #{pr_number}</a>
+                        contributed by <a href={author_url} className={'text-gray-400 hover:text-gray-500 hover:underline'}>{author_username}</a> 
+                        in <a href={pr_url} className={'text-blue-500 hover:text-purple-500 hover:underline'}>PR #{pr_number}</a>
                     </p>
                 </div>
             </div>
         </li>
     )
 }
-
+const determineClassNameIcon = (category: string) => {
+    switch (category) {
+        case 'NEW':
+            return 'text-green-500';
+        case 'FIX':
+            return 'text-orange-600';
+        case 'IMPROVEMENT':
+            return 'text-blue-600';
+        case 'balance':
+            return 'yellow-200';
+        default:
+            return 'text-white';
+    }
+}
 const determineIcon = (category: string) => {
     switch (category) {
         case 'NEW':
@@ -37,10 +51,4 @@ const determineIcon = (category: string) => {
             return faQuestion;
     }
 }
-/* 
-NEW 		text-green-500
-FIX 		text-red-500
-IMPROVEMENT text-blue-600
-balance 	yellow-200
-*/
 export default ChangeComponent;
diff --git a/components/changelog/buildComponent.tsx b/components/changelog/buildComponent.tsx
index 77feeb7..f1fcaf8 100644
--- a/components/changelog/buildComponent.tsx
+++ b/components/changelog/buildComponent.tsx
@@ -27,7 +27,7 @@ const BuildComponent = (props: Build) => {
             <li className={'py-3 sm:py-4'}>
                 <div className={'flex items-center space-x-4'}>
                     <div className={'shrink-0'}>
-
+                        
                     </div>
                     <div className={'min-w-fit flex-1'}>
                         <p className={'text-center text-gray-500'}>This build has no registered changes :(</p>
@@ -35,7 +35,6 @@ const BuildComponent = (props: Build) => {
                 </div>
             </li>
     }
-
     return (
         <div className={'max-w-xl min-w-sm'}>
             <Card>
diff --git a/components/changelog/changelogResultsPage.tsx b/components/changelog/changelogResultsPage.tsx
index 60c7eae..079b64b 100644
--- a/components/changelog/changelogResultsPage.tsx
+++ b/components/changelog/changelogResultsPage.tsx
@@ -29,6 +29,4 @@ const ChangelogResultsPage = (props: ChangelogResultsPageProps) => {
         </>)
 }
 
-
-
 export default ChangelogResultsPage;