1.0.4 • Published 2 years ago
@tagosan/next-simple-white-gradient-header v1.0.4
このコンポーネントの使い方
インストール方法
npm install @tagosan/next-simple-white-gradient-header
で読み込みます。
使い方
import NextSimpleWhiteGradientHeader from '@tagosan/next-simple-white-gradient-header'
こんな感じでコンポーネントを読み込みます。
パラメーター
backgroundImagePath
背景画像のパスです。これだけは必須です。
gradientRotate
回転角度をdegで指定します。 gradientRotate='90deg'のように指定します。
gradientColor
背景の色を指定します。 gradientColor='#FFFFFF'のような感じです。 rgb(255,255,255) white #FFF のようなスタイルではダメです。
gradientStartOpacity
開始地点の背景の透明度を2桁の16進数で指定します。 gradientStartOpacity='FF' のような感じです。
gradientEndOpacity
終了地点の背景の透明度を2桁の16進数で指定します。 gradientEndOpacity='00' のような感じです。
height
高さを指定します。 初期値は400pxが入ります。 height='300px' のように指定してください。
as
一番外側のタグ名を指定できる。 考えたらheader以外でもこれ使えるな、という話になったので追加した。 が、もう名前を決めて公開してしまったので、とりあえずは初期値はheaderにしてある
style
オブジェクト形式で適用すれば、一番外側の要素のスタイルを上書きできる。