mirror of
https://github.com/Kong/insomnia
synced 2024-11-08 06:39:48 +00:00
Margin control to insomnia-component styled buttons (#3429)
This commit is contained in:
parent
7861d7a505
commit
f72fca6a7b
@ -1,7 +1,7 @@
|
||||
import React, { FunctionComponent, useMemo } from 'react';
|
||||
import styled from 'styled-components';
|
||||
import { getGrpcPathSegments, getShortGrpcPath } from '../../../../common/grpc-paths';
|
||||
import { Button, Tooltip } from 'insomnia-components';
|
||||
import { Button, ButtonProps, Tooltip } from 'insomnia-components';
|
||||
|
||||
const FlexSpaceBetween = styled.span`
|
||||
width: 100%;
|
||||
@ -25,8 +25,15 @@ const useLabel = (fullPath?: string) =>
|
||||
return 'Select Method';
|
||||
}, [fullPath]);
|
||||
|
||||
const buttonProps: ButtonProps = {
|
||||
className: 'tall wide',
|
||||
variant: 'text',
|
||||
size: 'medium',
|
||||
radius: '0',
|
||||
};
|
||||
|
||||
const GrpcMethodDropdownButton: FunctionComponent<Props> = ({ fullPath }) => (
|
||||
<Button className="tall wide" variant="text" size="medium" radius="0">
|
||||
<Button {...buttonProps}>
|
||||
<Tooltip className="tall wide" message={fullPath} position="bottom" delay={500}>
|
||||
<FlexSpaceBetween>
|
||||
{useLabel(fullPath)}
|
||||
|
@ -34,10 +34,12 @@ export interface ButtonProps extends ButtonHTMLAttributes<HTMLButtonElement> {
|
||||
variant?: ValueOf<typeof ButtonVariantEnum>;
|
||||
size?: ValueOf<typeof ButtonSizeEnum>;
|
||||
radius?: string;
|
||||
margin?: string;
|
||||
}
|
||||
|
||||
const StyledButton = styled.button<ButtonProps>`
|
||||
color: ${({ bg }) => (bg ? `var(--color-${bg})` : 'var(--color-font)')};
|
||||
margin: ${({ margin }) => (margin || 0)};
|
||||
text-align: center;
|
||||
font-size: var(--font-size-sm);
|
||||
display: inline-flex !important;
|
||||
|
Loading…
Reference in New Issue
Block a user