New Case Study:See how Anthropic automated 95% of dependency reviews with Socket.Learn More →
@symbo.ls/card
Advanced tools
@symbo.ls/card - npm Package Compare versions
Comparing version 2.11.162 to 2.11.164
279
index.js
| 'use strict' | ||
| import { Flex } from '@symbo.ls/atoms' | ||
| import { InfoSet } from '@symbo.ls/infoset' | ||
| import { Label } from '@symbo.ls/label' | ||
| // import { BalancesIndicator } from '@symbo.ls/accessories' | ||
| export * from './BalanceCard' | ||
| export * from './StepCard' | ||
| export * from './ConvertCard' | ||
| export const AmountWithLabel = { | ||
| extend: Flex, | ||
| amount: { props: { text: '240.59' } }, | ||
| label: { | ||
| extend: Label, | ||
| props: { text: '-0.25%' } | ||
| }, | ||
| // import { Flex } from '@symbo.ls/atoms' | ||
| // import { InfoSet } from '@symbo.ls/infoset' | ||
| // import { Label } from '@symbo.ls/label' | ||
| // import { Icon } from '@symbo.ls/icon' | ||
| // // import { BalancesIndicator } from '@symbo.ls/accessories' | ||
| props: { | ||
| align: 'center flex-start', | ||
| gap: 'Y+V', | ||
| amount: { | ||
| fontSize: `${20 / 16}em`, | ||
| fontWeight: '700' | ||
| } | ||
| } | ||
| } | ||
| // export const AmountWithLabel = { | ||
| // extend: Flex, | ||
| // amount: { props: { text: '240.59' } }, | ||
| // label: { | ||
| // extend: Label, | ||
| // props: { text: '-0.25%' } | ||
| // }, | ||
| export const Card = { | ||
| extend: InfoSet, | ||
| // props: { | ||
| // align: 'center flex-start', | ||
| // gap: 'Y+V', | ||
| // amount: { | ||
| // fontSize: `${20 / 16}em`, | ||
| // fontWeight: '700' | ||
| // } | ||
| // } | ||
| // } | ||
| props: { | ||
| minWidth: 'G', | ||
| maxWidth: 'G', | ||
| padding: 'A', | ||
| round: 'Z+V', | ||
| // theme: 'secondary', | ||
| // theme: 'secondary @dark .color-only', | ||
| // childProps: { | ||
| // theme: 'secondary .child' | ||
| // } | ||
| gap: 'Y', | ||
| '@dark': { theme: 'primary @dark .gradient' }, | ||
| '@light': { theme: 'primary @light .gradient' }, | ||
| childProps: { | ||
| alignItems: 'center', | ||
| // export const ConvertCard = { | ||
| // extend: Card, | ||
| // heading: { | ||
| // title: { props: { text: 'From' } }, | ||
| // // balance: { extend: BalancesIndicator }, | ||
| // icon: null | ||
| // }, | ||
| amount: { fontSize: `${24 / 16}em` }, | ||
| Subtitle: { | ||
| gap: 'Y', | ||
| caption: { color: 'rgba(224, 224, 226, 1)' }, | ||
| span: { color: 'rgba(233, 233, 234, 1)' } | ||
| } | ||
| }, | ||
| // content: { | ||
| // props: { align: 'center space-between' }, | ||
| content: { gap: 'Y' } | ||
| }, | ||
| // amount: { props: { text: '0.00' } }, | ||
| // label: null, | ||
| // DropDownWithAvatar: {} | ||
| // }, | ||
| // footer: null, | ||
| Heading: { | ||
| props: { | ||
| justifyContent: 'space-between' | ||
| }, | ||
| Title: { | ||
| fontWeight: '700', | ||
| text: 'Total crypto assets' | ||
| }, | ||
| Icon: { | ||
| fontSize: 'C', | ||
| color: '#A3A3A8', | ||
| name: 'arrowUpRight' | ||
| } | ||
| }, | ||
| // props: { | ||
| // background: 'rgba(28, 28, 31, .5)', | ||
| // gap: 'A', | ||
| // childProps: { | ||
| // amount: { color: 'rgba(163, 163, 168, 1)' } | ||
| // } | ||
| // } | ||
| // } | ||
| AmountWithLabel: { | ||
| props: { | ||
| padding: 'Y Z', background: '#04040466' | ||
| }, | ||
| amount: { props: { text: '$ 12,759' } }, | ||
| label: { props: { text: '+ 8.8%' } } | ||
| }, | ||
| // export const ConvertBoard = { | ||
| // extend: Flex, | ||
| // header: { | ||
| // title: { | ||
| // tag: 'h6', | ||
| // props: { text: 'convert' } | ||
| // } | ||
| // }, | ||
| Footer: { | ||
| props: {}, | ||
| Flex: { | ||
| props: {}, | ||
| caption: { props: { text: 'Last update:' } }, | ||
| span: { props: { text: 'an hour ago' } } | ||
| } | ||
| } | ||
| } | ||
| // content: { | ||
| // extend: Flex, | ||
| // childExtend: ConvertCard, | ||
| // ...[ | ||
| // {}, | ||
| // {} | ||
| // ] | ||
| // }, | ||
| export const ConvertCard = { | ||
| extend: Card, | ||
| heading: { | ||
| title: { props: { text: 'From' } }, | ||
| // balance: { extend: BalancesIndicator }, | ||
| icon: null | ||
| }, | ||
| // Button: { | ||
| // text: 'Convert' | ||
| // }, | ||
| content: { | ||
| props: { align: 'center space-between' }, | ||
| // props: { | ||
| // background: '#1C1C1F', | ||
| // maxWidth: 'fit-content', | ||
| // padding: 'A', | ||
| // round: 'A', | ||
| // // gap: 'Z', | ||
| // flow: 'column', | ||
| // textTransform: 'capitalize', | ||
| // header: { | ||
| // padding: '- - - Z', | ||
| // margin: '- - Y -', | ||
| // title: { fontSize: 'Z', fontWeight: '700' } | ||
| // }, | ||
| amount: { props: { text: '0.00' } }, | ||
| label: null, | ||
| DropDownWithAvatar: {} | ||
| }, | ||
| footer: null, | ||
| // content: { | ||
| // flow: 'column', | ||
| // gap: 'Z', | ||
| // childProps: { | ||
| // minWidth: 'G+D', | ||
| // background: 'black' | ||
| // } | ||
| // }, | ||
| props: { | ||
| background: 'rgba(28, 28, 31, .5)', | ||
| gap: 'A', | ||
| childProps: { | ||
| amount: { color: 'rgba(163, 163, 168, 1)' } | ||
| } | ||
| } | ||
| } | ||
| // footer: { | ||
| // background: '#0474F2', | ||
| // color: 'white', | ||
| // minWidth: '100%', | ||
| // padding: 'A -', | ||
| // margin: 'Z - - -', | ||
| // fontSize: 'Z', | ||
| // round: 'Y+W', | ||
| // fontWeight: '500', | ||
| // cursor: 'pointer' | ||
| // } | ||
| // } | ||
| // } | ||
| export const ConvertBoard = { | ||
| extend: Flex, | ||
| header: { | ||
| title: { | ||
| tag: 'h6', | ||
| props: { text: 'convert' } | ||
| } | ||
| }, | ||
| // export const StepCard = { | ||
| // props: { | ||
| // boxSize: 'fit-content', | ||
| // padding: 'F E2+A2 G E2+A2', | ||
| // position: 'relative', | ||
| // overflow: 'hidden', | ||
| // round: 'A2', | ||
| // backgroundColor: '#FF3CAC', | ||
| // background: 'linear-gradient(225deg, #FF3CAC 0%, #784BA0 50%, #2B86C5 100%)' | ||
| content: { | ||
| extend: Flex, | ||
| childExtend: ConvertCard, | ||
| ...[ | ||
| {}, | ||
| {} | ||
| ] | ||
| }, | ||
| // }, | ||
| // Icon: { | ||
| // extend: Icon, | ||
| // props: { | ||
| // icon: 'dribbble', | ||
| // boxSize: 'E' | ||
| // } | ||
| // }, | ||
| // LineStepsWithTitleParagraph: { | ||
| // position: 'absolute', | ||
| // left: '0', | ||
| // bottom: '0', | ||
| // width: '100%', | ||
| // round: '0', | ||
| // background: 'black .2' | ||
| // } | ||
| Button: { | ||
| text: 'Convert' | ||
| }, | ||
| props: { | ||
| background: '#1C1C1F', | ||
| maxWidth: 'fit-content', | ||
| padding: 'A', | ||
| round: 'A', | ||
| // gap: 'Z', | ||
| flow: 'column', | ||
| textTransform: 'capitalize', | ||
| header: { | ||
| padding: '- - - Z', | ||
| margin: '- - Y -', | ||
| title: { fontSize: 'Z', fontWeight: '700' } | ||
| }, | ||
| content: { | ||
| flow: 'column', | ||
| gap: 'Z', | ||
| childProps: { | ||
| minWidth: 'G+D', | ||
| background: 'black' | ||
| } | ||
| }, | ||
| footer: { | ||
| background: '#0474F2', | ||
| color: 'white', | ||
| minWidth: '100%', | ||
| padding: 'A -', | ||
| margin: 'Z - - -', | ||
| fontSize: 'Z', | ||
| round: 'Y+W', | ||
| fontWeight: '500', | ||
| cursor: 'pointer' | ||
| } | ||
| } | ||
| } | ||
| // } |
| { | ||
| "name": "@symbo.ls/card", | ||
| "version": "2.11.162", | ||
| "version": "2.11.164", | ||
| "main": "index.js", | ||
| "license": "MIT", | ||
| "gitHead": "fe3359a1d6c14d38f45f5e5db10ef2056947a228", | ||
| "gitHead": "943a48800e5959b8c1f15d5d8d49224565038c23", | ||
| "dependencies": { | ||
@@ -8,0 +8,0 @@ "@symbo.ls/atoms": "latest", |
New alerts
Major refactor
Supply chain riskPackage has recently undergone a major refactor. It may be unstable or indicate significant internal changes. Use caution when updating to versions that include significant changes.
Found 1 instance in 1 package
Improved metrics
- Total package byte prevSize
- increased by43.92%
6685
- Number of package files
- increased by100%
6
- Lines of code
- increased by55.26%
236
Worsened metrics
- Number of medium supply chain risk alerts
- increased byInfinity%
1
No dependency changes