text-and-image-block
v0.1.10arrow_drop_downv0.1.10
v0.1.9
v0.1.8
v0.1.7
v0.1.6
v0.1.5
v0.1.4
v0.1.3
v0.1.2
v0.1.1
v0.1.0
STATUS
Passing
DOWNLOADS
138
VISIBILITY
Public
PUBLISHED
4 years ago
SIZE
104 KB
1 contributor
Like
Install text-and-image-block as a package?
Copied
npm i @bit/clui.nui-ui.blocks.tutorial.text-and-image-block
Set Bit as a scoped registryLearn more
npm config set '@bit:registry' https://node.bit.cloud
Component Example
React
React
Vue
Angular
React Native
Add dependency... help_outline
Just
and packages in Bit or NPM to the example. any of the 1 million componentstoggle layout
modifieddraft
chevron_left
chevron_right
Description
For two columns img/animation/text layout.
Import from bit.dev
https://bit.dev/clui/nui-ui/blocks/tutorial/text-and-image-block
yarn add @bit/clui.nui-ui.blocks.tutorial.text-and-image-block
import TextAndImageBlock from '@bit/clui.nui-ui.blocks.tutorial.text-and-image-block';
Props
This component inherits ui/common/section-block. Please refer to /?path=/story/ui-common-sectionblock–default for all the inherited props.
Below are the props defined for this component:
Name | Type | Default | Description |
---|---|---|---|
html* | string | - | - |
textAlign | “left” | “right” | “inherit” | “center” | “justify” | - | - |
imgType | ‘img’ | ‘sprite’ | ‘sequence’ | ‘img’ | - |
imgURL | string | - | for ‘sprite’ or ‘img’ type |
imgAlt | string | - | - |
fileList | string[] | - | for ‘sequence’ type, an array of file names |
fps | number | 10 | frame per second, affect the playback speed |
frameNum | number | 1 | for ‘sprite’ type, the number of frames the sprite image contains |
imgAlign | “left” | “right” | “top” | “bottom” | - | - |