kupos-ui-components-lib 6.0.0 → 6.0.2

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 (6) hide show
  1. package/dist/components/ServiceItem/ServiceItemDesktop.js +3 -2
  2. package/dist/components/ServiceItem/ServiceItemMobile.js +1 -1
  3. package/dist/styles.css +6 -6
  4. package/package.json +1 -1
  5. package/src/components/ServiceItem/ServiceItemDesktop.tsx +4 -3
  6. package/src/components/ServiceItem/ServiceItemMobile.tsx +1 -1
package/dist/components/ServiceItem/ServiceItemDesktop.js CHANGED
@@ -440,7 +440,7 @@ function ServiceItemPB({ serviceItem, onBookButtonPress, colors, metaData, child
440
440
  : "mt-[14px]"} ` },
441
441
  React.createElement("div", { className: "bg-white rounded-[20px] shadow-service mx-auto relative" },
442
442
  React.createElement("div", { className: "p-[15px] pt-[20px]" },
443
- React.createElement("div", { className: "grid text-[#464647] w-full [grid-template-columns:18%_28%_0.5%_24%_13.5%] gap-x-[4%] items-center", style: { marginTop: showTopLabel ? "8px" : "" } },
443
+ React.createElement("div", { className: "grid text-[#464647] w-full [grid-template-columns:14%_32%_0.5%_24%_13.5%] gap-x-[4%] items-center", style: { marginTop: showTopLabel ? "8px" : "" } },
444
444
  React.createElement("div", { className: "flex items-center justify-center m-[auto]" },
445
445
  React.createElement("div", { className: " " },
446
446
  React.createElement("img", { src: serviceItem.operator_details[0], alt: "service logo", className: ` h-auto object-contain ${isSoldOut ? "grayscale" : ""}` })),
@@ -524,7 +524,8 @@ function ServiceItemPB({ serviceItem, onBookButtonPress, colors, metaData, child
524
524
  color: isSoldOut ? "#c0c0c0" : colors.priceColor,
525
525
  top: 0,
526
526
  bottom: 0,
527
- left: "68%",
527
+ left: "clamp(75%, 75% + (100vw - 1300px) * 0.1, 80%)",
528
+ // left: "68%",
528
529
  right: 0,
529
530
  justifyContent: getNumberOfSeats() < 2 ? "center" : "",
530
531
  } }, getSeatPrice()))),
package/dist/components/ServiceItem/ServiceItemMobile.js CHANGED
@@ -300,7 +300,7 @@ function ServiceItemMobile({ serviceItem, onBookButtonPress, colors, busStage, o
300
300
  React.createElement("div", { className: `h-auto mr-[4px] min-[420]:text-[13px] text-[11px] text-[#464647] ${isSoldOut ? "grayscale" : ""}` },
301
301
  React.createElement(LottiePlayer, { animationData: serviceItem.icons.locationAnim, width: "20px", height: "20px" })))),
302
302
  (serviceItem.is_change_ticket || isPetSeat) && (React.createElement("img", { src: serviceItem.icons.plus, alt: "icon", width: 11 })))))),
