playbook_ui 13.19.0.pre.alpha.play1174fixconfimationtoastmobilebug2306 → 13.19.0

Sign up to get free protection for your applications and to get access to all the features.
Files changed (43) hide show
  1. checksums.yaml +4 -4
  2. data/app/pb_kits/playbook/pb_advanced_table/_advanced_table.tsx +4 -4
  3. data/app/pb_kits/playbook/pb_advanced_table/docs/_advanced_table_collapsible_trail.md +1 -1
  4. data/app/pb_kits/playbook/pb_advanced_table/docs/_advanced_table_default.md +1 -1
  5. data/app/pb_kits/playbook/pb_advanced_table/docs/_advanced_table_loading.md +1 -1
  6. data/app/pb_kits/playbook/pb_advanced_table/docs/_advanced_table_subrow_headers.md +1 -1
  7. data/app/pb_kits/playbook/pb_advanced_table/docs/_advanced_table_table_options.md +1 -1
  8. data/app/pb_kits/playbook/pb_fixed_confirmation_toast/_fixed_confirmation_toast.scss +2 -13
  9. data/app/pb_kits/playbook/pb_fixed_confirmation_toast/docs/_fixed_confirmation_toast_multi_line.html.erb +1 -32
  10. data/app/pb_kits/playbook/pb_fixed_confirmation_toast/docs/_fixed_confirmation_toast_multi_line.jsx +4 -38
  11. data/app/pb_kits/playbook/pb_icon/_icon.tsx +16 -28
  12. data/app/pb_kits/playbook/pb_icon/docs/_icon_custom.html.erb +11 -5
  13. data/app/pb_kits/playbook/pb_icon/docs/_icon_custom.jsx +18 -44
  14. data/app/pb_kits/playbook/pb_icon/docs/_icon_custom.md +8 -4
  15. data/app/pb_kits/playbook/pb_icon/icon.html.erb +4 -6
  16. data/app/pb_kits/playbook/pb_icon/icon.rb +10 -27
  17. data/app/pb_kits/playbook/pb_table/_table.tsx +67 -86
  18. data/app/pb_kits/playbook/pb_table/docs/example.yml +0 -2
  19. data/app/pb_kits/playbook/pb_table/docs/index.js +0 -1
  20. data/app/pb_kits/playbook/pb_table/styles/_content.scss +3 -3
  21. data/app/pb_kits/playbook/pb_table/styles/_desktop_collapse.scss +15 -15
  22. data/app/pb_kits/playbook/pb_table/styles/_headers.scss +3 -3
  23. data/app/pb_kits/playbook/pb_table/styles/_hover.scss +11 -11
  24. data/app/pb_kits/playbook/pb_table/styles/_mobile.scss +15 -15
  25. data/app/pb_kits/playbook/pb_table/styles/_mobile_collapse.scss +15 -15
  26. data/app/pb_kits/playbook/pb_table/styles/_reset.scss +3 -3
  27. data/app/pb_kits/playbook/pb_table/styles/_side_highlight.scss +2 -2
  28. data/app/pb_kits/playbook/pb_table/styles/_single-line.scss +4 -4
  29. data/app/pb_kits/playbook/pb_table/styles/_sticky_header.scss +2 -2
  30. data/app/pb_kits/playbook/pb_table/styles/_striped.scss +4 -4
  31. data/app/pb_kits/playbook/pb_table/styles/_structure.scss +6 -18
  32. data/app/pb_kits/playbook/pb_table/styles/_table-card.scss +7 -7
  33. data/app/pb_kits/playbook/pb_table/styles/_table-dark.scss +14 -14
  34. data/app/pb_kits/playbook/pb_table/styles/_table_header.scss +2 -2
  35. data/app/pb_kits/playbook/pb_table/styles/_tablet_collapse.scss +15 -15
  36. data/app/pb_kits/playbook/pb_table/styles/_vertical_border.scss +4 -3
  37. data/app/pb_kits/playbook/pb_table/table.html.erb +2 -12
  38. data/app/pb_kits/playbook/pb_table/table.rb +0 -3
  39. data/dist/playbook-rails.js +1 -1
  40. data/lib/playbook/version.rb +2 -2
  41. metadata +7 -9
  42. data/app/pb_kits/playbook/pb_table/docs/_table_div.html.erb +0 -34
  43. data/app/pb_kits/playbook/pb_table/docs/_table_div.jsx +0 -47
