<commit_before># brick-deck

> A [Brick](https://github.com/mozbrick/brick/) box element in which cards can be cycled independently of order with a variety of different transitions.

## Demo

[Check it live!](http://mozbrick.github.io/brick-deck)

## Usage

1. Import Web Components polyfill:

    ```html
    <script src="bower_components/platform/platform.js"></script>
    ```

2. Import Custom Element:

    ```html
    <link rel="import" href="src/element.html">
    ```

3. Start using it:

    ```html
    <brick-deck selected-index="0">
      <brick-card selected>0</brick-card>
      <brick-card>1</brick-card>
      <brick-card>2</brick-card>
      <brick-card>3</brick-card>
      <brick-card>4</brick-card>
    </brick-deck>
    ```

## Options
<table>
  <tr>
    <th>Attribute</th>
    <th>Options</th>
    <th>Default</th>
    <th>Description</th>
  </tr>
  <tr>
    <td><code>transition-type</code></td>
    <td>
      <i>string</i>
      <ul>
        <li><code>slide-left</code></li>
        <li><code>slide-right</li>
        <li><code>slide-up</code></li>
        <li><code>slide-down</code></li>
        <li><code>fade-scale</code></li><commit_msg>remove fade scale from readme<commit_after># brick-deck

> A [Brick](https://github.com/mozbrick/brick/) box element in which cards can be cycled independently of order with a variety of different transitions.

## Demo

[Check it live!](http://mozbrick.github.io/brick-deck)

## Usage

1. Import Web Components polyfill:

    ```html
    <script src="bower_components/platform/platform.js"></script>
    ```

2. Import Custom Element:

    ```html
    <link rel="import" href="src/element.html">
    ```

3. Start using it:

    ```html
    <brick-deck selected-index="0">
      <brick-card selected>0</brick-card>
      <brick-card>1</brick-card>
      <brick-card>2</brick-card>
      <brick-card>3</brick-card>
      <brick-card>4</brick-card>
    </brick-deck>
    ```

## Options
<table>
  <tr>
    <th>Attribute</th>
    <th>Options</th>
    <th>Default</th>
    <th>Description</th>
  </tr>
  <tr>
    <td><code>transition-type</code></td>
    <td>
      <i>string</i>
      <ul>
        <li><code>slide-left</code></li>
        <li><code>slide-right</li>
        <li><code>slide-up</code></li>
        <li><code>slide-down</code></li>
{'fraction_non_alphanumeric': 0.1927241229969684, 'fraction_numerical': 0.007795582503248159, 'mean_word_length': 2.793103448275862, 'pattern_counts': {'":': 0, '<': 107, '<?xml version=': 0, '>': 109, 'https://': 2, 'lorem ipsum': 0, 'www.': 0, 'xml': 0}, 'pii_count': 0, 'substrings_counts': 0, 'word_list_counts': {'cursed_substrings.json': 0, 'profanity_word_list.json': 0, 'sexual_word_list.json': 0, 'zh_pornsignals.json': 0}}
{'dir': 'git-commits-cleaned', 'id': '279489', 'n_tokens_mistral': 859, 'n_tokens_neox': 849, 'n_words': 150}