feat: enhance settings button

This commit is contained in:
EnixCoda 2020-08-02 23:42:01 +08:00
parent 6d7610349e
commit 42d9ef4725
No known key found for this signature in database
GPG key ID: 0C1A07377913A1DD
2 changed files with 19 additions and 19 deletions

View file

@ -89,15 +89,13 @@ export function SettingsBar(props: Props) {
>
{VERSION}
</Link>
{activated ? (
<Icon
type={'chevron-down'}
className={'hide-settings-icon'}
onClick={toggleShowSettings}
/>
) : (
<Icon type={'gear'} className={'show-settings-icon'} onClick={toggleShowSettings} />
)}
<button className={'settings-button'} onClick={toggleShowSettings}>
{activated ? (
<Icon type={'chevron-down'} className={'hide-settings-icon'} />
) : (
<Icon type={'gear'} className={'show-settings-icon'} />
)}
</button>
</div>
</div>
)

View file

@ -574,18 +574,20 @@ $minimal-z-index: max($github-header-z-index, $github-pull-request-float-header-
display: flex;
justify-content: space-between;
align-items: center;
padding: 6px 10px;
padding: 2px 6px 2px 10px;
border-top: 1px solid $border-gray-light;
.show-settings-icon {
width: 20px;
height: 20px;
cursor: pointer;
}
.hide-settings-icon {
width: 20px;
height: 20px;
cursor: pointer;
.settings-button {
@include icon-button();
@include button-color();
$size: 32px;
width: $size;
height: $size;
border-radius: $size;
.octicon-wrapper {
width: 18px;
}
}
}
}