playbook_ui 11.15.0.pre.alpha.table1 → 11.15.0

This diff represents the content of publicly available package versions that have been released to one of the supported registries. The information contained in this diff is provided for informational purposes only and reflects changes between package versions as they appear in their respective public registries.
checksums.yaml CHANGED
@@ -1,7 +1,7 @@
1
1
  ---
2
2
  SHA256:
3
- metadata.gz: 15b86b8ca70f72bbd121b5f06f6826a014b9050351783119d3d50deb475ee96c
4
- data.tar.gz: 7da32444f8b9cd59ed83c7fda537c2ad58ef9a87aa62ddfd567844d2488b2165
3
+ metadata.gz: cffd8ae39a8b80f013b9bc0fca179e7cdd94be62b1bfcba8a786984fbe6bb15a
4
+ data.tar.gz: 320820bff742b9b95b6d0867f81782eb6d20edee840ca1e65bd9ecc9fc96d805
5
5
  SHA512:
6
- metadata.gz: f0728c32ede83ef14a32676ddf639179df8503df1fd7079248c66134e9e7351efd66c6e9c81eefafd0c5ed4e6aab674d4d499b63708ae6b1a7472c24477e4029
7
- data.tar.gz: 685973877043359bd20017af71f5c5cf8000dacd38c701442359d3f58c723f7d4fb05c9ac9ff6391f93d3bdaac7ff227e9874b3644b49f0ce39fd44f71bd8d8b
6
+ metadata.gz: 612b82bdc76521177c494de8203d6a64147a8dc2e6863ad0f28edef9eece3c410236ffa234220ed8c1d0ad69c5b857b8023fa2bf6d0680fec24054f8acd4bbde
7
+ data.tar.gz: 24e96215afa640ea123786fb2a3656a91e5bff64e3a49b17598034230949be6b1e6671270cb1dee78edaf3563dee09dd09d5f1a7f6f5c9e1b7ba0c80173f5472
@@ -9,6 +9,7 @@
9
9
  @import "side_highlight";
10
10
  @import "alignment";
11
11
  @import "hover";
12
+ @import "as-cards";
12
13
  @import "single-line";
13
14
  @import "table-dark";
14
15
  @import "mobile";
@@ -0,0 +1,49 @@
1
+ [class^=pb_table] {
2
+ &.table-sm,
3
+ &.table-md,
4
+ &.table-lg {
5
+ &.as-cards {
6
+ thead {
7
+ tr {
8
+ display: flex;
9
+ width: 100%;
10
+
11
+ th {
12
+ flex-grow: 1;
13
+ }
14
+ }
15
+ }
16
+ tbody {
17
+ tr {
18
+ display: flex;
19
+ align-items: stretch;
20
+ flex-direction: row;
21
+ justify-content: flex-start;
22
+ width: 100%;
23
+ margin: $space-xs 0;
24
+
25
+ td {
26
+ background: $white;
27
+ flex-grow: 1;
28
+ border-width: 1px 0;
29
+
30
+ &:first-child {
31
+ border-left-width: 1px;
32
+ border-radius: 4px 0 0 4px;
33
+ }
34
+ &:last-child {
35
+ border-right-width: 1px;
36
+ border-radius: 0 4px 4px 0;
37
+ }
38
+ }
39
+
40
+ &:last-child {
41
+ td {
42
+ border-top-width: 1px !important;
43
+ }
44
+ }
45
+ }
46
+ }
47
+ }
48
+ }
49
+ }
@@ -81,10 +81,6 @@
81
81
  border-left-width: 1px !important;
82
82
  border-right-width: 1px !important;
83
83
  border-top-width: 1px !important;
84
- &:after {
85
- height: 0;
86
- background-color: transparent;
87
- }
88
84
 
