From 0305cc6ac7d4cc46487efa6f676834d7f5fde03d Mon Sep 17 00:00:00 2001
From: Nicolas Constant <github@nicolas-constant.com>
Date: Sun, 20 Aug 2023 02:33:03 -0400
Subject: [PATCH] added button to unlock icons, fix #489

---
 .../settings/settings.component.html           |  3 +++
 .../settings/settings.component.scss           | 18 ++++++++++++++++++
 .../settings/settings.component.ts             |  9 ++++++++-
 3 files changed, 29 insertions(+), 1 deletion(-)

diff --git a/src/app/components/floating-column/settings/settings.component.html b/src/app/components/floating-column/settings/settings.component.html
index ea108557..cd91ddac 100644
--- a/src/app/components/floating-column/settings/settings.component.html
+++ b/src/app/components/floating-column/settings/settings.component.html
@@ -220,6 +220,9 @@
                 (change)="onEnableFreezeAvatarChanged()" type="checkbox" name="enableFreezeAvatar"
                 value="enableFreezeAvatar" id="enableFreezeAvatar">
             <label class="noselect sub-section__label" for="enableFreezeAvatar">freeze animated avatar</label>
+            <br>
+            
+            reorder account's icons: <a href class="toogle-lock-icon-menu" (click)="toogleLockIconMenu()"><span *ngIf="iconMenuLocked">Unlock Icons</span><span *ngIf="!iconMenuLocked">Lock Icons</span></a>
         </div>
 
         <h4 class="panel__subtitle">About</h4>
diff --git a/src/app/components/floating-column/settings/settings.component.scss b/src/app/components/floating-column/settings/settings.component.scss
index cd272593..e42fadf4 100644
--- a/src/app/components/floating-column/settings/settings.component.scss
+++ b/src/app/components/floating-column/settings/settings.component.scss
@@ -153,4 +153,22 @@
             background-color: #32384d;
         }
     }
+}
+
+.toogle-lock-icon-menu {
+    display: block;
+    padding: 3px 40px;
+    width: 170px;
+    
+    float: right;
+    
+    text-align: center;
+
+    color: white;
+    background-color: #1f2330;
+
+    &:hover {
+        text-decoration: none;
+        background-color: #32384d;
+    }
 }
\ No newline at end of file
diff --git a/src/app/components/floating-column/settings/settings.component.ts b/src/app/components/floating-column/settings/settings.component.ts
index 30139494..eb360b5b 100644
--- a/src/app/components/floating-column/settings/settings.component.ts
+++ b/src/app/components/floating-column/settings/settings.component.ts
@@ -156,7 +156,14 @@ export class SettingsComponent implements OnInit, OnDestroy {
 
     ngOnDestroy(): void {
         if(this.languageSub) this.languageSub.unsubscribe();
-    }   
+    }
+
+    iconMenuLocked = true;
+    toogleLockIconMenu(): boolean {
+        this.navigationService.changeIconMenuState(this.iconMenuLocked);
+        this.iconMenuLocked = ! this.iconMenuLocked;
+        return false;
+    }
 
     onSearchLang(input: string) {
         this.searchedLangs = this.languageService.searchLanguage(input);