nestiq-component-library 1.1.172 → 1.2.1

package/src/components/MessagePopup/PopUp.css

@@ -1,408 +0,0 @@
-.popup-overlay {
-  position: fixed; /* Fixed position to cover the whole screen */
-  top: 0;
-  left: 0;
-  right: 0;
-  bottom: 0;
-  background-color: rgba(0, 0, 0, 0.5); /* Semi-transparent background */
-  display: flex; /* Flexbox to center the popup */
-  justify-content: center; /* Center horizontally */
-  align-items: center; /* Center vertically */
-  z-index: 2000; /* Ensure it's above other content */
-}
-
-.shareSection {
-  height: 340px;
-  padding: 40px;
-  border-radius: 16px;
-  box-shadow: 0 4px 4px 0 rgba(0, 0, 0, 0.25);
-  border: solid 1px #d7d9e3;
-  background-color: #fff;
-}
-.popUpHeader {
-  height: 48px;
-  font-size: 32px;
-  font-weight: 600;
-  color: #1b1b1b;
-}
-
-.closeIcon {
-  width: 16px;
-  height: 16px;
-  cursor: pointer;
-}
-
-.socialMediaIconsSection {
-  gap: 60px !important;
-}
-
-.socialMediaIcons {
-  width: 28px !important;
-  height: 28px !important;
-  cursor: pointer;
-}
-
-.socialMediaIconText {
-  height: 36px;
-  font-size: 13px;
-  font-weight: 500;
-  line-height: 3;
-  color: #344041;
-  cursor: pointer;
-}
-
-.popup_search-input {
-  height: 60px;
-  padding-inline-end: 190px;
-  font-size: 20px;
-  box-shadow: inset 0 4px 4px 0 rgba(0, 0, 0, 0.25);
-  background-color: rgba(0, 0, 0, 0.05);
-}
-
-.popup_search-input::placeholder {
-  font-size: 20px;
-  color: rgba(140, 140, 140, 0.5);
-}
-
-.popup_search-input:focus {
-  outline: none;
-}
-
-.popupcustom-button {
-  height: 35px;
-  color: #000;
-  cursor: pointer;
-  border-color: var(--main-yellow);
-  right: 0;
-  z-index: 1;
-  background-image: var(--gradient);
-  box-shadow: 0 4px 4px 0 rgba(0, 0, 0, 0.25);
-}
-.button-text {
-  width: 115px;
-  height: 19px;
-  flex-grow: 0;
-  font-family: Inter;
-  font-size: 16px;
-  font-weight: 500;
-  font-stretch: normal;
-  font-style: normal;
-  line-height: normal;
-  letter-spacing: normal;
-  text-align: center;
-}
-.button_success-right {
-  width: 184px;
-  height: 43px;
-  flex-grow: 0;
-  display: flex;
-  flex-direction: row;
-  justify-content: center;
-  align-items: center;
-  gap: 8px;
-  padding: 12px 24px;
-  border-radius: 16px;
-  border-color: #000;
-  background-color: transparent;
-}
-.button_success-left {
-  width: 200px;
-  height: 43px;
-  flex-grow: 0;
-  display: flex;
-  flex-direction: row;
-  justify-content: center;
-  align-items: center;
-  gap: 8px;
-  padding: 12px 24px;
-  border-radius: 16px;
-  box-shadow: 0 4px 4px 0 rgba(0, 0, 0, 0.25);
-  background-color: var(--main-yellow);
-}
-.shareSection-Success {
-  height: 510px;
-  padding: 40px;
-  border-radius: 16px;
-  box-shadow: 0 4px 4px 0 rgba(0, 0, 0, 0.25);
-  border: solid 1px #d7d9e3;
-  background-color: #fff;
-}
-.shareSection-Error {
-  height: 400px;
-  padding: 10px;
-  border-radius: 16px;
-  box-shadow: 0 4px 4px 0 rgba(0, 0, 0, 0.25);
-  border: solid 1px #d7d9e3;
-  background-color: #fff;
-}
-.MessageShareSection {
-  height: 513px;
-  padding: 14px 14px;
-  border-radius: 16px;
-  box-shadow: 0 4px 4px 0 rgba(0, 0, 0, 0.25);
-  border: solid 1px #d7d9e3;
-  background-color: #fff;
-}
-
-.popup-tags {
-  font-size: large;
-  font-weight: bold;
-}
-.button_icon-left {
-  width: 184px;
-  height: 43px;
-  flex-grow: 0;
-  display: flex;
-  flex-direction: row;
-  justify-content: center;
-  align-items: center;
-  gap: 8px;
-  padding: 12px 24px;
-  border-radius: 16px;
-  box-shadow: 0 4px 4px 0 rgba(0, 0, 0, 0.25);
-}
-.main_button {
- width: 184px;
-  height: 43px;
-  flex-grow: 0;
-  display: flex;
-  flex-direction: row;
-  justify-content: center;
-  align-items: center;
-  gap: 8px;
-  padding: 12px 24px;
-  border-radius: 16px;
-  box-shadow: 0 4px 4px 0 rgba(0, 0, 0, 0.25);
-  background-image: var(--gradient);
-}
-.button-text {
-  width: 85px;
-  height: 19px;
-  flex-grow: 0;
-  font-family: Inter;
-  font-size: 16px;
-  font-weight: 500;
-  font-stretch: normal;
-  font-style: normal;
-  line-height: normal;
-  letter-spacing: normal;
-  text-align: center;
-}
-.button_icon-right {
-  width: 184px;
-  height: 43px;
-  flex-grow: 0;
-  display: flex;
-  flex-direction: row;
-  justify-content: center;
-  align-items: center;
-  gap: 8px;
-  padding: 12px 24px;
-  border-radius: 16px;
-  border-color: #000;
-  background-color: transparent;
-}
-.circle {
-  height: 55px;
-  width: 55px;
-  background-color: transparent;
-  border-radius: 50%;
-  border-style: solid;
-  border-color: #000;
-  border-width: 2px;
-}
-.Line-9,
-.Line-10 {
-  height: 1px;
-  flex-grow: 1;
-  background-color: rgba(140, 140, 140, 0.5);
-  max-width: 18rem;
-  align-self: center;
-  align-content: center;
-}
-
-.middle-container {
-  display: flex;
-  align-items: center;
-  justify-content: center;
-}
-
-.middle-text {
-  margin: 25px 25px;
-}
-.google-button {
-  width: 260px;
-  height: 45px;
-  flex-grow: 0;
-  display: flex;
-  flex-direction: row;
-  justify-content: center;
-  align-items: center;
-  gap: 8px;
-  padding: 12px 24px;
-  border-radius: 4px;
-  background-color: #000000;
-  background: linear-gradient(to top, #000, #666);
-}
-.Account-popup {
-  height: 713px;
-  padding: 10px;
-  border-radius: 16px;
-  box-shadow: 0 4px 4px 0 rgba(0, 0, 0, 0.25);
-  border: solid 1px #d7d9e3;
-  background-color: #fff;
-  max-width: 1000px;
-}
-.lightertxt {
-  color: #797979;
-}
-
-.filter {
-  height: 343px;
-  align-self: stretch;
-  flex-grow: 0;
-  display: flex;
-  flex-direction: column;
-  gap: 2px;
-  padding: 32px;
-  border-radius: 32px;
-  box-shadow: inset 0 4px 10px 0 rgba(0, 0, 0, 0.15);
-  background-color: #f2f2f2;
-}
-.loginFilter {
-  height: 280px;
-  align-self: stretch;
-  flex-grow: 0;
-  display: flex;
-  flex-direction: column;
-  gap: 2px;
-  padding: 32px;
-  border-radius: 32px;
-  box-shadow: inset 0 4px 10px 0 rgba(0, 0, 0, 0.15);
-  background-color: #f2f2f2;
-}
-.radioLabel {
-  width: 176px;
-  height: 19px;
-  flex-grow: 0;
-  font-family: Inter;
-  font-size: 16px;
-  font-weight: normal;
-  font-stretch: normal;
-  font-style: normal;
-  line-height: normal;
-  letter-spacing: normal;
-  text-align: left;
-  color: #1b1b1b;
-}
-.goButton-text {
-  width: 78px;
-  height: 19px;
-  flex-grow: 0;
-  font-family: Inter;
-  font-size: 16px;
-  font-weight: 500;
-  font-stretch: normal;
-  font-style: normal;
-  line-height: normal;
-  letter-spacing: normal;
-  text-align: center;
-  color: #1b1b1b;
-}
-.placeholders {
-  width: 232px;
-  height: 45px;
-  flex-grow: 0;
-  display: flex;
-  flex-direction: row;
-  justify-content: flex-start;
-  align-items: center;
-  gap: 8px;
-  padding: 12px 24px;
-  border-radius: 4px;
-  background-image: linear-gradient(to top, #000 100%, #666 0%);
-}
-.TagW.active {
-  height: 40px;
-  flex-grow: 1;
-  display: flex;
-  flex-direction: row;
-  justify-content: center;
-  align-items: center;
-  gap: 6px;
-  padding: 0 24px;
-  border-radius: 16px;
-  box-shadow: 0 4px 4px 0 rgba(0, 0, 0, 0.25);
-  background-image: linear-gradient(to top, #000, #666);
-  color: white;
-}
-.Tag {
-  height: 40px;
-  flex-grow: 1;
-  display: flex;
-  flex-direction: row;
-  justify-content: center;
-  align-items: center;
-  gap: 6px;
-  padding: 0 24px;
-  border-radius: 16px;
-  box-shadow: 0 4px 4px 0 rgba(0, 0, 0, 0.25);
-  background-image: linear-gradient(
-    to top,
-    rgba(255, 0, 0, 0),
-    rgba(255, 0, 0, 1)
-  );
-}
-.TagW {
-  height: 40px;
-  flex-grow: 1;
-  display: flex;
-  flex-direction: row;
-  justify-content: center;
-  align-items: center;
-  gap: 6px;
-  padding: 0 24px;
-  border-radius: 16px;
-  border: solid 1px #000;
-  background-color: #fff;
-  color: #000;
-}
-/* */
-@media (min-width: 375px) and (max-width: 667px) {
-  .Account-popup {
-    height: 650px !important;
-    padding: 10px;
-    border-radius: 16px;
-    box-shadow: 0 4px 4px 0 rgba(0, 0, 0, 0.25);
-    border: solid 1px #d7d9e3;
-    background-color: #fff;
-    width: 90vw;
-  }
-  .filter {
-  height: 260px;
-  align-self: stretch;
-  flex-grow: 0;
-  display: flex;
-  flex-direction: column;
-  gap: 2px;
-  padding: 32px;
-  border-radius: 32px;
-  box-shadow: inset 0 4px 10px 0 rgba(0, 0, 0, 0.15);
-  background-color: #f2f2f2;
-}
-.middle-text {
-  margin: 5px 25px;
-}
-.loginFilter {
-  height: 180px;
-  align-self: stretch;
-  flex-grow: 0;
-  display: flex;
-  flex-direction: column;
-  gap: 2px;
-  padding: 32px;
-  border-radius: 32px;
-  box-shadow: inset 0 4px 10px 0 rgba(0, 0, 0, 0.15);
-  background-color: #f2f2f2;
-}
-}

package/src/components/MessagePopup/SuccessPopup.tsx

@@ -1,64 +0,0 @@
-import x from "../../assets/images/icon_close_2.png";
-import "./PopUp.css";
-import icon_checkmark from "../../assets/Images/icon_checkmark.svg";
-import React, { useState } from "react";
-
-interface PopupProps {
-    onClick: any;
-}
-export default function SuccessPopUp(props: PopupProps) {
-  const [showSuccessPopUp, setShowSuccessPopUp] = useState(true);
-
-  const handleClose = () => {
-    props.onClick();
-  };
-
-  return (
-    <div>
-      <div className="popup-overlay">
-        <div className="shareSection-Success  d-flex  flex-column  col-7 ">
-          <img
-            src={x}
-            alt="close"
-            className="closeIcon d-flex flex-column align-self-end ms-5 "
-            onClick={handleClose}
-          />
-          <div className=" d-flex flex-column align-self-center ms-5 ">
-            <img src={icon_checkmark} alt="facebook" className=" mb-4" />
-          </div>
-          <div className="popUpHeader d-flex flex-column col- text-center text-wrap mb-5 align-self-center">
-            <span> Herzlichen Glückwunsch! </span>
-            <span> Deine Nachricht wurde erfolgreich gesendet. </span>
-          </div>
-
-          <div className="d-flex flex-column mt-4 mb-4">
-            <span className="text-center ms-5 text-wrap">
-              Neben vielen weiteren Einstellungen und Aktionen kannst du die
-              Antwort auf deine Nachricht in deinem Control Center einsehen,
-              sobald der Verkäufer darauf reagiert hat.
-            </span>
-          </div>
-
-          <div className=" d-flex flex-row align-self-center ">
-            <button
-              className="d-flex button_success-left col-sm-5  border-0  rounded-4"
-              type="button"
-              id="button"
-              onClick={handleClose}
-            >
-              <strong> Zum Control Center</strong>
-            </button>
-
-            <button
-              className="button_success-right col-sm-3 border-1 ms-3 rounded-4"
-              type="button"
-              id="button"
-            >
-              <strong>Abbrechen</strong>
-            </button>
-          </div>
-        </div>
-      </div>
-    </div>
-  );
-}