Huge News!Announcing our $40M Series B led by Abstract Ventures.Learn More
Socket
Sign inDemoInstall
Socket

flexbox-vue

Package Overview
Dependencies
Maintainers
1
Versions
13
Alerts
File Explorer

Advanced tools

Socket logo

Install Socket

Detect and block malicious and high-risk dependencies

Install

flexbox-vue - npm Package Compare versions

Comparing version 1.0.9 to 1.0.10

2

package.json
{
"name": "flexbox-vue",
"version": "1.0.9",
"version": "1.0.10",
"description": "A Vue Component to flexbox",

@@ -5,0 +5,0 @@ "author": "hexonZhang <308826842@qq.com>",

@@ -21,1 +21,58 @@ # flexbox-vue

## Usage
Install it via npm:
- `npm install -S flexbox-vue`
## Example
1. Global import
```
import Flexbox from 'flexbox-vue'
Vue.use(Flexbox);
```
2. Use it
```
<FlexboxContainer orient="vertical">
<FlexboxItem grow="1">
<p>demo1</p>
</FlexboxItem>
<FlexboxItem>
<p>demo2</p>
</FlexboxItem>
</FlexboxContainer>
```
## Props
**FlexboxContainer**
- gutter
Spacing between items, Unit is px
- type: Number,
- default: 8
- orient (flex-direction)
- type: String,
- default: 'horizontal'
- options: 'horizontal' || 'vertical'
- justify:
- type: String
- default: 'flex-start'
- options: 'flex-start' || 'flex-end' || 'center' || 'space-between' || 'space-around'
- align:
- type: String
- default: flex-start
- options: 'flex-start' || 'flex-end' || 'center' || 'baseline' || 'stretch'
**FlexboxItem**
- grow (flex-grow)
- type: Number
- default: 0
- shrink (flex-shrink)
- type: Number
- default: 1
- basis (flex-basis)
- type: Number | String
- default: 'auto'
- options: <length> | 'auto'
- order (order)
- type: Number
- default: 0
SocketSocket SOC 2 Logo

Product

  • Package Alerts
  • Integrations
  • Docs
  • Pricing
  • FAQ
  • Roadmap
  • Changelog

Packages

npm

Stay in touch

Get open source security insights delivered straight into your inbox.


  • Terms
  • Privacy
  • Security

Made with ⚡️ by Socket Inc