@licklist/design 0.44.486-dev.78 → 0.44.486-dev.8

package/src/styles/iframe-events/Card.scss

@@ -142,7 +142,6 @@
     .card-body {
       padding: 0;
       margin: 0 0 auto;
-      margin-top: 1rem;
     }
   }
 

package/src/styles/notification/Notification.scss

@@ -15,10 +15,6 @@
       display: none !important;
     }
   }
-
-  &.is-invalid {
-    border-color: theme-color("danger");
-  }
 }
 
 .placeholder-row {

package/src/styles/packages.scss

@@ -13,6 +13,7 @@
 @import "./static";
 @import "./table";
 @import "./back-button";
+@import "./iframe-customers-journey";
 @import "./custom-fields";
 @import "./file-upload";
 @import "./iframe-events";
@@ -40,6 +41,3 @@
 @import "./striped-static-table/";
 @import "./image-radio-input/";
 @import "./radio-card/";
-@import "./activity-card/";
-@import "./date-time-button/";
-@import "./availability-indicator/";

package/src/styles/resources-blocking/_index.scss

@@ -7,16 +7,6 @@
     overflow: auto;
   }
 
-
-  .modal-form-content {
-    max-height: 21rem;
-    overflow-x: hidden;
-
-    .error-content {
-      min-width: 25rem;
-    }
-  }
-
   .reccurrence-interval-container {
     .form-group {
       margin-bottom: 0.5rem;
@@ -76,7 +66,6 @@
     display: flex;
     flex-direction: column;
     gap: 1rem;
-
   }
 
   .custom-checkbox {
@@ -143,10 +132,6 @@
     }
   }
 
-  .footer-with-short-notes {
-    min-width: 18rem;
-  }
-
   footer {
     display: flex;
     gap: 1.25rem;
@@ -163,4 +148,3 @@
     }
   }
 }
-

package/src/styles/sales/BookingResults.scss

@@ -5,14 +5,14 @@
     flex-wrap: wrap;
 
     .result-card {
-      height: 13.825rem;
+      height: 11.125rem;
       border: 1px solid $gray-400;
       max-width: calc(50% - 0.75rem);
       flex: 0 0 calc(50% - 0.75rem);
       transition: ease-in 0.25s;
       border-radius: 0.25rem;
       box-shadow: 0px 0px 0.125rem 0px rgb(0 0 0 / 20%);
-
+      
       .card-content {
         width: 100%;
         height: 100%;
@@ -28,7 +28,7 @@
           position: absolute;
           left: 0.5rem;
           top: 0.125rem;
-          font-weight: 600;
+          font-weight: 600;   
         }
 
         .order-people {
@@ -43,7 +43,7 @@
           height: 1.75rem;
           font-size: 0.625rem;
           line-height: 0.625rem;
-          color: #6d6d6d;
+          color: #6D6D6D;
           font-weight: 600;
 
           svg {
@@ -62,19 +62,11 @@
             font-size: 0.6875rem;
           }
         }
-
-        .products {
-          display: block;
-          width: 80%;
-          white-space: nowrap;
-          overflow: hidden;
-          text-overflow: ellipsis;
-        }
       }
 
       &:hover {
         box-shadow: 0px 0px 0.5rem 0px rgb(0 0 0 / 20%);
-        cursor: pointer;
+        cursor: pointer; 
       }
     }
 
@@ -93,4 +85,4 @@
       }
     }
   }
-}
+}

package/src/styles/themes/bookedit/_index.scss

@@ -46,7 +46,6 @@
 .header {
   background-color: color("white");
   padding: 0 2.5rem;
-  z-index: 2;
   min-height: 4rem;
   border-bottom: 1px solid #f0f0f0;
 }

package/src/styles/zones/ZoneForm.scss

@@ -3,8 +3,5 @@
   flex-wrap: wrap;
   gap: 1.5rem;
   height: 8rem;
-  padding-left: 1.5rem;
-  justify-content: start;
-  width: 95%;
   overflow: scroll;
 }