89
85
  &:first-child {
90
86
  border-radius: $border_rad_light $border_rad_light 0 0 !important;
@@ -12,42 +12,39 @@ $transition-speed: 0.2s;
12
12
  tr {
13
13
  box-shadow: 0 0 0 $white;
14
14
  transition: box-shadow $transition-speed ease;
15
+
15
16
  td {
16
17
  border-top-color: transparent;
17
- border-top-width: 0;
18
- transition: all $transition-speed ease;
18
+ border-top-width: 1px !important;
19
+ transition: all $transition-speed ease;
19
20
  }
20
- @media (hover:hover) {
21
- td {
22
- position: relative;
23
- &:after {
24
- transition: background-color $transition-speed ease, height $transition-speed ease;
25
- content: "";
26
- position: absolute;
27
- display: block;
28
- top: -1px;
29
- left: 0;
30
- right: 0;
31
- height: 0;
32
- background-color: transparent;
33
- }
34
- &:first-child:after {
35
- left: -1px;
36
- }
37
- &:last-child:after {
38
- right: -1px;
39
- }
40
- }
21
+
22
+ @media (hover:hover) {
41
23
  &:hover {
42
24
  box-shadow: 0 2px 10px 0 rgba($slate, $opacity-6);
25
+
43
26
  td {
27
+ background: $white;
44
28
  border-color: darken($border_light, 10%);
45
- border-top-width: 0;
29
+ border-top-width: 1px;
46
30
  border-top-color: transparent;
47
- &:after {
48
- transition: background-color $transition-speed ease, height $transition-speed ease;
49
- background-color: darken($border_light, 10%);
50
- height: 1px;
31
+ }
32
+ }
33
+ }
34
+ }
35
+ }
36
+ &.as-cards {
37
+ tbody {
38
+ tr {
39
+ td {
40
+ border-top-color: $border_light;
41
+ border-top-width: 1px;
42
+ }
43
+ @media (hover:hover) {
44
+ &:hover {
45
+ td {
46
+ border-top-width: 1px;
47
+ border-top-color: $border_light;
51
48
  }
52
49
  }
53
50
  }
@@ -81,10 +81,6 @@
81
81
  border-left-width: 1px !important;
82
82
  border-right-width: 1px !important;
83
83
  border-top-width: 1px !important;
84
- &:after {
85
- height: 0;
86
- background-color: transparent;
87
- }
88
84
 
89
85
  &:first-child {
90
86
  border-radius: $border_rad_light $border_rad_light 0 0 !important;
@@ -81,10 +81,6 @@
81
81
  border-left-width: 1px !important;
82
82
  border-right-width: 1px !important;
83
83
  border-top-width: 1px !important;
84
- &:after {
85
- height: 0;
86
- background-color: transparent;
87
- }
88
84
 
89
85
  &:first-child {
90
86
  border-radius: $border_rad_light $border_rad_light 0 0 !important;
@@ -9,6 +9,7 @@
9
9
  td {
10
10
  white-space: nowrap;
11
11
  text-overflow: ellipsis;
12
+ overflow: hidden;
12
13
 
13
14
  & > * {
14
15
  &:not(.btn, br) {
@@ -57,6 +57,33 @@
57
57
  }
58
58
  }
59
59
  }
60
+
61
+ &.as-cards {
62
+ border: 1px solid $border_light;
63
+ border-radius: 4px;
64
+
65
+ thead {
66
+ tr {
67
+ margin: $space-xs 0 0;
68
+ padding: 0 $space-xs;
69
+ border-bottom: 1px solid $border_light;
70
+
71
+ th {
72
+ border-width: 0;
73
+ }
74
+ }
75
+ }
76
+ tbody {
77
+ tr {
78
+ margin: $space-xs;
79
+ width: calc(100% - #{$space-xs}*2);
80
+
81
+ td {
82
+ border-top-width: 1px;
83
+ }
84
+ }
85
+ }
86
+ }
60
87
  }
61
88
  }
62
89
  }
@@ -81,10 +81,6 @@
81
81
  border-left-width: 1px !important;
82
82
  border-right-width: 1px !important;
83
83
  border-top-width: 1px !important;
84
- &:after {
85
- height: 0;
86
- background-color: transparent;
87
- }
88
84
 
89
85
  &:first-child {
90
86
  border-radius: $border_rad_light $border_rad_light 0 0 !important;
@@ -1,6 +1,6 @@
1
1
  # frozen_string_literal: true
2
2
 
3
3
  module Playbook
4
- PREVIOUS_VERSION = "11.15.0"
5
- VERSION = "11.15.0.pre.alpha.table1"
4
+ PREVIOUS_VERSION = "11.14.0"
5
+ VERSION = "11.15.0"
6
6
  end
metadata CHANGED
@@ -1,7 +1,7 @@
1
1
  --- !ruby/object:Gem::Specification
2
2
  name: playbook_ui
3
3
  version: !ruby/object:Gem::Version
4
- version: 11.15.0.pre.alpha.table1
4
+ version: 11.15.0
5
5
  platform: ruby
6
6
  authors:
7
7
  - Power UX
@@ -9,7 +9,7 @@ authors:
9
9
  autorequire:
10
10
  bindir: bin
11
11
  cert_chain: []
12
- date: 2022-12-21 00:00:00.000000000 Z
12
+ date: 2022-12-19 00:00:00.000000000 Z
13
13
  dependencies:
14
14
  - !ruby/object:Gem::Dependency
15
15
  name: actionpack
@@ -1873,6 +1873,7 @@ files:
1873
1873
  - app/pb_kits/playbook/pb_table/index.js
1874
1874
  - app/pb_kits/playbook/pb_table/styles/_alignment.scss
1875
1875
  - app/pb_kits/playbook/pb_table/styles/_all.scss
1876
+ - app/pb_kits/playbook/pb_table/styles/_as-cards.scss
1876
1877
  - app/pb_kits/playbook/pb_table/styles/_content.scss
1877
1878
  - app/pb_kits/playbook/pb_table/styles/_desktop_collapse.scss
1878
1879
  - app/pb_kits/playbook/pb_table/styles/_headers.scss
@@ -2358,9 +2359,9 @@ required_ruby_version: !ruby/object:Gem::Requirement
2358
2359
  version: '0'
2359
2360
  required_rubygems_version: !ruby/object:Gem::Requirement
2360
2361
  requirements:
2361
- - - ">"
2362
+ - - ">="
2362
2363
  - !ruby/object:Gem::Version
2363
- version: 1.3.1
2364
+ version: '0'
2364
2365
  requirements: []
2365
2366
  rubygems_version: 3.3.7
2366
2367
  signing_key: