Merge pull request #12 from shefing/designLineDefination

Design line defination
shefing · Jan 22, 2024 · 9efc995 · 9efc995
2 parents e6a6188 + 4c7234f
commit 9efc995
Showing 1 changed file with 6 additions and 9 deletions.
diff --git a/src/components/toolbar/LineDefinition.tsx b/src/components/toolbar/LineDefinition.tsx
@@ -5,15 +5,13 @@ import { useNumbersLineContext } from "../../context/numbersLineContext";
 import openMenu from "../../assets/icons/menuButtonOpen.svg";
 import closeMenu from "../../assets/icons/menuButtonClose.svg";
 
-
 const LineDefinition = () => {
   const [isMenuOpen, setIsMenuOpen] = useState(false);
   const { setKind } = useNumbersLineContext();
   const wrapperRef = useRef<HTMLButtonElement>(null);
 
   useEffect(() => {
     const handleOutsideClick = (event: any) => {
-      // Close the component if the click is outside the component
       if (wrapperRef.current && !wrapperRef.current.contains(event.target)) {
         setIsMenuOpen(false);
       }
@@ -38,7 +36,7 @@ const LineDefinition = () => {
   return (
     <button
       ref={wrapperRef}
-      className={`flex flex-col items-end  right-0 absolute  mt-[1.8%] mr-[1.8%] rounded-md  ${isMenuOpen && "shadow-2xl bg-[#009FDE]"}`}
+      className={`flex flex-col items-end  right-0 absolute  mt-[1.5%] mr-[1.5%] rounded-md  ${isMenuOpen && "shadow-2xl bg-[#009FDE]"}`}
     >
       <div className={`cursor-pointer flex  w-259 text-xl font-bold rounded-md ${isMenuOpen && "bg-[#009FDE]"}`} onClick={handleButtonClick}>
         <img className="flex-shrink-0 p-5 pr-5" src={isMenuOpen ? closeMenu : openMenu} />
@@ -47,24 +45,23 @@ const LineDefinition = () => {
             isMenuOpen && " text-[#ffffff]"
           }`}
         >
-          {"הגדרת הישר"}
+          הגדרת הישר
         </div>
       </div>
 
       {isMenuOpen && (
-
         <div className="flex flex-col items-end pt-8 pb-2 rounded-tl-5 right-0 rounded-md opacity-100 bg-#009FDE">
           <Button className={fontButtonClassName} onClick={() => handleMenuButtonClick(LineRange.ten)}>
-            {"10-0"}
+            10-0
           </Button>
           <Button className={fontButtonClassName} onClick={() => handleMenuButtonClick(LineRange.twenty)}>
-            {"20-0"}
+            20-0
           </Button>
           <Button className={fontButtonClassName} onClick={() => handleMenuButtonClick(LineRange.hundredCircular)}>
-            {"(קפיצות של 10) 100-0"}
+            (קפיצות של 10) 100-0
           </Button>
           <Button className={fontButtonClassName} onClick={() => handleMenuButtonClick(LineRange.hundred)}>
-            {"(קפיצות של 1) 100-0 "}
+            (קפיצות של 1) 100-0
           </Button>
         </div>
       )}