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.