[ { "target": "demo", "code": "<div>\n <table class=\"table\">\n <thead>\n <tr>\n <th>foo</th>\n <th>bar</th>\n <th>baz</th>\n </tr>\n </thead>\n <tdoby>\n <tr>\n <td>hoge</td>\n <td>fuga</td>\n <td>piyo</td>\n </tr>\n </tbody>\n </table>\n</div>" }, { "target": "html", "code": "<div>\n <table class=\"table\">\n <thead>\n <tr>\n <th>foo</th>\n <th>bar</th>\n <th>baz</th>\n </tr>\n </thead>\n <tdoby>\n <tr>\n <td>hoge</td>\n <td>fuga</td>\n <td>piyo</td>\n </tr>\n </tbody>\n </table>\n</div>" }, { "target": "sass", "code": "@mixin table() {\n border-collapse: collapse;\n border: 1px solid #aaa;\n}\n\n@mixin table__item() {\n padding: .3em .5em;\n border: 1px solid #aaa;\n}\n\n@mixin table__headline() {\n @include table__item;\n background: #ccc;\n}\n", "altCode": "@import \"table\";\n\n.table {\n @include table;\n}\n\n.table th {\n @include table__headline;\n}\n\n.table td {\n @include table__item;\n}\n" }, { "target": "css", "code": ".table {\n border-collapse: collapse;\n border: 1px solid #aaa;\n}\n\n.table th {\n background: #ccc;\n}\n\n.table th,\n.table td {\n padding: .3em .5em;\n border: 1px solid #aaa;\n}\n" } ]