fixed css issues

talyaron · Sep 2, 2024 · 93ec1c5 · 93ec1c5
1 parent ff30d77
commit 93ec1c5
Show file tree

Hide file tree

Showing 7 changed files with 158 additions and 158 deletions.
diff --git a/src/assets/Languages/he.json b/src/assets/Languages/he.json
@@ -157,7 +157,7 @@
     "Bravo! Your passcode is correct. Welcome aboard!": "בראבו! קוד הגישה שלך נכון. ברוכים הבאים!",
     "Something went wrong. Please try again!": "משהו השתבש. בבקשה נסה שוב!",
     "Submit": "שלח",
-    "Click on": "תלחץ על",
+    "Click on": "לחץ/י על",
     "Add suggestion button": "הוסף פתרון",
     "to add your suggestion": "כדי להוסיף את הפתרון שלך",
     "Add suggestion":"הוסף פתרון",

diff --git a/src/view/pages/statement/components/chat/components/StatementChatMore.scss b/src/view/pages/statement/components/chat/components/StatementChatMore.scss
@@ -36,7 +36,7 @@
             color: white;
             font-size: 0.75rem;
             margin-left: 5px;
-            z-index: 100;
+            z-index: 0;
         }
     }
 

diff --git a/src/view/pages/statement/components/nav/bottom/StatementBottomNav.scss b/src/view/pages/statement/components/nav/bottom/StatementBottomNav.scss
@@ -11,9 +11,8 @@ $addOptionSize: 60px;
     display: flex;
     justify-content: space-between;
     bottom: 0px;
-
     z-index: 10;
-    padding: 5px 5px 60px 5px;
+    padding: 5px 5px 30px 5px;
     // background-color: teal;
     background: rgb(252, 252, 252);
     background: linear-gradient(180deg, rgba(252, 252, 252, 0) 0%, rgba(255, 255, 255, 0.8687850140056023) 37%, rgba(255, 255, 255, 1) 100%);
@@ -59,7 +58,7 @@ $addOptionSize: 60px;
                 align-items: center;
                 justify-content: center;
                 background-color: var(--white);
-
+                box-shadow: 2px 2px 5px var(--shadow);
                 border-radius: 50%;
                 cursor: pointer;
                 transition: all 1s ease;
@@ -71,7 +70,7 @@ $addOptionSize: 60px;
                     width: 26px;
                 }
 
-                box-shadow: 2px 2px 5px var(--shadow);
+
 
 
             }

diff --git a/src/view/pages/statement/components/nav/bottom/StatementBottomNav.tsx b/src/view/pages/statement/components/nav/bottom/StatementBottomNav.tsx
@@ -5,8 +5,7 @@ import { Statement, Screen, StatementType } from "delib-npm";
 import { Link, useParams } from "react-router-dom";
 
 // Icons
-import LightIcon from "@/assets/icons/lightBulbIcon.svg?react";
-import NavQuestionIcon from "@/assets/icons/questionIcon.svg?react";
+
 import PlusIcon from "@/assets/icons/plusIcon.svg?react";
 import AgreementIcon from "@/assets/icons/agreementIcon.svg?react";
 import RandomIcon from "@/assets/icons/randomIcon.svg?react";
@@ -16,12 +15,12 @@ import SortIcon from "@/assets/icons/sort.svg?react";
 
 import useStatementColor from "@/controllers/hooks/useStatementColor";
 import {
-  NavItem,
-  optionsArray,
-  questionsArray,
-  votesArray,
+	NavItem,
+	optionsArray,
+	questionsArray,
+	votesArray,
 } from "./StatementBottomNavModal";
