update move plugin icons

Author: Aniket-Engg

apps/remix-ide/src/index.css

@@ -1,3 +1,5 @@
+@import '@vscode/codicons/dist/codicon.css';
+
 .centered {
   position           : fixed;
   top                : 20%;

libs/remix-ui/panel/src/lib/plugins/panel-header.tsx

@@ -81,12 +81,12 @@ const RemixUIPanelHeader = (props: RemixPanelProps) => {
                     <>
                       <div className='d-flex' data-id="movePluginToLeft" data-pinnedplugin={`movePluginToLeft-${plugin.profile.name}`} onClick={unPinPlugin}>
                         <CustomTooltip placement="auto-end" tooltipId="unPinnedMsg" tooltipClasses="text-nowrap" tooltipText={<FormattedMessage id="panel.unPinnedMsg" />}>
-                          <i aria-hidden="true" className="mt-1 px-2 fak fa-fa-dock-l"></i>
+                          <div aria-hidden="true" className="codicon codicon-layout-sidebar-left-dock ms-2 fs-5 fw-bold"></div>
                         </CustomTooltip>
                       </div>
                       <CustomTooltip placement="bottom-end" tooltipText="Hide Panel">
                         <div
-                          className="codicon codicon-close ms-1 fs-5 fw-bold"
+                          className="codicon codicon-close ms-2 fs-5 fw-bold"
                           onClick={togglePanelHandler}
                           data-id="hideRightSidePanel"
                         ></div>
@@ -96,7 +96,7 @@ const RemixUIPanelHeader = (props: RemixPanelProps) => {
                   <RenderIfNot condition={plugin.pinned}>
                     <div className='d-flex' data-id="movePluginToRight" data-pinnedplugin={`movePluginToRight-${plugin.profile.name}`} onClick={pinPlugin}>
                       <CustomTooltip placement="auto-end" tooltipId="pinnedMsg" tooltipClasses="text-nowrap" tooltipText={<FormattedMessage id="panel.pinnedMsg" />}>
-                        <i aria-hidden="true" className="mt-1 px-1 ps-2 fak fa-fa-dock-r"></i>
+                        <div aria-hidden="true" className="codicon codicon-layout-sidebar-right-dock ms-2 fs-5 fw-bold"></div>
                       </CustomTooltip>
                     </div>
                   </RenderIfNot>

package.json

@@ -145,6 +145,7 @@
     "@uiw/codemirror-theme-vscode": "^4.25.2",
     "@uiw/codemirror-themes": "^4.25.2",
     "@uiw/react-codemirror": "^4.25.2",
+    "@vscode/codicons": "^0.0.43",
     "ansi-gray": "^0.1.1",
     "assert": "^2.1.0",
     "async": "^2.6.2",

yarn.lock

@@ -8837,6 +8837,11 @@
   dependencies:
     resolve "^1.10.0"
 
+"@vscode/codicons@^0.0.43":
+  version "0.0.43"
+  resolved "https://registry.yarnpkg.com/@vscode/codicons/-/codicons-0.0.43.tgz#14a3bc218544b381c54917697b802d6d89ae083d"
+  integrity sha512-8sf8WOBoZkyUi8ogCm5ycHJJGhwOEG3E9b64+JIx+m6bCExdkc30VwCwr94cXUU1opmRD0CTCWLcN46I8WLJIg==
+
 "@walletconnect/core@2.20.2":
   version "2.20.2"
   resolved "https://registry.yarnpkg.com/@walletconnect/core/-/core-2.20.2.tgz#525cdea073d75d49571350945bc8165d9fd88ab5"