diff --git a/src/ui_kit/FloatingSupportChat/Chat.tsx b/src/ui_kit/FloatingSupportChat/Chat.tsx
index 75e992a6..14a12e43 100644
--- a/src/ui_kit/FloatingSupportChat/Chat.tsx
+++ b/src/ui_kit/FloatingSupportChat/Chat.tsx
@@ -218,6 +218,7 @@ export default function Chat({ sx }: Props) {
display: "flex",
flexDirection: "column",
gap: "3px",
+ color: theme.palette.common.white,
}}
>
Мария
diff --git a/src/ui_kit/FloatingSupportChat/ChatMessage.tsx b/src/ui_kit/FloatingSupportChat/ChatMessage.tsx
index 3f6c15e0..58419860 100644
--- a/src/ui_kit/FloatingSupportChat/ChatMessage.tsx
+++ b/src/ui_kit/FloatingSupportChat/ChatMessage.tsx
@@ -24,10 +24,11 @@ export default function ChatMessage({
: theme.palette.grey1.main;
const date = new Date(createdAt);
+ const today = isDateToday(date);
const time = date.toLocaleString([], {
hour: "2-digit",
minute: "2-digit",
- ...(!isDateToday(date) && {
+ ...(!today && {
year: "2-digit",
month: "2-digit",
day: "2-digit",
@@ -38,10 +39,8 @@ export default function ChatMessage({
- );
-}
diff --git a/src/ui_kit/FloatingSupportChat/FloatingSupportChat.tsx b/src/ui_kit/FloatingSupportChat/FloatingSupportChat.tsx
index c984ec00..1286f72f 100644
--- a/src/ui_kit/FloatingSupportChat/FloatingSupportChat.tsx
+++ b/src/ui_kit/FloatingSupportChat/FloatingSupportChat.tsx
@@ -1,35 +1,24 @@
-import { Box, Fab, Typography } from "@mui/material";
+import { Box, Fab, useTheme, useMediaQuery } from "@mui/material";
import { useState } from "react";
-import CircleDoubleDown from "./CircleDoubleDownIcon";
+import CircleDoubleDown from "./QuestionIcon";
+
import Chat from "./Chat";
+const animation = {
+ "@keyframes runningStripe": {
+ "0%": { left: "10%", backgroundColor: "transparent" },
+ "10%": { backgroundColor: "#ffffff" },
+ "50%": { backgroundColor: "#ffffff", transform: "translate(400px, 0)" },
+ "80%": { backgroundColor: "#ffffff" },
+ "100%": { backgroundColor: "transparent", boxShadow: "none", left: "100%" },
+ },
+};
+
export default function FloatingSupportChat() {
const [isChatOpened, setIsChatOpened] = useState(false);
+ const theme = useTheme();
+ const isMobile = useMediaQuery(theme.breakpoints.down(800));
- const animation = {
- "@keyframes runningStripe": {
- "0%": {
- left: "10%",
- backgroundColor: "transparent",
- },
- "10%": {
- backgroundColor: "#ffffff",
- },
- "50%": {
- backgroundColor: "#ffffff",
- transform: "translate(400px, 0)",
- },
- "80%": {
- backgroundColor: "#ffffff",
- },
-
- "100%": {
- backgroundColor: "transparent",
- boxShadow: "none",
- left: "100%",
- },
- },
- };
return (
{isChatOpened && (
-
+
)}
)}
-
-
- {!isChatOpened && (
- Задайте нам вопрос
- )}
+
);
diff --git a/src/ui_kit/FloatingSupportChat/QuestionIcon.tsx b/src/ui_kit/FloatingSupportChat/QuestionIcon.tsx
new file mode 100644
index 00000000..538da694
--- /dev/null
+++ b/src/ui_kit/FloatingSupportChat/QuestionIcon.tsx
@@ -0,0 +1,36 @@
+import { Box } from "@mui/material";
+
+export default function CircleDoubleDown() {
+ return (
+
+
+
+
+
+
+ );
+}