-import IconButton from "@/view/components/iconButton/IconButton";
+
 import "./StatementBottomNav.scss";
 
 interface Props {
@@ -31,106 +30,106 @@ interface Props {
 }
 
 const StatementBottomNav: FC<Props> = ({ setShowModal, statement }) => {
-  const { page } = useParams();
+	const { page } = useParams();
 
-  const navItems = getNavigationScreens(page);
+	const navItems = getNavigationScreens(page);
 
-  const [isNavigationOpen, setIsNavigationOpen] = useState(false);
-  const [showSorting, setShowSorting] = useState(false);
+	const [isNavigationOpen, setIsNavigationOpen] = useState(false);
+	const [showSorting, setShowSorting] = useState(false);
 
-  const statementColor = useStatementColor(
-    statement.statementType || StatementType.statement
-  );
+	const statementColor = useStatementColor(
+		statement.statementType || StatementType.statement
+	);
 
-  //used to check if the user can add a new option in voting and in evaluation screens
-  const addOption: boolean | undefined =
+	//used to check if the user can add a new option in voting and in evaluation screens
+	const addOption: boolean | undefined =
     statement.statementSettings?.enableAddEvaluationOption;
 
-  const addVotingOption: boolean | undefined =
+	const addVotingOption: boolean | undefined =
     statement.statementSettings?.enableAddVotingOption;
 
-  const showAddOptionEvaluation = page === Screen.OPTIONS && addOption;
-  const showAddOptionVoting = page === Screen.VOTE && addVotingOption;
-  const showAddQuestion = page === Screen.QUESTIONS;
-  const isAddOption =
+	const showAddOptionEvaluation = page === Screen.OPTIONS && addOption;
+	const showAddOptionVoting = page === Screen.VOTE && addVotingOption;
+	const showAddQuestion = page === Screen.QUESTIONS;
+	const isAddOption =
     showAddOptionEvaluation || showAddOptionVoting || showAddQuestion;
 
-  const handleMidIconClick = () => {
+	const handleMidIconClick = () => {
 
-    if (isAddOption) {
-      setShowModal(true);
-    }
+		if (isAddOption) {
+			setShowModal(true);
+		}
 
-  };
-
-  function handleSortingClick() {
-    setShowSorting(!showSorting);
-
-
-  }
-
-
-
-  return (
-    <>
-      {isNavigationOpen && (
-        <div
-          className="invisibleBackground"
-          onClick={() => setIsNavigationOpen(false)}
-        />
-      )}
-      <div className="statement-bottom-nav">
-        <button
-          className="add-option-button"
-          style={statementColor}
-          onClick={handleMidIconClick}
-          data-cy="bottom-nav-mid-icon"
-        >
-          {isAddOption && (
-            <PlusIcon style={{ color: statementColor.color }} />
-          ) }
-        </button>
-        <div className="sort-menu">
-          {navItems.map((navItem) => (
-            <div className={`sort-menu__item  ${showSorting ? "active" : ""}`}>
-              <Link
-                className={`open-nav-icon ${showSorting ? "active" : ""}`}
-                to={navItem.link}
-                key={navItem.id}
-                onClick={() => setShowSorting(false)}
-              >
-                <NavIcon
-                  name={navItem.name}
-                  color={statementColor.backgroundColor}
-                />
-              </Link>
-              <span className="button-name">{navItem.name}</span>
-            </div>
-          ))}
-          <div className="sort-button" onClick={handleSortingClick}>
-            <SortIcon />
-          </div>
-        </div>
-      </div>
-    </>
-  );
+	};
+
+	function handleSortingClick() {
+		setShowSorting(!showSorting);
+
+
+	}
+
+
+
+	return (
+		<>
+			{isNavigationOpen && (
+				<div
+					className="invisibleBackground"
+					onClick={() => setIsNavigationOpen(false)}
+				/>
+			)}
+			<div className="statement-bottom-nav">
+				<button
+					className="add-option-button"
+					style={statementColor}
+					onClick={handleMidIconClick}
+					data-cy="bottom-nav-mid-icon"
+				>
+					{isAddOption && (
+						<PlusIcon style={{ color: statementColor.color }} />
+					) }
+				</button>
+				<div className="sort-menu">
+					{navItems.map((navItem) => (
+						<div className={`sort-menu__item  ${showSorting ? "active" : ""}`}>
+							<Link
+								className={`open-nav-icon ${showSorting ? "active" : ""}`}
+								to={navItem.link}
+								key={navItem.id}
+								onClick={() => setShowSorting(false)}
+							>
+								<NavIcon
+									name={navItem.name}
+									color={statementColor.backgroundColor}
+								/>
+							</Link>
+							<span className="button-name">{navItem.name}</span>
+						</div>
+					))}
+					<div className="sort-button" onClick={handleSortingClick}>
+						<SortIcon />
+					</div>
+				</div>
+			</div>
+		</>
+	);
 };
 
 export default StatementBottomNav;
 
 function getNavigationScreens(page: string | undefined): NavItem[] {
-  if (!page) return optionsArray;
-
-  switch (page) {
-    case Screen.VOTE:
-      return votesArray;
-    case Screen.OPTIONS:
-      return optionsArray;
-    case Screen.QUESTIONS:
-      return questionsArray;
-    default:
-      return optionsArray;
-  }
+	if (!page) return optionsArray;
+
+	switch (page) {
+	case Screen.VOTE:
+		return votesArray;
+	case Screen.OPTIONS:
+		return optionsArray;
+	case Screen.QUESTIONS:
+		return questionsArray;
+	default:
+		return optionsArray;
+	}
 }
 
 interface NavIconProps {
@@ -139,17 +138,17 @@ interface NavIconProps {
 }
 
 const NavIcon: FC<NavIconProps> = ({ name, color }) => {
-  const props = { style: { color } };
-  switch (name) {
-    case "New":
-      return <NewestIcon {...props} />;
-    case "Update":
-      return <UpdateIcon {...props} />;
-    case "Random":
-      return <RandomIcon {...props} />;
-    case "Agreement":
-      return <AgreementIcon {...props} />;
-    default:
-      return null;
-  }
+	const props = { style: { color } };
+	switch (name) {
+	case "New":
+		return <NewestIcon {...props} />;
+	case "Update":
+		return <UpdateIcon {...props} />;
+	case "Random":
+		return <RandomIcon {...props} />;
+	case "Agreement":
+		return <AgreementIcon {...props} />;
+	default:
+		return null;
+	}
 };