Lookbook Demo

Previews

      • Rounded
      • Square
      • Playground
      • Themes
      • Standard
      • Sizes
    • Simple list
      • Warning
      • Success
      • Danger
    • Blank Slate
  • Full page example
    • Navbar
  • Phlex Example
  • View template example

No matching results.

Pages

  • Overview
  • Embedding Previews

No matching results.

Lookbook Demo

This app includes example components, previews and pages to help demonstrate some of Lookbook's key features.

Useful Links

  • Demo repository
  • Lookbook docs
  • Lookbook repository
Embedding Previews
  • Copy debug data
  • Reset local storage
Lookbook v2.3.7
{ "version": "2.3.7", "env": "production", "config": { "project_name": "Lookbook Demo", "project_logo": null, "preview_collection_label": "Previews", "preview_nav_filter": true, "preview_paths": [ "test/components/previews", "/app/app/components", "/app/test/components/previews" ], "preview_display_options": { "theme": [ "light", "dark" ] }, "preview_controller": "PreviewController", "preview_template": "lookbook/previews/preview", "preview_inspector": { "main_panels": [ "preview", "output" ], "drawer_panels": [ "source", "notes", "params", "*" ], "sidebar_panels": [ "previews", "pages" ] }, "preview_embeds": { "enabled": true, "policy": "ALLOWALL", "panels": false, "actions": [ ], "scenarios": [ ], "display_option_controls": true }, "preview_layout": "preview", "preview_disable_action_view_annotations": true, "preview_disable_action_view_partial_prefixes": true, "preview_type_default": "view_component", "preview_sort_scenarios": false, "preview_disable_error_handling": false, "page_collection_label": "Pages", "page_nav_filter": true, "page_controller": "Lookbook::PageController", "page_route": "pages", "page_paths": [ "test/components/docs" ], "page_extensions": [ "html.*", "md.*" ], "page_options": { }, "markdown_options": { "tables": true, "fenced_code_blocks": true, "disable_indented_code_blocks": true, "strikethrough": true, "highlight": true, "with_toc_data": true, "lax_spacing": true }, "highlighter_options": { "theme": "github", "dark": false }, "component_paths": [ "app/views", "app/components", "app/components" ], "reload_on_change": false, "lazy_load_previews_and_pages": false, "live_updates": false, "listen_paths": [ ], "listen_extensions": [ "rb", "html.*" ], "autoload_previews": true, "ui_theme": "indigo", "ui_theme_overrides": { }, "ui_favicon": true, "log_level": 2, "log_use_rails_logger": true, "debug_menu": true, "links": { "docs": "https://v2.lookbook.build", "demo": "https://v2-demo.lookbook.build", "repo": "https://github.com/lookbook-hq/lookbook/tree/v2" }, "using_view_component": true, "dependencies": { "actioncable": false, "listen": false, "view_component": true }, "panels": { "assets": { "label": "Assets", "hotkey": null, "disabled": false, "show": true, "copy": null, "locals": "#<Proc:0x00007f9563623a68 /app/config/application.rb:57 (lambda)>", "partial": "lookbook/panels/assets", "name": "assets" } }, "inputs": { }, "tags": { } } }