Sha256: 6cfefedd9175f33e20a5aaced1cc8046cce76550b6ebfa66d1342518948f091b

Contents?: true

Size: 1.21 KB

Versions: 69

Compression:

Stored size: 1.21 KB

Contents

# frozen_string_literal: true

# Setup Playground to use all available component props
# Setup Features to use individual component props and combinations

module Primer
  module OpenProject
    # @label GridLayout
    class GridLayoutPreview < ViewComponent::Preview
      # @label Playground
      def playground
        render(Primer::OpenProject::GridLayout.new(css_class: "grid-layout", tag: :div)) do |component|
          component.with_area(:area1, bg: :attention, p: 6) do
            "Block 1"
          end
          component.with_area(:area2, bg: :accent, p: 6) do
            "Block 2"
          end
        end
      end

      # The component can be used for easy layouting of multiple child components.
      # The component sets classes as well the grid-area definitions. The actual grid template can then be defined a separate CSS file.
      # @label Default
      def default
        render(Primer::OpenProject::GridLayout.new(css_class: "grid-layout", tag: :div)) do |component|
          component.with_area(:area1, bg: :attention, p: 6) do
            "Block 1"
          end
          component.with_area(:area2, bg: :accent, p: 6) do
            "Block 2"
          end
        end
      end
    end
  end
end

Version data entries

69 entries across 69 versions & 1 rubygems

Version Path
openproject-primer_view_components-0.44.0 previews/primer/open_project/grid_layout_preview.rb
openproject-primer_view_components-0.43.1 previews/primer/open_project/grid_layout_preview.rb
openproject-primer_view_components-0.43.0 previews/primer/open_project/grid_layout_preview.rb
openproject-primer_view_components-0.42.0 previews/primer/open_project/grid_layout_preview.rb
openproject-primer_view_components-0.41.1 previews/primer/open_project/grid_layout_preview.rb
openproject-primer_view_components-0.41.0 previews/primer/open_project/grid_layout_preview.rb
openproject-primer_view_components-0.40.0 previews/primer/open_project/grid_layout_preview.rb
openproject-primer_view_components-0.39.1 previews/primer/open_project/grid_layout_preview.rb
openproject-primer_view_components-0.39.0 previews/primer/open_project/grid_layout_preview.rb
openproject-primer_view_components-0.38.0 previews/primer/open_project/grid_layout_preview.rb
openproject-primer_view_components-0.37.1 previews/primer/open_project/grid_layout_preview.rb
openproject-primer_view_components-0.37.0 previews/primer/open_project/grid_layout_preview.rb
openproject-primer_view_components-0.36.2 previews/primer/open_project/grid_layout_preview.rb
openproject-primer_view_components-0.36.1 previews/primer/open_project/grid_layout_preview.rb
openproject-primer_view_components-0.36.0 previews/primer/open_project/grid_layout_preview.rb
openproject-primer_view_components-0.35.2 previews/primer/open_project/grid_layout_preview.rb
openproject-primer_view_components-0.35.1 previews/primer/open_project/grid_layout_preview.rb
openproject-primer_view_components-0.35.0 previews/primer/open_project/grid_layout_preview.rb
openproject-primer_view_components-0.34.0 previews/primer/open_project/grid_layout_preview.rb
openproject-primer_view_components-0.33.2 previews/primer/open_project/grid_layout_preview.rb