feat(preferences): improve custom extension installation design (#674)

This commit is contained in:
Gorjan Petrovski
2021-10-11 11:24:54 +02:00
committed by GitHub
parent f1122f292e
commit d61ff5138b
3 changed files with 12 additions and 11 deletions

View File

@@ -88,9 +88,10 @@ export const Extensions: FunctionComponent<{
text={customUrl} text={customUrl}
onChange={(value) => { setCustomUrl(value); }} onChange={(value) => { setCustomUrl(value); }}
/> />
<div className="min-h-1" /> <div className="min-h-2" />
<Button <Button
type="primary" className="min-w-20"
type="normal"
label="Install" label="Install"
onClick={() => submitExtensionUrl(customUrl)} onClick={() => submitExtensionUrl(customUrl)}
/> />

View File

@@ -60,18 +60,18 @@ export const ConfirmCustomExtension: FunctionComponent<{
<div className="flex flex-row"> <div className="flex flex-row">
<Button <Button
className="min-w-20" className="min-w-20"
type="primary" type="normal"
label="Install" label="Cancel"
onClick={() => callback(true)} onClick={() => callback(false)}
/> />
<div className="min-w-3" /> <div className="min-w-3" />
<Button <Button
className="min-w-20" className="min-w-20"
type="primary" type="normal"
label="Cancel" label="Install"
onClick={() => callback(false)} onClick={() => callback(true)}
/> />
</div> </div>

View File

@@ -180,13 +180,13 @@ export const ExtensionItem: FunctionComponent<{
{isEditorOrTags && ( {isEditorOrTags && (
<> <>
{extension.active ? {extension.active ?
<Button type="normal" label="Deactivate" onClick={() => toggleActivate(extension)} /> : <Button className="min-w-20" type="normal" label="Deactivate" onClick={() => toggleActivate(extension)} /> :
<Button type="primary" label="Activate" onClick={() => toggleActivate(extension)} /> <Button className="min-w-20" type="normal" label="Activate" onClick={() => toggleActivate(extension)} />
} }
<div className="min-w-3" /> <div className="min-w-3" />
</> </>
)} )}
{isExternal && <Button type="normal" label="Uninstall" onClick={() => uninstall(extension)} />} {isExternal && <Button className="min-w-20" type="normal" label="Uninstall" onClick={() => uninstall(extension)} />}
</div> </div>
</> </>
} }