data/app/pb_kits/playbook/pb_table/_table.tsx CHANGED
@@ -5,60 +5,67 @@ import { globalProps, GlobalProps } from '../utilities/globalProps'
5
5
  import PbTable from '.'
6
6
 
7
7
  type TableProps = {
8
- aria?: { [key: string]: string },
9
- children: React.ReactNode[] | React.ReactNode,
10
- className: string,
11
- collapse?: "sm" | "md" | "lg",
12
- container?: boolean,
13
- dark?: boolean,
14
- data?: { [key: string]: string },
15
- dataTable: boolean,
16
- disableHover?: boolean,
17
- htmlOptions?: { [key: string]: string | number | boolean | (() => void) },
18
- id?: string,
19
- responsive?: "collapse" | "scroll" | "none",
20
- singleLine?: boolean,
21
- size?: "sm" | "md" | "lg",
22
- sticky?: boolean,
23
- striped?: boolean,
24
- tag?: "table" | "div",
25
- verticalBorder?: boolean,
8
+ aria?: { [key: string]: string },
9
+ children: React.ReactNode[] | React.ReactNode,
10
+ className: string,
11
+ collapse?: "sm" | "md" | "lg",
12
+ container?: boolean,
13
+ dark?: boolean,
14
+ data?: { [key: string]: string },
15
+ dataTable: boolean,
16
+ disableHover?: boolean,
17
+ htmlOptions?: {[key: string]: string | number | boolean | (() => void)},
18
+ id?: string,
19
+ responsive?: "collapse" | "scroll" | "none",
20
+ singleLine?: boolean,
21
+ size?: "sm" | "md" | "lg",
22
+ sticky?: boolean,
23
+ striped?: boolean,
24
+ verticalBorder?: boolean,
26
25
  } & GlobalProps
27
26
 
