Make folder select easier to click (#4017)

This commit is contained in:
WithoutPants 2023-08-10 13:10:34 +10:00 committed by GitHub
parent e3225db5c0
commit 38a06be148
No known key found for this signature in database
GPG key ID: 4AEE18F83AFDEB23
2 changed files with 10 additions and 6 deletions

View file

@ -78,7 +78,9 @@ export const FolderSelect: React.FC<IProps> = ({
currentDirectory && data?.directory?.parent ? ( currentDirectory && data?.directory?.parent ? (
<li className="folder-list-parent folder-list-item"> <li className="folder-list-parent folder-list-item">
<Button variant="link" onClick={() => goUp()}> <Button variant="link" onClick={() => goUp()}>
<span>
<FormattedMessage id="setup.folder.up_dir" /> <FormattedMessage id="setup.folder.up_dir" />
</span>
</Button> </Button>
</li> </li>
) : null; ) : null;
@ -128,7 +130,7 @@ export const FolderSelect: React.FC<IProps> = ({
return ( return (
<li key={path} className="folder-list-item"> <li key={path} className="folder-list-item">
<Button variant="link" onClick={() => setInstant(path)}> <Button variant="link" onClick={() => setInstant(path)}>
{path} <span>{path}</span>
</Button> </Button>
</li> </li>
); );

View file

@ -105,18 +105,20 @@
&-item { &-item {
white-space: nowrap; white-space: nowrap;
.btn-link { .btn {
border: none; border: none;
color: white; color: white;
font-weight: 400; font-weight: 400;
padding: 0; padding: 0;
text-align: left;
width: 100%;
} }
&:last-child::before { &:last-child .btn span::before {
content: "└ \1F4C1"; content: "└ \1F4C1";
} }
&::before { .btn span::before {
content: "├ \1F4C1"; content: "├ \1F4C1";
display: inline-block; display: inline-block;
padding-right: 1rem; padding-right: 1rem;
@ -125,7 +127,7 @@
} }
&-parent { &-parent {
&::before { .btn span::before {
visibility: hidden; visibility: hidden;
} }