summaryrefslogtreecommitdiff
path: root/src/components
diff options
context:
space:
mode:
Diffstat (limited to 'src/components')
-rw-r--r--src/components/proxies/Proxies.module.css12
-rw-r--r--src/components/proxies/Proxies.tsx14
-rw-r--r--src/components/proxies/ProxyList.module.css1
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 {