スケルトン
3つの形状バリアントを持つローディングプレースホルダーコンポーネント。 パルスアニメーションでローディング状態を示します。複数のスケルトンを組み合わせて カード、リスト、コンテンツのローディングプレースホルダーを作成できます。
プレビュー & コード
_skeleton.html.erb
███
████████ █████████ █████████
██████
███ ██████ █████████████████████ ██
███ ██████ ██████████████████████ ████████ ███████ ██
███ ██████ ██████████████████████ ████████ ███████████ █████ ███ ██
███ ██████ ██████████████████████ ██████ ███████ ██
██
skeleton_component.rb
█ ██████████████████████ ████
█████ █████████████████ █ ███████████████████
████████ █ ███████ ██████ █████████████████
█████ █ █████ ██ ██████████
███████████ █████████ ██████ ██████
███ ███████████████████ ██████ █████ ████ ██████ ████ ████████████████
████████ █ ██████████████
skeleton_component.html.erb
████ ██████████ ████████████████ ██████████
変更履歴
- Initial release with text, circle, and rectangle variants
- Pulse animation for loading indication
- Size presets (sm, md, lg) for each variant
- Dark mode support