303
- (serviceItem === null || serviceItem === void 0 ? void 0 : serviceItem.offer_text) && (React.createElement("div", { className: ` text-white p-[10px_15px] text-left w-full flex items-center absolute -bottom-[40px] pt-[50px] z-10 rounded-b-[14px] min-[420]:text-[14px] text-[12px]`, style: {
303
+ (serviceItem === null || serviceItem === void 0 ? void 0 : serviceItem.offer_text) && (React.createElement("div", { className: ` text-white p-[10px_15px] text-left w-full flex items-center absolute -bottom-[35px] pt-[50px] z-10 rounded-b-[14px] min-[420]:text-[14px] text-[12px]`, style: {
304
304
  backgroundColor: isSoldOut ? "#ccc" : colors === null || colors === void 0 ? void 0 : colors.bottomStripColor,
305
305
  zIndex: -1,
306
306
  color: "#fff",
package/dist/styles.css CHANGED
@@ -63,12 +63,12 @@
63
63
  .-bottom-\[10\%\] {
64
64
  bottom: calc(10% * -1);
65
65
  }
66
+ .-bottom-\[35px\] {
67
+ bottom: calc(35px * -1);
68
+ }
66
69
  .-bottom-\[36px\] {
67
70
  bottom: calc(36px * -1);
68
71
  }
69
- .-bottom-\[40px\] {
70
- bottom: calc(40px * -1);
71
- }
72
72
  .-bottom-\[160px\] {
73
73
  bottom: calc(160px * -1);
74
74
  }
@@ -403,12 +403,12 @@
403
403
  .cursor-pointer {
404
404
  cursor: pointer;
405
405
  }
406
+ .\[grid-template-columns\:14\%_32\%_0\.5\%_24\%_13\.5\%\] {
407
+ grid-template-columns: 14% 32% 0.5% 24% 13.5%;
408
+ }
406
409
  .\[grid-template-columns\:14\%_40\%_0\.5\%_24\%_13\.5\%\] {
407
410
  grid-template-columns: 14% 40% 0.5% 24% 13.5%;
408
411
  }
409
- .\[grid-template-columns\:18\%_28\%_0\.5\%_24\%_13\.5\%\] {
410
- grid-template-columns: 18% 28% 0.5% 24% 13.5%;
411
- }
412
412
  .\[grid-template-columns\:minmax\(0\,1\.4fr\)_minmax\(0\,0\.2fr\)_minmax\(0\,1fr\)_auto\] {
413
413
  grid-template-columns: minmax(0,1.4fr) minmax(0,0.2fr) minmax(0,1fr) auto;
414
414
  }
package/package.json CHANGED
@@ -1,6 +1,6 @@
1
1
  {
2
2
  "name": "kupos-ui-components-lib",
3
- "version": "6.0.0",
3
+ "version": "6.0.2",
4
4
  "description": "A reusable UI components package",
5
5
  "publishConfig": {
6
6
  "access": "public"
package/src/components/ServiceItem/ServiceItemDesktop.tsx CHANGED
@@ -1,4 +1,4 @@
1
- import React, { useState } from "react";
1
+ import React, { useState, useEffect } from "react";
2
2
  import { ServiceItemProps } from "./types";
3
3
  import DateService from "../../utils/DateService";
4
4
  import CommonService from "../../utils/CommonService";
@@ -650,7 +650,7 @@ function ServiceItemPB({
650
650
 
651
651
  {/* <div className="grid grid-cols-[1.5fr_1fr_auto] gap-[3rem] sm:gap-[4rem] md:gap-[5rem] lg:gap-[6rem] xl:gap-[5rem] 2xl:gap-[7rem] text-[#464647]"> */}
652
652
  <div
653
- className="grid text-[#464647] w-full [grid-template-columns:18%_28%_0.5%_24%_13.5%] gap-x-[4%] items-center"
653
+ className="grid text-[#464647] w-full [grid-template-columns:14%_32%_0.5%_24%_13.5%] gap-x-[4%] items-center"
654
654
  style={{ marginTop: showTopLabel ? "8px" : "" }}
655
655
  >
656
656
  {/* OPERATOR LOGO */}
@@ -946,7 +946,8 @@ function ServiceItemPB({
946
946
  color: isSoldOut ? "#c0c0c0" : colors.priceColor,
947
947
  top: 0,
948
948
  bottom: 0,
949
- left: "68%",
949
+ left: "clamp(75%, 75% + (100vw - 1300px) * 0.1, 80%)",
950
+ // left: "68%",
950
951
  right: 0,
951
952
  justifyContent: getNumberOfSeats() < 2 ? "center" : "",
952
953
  }}
package/src/components/ServiceItem/ServiceItemMobile.tsx CHANGED
@@ -611,7 +611,7 @@ function ServiceItemMobile({
611
611
 
612
612
  {serviceItem?.offer_text && (
613
613
  <div
614
- className={` text-white p-[10px_15px] text-left w-full flex items-center absolute -bottom-[40px] pt-[50px] z-10 rounded-b-[14px] min-[420]:text-[14px] text-[12px]`}
614
+ className={` text-white p-[10px_15px] text-left w-full flex items-center absolute -bottom-[35px] pt-[50px] z-10 rounded-b-[14px] min-[420]:text-[14px] text-[12px]`}
615
615
  style={{
616
616
  backgroundColor: isSoldOut ? "#ccc" : colors?.bottomStripColor,
617
617
  zIndex: -1,