Responsive Table 

<div class="responsive-table spacer-md" data-module="responsiveTable">
    <div class="grid-container">
        <h3 class="responsive-table__title">Phone numbers in Ireland</h3>
        <div class="responsive-table__wrapper responsive-table__wrapper--desktop">
            <table class="responsive-table__table">
                <thead class="responsive-table__head">
                    <tr class="responsive-table__head-row">
                        <th class="responsive-table__head-cell"></th>
                        <th class="responsive-table__head-cell">Republic of Ireland</th>
                        <th class="responsive-table__head-cell">Northern Ireland</th>
                    </tr>
                </thead>
                <tbody>
                    <tr class="responsive-table__body-row">
                        <td class="responsive-table__body-cell">Country Code</td>
                        <td class="responsive-table__body-cell">+353</td>
                        <td class="responsive-table__body-cell">+121</td>
                    </tr>
                    <tr class="responsive-table__body-row">
                        <td class="responsive-table__body-cell">International Access Code</td>
                        <td class="responsive-table__body-cell">00</td>
                        <td class="responsive-table__body-cell">11</td>
                    </tr>
                    <tr class="responsive-table__body-row">
                        <td class="responsive-table__body-cell">Directory enquiries</td>
                        <td class="responsive-table__body-cell">11811/11850</td>
                        <td class="responsive-table__body-cell">22922/22961</td>
                    </tr>
                    <tr class="responsive-table__body-row">
                        <td class="responsive-table__body-cell">International directory enquiries</td>
                        <td class="responsive-table__body-cell">118118</td>
                        <td class="responsive-table__body-cell">229229</td>
                    </tr>
                </tbody>
            </table>
        </div>
        <div class="responsive-table__wrapper responsive-table__wrapper--mobile">
            <table class="responsive-table__table">
                <thead class="responsive-table__head">
                    <tr class="responsive-table__head-row">
                        <th class="responsive-table__head-cell">Republic of Ireland</th>
                    </tr>
                </thead>
                <tbody>
                    <tr class="responsive-table__body-row">
                        <td class="responsive-table__body-cell">Country Code</td>
                        <td class="responsive-table__body-cell">+353</td>
                    </tr>
                    <tr class="responsive-table__body-row">
                        <td class="responsive-table__body-cell">International Access Code</td>
                        <td class="responsive-table__body-cell">00</td>
                    </tr>
                    <tr class="responsive-table__body-row">
                        <td class="responsive-table__body-cell">Directory enquiries</td>
                        <td class="responsive-table__body-cell">11811/11850</td>
                    </tr>
                    <tr class="responsive-table__body-row">
                        <td class="responsive-table__body-cell">International directory enquiries</td>
                        <td class="responsive-table__body-cell">118118</td>
                    </tr>
                </tbody>
            </table>
            <table class="responsive-table__table">
                <thead class="responsive-table__head">
                    <tr class="responsive-table__head-row">
                        <th class="responsive-table__head-cell">Northern Ireland</th>
                    </tr>
                </thead>
                <tbody>
                    <tr class="responsive-table__body-row">
                        <td class="responsive-table__body-cell">Country Code</td>
                        <td class="responsive-table__body-cell">+121</td>
                    </tr>
                    <tr class="responsive-table__body-row">
                        <td class="responsive-table__body-cell">International Access Code</td>
                        <td class="responsive-table__body-cell">11</td>
                    </tr>
                    <tr class="responsive-table__body-row">
                        <td class="responsive-table__body-cell">Directory enquiries</td>
                        <td class="responsive-table__body-cell">22922/22961</td>
                    </tr>
                    <tr class="responsive-table__body-row">
                        <td class="responsive-table__body-cell">International directory enquiries</td>
                        <td class="responsive-table__body-cell">229229</td>
                    </tr>
                </tbody>
            </table>
        </div>
    </div>
</div>
 
<div class="responsive-table spacer-md" data-module="responsiveTable">
    <div class="grid-container">
        {{#if title}}
            <h3 class="responsive-table__title">{{title}}</h3>
        {{/if}}
        {{#if tablesDesktop}}
            {{> @cp-table tables=tablesDesktop modifier="responsive-table__wrapper--desktop"}}
        {{/if}}
        {{#if tablesMobile}}
            {{> @cp-table tables=tablesMobile modifier="responsive-table__wrapper--mobile"}}
        {{/if}}
        {{#if buttons}}
            <div class="responsive-table__buttons">
                {{#each buttons}}
                    {{> @cp-button-primary url=url text=text modifier="with-icon" cssClasses=cssClasses }}
                {{/each}}
            </div>
        {{/if}}
    </div>
</div>
 
{
  "title": "Phone numbers in Ireland",
  "tablesDesktop": [
    {
      "header": [
        "",
        "Republic of Ireland",
        "Northern Ireland"
      ],
      "rows": [
        [
          "Country Code",
          "+353",
          "+121"
        ],
        [
          "International Access Code",
          "00",
          "11"
        ],
        [
          "Directory enquiries",
          "11811/11850",
          "22922/22961"
        ],
        [
          "International directory enquiries",
          "118118",
          "229229"
        ]
      ]
    }
  ],
  "tablesMobile": [
    {
      "header": [
        "Republic of Ireland"
      ],
      "rows": [
        [
          "Country Code",
          "+353"
        ],
        [
          "International Access Code",
          "00"
        ],
        [
          "Directory enquiries",
          "11811/11850"
        ],
        [
          "International directory enquiries",
          "118118"
        ]
      ]
    },
    {
      "header": [
        "Northern Ireland"
      ],
      "rows": [
        [
          "Country Code",
          "+121"
        ],
        [
          "International Access Code",
          "11"
        ],
        [
          "Directory enquiries",
          "22922/22961"
        ],
        [
          "International directory enquiries",
          "229229"
        ]
      ]
    }
  ]
}

There are no notes for this item.