# Code

Ready

- HTML
- View
- Context
- Assets
- Info
- Notes

`

    <pre><code>pick(:love) do |something|
        n.times do
            result &#x3D; play(something)
            result.publish
        end
    end
    </code></pre>

    <figure>
        <div>
            <pre><code>pick(:love) do |something|
        n.times do
            result &#x3D; play(something)
            result.publish
        end
    end
    </code></pre>
        </div>
        <figcaption>Code mit Figaption</figcaption>
    </figure>

`
`

    <pre><code>{{ code }}</code></pre>

    <figure>
        <div>
        <pre><code>{{ code }}</code></pre>
        </div>
        <figcaption>Code mit Figaption</figcaption>
    </figure>

`
`

    {
      "code": "pick(:love) do |something|\n    n.times do\n        result = play(something)\n        result.publish\n    end\nend\n"
    }

`
File:

- Content:
  `

      pre > code {
        @extend %monospace-font-regular;

        overflow: auto;
        display: block;

        padding: $spacer-xs;

        font-size: $font-size-xxs;
        line-height: $paragraph-line-height;

        background-color: $code-background-color;
      }

      pre {
        margin: 0;
      }

      figure > div > pre {
        /* stylelint-disable-next-line selector-max-compound-selectors */
        code {
          margin-bottom: $spacer-xxs;
        }
      }

  `
- URL: /components/raw/code/_code.scss
- Filesystem Path: components/05-atoms/text/code/_code.scss
- Size: 384 Bytes

- Handle: @code
- Preview:
  - With layout
  - Component only
- Filesystem Path: components/05-atoms/text/code/code.html

No notes defined.