package/src/types/iframe.ts

@@ -15,7 +15,6 @@ export interface Product {
   isRequired?: boolean;
   isUnlimited?: boolean;
   images: CoreProduct["images"];
-  capacity?: number | null;
   uuid: string;
 }
 

package/src/typings.d.ts

@@ -28,14 +28,3 @@ declare module "*.json" {
 
 declare module "react-phone-number-input/input";
 declare module "react-phone-number-input/commonjs/Flag";
-
-// @TODO: this is a hofix for the following issue:
-// licklist_workspace_frontend/packages/design/src/product-set/hooks/useSortableTreeFunctions.ts(17,34):
-// semantic error TS2304: Cannot find name 'structuredClone'.
-interface WindowOrWorkerGlobalScope {
-  structuredClone(value: any, options?: StructuredSerializeOptions): any;
-}
-declare function structuredClone(
-  value: any,
-  options?: StructuredSerializeOptions
-): any;

package/src/virtualized/components/VirtualizedWindowScroller.tsx

@@ -39,8 +39,7 @@ const WrappedVirtualizedWindowScroller = ({
     if (!onDataUpdate) return;
 
     onDataUpdate();
-    // eslint-disable-next-line react-hooks/exhaustive-deps
-  }, [windowDimensions]);
+  }, [windowDimensions, scrollElement, gridRef, onDataUpdate]);
 
   return (
     <WindowScroller scrollElement={scrollElement}>

package/src/zone/form/ZoneForm.tsx

@@ -25,6 +25,7 @@ export const ZoneForm = ({
   onSubmit,
   serverErrors,
   isLoading = false,
+  workHours = [],
 }: ZoneFormProps) => {
   const { t } = useTranslation("Design");
   const form = useForm<ZoneFormValues>({
@@ -54,7 +55,7 @@ export const ZoneForm = ({
   return (
     <FormProvider {...form}>
       <Form onSubmit={handleSubmit(onFormSubmit)}>
-        <ZoneControl isLoading={isLoading} />
+        <ZoneControl isLoading={isLoading} workHours={workHours} />
         <Row>
           <Col md={6} sm={12} />
           <Col

package/src/zone/form/components/AvailableTimesControl.tsx

@@ -9,6 +9,7 @@ import { Form } from "react-bootstrap";
 import { UseFormSetError, useForm } from "react-hook-form";
 import { useId } from "@react-aria/utils";
 import { WorkHour } from "@licklist/core/dist/DataMapper/Provider/WorkHourDataMapper";
+import { calculateTimeWithOffset } from "@licklist/plugins/dist/utils/time";
 import { getCheckboxesByWorkHours } from "../utils/dates";
 
 export type AvailableTimesControlRef = {
@@ -23,8 +24,6 @@ type AvailableTimesControlProps = {
   defaultValues?: string[];
   startTime?: string;
   endTime?: string;
-  errorMessage?: string;
-  clearErrorMessage: () => void;
 };
 
 type AvailableTimesForm = { availableTimes: string[] };
@@ -32,95 +31,95 @@ type AvailableTimesForm = { availableTimes: string[] };
 export const AvailableTimesControl = forwardRef<
   AvailableTimesControlRef,
   AvailableTimesControlProps
->(
-  (
-    {
-      isLoading,
-      workHours,
-      defaultValues = [],
-      errorMessage,
-      clearErrorMessage,
-    },
-    ref
-  ) => {
-    const nameId = useId();
-    const { t } = useTranslation(["Design", "Validation"]);
-
-    const {
-      register,
-      formState: { errors },
-      reset,
+>(({ isLoading, workHours, defaultValues = [] }, ref) => {
+  const nameId = useId();
+  const { t } = useTranslation(["Design", "Validation"]);
+
+  const {
+    register,
+    formState: { errors },
+    reset,
+    trigger,
+    getValues,
+    setValue,
+    watch,
+    setError,
+  } = useForm<AvailableTimesForm>({ mode: "onChange" });
+
+  const availableTimes = watch("availableTimes") || [];
+
+  const checkboxes = useMemo(
+    () => getCheckboxesByWorkHours(workHours),
+    [workHours]
+  );
+
+  useImperativeHandle(ref, () => {
+    return {
       trigger,
       getValues,
-      setValue,
-      watch,
       setError,
-    } = useForm<AvailableTimesForm>({ mode: "onChange" });
-
-    const availableTimes = watch("availableTimes") || [];
-
-    const checkboxes = useMemo(
-      () => getCheckboxesByWorkHours(workHours),
-      [workHours]
-    );
-
-    useImperativeHandle(ref, () => {
-      return {
-        trigger,
-        getValues,
-        setError,
-      };
-    });
-
-    const onChange = (option: string) => {
-      const isAlreadyChecked = availableTimes.includes(option);
-      if (errorMessage) {
-        clearErrorMessage();
-      }
-      if (isAlreadyChecked) {
-        setValue(
-          "availableTimes",
-          availableTimes.filter((value) => value !== option)
-        );
-
-        return;
-      }
-
-      setValue("availableTimes", [...availableTimes, option]);
     };
+  });
+
+  const onChange = (option: string) => {
+    const timeWithOffset = calculateTimeWithOffset(option);
+
+    const isAlreadyChecked = availableTimes.includes(timeWithOffset);
+
+    if (isAlreadyChecked) {
+      setValue(
+        "availableTimes",
+        availableTimes.filter((value) => value !== timeWithOffset)
+      );
+
+      return;
+    }
+
+    setValue("availableTimes", [...availableTimes, timeWithOffset]);
+  };
+
+  useEffect(() => {
+    if (!defaultValues) return;
+
+    reset({ availableTimes: defaultValues });
+    // eslint-disable-next-line react-hooks/exhaustive-deps
+  }, [defaultValues]);
+
+  return (
+    <Form.Group controlId={nameId}>
+      <Form.Label>{t("Design:startTimes")}</Form.Label>
+      <div className="zone-available-times">
+        {checkboxes.map((option) => {
+          return (
+            <Form.Check key={option} inline custom id={option}>
+              <Form.Check.Input
+                type="checkbox"
+                value={option}
+                checked={availableTimes.includes(
+                  calculateTimeWithOffset(option)
+                )}
+                onChange={() => onChange(option)}
+                disabled={isLoading}
+              />
+              <Form.Check.Label>{option}</Form.Check.Label>
+            </Form.Check>
+          );
+        })}
+      </div>
 
-    useEffect(() => {
-      if (!defaultValues) return;
-
-      reset({ availableTimes: defaultValues });
-      // eslint-disable-next-line react-hooks/exhaustive-deps
-    }, [defaultValues]);
-
-    return (
-      <Form.Group controlId={nameId}>
-        <Form.Label>{t("Design:startTimes")}</Form.Label>
-        <div className="zone-available-times">
-          {checkboxes.map((option) => {
-            return (
-              <Form.Check key={option} inline custom id={option}>
-                <Form.Check.Input
-                  type="checkbox"
-                  value={option}
-                  checked={availableTimes.includes(option)}
-                  onChange={() => onChange(option)}
-                  disabled={isLoading}
-                />
-                <Form.Check.Label>{option}</Form.Check.Label>
-              </Form.Check>
-            );
-          })}
-        </div>
-
-        <Form.Control type="hidden" {...register("availableTimes")} />
-        <div className="manual-form-error">
-          {errors.availableTimes?.message || errorMessage}
-        </div>
-      </Form.Group>
-    );
-  }
-);
+      <Form.Control
+        type="hidden"
+        {...register("availableTimes", {
+          required: {
+            value: true,
+            message: t("Validation:fieldMinNumber", {
+              attribute: t("startTimes"),
+              min: 1,
+            }),
+          },
+        })}
+      />
+      <div className="manual-form-error">{errors.availableTimes?.message}</div>
+    </Form.Group>
+  );
+});

package/src/zone/form/components/ZoneControl.tsx

@@ -7,25 +7,26 @@ import { SortControl } from "./SortControl";
 import { ZoneRecurrencesControl } from "./ZoneRecurrencesControl";
 import { DescriptionControl } from "./DescriptionControl";
 import { ZoneImageControl } from "./ZoneImageControl";
-import { GameDurationControl } from "./GameDurationControl";
 
 export type ZoneControlProps = {
   isLoading: boolean;
   workHours?: WorkHour[];
 };
 
-export const ZoneControl = ({ isLoading }: ZoneControlProps) => {
+export const ZoneControl = ({
+  isLoading,
+  workHours = [],
+}: ZoneControlProps) => {
   return (
     <Row>
       <Col md={6} sm={12} className="pr-5">
         <NameControl isLoading={isLoading} />
-        <ZoneRecurrencesControl />
+        <ZoneRecurrencesControl workHours={workHours} isLoading={isLoading} />
         <hr />
         <Row>
           <Col md={6} sm={6}>
             <ZoneTypeControl isLoading={isLoading} />
             <SortControl isLoading={isLoading} />
-            <GameDurationControl isLoading={isLoading} />
           </Col>
           <Col md={6} sm={6}>
             <ZoneImageControl isLoading={isLoading} />

package/src/zone/form/components/ZoneRecurrencesControl.tsx

@@ -11,7 +11,12 @@ import {
 } from "@dnd-kit/sortable";
 import { DndContext } from "@dnd-kit/core";
 import { WorkHour } from "@licklist/core/dist/DataMapper/Provider/WorkHourDataMapper";
-
+import { DateTime } from "luxon";
+import { TIME_FORMAT } from "@licklist/core/dist/Config";
+import {
+  calculateTimeWithOffset,
+  DIRECTION_TO_LOCAL,
+} from "@licklist/plugins/dist/utils/time";
 import { CONFIRM_MODAL_ACTIONS } from "../../../modals/confirmation/ConfirmModal";
 import { Icon } from "../../../static";
 import {
@@ -19,6 +24,10 @@ import {
   RecurringDatePickerInputValues,
 } from "../../../recurring-date-picker-input/RecurringDatePickerInput";
 import { ZoneRecurrenceControl } from "./ZoneRecurrenceControl";
+import {
+  AvailableTimesControl,
+  AvailableTimesControlRef,
+} from "./AvailableTimesControl";
 import { sameWidthPopperModifier } from "../../../product-set/control/DateAndRecurrenceInput";
 
 export interface DateAndRecurrenceInputValues {
@@ -30,7 +39,10 @@ export type ZoneRecurrenceControlProps = {
   isLoading?: boolean;
 };
 
-export const ZoneRecurrencesControl = () => {
+export const ZoneRecurrencesControl = ({
+  workHours,
+  isLoading = false,
+}: ZoneRecurrenceControlProps) => {
   const {
     control,
     register,
@@ -54,7 +66,10 @@ export const ZoneRecurrencesControl = () => {
     values: null,
   });
   const clearEditState = () => setEditState({ index: null, values: null });
+  const [availableTimes, setAvailableTimes] = useState<string[]>([]);
+
   const popoverRef = useRef<HTMLDivElement>();
+  const availableTimesFormRef = useRef<AvailableTimesControlRef>();
 
   useClickAway(popoverRef, (event) => {
     const isModal = CONFIRM_MODAL_ACTIONS.includes(
@@ -77,12 +92,45 @@ export const ZoneRecurrencesControl = () => {
   const handleRecurringDateChange = async (
     next: RecurringDatePickerInputValues
   ) => {
+    const isAvailableTimesFormValid =
+      await availableTimesFormRef.current?.trigger();
+    if (!isAvailableTimesFormValid) {
+      return;
+    }
+    if (next?.startTime && next?.endTime) {
+      const startTime = DateTime.fromISO(next.startTime);
+      const endTime = DateTime.fromISO(next.endTime);
+      const { availableTimes } = availableTimesFormRef.current.getValues();
+      const validAvalilableTimes = availableTimes.every((time) => {
+        const currentAvailableTime = DateTime.fromFormat(
+          calculateTimeWithOffset(time, DIRECTION_TO_LOCAL),
+          TIME_FORMAT
+        );
+
+        return (
+          currentAvailableTime.diff(startTime, "minutes").minutes >= 0 &&
+          currentAvailableTime.diff(endTime, "minutes").minutes <= 0
+        );
+      });
+      if (!validAvalilableTimes) {
+        availableTimesFormRef.current.setError("availableTimes", {
+          message: t("Validation:fieldTimeBetween", {
+            attribute: t("Design:startTimesSmall"),
+            min: startTime.toFormat(TIME_FORMAT),
+            max: endTime.toFormat(TIME_FORMAT),
+          }),
+        });
+
+        return;
+      }
+    }
     const values = {
       rrule: next.rrule,
       startDate: next.startDate,
       endDate: next.endDate,
       startTime: next.startTime,
       endTime: next.endTime,
+      ...availableTimesFormRef.current.getValues(),
     } as Partial<ZoneRecurrence>;
 
     if (editState.values?.id) {
@@ -103,6 +151,7 @@ export const ZoneRecurrencesControl = () => {
     clearEditState();
 
     setEditState({ index, values: next });
+    setAvailableTimes(next.availableTimes || []);
     setIsDatePopoverVisible(() => true);
   };
 
@@ -166,7 +215,14 @@ export const ZoneRecurrencesControl = () => {
                 onChange={handleRecurringDateChange}
                 onDelete={handleDelete}
                 setInitialStartDateAfterSelect
-              />
+              >
+                <AvailableTimesControl
+                  workHours={workHours}
+                  isLoading={isLoading}
+                  defaultValues={availableTimes}
+                  ref={availableTimesFormRef}
+                />
+              </RecurringDatePickerInput>
             </Popover.Content>
           </Popover>
         }

package/src/zone/form/utils/dates.ts

@@ -1,7 +1,5 @@
-import { TIME_SEPARATOR } from "@licklist/core/dist/Services/Date";
+import { datetime, TIME_SEPARATOR } from "@licklist/core/dist/Services/Date";
 import { WorkHour } from "@licklist/core/dist/DataMapper/Provider/WorkHourDataMapper";
-import { DateTime } from "luxon";
-import { TIME_FORMAT } from "@licklist/core/dist/Config";
 
 const DEFAULT_START_DAY_TIME = "00:00";
 const DEFAULT_END_DAY_TIME = "23:59";
@@ -15,37 +13,46 @@ export const getTimeCheckboxRanges = (
   const [startHour, startMinutes] = startTime.split(TIME_SEPARATOR);
   const [endHour, endMinutes] = endTime.split(TIME_SEPARATOR);
 
-  let startDate = DateTime.now()
-    .setZone("UTC")
-    .set({
-      year: today.getFullYear(),
-      month: today.getMonth() + 1,
-      day: today.getDate(),
-      hour: Number(startHour),
-      minute: Number(startMinutes),
-      second: 0,
-    });
-
-  const endDate = DateTime.now()
-    .setZone("UTC")
-    .set({
-      year: today.getFullYear(),
-      month: today.getMonth() + 1,
-      day: today.getDate(),
-      hour: Number(endHour),
-      minute: Number(endMinutes),
-      second: 0,
-    });
-
-  const checkboxes: string[] = [startDate.toFormat(TIME_FORMAT)];
+  let startDate = datetime(
+    today.getFullYear(),
+    today.getMonth() + 1,
+    today.getDate(),
+    Number(startHour),
+    Number(startMinutes)
+  );
+
+  const endDate = datetime(
+    today.getFullYear(),
+    today.getMonth() + 1,
+    today.getDate(),
+    Number(endHour),
+    Number(endMinutes)
+  );
+
+  const dateSlices: { [key: string]: Date } = {
+    0: startDate,
+  };
   let count = 0;
 
-  while (endDate.diff(startDate, ["minutes"]).minutes >= range) {
-    startDate = startDate.plus({ minutes: range });
+  while (endDate >= startDate) {
+    startDate = new Date(startDate.getTime() + range * 60 * 1000);
     count += 1;
-    checkboxes[count] = startDate.toFormat(TIME_FORMAT);
+    dateSlices[count] = startDate;
   }
 
+  const checkboxes = Object.keys(dateSlices)
+    .map((key) => {
+      const date = dateSlices[key];
+      if (date < endDate) {
+        const [, time] = date.toISOString().split("T");
+        const [selectedHours, selectedMinutes] = time.split(TIME_SEPARATOR);
+
+        return [selectedHours, selectedMinutes].join(TIME_SEPARATOR);
+      }
+      return null;
+    })
+    .filter(Boolean);
+
   return checkboxes;
 };
 

package/dist/assets/iframe/available.svg.js

@@ -1 +0,0 @@
-"use strict";Object.defineProperty(exports,"__esModule",{value:!0});var e,t,r,n,i=require("react");(e=i)&&"object"==typeof e&&"default"in e&&e.default;function f(){return f=Object.assign?Object.assign.bind():function(e){for(var t=1;t<arguments.length;t++){var r=arguments[t];for(var n in r)Object.prototype.hasOwnProperty.call(r,n)&&(e[n]=r[n])}return e},f.apply(this,arguments)}exports.ReactComponent=function(e){return i.createElement("svg",f({width:7,height:11,fill:"none",xmlns:"http://www.w3.org/2000/svg"},e),t||(t=i.createElement("rect",{x:.944,y:1.037,width:5.252,height:3.049,rx:1.5,fill:"#4CF973",stroke:"#fff"})),r||(r=i.createElement("rect",{x:.944,y:4.11,width:5.252,height:3.049,rx:1.5,fill:"#4CF973",stroke:"#fff"})),n||(n=i.createElement("rect",{x:.944,y:7.183,width:5.252,height:3.049,rx:1.5,fill:"#4CF973",stroke:"#fff"})))};

package/dist/assets/iframe/limited.svg.js

@@ -1 +0,0 @@
-"use strict";Object.defineProperty(exports,"__esModule",{value:!0});var e,t,r,n,i=require("react");(e=i)&&"object"==typeof e&&"default"in e&&e.default;function f(){return f=Object.assign?Object.assign.bind():function(e){for(var t=1;t<arguments.length;t++){var r=arguments[t];for(var n in r)Object.prototype.hasOwnProperty.call(r,n)&&(e[n]=r[n])}return e},f.apply(this,arguments)}exports.ReactComponent=function(e){return i.createElement("svg",f({width:7,height:11,fill:"none",xmlns:"http://www.w3.org/2000/svg"},e),t||(t=i.createElement("rect",{x:1.241,y:1.037,width:5.252,height:3.049,rx:1.5,fill:"#E4E4E4",stroke:"#fff"})),r||(r=i.createElement("rect",{x:1.241,y:4.11,width:5.252,height:3.049,rx:1.5,fill:"#FDD054",stroke:"#fff"})),n||(n=i.createElement("rect",{x:1.241,y:7.183,width:5.252,height:3.049,rx:1.5,fill:"#FDD054",stroke:"#fff"})))};

package/dist/assets/iframe/soldOut.svg.js

@@ -1 +0,0 @@
-"use strict";Object.defineProperty(exports,"__esModule",{value:!0});var e,t,r,n,f,i=require("react");(e=i)&&"object"==typeof e&&"default"in e&&e.default;function l(){return l=Object.assign?Object.assign.bind():function(e){for(var t=1;t<arguments.length;t++){var r=arguments[t];for(var n in r)Object.prototype.hasOwnProperty.call(r,n)&&(e[n]=r[n])}return e},l.apply(this,arguments)}exports.ReactComponent=function(e){return i.createElement("svg",l({width:7,height:10,fill:"none",xmlns:"http://www.w3.org/2000/svg"},e),t||(t=i.createElement("path",{fill:"#fff",d:"M.497 0h5.94v10H.497z"})),r||(r=i.createElement("rect",{x:.591,y:.5,width:5.752,height:3,rx:1.5,fill:"#E4E4E4",stroke:"#fff"})),n||(n=i.createElement("rect",{x:.591,y:3.5,width:5.752,height:3,rx:1.5,fill:"#E4E4E4",stroke:"#fff"})),f||(f=i.createElement("rect",{x:.591,y:6.5,width:5.752,height:3,rx:1.5,fill:"#E4E4E4",stroke:"#fff"})))};

package/dist/assets/logo/favicon.svg

@@ -1,12 +0,0 @@
-<?xml version="1.0"?>
-<svg width="200" height="201" xmlns="http://www.w3.org/2000/svg" xmlns:svg="http://www.w3.org/2000/svg" version="1.1">
-    <title>Single Colour - Light Blue Light</title>
-    <g class="layer">
-        <title>Layer 1</title>
-        <g fill="none" fill-rule="evenodd" id="Page-1">
-            <g fill="#0E8CE2" fill-rule="nonzero" id="Logo-Export" transform="translate(0 -1835)">
-                <path d="m52.59,1861.52c16.49,-16.49 24.18,-20.75 33.43,-23.55c9.25,-2.8 18.71,-2.8 27.95,0c9.25,2.8 16.95,7.06 33.43,23.55l26.95,26.94c16.48,16.49 20.74,24.18 23.54,33.43c2.81,9.25 2.81,18.71 0,27.95c-2.8,9.25 -7.06,16.95 -23.54,33.43l-26.95,26.95c-16.48,16.48 -24.18,20.74 -33.43,23.54c-9.24,2.81 -18.7,2.81 -27.95,0c-9.25,-2.8 -16.94,-7.06 -33.43,-23.54l-26.94,-26.95c-16.49,-16.48 -20.75,-24.18 -23.55,-33.43c-2.8,-9.24 -2.8,-18.7 0,-27.95c2.8,-9.25 7.06,-16.94 23.55,-33.43l26.94,-26.94zm14.82,14.04l-27.33,27.33c-12.85,12.85 -16.37,18.05 -18.45,24.92c-1.63,5.39 -1.63,10.73 0,16.11c2.06,6.8 5.53,11.97 18.06,24.54l27.72,27.71c12.57,12.54 17.73,16 24.53,18.06c5.39,1.64 10.73,1.64 16.11,0c6.87,-2.08 12.07,-5.59 24.92,-18.44l26.95,-26.95c12.85,-12.85 16.36,-18.05 18.44,-24.92c1.64,-5.38 1.64,-10.72 0,-16.11c-2.08,-6.87 -5.59,-12.07 -18.44,-24.92l-26.95,-26.94c-12.85,-12.85 -18.05,-16.37 -24.92,-18.45c-5.38,-1.63 -10.72,-1.63 -16.11,0c-6.8,2.06 -11.96,5.53 -24.53,18.06zm67.18,50.6c5.48,-5.47 14.37,-5.47 19.85,0c5.47,5.48 5.47,14.37 0,19.85l-44.2,44.19c-5.48,5.48 -14.36,5.48 -19.84,0l-6.45,-6.45c-1.21,-1.21 -1.52,-1.77 -1.72,-2.45c-0.21,-0.68 -0.21,-1.37 0,-2.05c0.2,-0.67 0.51,-1.24 1.72,-2.44l50.64,-50.65zm-73.77,24.53c1.32,-1.32 3.11,-2.06 4.97,-2.05l25.82,0.06c1.4,0 2.54,1.15 2.54,2.55c0,0.67 -0.26,1.3 -0.72,1.78l-1.36,1.4l-16.1,15.95c-1.49,1.48 -3.91,1.48 -5.4,-0.01l-9.75,-9.76c-2.74,-2.74 -2.74,-7.18 0,-9.92" id="Single-Colour---Light-Blue-Light"/>
-            </g>
-        </g>
-    </g>
-</svg>