playbook_ui 14.6.2.pre.alpha.PLAY1485selectablecardoverflowoutlinebug4274 → 14.6.2.pre.alpha.PLAY1538READMEroot4251

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: b71c4b2a395af6da68e3af1572a6017af6a9e5295f52b94457ca6c0ad8dcc38f
4
- data.tar.gz: 508acfe334924d8e006974817f578a4bb7273058a820acb946e882a4cf14b0bc
3
+ metadata.gz: 8c6aa55238196ebc405fee91b69f494c27aa1ba26c73d9a104ef1862db6dc571
4
+ data.tar.gz: af887cbf3947b1a6089229aea82501237b05fbd3cbb794acba711ed1ca62bcd7
5
5
  SHA512:
6
- metadata.gz: 1257a96645ecf4f5fd4f635b5550134c4226147233720cfd3e560a0439690b53e76017a5520e8aadef384733c67f955e96bcec150ac6de030e19788f565ad1d0
7
- data.tar.gz: bc83b14f9ad21018f572bf3ead1aef4ed7c69495a9d2c56e747d7b4a3ff8f3f6405fb392fe80009111c5cff677177ddcced0c06e876d97b71d1bcd4cd09936a5
6
+ metadata.gz: cba0b9142d0cfc4ae4a1bf605f28cae9b19a52b7fc48a995ce0ea3947c98d3344bf545cd45ed0b37fc16187a88a396907052e80b7cef86693136c96c21d52062
7
+ data.tar.gz: 84eb17729486891c6ea6390784d1b3f3bcaf54579e5bb8602e0db2a4659a77850eb7e4ad2524d5fe808e8f7df7a33de57b9c129f6d88a020009fda795b03dd8c
@@ -28,7 +28,8 @@ $pb_card_header_colors: map-merge(map-merge($product_colors, $additional_colors)
28
28
 
29
29
  @mixin pb_card_selected($border_color: $primary) {
30
30
  border-color: $border_color;
31
- border-width: $pb_card_border_width * 2;
31
+ border-width: $pb_card_border_width;
32
+ outline: 1px solid $border_color;
32
33
  }
33
34
 
34
35
  @mixin pb_card_selected_dark {
@@ -10,24 +10,6 @@
10
10
  $pb_selectable_card_indicator_size: 22px;
11
11
  $pb_selectable_card_border: 2px;
12
12
 
13
- $pb_selectable_space_classes: (
14
- xxs: $space_xxs,
15
- xs: $space_xs,
16
- sm: $space_sm,
17
- md: $space_md,
18
- lg: $space_lg,
19
- xl: $space_xl,
20
- );
21
- $pb_selectable_paddings: (
22
- p: "padding",
23
- pr: "padding-right",
24
- pl: "padding-left",
25
- pt: "padding-top",
26
- pb: "padding-bottom",
27
- px: ("padding-left", "padding-right"),
28
- py: ("padding-top", "padding-bottom")
29
- );
30
-
31
13
  [class^=pb_selectable_card_kit] {
32
14
  display: block;
33
15
  margin-bottom: 0;
@@ -46,6 +28,7 @@ $pb_selectable_paddings: (
46
28
  padding: $space_sm;
47
29
  margin-bottom: $space_sm;
48
30
  cursor: pointer;
31
+ outline: 1px solid transparent;
49
32
 
50
33
  @media (hover:hover) {
51
34
  &:hover {
@@ -91,7 +74,6 @@ $pb_selectable_paddings: (
91
74
 
92
75
  position: relative;
93
76
  @include pb_card_selected;
94
- padding: calc(#{$space_sm} - 1px);
95
77
  transition-property: none;
96
78
  transition-duration: 0s;
97
79
 
@@ -106,54 +88,6 @@ $pb_selectable_paddings: (
106
88
  background-color: $royal;
107
89
  }
108
90
  }
109
-
110
- // Selected card has 1px more border
111
- // Remove 1px so content does not "jump"
112
- @each $position_name,
113
- $position in $pb_selectable_paddings {
114
- @each $space_name,
115
- $space in $pb_selectable_space_classes {
116
- ~ label.#{$position_name}_#{$space_name} {
117
- @if type-of($position)=="list" {
118
- @each $coordinate in $position {
119
- #{$coordinate}: calc(#{$space} - 1px) !important;
120
- }
121
- }
122
-
123
- @else {
124
- #{$position}: calc(#{$space} - 1px) !important;
125
- }
126
- }
127
- }
128
- }
129
- }
130
- }
131
-
132
- &.display_input {
133
- input[type="checkbox"],
134
- input[type="radio"] {
135
- &:checked {
136
- ~label {
137
- border-width: $pb_card_border_width;
138
- outline: 1px solid $primary;
139
- }
140
-
141
- }
142
- }
143
-
144
- > label {
145
- outline: 1px solid transparent;
146
- padding: $space_sm;
147
- }
148
-
149
- &.dark {
150
- input[type="checkbox"],
151
- input[type="radio"] {
152
- &:checked ~ label {
153
- border-width: $pb_card_border_width;
154
- outline: 1px solid $primary;
155
- }
156
- }
157
91
  }
158
92
  }
159
93
 
@@ -67,7 +67,6 @@ const SelectableCard = (props: SelectableCardProps) => {
67
67
  'disabled': disabled,
68
68
  'enabled': !disabled,
69
69
  }),
70
- variant === 'displayInput' ? 'display_input' : '',
71
70
  { error },
72
71
  dark ? 'dark' : '',
73
72
  className
@@ -25,7 +25,7 @@
25
25
  <% end %>
26
26
  <div class="separator"></div>
27
27
  <div class="psuedo_separator"></div>
28
- <%= pb_rails("card", props: { padding: "sm", status: object.status, border_none: true, dark: object.dark }) do %>
28
+ <%= pb_rails("card", props: { padding: "sm", status: object.status, border_none: true }) do %>
29
29
  <% if content.nil? %>
30
30
  <%= pb_rails("body", props: { text: object.text }) %>
31
31
  <% else %>
@@ -25,7 +25,7 @@ module Playbook
25
25
 
26
26
  def classname
27
27
  [
28
- generate_classname_without_spacing("pb_selectable_card_kit", checked_class, enable_disabled_class) + display_input_class,
28
+ generate_classname_without_spacing("pb_selectable_card_kit", checked_class, enable_disabled_class),
29
29
  error_class,
30
30
  dark_props,
31
31
  ].compact.join(" ")
@@ -79,10 +79,6 @@ module Playbook
79
79
  def error_class
80
80
  error ? "error" : nil
81
81
  end
82
-
83
- def display_input_class
84
- variant == "display_input" ? " display_input" : ""
85
- end
86
82
  end
87
83
  end
88
84
  end