This repository has been archived by the owner on Oct 23, 2023. It is now read-only.
-
Notifications
You must be signed in to change notification settings - Fork 224
Commit
This commit does not belong to any branch on this repository, and may belong to a fork outside of the repository.
feat: add button group property (#762)
* feat: add button group property * fix: remove dragging overlay * feat: add function to fetch local or feather icons * chore: update styling of button group * fix: make ts happy * chore: rename radio group to button group * fix: align button group label properly * fix: simplify code * feat: add button group property to essentials box * fix: delete duplicate control entries
- Loading branch information
Showing
37 changed files
with
322 additions
and
453 deletions.
There are no files selected for viewing
This file contains bidirectional Unicode text that may be interpreted or compiled differently than what appears below. To review, open the file in an editor that reveals hidden Unicode characters.
Learn more about bidirectional Unicode characters
This file contains bidirectional Unicode text that may be interpreted or compiled differently than what appears below. To review, open the file in an editor that reveals hidden Unicode characters.
Learn more about bidirectional Unicode characters
This file contains bidirectional Unicode text that may be interpreted or compiled differently than what appears below. To review, open the file in an editor that reveals hidden Unicode characters.
Learn more about bidirectional Unicode characters
This file contains bidirectional Unicode text that may be interpreted or compiled differently than what appears below. To review, open the file in an editor that reveals hidden Unicode characters.
Learn more about bidirectional Unicode characters
This file contains bidirectional Unicode text that may be interpreted or compiled differently than what appears below. To review, open the file in an editor that reveals hidden Unicode characters.
Learn more about bidirectional Unicode characters
This file contains bidirectional Unicode text that may be interpreted or compiled differently than what appears below. To review, open the file in an editor that reveals hidden Unicode characters.
Learn more about bidirectional Unicode characters
This file contains bidirectional Unicode text that may be interpreted or compiled differently than what appears below. To review, open the file in an editor that reveals hidden Unicode characters.
Learn more about bidirectional Unicode characters
Original file line number | Diff line number | Diff line change |
---|---|---|
@@ -1,51 +1,13 @@ | ||
import DemoContainer from '../demo-container'; | ||
import { Icon, IconName, IconSize, reduce } from './index'; | ||
import { Icon, IconSize, getIcon } from './index'; | ||
import * as React from 'react'; | ||
import styled from 'styled-components'; | ||
|
||
const StyledDemoIconList = styled.ul` | ||
box-sizing: border-box; | ||
display: flex; | ||
flex-direction: row; | ||
flex-wrap: wrap; | ||
margin-top: 20px; | ||
margin-bottom: 20px; | ||
padding-left: 0; | ||
width: 100%; | ||
list-style: none; | ||
`; | ||
|
||
const StyledDemoListItem = styled.li` | ||
margin-top: 20px; | ||
width: 20%; | ||
min-width: 51px; | ||
text-align: center; | ||
`; | ||
|
||
const StyledIcon = styled(Icon)` | ||
margin-bottom: 20px; | ||
`; | ||
|
||
interface DemoIconsProps { | ||
names: typeof IconName; | ||
size: IconSize; | ||
} | ||
|
||
const DemoIcons = (props: DemoIconsProps) => ( | ||
<StyledDemoIconList> | ||
{reduce(props.names, (name, id) => [ | ||
<StyledDemoListItem key={name}> | ||
<StyledIcon name={id} size={props.size} /> | ||
</StyledDemoListItem> | ||
])} | ||
</StyledDemoIconList> | ||
); | ||
|
||
const IconRegistryDemo: React.StatelessComponent<void> = (): JSX.Element => ( | ||
<DemoContainer title="Icons"> | ||
<DemoIcons size={IconSize.XS} names={IconName} /> | ||
<DemoIcons size={IconSize.S} names={IconName} /> | ||
</DemoContainer> | ||
import { Color } from '../colors'; | ||
|
||
const IconDemo: React.SFC = () => ( | ||
<> | ||
<Icon size={IconSize.XS} color={Color.Green} icon="FlexAlignCenter" /> | ||
{getIcon({ icon: 'Box' })} | ||
{getIcon({ icon: 'Hello' })} | ||
</> | ||
); | ||
|
||
export default IconRegistryDemo; | ||
export default IconDemo; |
Oops, something went wrong.
5e3a672
There was a problem hiding this comment.
Choose a reason for hiding this comment
The reason will be displayed to describe this comment to others. Learn more.
Deployed at: https://alva-commits-5e3a6.surge.sh