@pradip1995/segment-powerhouse-shop 0.1.3 → 0.1.4

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.
Files changed (2) hide show
  1. package/package.json +1 -1
  2. package/src/shop.css +38 -4
package/package.json CHANGED
@@ -1,6 +1,6 @@
1
1
  {
2
2
  "name": "@pradip1995/segment-powerhouse-shop",
3
- "version": "0.1.3",
3
+ "version": "0.1.4",
4
4
  "license": "MIT",
5
5
  "publishConfig": {
6
6
  "access": "public"
package/src/shop.css CHANGED
@@ -544,11 +544,17 @@ html.powerhouse-filters-open body {
544
544
  }
545
545
 
546
546
  .powerhouse-shop__card {
547
+ position: relative;
548
+ z-index: 1;
547
549
  display: flex;
548
550
  flex-direction: column;
549
551
  height: 100%;
550
552
  min-width: 0;
551
553
  max-width: 100%;
554
+ padding: 0.6875rem;
555
+ border: 1px solid #dddddd;
556
+ box-sizing: border-box;
557
+ background: #fff;
552
558
  }
553
559
 
554
560
  .powerhouse-shop__media {
@@ -921,9 +927,17 @@ html.powerhouse-filters-open body {
921
927
  }
922
928
 
923
929
  .powerhouse-shop__grid {
930
+ align-items: stretch;
931
+ overflow: visible;
924
932
  grid-template-columns: repeat(3, minmax(0, 1fr));
925
933
  }
926
934
 
935
+ .powerhouse-shop__grid:not(.is-list) .powerhouse-shop__card:hover,
936
+ .powerhouse-shop__grid:not(.is-list) .powerhouse-shop__card:focus-within {
937
+ z-index: 8;
938
+ box-shadow: 0 6px 18px rgba(29, 29, 29, 0.12);
939
+ }
940
+
927
941
  .powerhouse-shop__grid.is-list {
928
942
  grid-template-columns: 1fr;
929
943
  }
@@ -946,11 +960,22 @@ html.powerhouse-filters-open body {
946
960
  width: 100%;
947
961
  }
948
962
 
949
- .powerhouse-shop__actions {
963
+ .powerhouse-shop__grid:not(.is-list) .powerhouse-shop__actions {
964
+ position: absolute;
965
+ left: -1px;
966
+ right: -1px;
967
+ top: calc(100% - 1px);
950
968
  flex-direction: row;
969
+ margin-top: 0;
970
+ padding: 0.75rem 0.6875rem 0.6875rem;
971
+ border: 1px solid #dddddd;
972
+ border-top: 0;
973
+ background: #fff;
974
+ box-sizing: border-box;
951
975
  opacity: 0;
976
+ visibility: hidden;
952
977
  pointer-events: none;
953
- transition: opacity 0.2s ease;
978
+ transition: opacity 0.2s ease, visibility 0.2s ease;
954
979
  }
955
980
 
956
981
  .powerhouse-shop__quickshop,
@@ -960,11 +985,20 @@ html.powerhouse-filters-open body {
960
985
  min-width: 0;
961
986
  }
962
987
 
963
- .powerhouse-shop__card:hover .powerhouse-shop__actions,
964
- .powerhouse-shop__card:focus-within .powerhouse-shop__actions,
988
+ .powerhouse-shop__grid:not(.is-list) .powerhouse-shop__card:hover .powerhouse-shop__actions,
989
+ .powerhouse-shop__grid:not(.is-list) .powerhouse-shop__card:focus-within .powerhouse-shop__actions {
990
+ opacity: 1;
991
+ visibility: visible;
992
+ pointer-events: auto;
993
+ }
994
+
965
995
  .powerhouse-shop__grid.is-list .powerhouse-shop__actions {
996
+ position: static;
966
997
  opacity: 1;
998
+ visibility: visible;
967
999
  pointer-events: auto;
1000
+ border: 0;
1001
+ background: transparent;
968
1002
  }
969
1003
  }
970
1004