28
27
  const Table = (props: TableProps) => {
29
- const {
30
- aria = {},
31
- children,
32
- className,
33
- collapse = 'sm',
34
- container = true,
35
- dark,
36
- data = {},
37
- dataTable = false,
38
- disableHover = false,
39
- htmlOptions = {},
40
- id,
41
- responsive = 'collapse',
42
- singleLine = false,
43
- size = 'sm',
44
- sticky = false,
45
- striped = false,
46
- tag = 'table',
47
- verticalBorder = false,
48
- } = props
28
+ const {
29
+ aria = {},
30
+ children,
31
+ className,
32
+ collapse = 'sm',
33
+ container = true,
34
+ dark,
35
+ data = {},
36
+ dataTable = false,
37
+ disableHover = false,
38
+ htmlOptions = {},
39
+ id,
40
+ responsive = 'collapse',
41
+ singleLine = false,
42
+ size = 'sm',
43
+ sticky = false,
44
+ striped = false,
45
+ verticalBorder = false,
46
+ } = props
49
47
 
50
- const ariaProps = buildAriaProps(aria)
51
- const dataProps = buildDataProps(data)
52
- const htmlProps = buildHtmlProps(htmlOptions)
53
- const tableCollapseCss = responsive !== 'none' ? `table-collapse-${collapse}` : ''
54
- const verticalBorderCss = verticalBorder ? 'vertical-border' : ''
55
- const isTableTag = tag === 'table'
48
+ const ariaProps = buildAriaProps(aria)
49
+ const dataProps = buildDataProps(data)
50
+ const htmlProps = buildHtmlProps(htmlOptions)
51
+ const tableCollapseCss = responsive !== 'none' ? `table-collapse-${collapse}` : ''
52
+ const verticalBorderCss = verticalBorder ? 'vertical-border' : ''
56
53
 
57
- const classNames = classnames(
58
- 'pb_table',
59
- `table-${size}`,
60
- `table-responsive-${responsive}`,
61
- {
54
+ useEffect(() => {
55
+ const instance = new PbTable()
56
+ instance.connect()
57
+ }, [])
58
+
59
+ return (
60
+ <table
61
+ {...ariaProps}
62
+ {...dataProps}
63
+ {...htmlProps}
64
+ className={classnames(
65
+ 'pb_table',
66
+ `table-${size}`,
67
+ `table-responsive-${responsive}`,
68
+ {
62
69
  'table-card': container,
63
70
  'table-dark': dark,
64
71
  'data_table': dataTable,
@@ -66,43 +73,17 @@ const Table = (props: TableProps) => {
66
73
  'no-hover': disableHover,
67
74
  'sticky-header': sticky,
68
75
  'striped': striped,
69
- },
70
- globalProps(props),
71
- tableCollapseCss,
72
- verticalBorderCss,
73
- className
74
- )
75
-
76
- useEffect(() => {
77
- const instance = new PbTable()
78
- instance.connect()
79
- }, [])
80
-
81
- return (
82
- <>
83
- {isTableTag ? (
84
- <table
85
- {...ariaProps}
86
- {...dataProps}
87
- {...htmlProps}
88
- className={classNames}
89
- id={id}
90
- >
91
- {children}
92
- </table>
93
- ) : (
94
- <div
95
- {...ariaProps}
96
- {...dataProps}
97
- {...htmlProps}
98
- className={classNames}
99
- id={id}
100
- >
101
- {children}
102
- </div>
103
- )}
104
- </>
105
- )
76
+ },
77
+ globalProps(props),
78
+ tableCollapseCss,
79
+ verticalBorderCss,
80
+ className
81
+ )}
82
+ id={id}
83
+ >
84
+ {children}
85
+ </table>
86
+ )
106
87
  }
107
88
 
108
89
  export default Table
data/app/pb_kits/playbook/pb_table/docs/example.yml CHANGED
@@ -1,6 +1,5 @@
1
1
  examples:
2
2
  rails:
3
- # - table_div: Div
4
3
  - table_sm: Small
5
4
  - table_md: Medium
6
5
  - table_lg: Large
@@ -27,7 +26,6 @@ examples:
27
26
  - table_striped: Striped Table
28
27
 
29
28
  react:
30
- # - table_div: Div
31
29
  - table_sm: Small
32
30
  - table_md: Medium
33
31
  - table_lg: Large
data/app/pb_kits/playbook/pb_table/docs/index.js CHANGED
@@ -21,4 +21,3 @@ export { default as TableAlignmentShiftData } from './_table_alignment_shift_dat
21
21
  export { default as TableWithBackgroundKit } from './_table_with_background_kit.jsx'
22
22
  export { default as TableVerticalBorder } from './_table_vertical_border.jsx'
23
23
  export { default as TableStriped } from './_table_striped.jsx'
24
- export { default as TableDiv } from './_table_div.jsx'
data/app/pb_kits/playbook/pb_table/styles/_content.scss CHANGED
@@ -2,9 +2,9 @@
2
2
  &.table-sm,
3
3
  &.table-md,
4
4
  &.table-lg {
5
- tbody, .pb_table_tbody {
6
- tr, .pb_table_tr {
7
- td, .pb_table_td {
5
+ tbody {
6
+ tr {
7
+ td {
8
8
  font-size: $default-font-size;
9
9
  }
10
10
  }
data/app/pb_kits/playbook/pb_table/styles/_desktop_collapse.scss CHANGED
@@ -10,21 +10,21 @@
10
10
  width: 100%;
11
11
  background: none !important;
12
12
 
13
- thead, .pb_table_thead {
14
- tr, .pb_table_tr {
13
+ thead {
14
+ tr {
15
15
  left: $offscreen;
16
16
  position: absolute;
17
17
  top: $offscreen;
18
18
 
19
- th, .pb_table_th {
19
+ th {
20
20
  display: block;
21
21
  visibility: visible;
22
22
  }
23
23
  }
24
24
  }
25
- tbody, .pb_table_tbody {
26
- tr, .pb_table_tr {
27
- td, .pb_table_td {
25
+ tbody {
26
+ tr {
27
+ td {
28
28
  display: block;
29
29
  visibility: visible;
30
30
  border-left-width: 1px !important;
@@ -63,7 +63,7 @@
63
63
  }
64
64
 
65
65
  &:first-child {
66
- td, .pb_table_td {
66
+ td {
67
67
  &:first-child {
68
68
  margin-top: $space-xs !important;
69
69
  }
@@ -74,9 +74,9 @@
74
74
  &.table-card {
75
75
  background: none !important;
76
76
 
77
- tbody, .pb_table_tbody {
78
- tr, .pb_table_tr {
79
- td, .pb_table_td {
77
+ tbody {
78
+ tr {
79
+ td {
80
80
  background: $white !important;
81
81
  border-left-width: 1px !important;
82
82
  border-right-width: 1px !important;
@@ -98,8 +98,8 @@
98
98
  }
99
99
  @media (hover:hover) {
100
100
  &:hover {
101
- tbody, .pb_table_tbody {
102
- tr, .pb_table_tr {
101
+ tbody {
102
+ tr {
103
103
  box-shadow: 0 0 0 $white !important;
104
104
  }
105
105
  }
@@ -108,9 +108,9 @@
108
108
  // reset the first and last to normalize
109
109
  @each $name, $value in $cell-pad-list {
110
110
  &.#{$name} {
111
- tbody, .pb_table_tbody {
112
- tr, .pb_table_tr {
113
- td, .pb_table_td {
111
+ tbody {
112
+ tr {
113
+ td {
114
114
  &:first-child,
115
115
  &:last-child {
116
116
  padding: $value $cell-gutter !important;
data/app/pb_kits/playbook/pb_table/styles/_headers.scss CHANGED
@@ -4,9 +4,9 @@
4
4
  &.table-sm,
5
5
  &.table-md,
6
6
  &.table-lg {
7
- thead, .pb_table_thead {
8
- tr, .pb_table_tr {
9
- th, .pb_table_th {
7
+ thead {
8
+ tr {
9
+ th {
10
10
  @include caption;
11
11
  border-bottom: 1px solid $border_light;
12
12
  }
data/app/pb_kits/playbook/pb_table/styles/_hover.scss CHANGED
@@ -9,17 +9,17 @@ $border_hover_color_dark: lighten($border_dark, 5%);
9
9
  &.table-lg {
10
10
  &:not(.no-hover) {
11
11
  border-collapse: collapse;
12
- tbody, .pb_table_tbody {
13
- tr, .pb_table_tr {
12
+ tbody {
13
+ tr {
14
14
  box-shadow: 0 0 0 $white;
15
15
  transition: box-shadow $transition-speed ease;
16
- td, .pb_table_td {
16
+ td {
17
17
  border-top-color: transparent;
18
18
  border-top-width: 0;
19
19
  transition: all $transition-speed ease;
20
20
  }
21
21
  @media (hover:hover) {
22
- td, .pb_table_td {
22
+ td {
23
23
  position: relative;
24
24
  &:after {
25
25
  transition: background-color $transition-speed ease, height $transition-speed ease;
@@ -41,7 +41,7 @@ $border_hover_color_dark: lighten($border_dark, 5%);
41
41
  }
42
42
  &:hover {
43
43
  box-shadow: 0 2px 10px 0 rgba($slate, $opacity-6);
44
- td, .pb_table_td {
44
+ td {
45
45
  border-color: darken($border_light, 10%);
46
46
  border-top-width: 0;
47
47
  border-top-color: transparent;
@@ -57,9 +57,9 @@ $border_hover_color_dark: lighten($border_dark, 5%);
57
57
  }
58
58
  &.table-card {
59
59
  border-collapse: separate;
60
- tbody, .pb_table_tbody {
61
- tr, .pb_table_tr {
62
- td, .pb_table_td {
60
+ tbody {
61
+ tr {
62
+ td {
63
63
  &:first-child {
64
64
  border-left-width: 1px;
65
65
  }
@@ -72,12 +72,12 @@ $border_hover_color_dark: lighten($border_dark, 5%);
72
72
  }
73
73
 
74
74
  &.dark {
75
- tbody, .pb_table_tbody {
76
- tr, .pb_table_tr {
75
+ tbody {
76
+ tr {
77
77
  @media (hover:hover) {
78
78
  &:hover {
79
79
  box-shadow: 0 2px 10px 0 $shadow_dark;
80
- td, .pb_table_td {
80
+ td {
81
81
  border-top-width: 0;
82
82
  border-top-color: transparent;
83
83
  border-color: $border_hover_color_dark !important;
data/app/pb_kits/playbook/pb_table/styles/_mobile.scss CHANGED
@@ -10,21 +10,21 @@
10
10
  width: 100%;
11
11
  background: none !important;
12
12
 
13
- thead, .pb_table_thead {
14
- tr, .pb_table_tr {
13
+ thead {
14
+ tr {
15
15
  left: $offscreen;
16
16
  position: absolute;
17
17
  top: $offscreen;
18
18
 
19
- th, .pb_table_th {
19
+ th {
20
20
  display: block;
21
21
  visibility: visible;
22
22
  }
23
23
  }
24
24
  }
25
- tbody, .pb_table_tbody {
26
- tr, .pb_table_tr {
27
- td, .pb_table_td {
25
+ tbody {
26
+ tr {
27
+ td {
28
28
  display: block;
29
29
  visibility: visible;
30
30
  border-left-width: 1px !important;
@@ -63,7 +63,7 @@
63
63
  }
64
64
 
65
65
  &:first-child {
66
- td, .pb_table_td {
66
+ td {
67
67
  &:first-child {
68
68
  margin-top: $space-xs !important;
69
69
  }
@@ -74,9 +74,9 @@
74
74
  &.table-card {
75
75
  background: none !important;
76
76
 
77
- tbody, .pb_table_tbody {
78
- tr, .pb_table_tr {
79
- td, .pb_table_td {
77
+ tbody {
78
+ tr {
79
+ td {
80
80
  background: $white !important;
81
81
  border-left-width: 1px !important;
82
82
  border-right-width: 1px !important;
@@ -98,8 +98,8 @@
98
98
  }
99
99
  @media (hover:hover) {
100
100
  &:hover {
101
- tbody, .pb_table_tbody {
102
- tr, .pb_table_tr {
101
+ tbody {
102
+ tr {
103
103
  box-shadow: 0 0 0 $white !important;
104
104
  }
105
105
  }
@@ -108,9 +108,9 @@
108
108
  // reset the first and last to normalize
109
109
  @each $name, $value in $cell-pad-list {
110
110
  &.#{$name} {
111
- tbody, .pb_table_tbody {
112
- tr, .pb_table_tr {
113
- td, .pb_table_td {
111
+ tbody {
112
+ tr {
113
+ td {
114
114
  &:first-child,
115
115
  &:last-child {
116
116
  padding: $value $cell-gutter !important;
data/app/pb_kits/playbook/pb_table/styles/_mobile_collapse.scss CHANGED
@@ -10,21 +10,21 @@
10
10
  width: 100%;
11
11
  background: none !important;
12
12
 
13
- thead, .pb_table_thead {
14
- tr, .pb_table_tr {
13
+ thead {
14
+ tr {
15
15
  left: $offscreen;
16
16
  position: absolute;
17
17
  top: $offscreen;
18
18
 
19
- th, .pb_table_th {
19
+ th {
20
20
  display: block;
21
21
  visibility: visible;
22
22
  }
23
23
  }
24
24
  }
25
- tbody, .pb_table_tbody {
26
- tr, .pb_table_tr {
27
- td, .pb_table_td {
25
+ tbody {
26
+ tr {
27
+ td {
28
28
  display: block;
29
29
  visibility: visible;
30
30
  border-left-width: 1px !important;
@@ -63,7 +63,7 @@
63
63
  }
64
64
 
65
65
  &:first-child {
66
- td, .pb_table_td {
66
+ td {
67
67
  &:first-child {
68
68
  margin-top: $space-xs !important;
69
69
  }
@@ -74,9 +74,9 @@
74
74
  &.table-card {
75
75
  background: none !important;
76
76
 
77
- tbody, .pb_table_tbody {
78
- tr, .pb_table_tr {
79
- td, .pb_table_td {
77
+ tbody {
78
+ tr {
79
+ td {
80
80
  background: $white !important;
81
81
  border-left-width: 1px !important;
82
82
  border-right-width: 1px !important;
@@ -98,8 +98,8 @@
98
98
  }
99
99
  @media (hover:hover) {
100
100
  &:hover {
101
- tbody, .pb_table_tbody {
102
- tr, .pb_table_tr {
101
+ tbody {
102
+ tr {
103
103
  box-shadow: 0 0 0 $white !important;
104
104
  }
105
105
  }
@@ -108,9 +108,9 @@
108
108
  // reset the first and last to normalize
109
109
  @each $name, $value in $cell-pad-list {
110
110
  &.#{$name} {
111
- tbody, .pb_table_tbody {
112
- tr, .pb_table_tr {
113
- td, .pb_table_td {
111
+ tbody {
112
+ tr {
113
+ td {
114
114
  &:first-child,
115
115
  &:last-child {
116
116
  padding: $value $cell-gutter !important;
data/app/pb_kits/playbook/pb_table/styles/_reset.scss CHANGED
@@ -6,9 +6,9 @@
6
6
  background-color: unset;
7
7
  background: unset;
8
8
 
9
- thead, .pb_table_thead {
10
- tr, .pb_table_tr {
11
- th, .pb_table_th {
9
+ thead {
10
+ tr {
11
+ th {
12
12
  text-align: left;
13
13
  }
14
14
  }
data/app/pb_kits/playbook/pb_table/styles/_side_highlight.scss CHANGED
@@ -8,11 +8,11 @@ $pb_table_row_kit_side_highlight_colors: map-merge(map-merge($status_colors, $pr
8
8
  }
9
9
 
10
10
  [class^=pb_table] {
11
- tbody, .pb_table_tbody {
11
+ tbody {
12
12
  [class^=pb_table_row_kit] {
13
13
  @each $color_name, $color_value in $pb_table_row_kit_side_highlight_colors {
14
14
  &[class*=_side_highlight_#{$color_name}] {
15
- td, .pb_table_td {
15
+ td {
16
16
  &:first-child {
17
17
  @include pb_table_row_kit_side_highlight($color_value);
18
18
  }
data/app/pb_kits/playbook/pb_table/styles/_single-line.scss CHANGED
@@ -4,9 +4,9 @@
4
4
  max-width: 100vw;
5
5
  table-layout: fixed;
6
6
 
7
- tbody, .pb_table_tbody {
8
- tr, .pb_table_tr {
9
- td, .pb_table_td {
7
+ tbody {
8
+ tr {
9
+ td {
10
10
  white-space: nowrap;
11
11
  text-overflow: ellipsis;
12
12
 
@@ -20,7 +20,7 @@
20
20
  display: block !important;
21
21
  }
22
22
 
23
- br, .pb_table_br {
23
+ br {
24
24
  content:' ' !important;
25
25
 
26
26
  &::after {
data/app/pb_kits/playbook/pb_table/styles/_sticky_header.scss CHANGED
@@ -2,7 +2,7 @@
2
2
 
3
3
  [class^="pb_table"] {
4
4
  &.sticky-header {
5
- thead, .pb_table_thead {
5
+ thead {
6
6
  background: $white;
7
7
  position: sticky;
8
8
  top: 0;
@@ -12,7 +12,7 @@
12
12
 
13
13
  &.dark {
14
14
  &.sticky-header {
15
- thead, .pb_table_thead {
15
+ thead {
16
16
  background: $bg_dark;
17
17
  position: sticky;
18
18
  top: 0;
data/app/pb_kits/playbook/pb_table/styles/_striped.scss CHANGED
@@ -1,7 +1,7 @@
1
1
  [class^=pb_table] {
2
2
  &.striped {
3
- tbody, .pb_table_tbody {
4
- tr:nth-child(odd), .tr:nth-child(odd) {
3
+ tbody {
4
+ tr:nth-child(odd) {
5
5
  background-color: $bg_light;
6
6
  }
7
7
  }
@@ -9,8 +9,8 @@
9
9
 
10
10
  &.dark {
11
11
  &.striped {
12
- tbody, .pb_table_tbody {
13
- tr:nth-child(odd), .tr:nth-child(odd) {
12
+ tbody {
13
+ tr:nth-child(odd) {
14
14
  background-color: $bg_dark;
15
15
  }
16
16
  }
data/app/pb_kits/playbook/pb_table/styles/_structure.scss CHANGED
@@ -1,19 +1,12 @@
1
1
  @import "../../tokens/colors";
2
2
 
3
3
  [class^=pb_table] {
4
- display: table;
5
-
6
4
  @each $name, $value in $cell-pad-list {
7
5
  &.#{$name} {
8
6
  width: 100%;
9
- thead, .pb_table_thead {
10
- display: table-header-group;
11
-
12
- tr, .pb_table_tr {
13
- display: table-row;
14
-
15
- th, .pb_table_th {
16
- display: table-cell;
7
+ thead {
8
+ tr {
9
+ th {
17
10
  padding: $cell-pad-md $cell-gutter;
18
11
 
19
12
  &:first-child {
@@ -25,14 +18,9 @@
25
18
  }
26
19
  }
27
20
  }
28
- tbody, .pb_table_tbody {
29
- display: table-row-group;
30
-
31
- tr, .pb_table_tr {
32
- display: table-row;
33
-
34
- td, .pb_table_td {
35
- display: table-cell;
21
+ tbody {
22
+ tr {
23
+ td {
36
24
  border-color: $border_light;
37
25
  border-style: solid;
38
26
  border-width: 0 0 1px;
data/app/pb_kits/playbook/pb_table/styles/_table-card.scss CHANGED
@@ -7,9 +7,9 @@
7
7
  border-spacing: 0;
8
8
  background: $white;
9
9
 
10
- thead, .pb_table_thead {
11
- tr, .pb_table_tr {
12
- th, .pb_table_th {
10
+ thead {
11
+ tr {
12
+ th {
13
13
  border-color: $border_light;
14
14
  border-style: solid;
15
15
  border-width: 1px 0 1px 0;
@@ -26,9 +26,9 @@
26
26
  }
27
27
  }
28
28
 
29
- tbody, .pb_table_tbody {
30
- tr, .pb_table_tr {
31
- td, .pb_table_td {
29
+ tbody {
30
+ tr {
31
+ td {
32
32
  border-color: $border_light;
33
33
  border-style: solid;
34
34
  border-width: 0 0 1px 0;
@@ -42,7 +42,7 @@
42
42
  }
43
43
 
44
44
  &:last-child {
45
- td, .pb_table_td {
45
+ td {
46
46
  border-width: 0 0 1px 0;
47
47
 
48
48
  &:first-child {