updated: font weights, contextmenu shortcut & package version

marraph · May 10, 2024 · d8edb38 · d8edb38
1 parent 2ea2e94
commit d8edb38
Show file tree

Hide file tree

Showing 10 changed files with 22 additions and 20 deletions.
diff --git a/components/alert/Alert.tsx b/components/alert/Alert.tsx
@@ -2,7 +2,7 @@ import {cva, VariantProps} from "class-variance-authority";
 import {cn} from "../../utils/cn";
 import React, {ReactNode} from "react";
 
-const alert = cva("group w-full rounded-lg font-medium py-2 px-2 bg-black text-gray text-base flex flex-row items-start shadow-2xl", {
+const alert = cva("group w-full rounded-lg font-normal py-2 px-2 bg-black text-gray text-base flex flex-row items-start shadow-2xl", {
     variants: {
         theme: {
             dark: ["bg-black"],
@@ -48,7 +48,7 @@ AlertTitle.displayName = "AlertTitle";
 
 
 const AlertDescription = React.forwardRef<HTMLDivElement, AlertDescriptionProps>(({ description, className, ...props }, ref) => (
-    <div className={cn("font-normal float-left", className)} ref={ref} {...props}>
+    <div className={cn("float-left", className)} ref={ref} {...props}>
         {description}
     </div>
 ));

diff --git a/components/appointment/Appointment.tsx b/components/appointment/Appointment.tsx
@@ -46,7 +46,7 @@ const AppointmentDescription = React.forwardRef<HTMLDivElement, AppointmentDescr
 AppointmentDescription.displayName = "AppointmentDescription";
 
 const Appointment =  React.forwardRef<HTMLDivElement, AppointmentProps>(({ theme, width, height, className, ...props }, ref) => (
-    <div className={cn(appointment({ theme }), className, "bg-opacity-10 rounded-lg")} ref={ref} {...props} style={{width: `${width}px`, height: `${height}px`}}>
+    <div className={cn(appointment({ theme }), className, "bg-opacity-10 rounded-lg font-normal")} ref={ref} {...props} style={{width: `${width}px`, height: `${height}px`}}>
         <div className={cn(appointment({theme}), "h-full w-3 mr-4 rounded-tl-lg rounded-bl-lg")}></div>
         <div className={cn("flex flex-col py-2", className)}>
             {props.children}

diff --git a/components/badge/Badge.tsx b/components/badge/Badge.tsx
@@ -2,7 +2,7 @@ import { cva, VariantProps } from "class-variance-authority";
 import React from "react";
 import { cn } from "../../utils/cn";
 
-const badge = cva("group w-full flex items-center font-medium py-2 px-4", {
+const badge = cva("group w-full flex items-center font-semibold py-2 px-4", {
     variants: {
         theme: {
             dark: ["bg-black", "text-gray"],

diff --git a/components/checkbox/Checkbox.tsx b/components/checkbox/Checkbox.tsx
@@ -6,7 +6,7 @@ interface CheckboxProps extends React.InputHTMLAttributes<HTMLInputElement> {
 }
 
 const Checkbox = React.forwardRef<HTMLDivElement, CheckboxProps>(({ text, className, ...props }) => (
-        <div className={cn("group w-full font-semibold flex items-center py-2 px-2 text-white", className)} {...props}>
+        <div className={cn("group w-full font-normal flex items-center py-2 px-2 text-white", className)} {...props}>
             <input type={"checkbox"} className={cn("w-4 h-4 accent-black border-gray border-opacity-20 rounded-md mr-2 checked:accent-black", className)}/>
             <p>{text}</p>
         </div>

diff --git a/components/combobox/Combobox.tsx b/components/combobox/Combobox.tsx
@@ -24,7 +24,7 @@ ComboboxIcon.displayName = "ComboboxIcon";
 
 
 const ComboboxItem = React.forwardRef<HTMLDivElement, ComboboxItemProps>(({ title, isSelected, className, ...props }, ref) => (
-    <div className={cn("bg-black text-gray cursor-pointer rounded-lg hover:bg-selected hover:text-white py-2 px-2 flex items-center", className, isSelected ? "bg-white" : "bg-black")} ref={ref} {...props}>
+    <div className={cn("bg-black text-gray cursor-pointer rounded-lg hover:bg-selected hover:text-white p-2 flex items-center", className, isSelected ? "bg-white" : "bg-black")} ref={ref} {...props}>
         {props.children}
         <span className={cn("ml-1", className)}>{title}</span>
     </div>
@@ -47,13 +47,13 @@ const Combobox: React.FC<ComboboxProps> = ({buttonTitle, className, ...props}) =
 
     return (
         <div className={cn("relative inline-block", className)}>
-            <div className={cn("group text-gray whitespace-nowrap w-full rounded-lg font-semibold text-base py-2 px-4 flex items-center bg-black hover:text-white border border-white border-opacity-20",
+            <div className={cn("group text-gray whitespace-nowrap w-full rounded-lg font-normal text-base py-2 px-4 flex items-center bg-black hover:text-white border border-white border-opacity-20",
                 className)} {...props} onClick={handleButtonClick}>
                 <span>{!selectedValue ? buttonTitle : selectedValue}</span>
                 <ChevronsUpDown className={cn("group-hover:text-white ml-6 text-gray", className)} size={15}/>
             </div>
             {isOpen && (
-                <div className={cn("absolute top-full flex flex-col w-full rounded-lg font-semibold py-2 px-2 bg-black text-gray whitespace-nowrap", className)}>
+                <div className={cn("absolute top-full flex flex-col w-full rounded-lg py-2 px-2 bg-black text-gray whitespace-nowrap", className)}>
                     {React.Children.map(props.children, (child) => {
                         if (React.isValidElement<ComboboxItemProps>(child)) {
                             return React.cloneElement(child, {

diff --git a/components/contextmenu/ContextMenu.tsx b/components/contextmenu/ContextMenu.tsx
@@ -28,11 +28,13 @@ ContextMenuIcon.displayName = "ContextMenuIcon";
 
 
 const ContextMenuItem = React.forwardRef<HTMLDivElement, ContextMenuItemProps>(({ title, shortcut, className, ...props }, ref) => (
-    <div className={cn("group cursor-pointer rounded-lg hover:bg-selected hover:text-white p-2 flex justify-normal items-center", className)} ref={ref} {...props}>
-        {props.children}
-        {title}
+    <div className={cn("group cursor-pointer rounded-lg hover:bg-selected hover:text-white p-2 flex flex-row justify-between items-center", className)} ref={ref} {...props}>
+        <div className={"flex flex-row items-center space-x-2"}>
+            {props.children}
+            {title}
+        </div>
         {shortcut &&
-        <span className={"hidden group-hover:block text-sm text-gray"}>
+        <span className={"hidden group-hover:block text-sm text-gray "}>
             {shortcut}
         </span>
         }
@@ -42,7 +44,7 @@ ContextMenuItem.displayName = "ContextMenuItem";
 
 
 const ContextMenu = React.forwardRef<HTMLDivElement, React.AreaHTMLAttributes<HTMLDivElement>>(({ className, ...props }, ref) => (
-    <div className={cn("w-full rounded-lg font-semibold py-2 px-2 bg-black text-gray border border-white border-opacity-20" , className)} ref={ref} {...props}>
+    <div className={cn("w-full rounded-lg font-normal py-2 px-2 bg-black text-gray border border-white border-opacity-20" , className)} ref={ref} {...props}>
         {props.children}
     </div>
 ));

diff --git a/components/dialog/Dialog.tsx b/components/dialog/Dialog.tsx
@@ -26,7 +26,7 @@ DialogDescription.displayName = "DialogDescription";
 
 
 const Dialog = React.forwardRef<HTMLDialogElement, React.DialogHTMLAttributes<HTMLDialogElement>>(({ className, ...props }, ref) => (
-    <dialog className={cn("group rounded-lg font-semibold p-5 bg-black backdrop backdrop-opacity-20 backdrop-brightness-0" , className)} ref={ref} {...props}>
+    <dialog className={cn("group rounded-lg p-5 bg-black backdrop backdrop-opacity-20 backdrop-brightness-0" , className)} ref={ref} {...props}>
         {props.children}
     </dialog>
 

diff --git a/components/input/Input.tsx b/components/input/Input.tsx
@@ -11,13 +11,13 @@ interface InputProps extends React.InputHTMLAttributes<HTMLInputElement> {
 const Input = forwardRef<HTMLInputElement, InputProps>(({ label, placeholder, className, ...props }, ref) => (
     <div className={cn("group flex flex-col", className)}>
         {label && (
-            <p className={cn("text-white text-base font-medium m-1", className)}>
+            <p className={cn("text-white text-base font-normal m-1", className)}>
                 {label}
             </p>
         )}
         <div className={cn("relative", className)}>
             <input placeholder={placeholder}
-                   className={cn("w-full bg-black rounded-lg font-medium border border-white border-opacity-20 outline-none text-base py-2 px-4 " +
+                   className={cn("w-full bg-black rounded-lg font-normal border border-white border-opacity-20 outline-none text-base py-2 px-4 " +
                        "text-gray focus:text-white focus:ring-2 focus:ring-placeholder placeholder-placeholder", className)}
                    ref={ref} {...props}>
             </input>

diff --git a/components/tooltip/Tooltip.tsx b/components/tooltip/Tooltip.tsx
@@ -2,7 +2,7 @@ import React from "react";
 import {cva, VariantProps} from "class-variance-authority";
 import {cn} from "../../utils/cn";
 
-const tooltip = cva("group rounded-lg font-medium py-2 px-2", {
+const tooltip = cva("group rounded-lg py-2 px-2", {
     variants: {
         theme: {
             dark: ["bg-black", "text-gray"],
@@ -27,7 +27,7 @@ interface TooltipProps extends React.HTMLAttributes<HTMLDivElement>, VariantProp
 
 
 const TooltipTitle = React.forwardRef<HTMLDivElement, TooltipTitleProps>(({ title, className, ...props }, ref) => (
-    <div className={"text-white"} ref={ref} {...props}>
+    <div className={"text-white font-semibold"} ref={ref} {...props}>
         {title}
     </div>
 ));
@@ -44,7 +44,7 @@ TooltipDescription.displayName = "TooltipHeader";
 
 const Tooltip = React.forwardRef<HTMLDivElement, TooltipProps>(({ theme, className, ...props }, ref) => (
         <div className={cn(tooltip({theme}), className)} ref={ref} {...props}>
-            <div className={"font-semibold flex flex-col items-start"}>
+            <div className={"flex flex-col items-start"}>
                 {props.children}
             </div>
         </div>

diff --git a/package.json b/package.json
@@ -1,6 +1,6 @@
 {
   "name": "@marraph/daisy",
-  "version": "0.0.5",
+  "version": "0.0.6",
   "description": "Daisy is a component library for the marraph organisation",
   "scripts": {
     "dev": "next dev",