diff options
Diffstat (limited to 'src/components')
| -rw-r--r-- | src/components/proxies/Proxies.module.css | 12 | ||||
| -rw-r--r-- | src/components/proxies/Proxies.tsx | 14 | ||||
| -rw-r--r-- | src/components/proxies/ProxyList.module.css | 1 |
3 files changed, 18 insertions, 9 deletions
diff --git a/src/components/proxies/Proxies.module.css b/src/components/proxies/Proxies.module.css index 2c702e7..f8f50a9 100644 --- a/src/components/proxies/Proxies.module.css +++ b/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; - justify-content: flex-end; - padding: 5px 5px 2px 0; + background: linear-gradient(var(--color-background) 70%, transparent); +} + +.settingBtnContainer { + margin-right: 20px; } .group { diff --git a/src/components/proxies/Proxies.tsx b/src/components/proxies/Proxies.tsx index 474d09f..2a6977b 100644 --- a/src/components/proxies/Proxies.tsx +++ b/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> - <ContentHeader title="Proxies" /> + <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 ( diff --git a/src/components/proxies/ProxyList.module.css b/src/components/proxies/ProxyList.module.css index b7ff2a3..1814929 100644 --- a/src/components/proxies/ProxyList.module.css +++ b/src/components/proxies/ProxyList.module.css @@ -2,6 +2,7 @@ margin: 8px 0; display: flex; flex-wrap: wrap; + margin-left: -3px; } .listSummaryView { |
