refactor(proxies): make the content header and settings button sticky

src/components/proxies/Proxies.module.css

@@ -1,11 +1,17 @@
 .topBar {
   position: sticky;
   top: 0;
+
+  display: flex;
+  align-items: center;
+  justify-content: space-between;
   z-index: 1;
   background: var(--color-background);
-  display: flex;
+  background: linear-gradient(var(--color-background) 70%, transparent);
-  justify-content: flex-end;
+}
-  padding: 5px 5px 2px 0;
+
+.settingBtnContainer {
+  margin-right: 20px;
 }
 
 .group {

src/components/proxies/Proxies.tsx

@@ -84,18 +84,20 @@ function Proxies({
 
   return (
     <>
-      <div className={s0.topBar}>
-        <Button kind="minimal" onClick={() => setIsSettingsModalOpen(true)}>
-          <Equalizer size={16} />
-        </Button>
-      </div>
       <BaseModal
         isOpen={isSettingsModalOpen}
         onRequestClose={closeSettingsModal}
       >
         <Settings />
       </BaseModal>
+      <div className={s0.topBar}>
         <ContentHeader title="Proxies" />
+        <div className={s0.settingBtnContainer}>
+          <Button kind="minimal" onClick={() => setIsSettingsModalOpen(true)}>
+            <Equalizer size={16} />
+          </Button>
+        </div>
+      </div>
       <div>
         {groupNames.map((groupName: string) => {
           return (

src/components/proxies/ProxyList.module.css

@@ -2,6 +2,7 @@
   margin: 8px 0;
   display: flex;
   flex-wrap: wrap;
+  margin-left: -3px;
 }
 
 .listSummaryView {