diff --git a/addon/components/pix-table.hbs b/addon/components/pix-table.hbs index 9dcf7b062..ab1220a4d 100644 --- a/addon/components/pix-table.hbs +++ b/addon/components/pix-table.hbs @@ -1,5 +1,5 @@ -
- +
+
diff --git a/addon/components/pix-table.js b/addon/components/pix-table.js index ef43470ea..8006abfbf 100644 --- a/addon/components/pix-table.js +++ b/addon/components/pix-table.js @@ -24,6 +24,7 @@ export default class PixTable extends Component { } get tableClass() { + const tableClass = ['pix-table']; warn( 'PixTable: @condensed must be a boolean, default undefined', [true, false, undefined].includes(this.args.condensed), @@ -32,9 +33,10 @@ export default class PixTable extends Component { }, ); if (this.args.condensed) { - return 'pix-table__condensed'; + tableClass.push('pix-table--condensed'); } - return null; + + return tableClass.join(' '); } get headerClass() { diff --git a/addon/styles/_pix-table.scss b/addon/styles/_pix-table.scss index f944a0063..37a821efb 100644 --- a/addon/styles/_pix-table.scss +++ b/addon/styles/_pix-table.scss @@ -11,12 +11,6 @@ @extend %pix-body-s; - &__condensed { - th, td { - padding: var(--pix-spacing-2x) var(--pix-spacing-4x); - } - } - &__clickable-row { cursor: pointer; @@ -82,5 +76,13 @@ } } } + + &--condensed { + table { + th, td { + padding: var(--pix-spacing-2x) var(--pix-spacing-4x); + } + } + } }
{{this.caption}}