playbook_ui 11.15.0.pre.alpha.table1 → 11.15.0

Sign up to get free protection for your applications and to get access to all the features.
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: