Revert "change color to const"

This reverts commit d56c0a0.
shefing · Feb 21, 2024 · e06d040 · e06d040
1 parent d56c0a0
commit e06d040
Show file tree

Hide file tree

Showing 8 changed files with 23 additions and 34 deletions.
diff --git a/library/math/numbersLine/src/App.css b/library/math/numbersLine/src/App.css
@@ -68,21 +68,20 @@
 
   margin: var(--margin-value)  !important;
   height: 18px !important;
-  border: 0px !important;  border-bottom-left-radius: 0px !important;
-  border-top-left-radius: 0px !important;
-  border-bottom-right-radius: 0px !important;
-  border-top-right-radius: 0px !important;
+  border: 0px !important;
 }
 
 
 .moveable-direction.moveable-e{
   background-image: url('../public/assets/icons/resizeRight.svg')  !important;
-  margin-inline: -1px !important;
-
+  margin-inline: 0px !important;
+  border-bottom-left-radius: 0px !important;
+  border-top-left-radius: 0px !important;
 }
 
 .moveable-direction.moveable-w{
   background-image: url('../public/assets/icons/resizeLeft.svg')  !important;
   margin-inline:-14px !important;
-
+  border-bottom-right-radius: 0px !important;
+  border-top-right-radius: 0px !important;
 }
diff --git a/library/math/numbersLine/src/components/toolbar/DisplayNumbers.tsx b/library/math/numbersLine/src/components/toolbar/DisplayNumbers.tsx
@@ -2,7 +2,7 @@ import { Button } from "../ui/button";
 import { useNumbersLineContext } from "../../context/numbersLineContext";
 import { IDisplayRuller, TypeCover } from "../../type/elements";
 import triangleToMenu from "/assets/icons/TriangleToMenu.png";
-import { blue1, displayRulerButtonDetials } from "../../consts/elementConsts";
+import { displayRulerButtonDetials } from "../../consts/elementConsts";
 
 interface IProps {
   setOpen: (val: boolean) => void;
@@ -18,7 +18,7 @@ const DisplayNumbers = ({ setOpen }: IProps) => {
   return (
     <div className="relative flex flex-col items-center bg-white relative">
       <img className="absolute top-0 " src={triangleToMenu} alt="triple for menu" />
-      <div className={`m-[18px] flex flex-col items-end shadow-2xl rounded-[6px] border border-solid border-[${blue1}] p-2`}>
+      <div className="m-[18px] flex flex-col items-end shadow-2xl rounded-[6px] border border-solid border-[#009FDE] p-2">
         {displayRulerButtonDetials.map((item: IDisplayRuller, i: number) => (
           <Button
             key={i}

diff --git a/library/math/numbersLine/src/components/toolbar/LineDefinition.tsx b/library/math/numbersLine/src/components/toolbar/LineDefinition.tsx
@@ -4,7 +4,7 @@ import { LineRange } from "../../type/ruler";
 import { useNumbersLineContext } from "../../context/numbersLineContext";
 import openMenu from "/assets/icons/menuButtonOpen.svg";
 import closeMenu from "/assets/icons/menuButtonClose.svg";
-import { blue1, rulerDefinitionButtonDetials } from "../../consts/elementConsts";
+import { rulerDefinitionButtonDetials } from "../../consts/elementConsts";
 import { IRulerDefinition, TypeCover } from "../../type/elements";
 
 const LineDefinition = () => {
@@ -41,10 +41,10 @@ const LineDefinition = () => {
   };
 
   return (
-    <div ref={wrapperRef} className={`flex flex-col items-end p-2 rounded-md w-[16rem] ${isMenuOpen && "shadow-2xl bg-[" + blue1 + "]"} relative`}>
+    <div ref={wrapperRef} className={`flex flex-col items-end p-2 rounded-md w-[16rem] ${isMenuOpen && "shadow-2xl bg-[#009FDE]"} relative`}>
       <div className="cursor-pointer flex" onClick={handleButtonClick}>
         <img className="p-3 pr-6" src={isMenuOpen ? closeMenu : openMenu} alt="Menu Arrow" />
-        <div className={`pr-3 text-[${blue1}] text-[32px] font-[500] font-[Abraham] ${isMenuOpen && " text-[#ffffff]"}`}>הגדרת הישר</div>
+        <div className={`pr-3 text-[#009FDE] text-[32px] font-[500] font-[Abraham] ${isMenuOpen && " text-[#ffffff]"}`}>הגדרת הישר</div>
       </div>
 
       {isMenuOpen && (

diff --git a/library/math/numbersLine/src/components/ui/alert-dialog.tsx b/library/math/numbersLine/src/components/ui/alert-dialog.tsx
@@ -3,7 +3,6 @@ import * as AlertDialogPrimitive from "@radix-ui/react-alert-dialog";
 
 import { cn } from "@/lib/utils";
 import { buttonVariants } from "@/components/ui/button";
-import { blue1 } from "@/consts/elementConsts";
 
 const AlertDialog = AlertDialogPrimitive.Root;
 
@@ -35,9 +34,7 @@ const AlertDialogContent = React.forwardRef<
     <AlertDialogPrimitive.Content
       ref={ref}
       className={cn(
-        "fixed left-[50%] top-[50%] h-[146px] z-50 grid w-[350px] max-w-lg translate-x-[-50%] translate-y-[-50%] gap-4 border bg-background p-6 shadow-lg duration-200 data-[state=open]:animate-in data-[state=closed]:animate-out data-[state=closed]:fade-out-0 data-[state=open]:fade-in-0 data-[state=closed]:zoom-out-95 data-[state=open]:zoom-in-95 data-[state=closed]:slide-out-to-left-1/2 data-[state=closed]:slide-out-to-top-[48%] data-[state=open]:slide-in-from-left-1/2 data-[state=open]:slide-in-from-top-[48%] sm:rounded-lg  border border-radius-[5px] border-[" +
-          blue1 +
-          "]",
+        "fixed left-[50%] top-[50%] h-[146px] z-50 grid w-[350px] max-w-lg translate-x-[-50%] translate-y-[-50%] gap-4 border bg-background p-6 shadow-lg duration-200 data-[state=open]:animate-in data-[state=closed]:animate-out data-[state=closed]:fade-out-0 data-[state=open]:fade-in-0 data-[state=closed]:zoom-out-95 data-[state=open]:zoom-in-95 data-[state=closed]:slide-out-to-left-1/2 data-[state=closed]:slide-out-to-top-[48%] data-[state=open]:slide-in-from-left-1/2 data-[state=open]:slide-in-from-top-[48%] sm:rounded-lg  border border-radius-[5px] border-[#009FDE]",
         className
       )}
       {...props}

diff --git a/library/math/numbersLine/src/components/ui/button.tsx b/library/math/numbersLine/src/components/ui/button.tsx
@@ -3,7 +3,6 @@ import { Slot } from "@radix-ui/react-slot";
 import { cva, type VariantProps } from "class-variance-authority";
 
 import { cn } from "@/lib/utils";
-import { blue1, blue2, gray1, lightBlye } from "@/consts/elementConsts";
 
 const buttonVariants = cva(
   "inline-flex items-center justify-center whitespace-nowrap rounded-md text-sm font-medium ring-offset-background transition-colors focus-visible:outline-none focus-visible:ring-2 focus-visible:ring-ring focus-visible:ring-offset-2 disabled:pointer-events-none disabled:opacity-50",
@@ -17,16 +16,17 @@ const buttonVariants = cva(
         ghost: "hover:bg-accent hover:text-accent-foreground",
         link: "text-primary underline-offset-4 hover:underline",
         icon: "w-12 h-12 m-3 cursor-pointer rounded-full ",
-        action: `h-[25px] w-[100px] px-4 py-4 ml-[2rem] mr-[2rem] bg-[${blue1}] hover:bg-[${blue2}] transition rounded-[20px] text-white text-[22px] font-[400] font-[Abraham] `,
-        cancel: `h-[25px] w-[100px] px-4 py-4 ml-[2rem] mr-[2rem] bg-[${lightBlye}] hover:bg-[${blue2}] transition rounded-[20px] text-[${blue1}] text-[22px] font-[400] font-[Abraham] `,
-        linedefinition: `h-[48px] px-4 py-2 m-[0.5rem] bg-white hover:bg-[${lightBlye}] transition rounded-[20px] text-[24px] font-[400] font-[Abraham] border border-solid border-[${blue1}]`,
-        displayRulerNumber: `h-[33px] px-4 py-2 m-[0.5rem] ml-[1rem] mr-[1rem] hover:bg-[${lightBlye}] transition rounded-[20px] text-[26px] font-[400] font-[Abraham] border border-solid border-[${blue1}]] `,
+        action: `h-[25px] w-[100px] px-4 py-4 ml-[2rem] mr-[2rem] bg-[#009FDE] hover:bg-[#7BC8EF] transition rounded-[20px] text-white text-[22px] font-[400] font-[Abraham] `,
+        cancel: `h-[25px] w-[100px] px-4 py-4 ml-[2rem] mr-[2rem] bg-[#E1F4FD] hover:bg-[#7BC8EF] transition rounded-[20px] text-[#009FDE] text-[22px] font-[400] font-[Abraham] `,
+        linedefinition: `h-[48px] px-4 py-2 m-[0.5rem] bg-white hover:bg-[#E1F4FD] transition rounded-[20px] text-[24px] font-[400] font-[Abraham] border border-solid border-[#009FDE]`,
+        displayRulerNumber:
+          "h-[33px] px-4 py-2 m-[0.5rem] ml-[1rem] mr-[1rem] hover:bg-[#E1F4FD] transition rounded-[20px] text-[26px] font-[400] font-[Abraham] border border-solid border-[#009FDE] ",
       },
       isChoice: {
-        true: ` bg-[${blue2}]  text-white`,
+        true: " bg-[#7BC8EF]  text-white",
       },
       isVisitDisable: {
-        true: ` bg-write text-block hover:bg-white text-[${gray1}] border-[${gray1}] pointer-events-none`,
+        true: " bg-write text-block hover:bg-white text-[#CACACC] border-[#CACACC] pointer-events-none",
       },
     },
     defaultVariants: {

diff --git a/library/math/numbersLine/src/consts/elementConsts.ts b/library/math/numbersLine/src/consts/elementConsts.ts
@@ -35,10 +35,3 @@ export const RulerMargin = window.innerHeight * 0.25;
 export const jumpBaseHeight = 40;
 export const jumpArrowHeight = 64;
 export const ToolbarHieght = 80;
-
-export const blue1 = "#009FDE";
-export const blue2 = "#7BC8EF"; //onHover
-export const lightBlye = "#E1F4FD";
-export const red = "#F48460";
-export const gray1 = "#CACACC"; //disable
-export const gray2 = "#A4A3AE"; //border
diff --git a/library/math/numbersLine/src/lib/stylesUtils.ts b/library/math/numbersLine/src/lib/stylesUtils.ts
@@ -1,10 +1,10 @@
 import { baseJumpClassName } from "../styles/jump";
 import { calculatUnitsAmount } from "./utils";
 import { LineRange } from "../type/ruler";
-import { blue1, jumpArrowHeight, jumpBaseHeight, red } from "../consts/elementConsts";
+import { jumpArrowHeight, jumpBaseHeight } from "../consts/elementConsts";
 
 export const MatchBaseJumpClassName = (underRuler: boolean) => {
-  return underRuler ? baseJumpClassName + ` bg-[${red}] mb-[1rem]` : baseJumpClassName + ` bg-[${blue1}] mt-[1rem]`;
+  return underRuler ? baseJumpClassName + " bg-[#F48460] mb-[1rem]" : baseJumpClassName + " bg-[#009FDE] mt-[1rem]";
 };
 export const calcWidthStartPosition = (value: number, windowWidth: number, type: LineRange) => {
   return (windowWidth - windowWidth / calculatUnitsAmount(type)) / value;

diff --git a/library/math/numbersLine/src/styles/jump.ts b/library/math/numbersLine/src/styles/jump.ts
@@ -1,3 +1,3 @@
-import { gray2, jumpBaseHeight } from "../consts/elementConsts";
+import { jumpBaseHeight } from "../consts/elementConsts";
 
-export const baseJumpClassName: string = ` h-[${jumpBaseHeight}px] bg-opacity-85 rounded-[1px] border border-[${gray2}] border-[0.5px] text-center text-white text-[24px] font-[700] font-[Arial]`;
+export const baseJumpClassName:string = ` h-[${jumpBaseHeight+"px"}] bg-opacity-85 rounded-[1px] border border-[#A4A3AE] border-[0.5px] text-center text-white text-[24px] font-[700] font-[Arial]`