chore: apply suggestions from comments

add currentColor and inherit to getTailwindTheme.ts, apply suggestions/fixes from comments
kiwicom · Nov 30, 2023 · b61db3e · b61db3e
1 parent 9feb0b0
commit b61db3e
Show file tree

Hide file tree

Showing 8 changed files with 17 additions and 12 deletions.
diff --git a/docs/src/components/Head/index.tsx b/docs/src/components/Head/index.tsx
@@ -20,12 +20,14 @@ export default function Head({ title, hasSiteName, description, path }: Props) {
 
   return (
     <Helmet>
-      <html lang="en" className={hasJs ? "orbit-js" : "orbit-no-js"} />
+      {}
+
+      <html lang="en" className={hasJs ? "js" : "no-js"} />
       <script
         dangerouslySetInnerHTML={{
           __html: `
-        document.documentElement.classList.remove("orbit-no-js");
-        document.documentElement.classList.add("orbit-js");
+        document.documentElement.classList.remove("no-js");
+        document.documentElement.classList.add("js");
       `,
         }}
       />

diff --git a/docs/src/components/VisualList.tsx b/docs/src/components/VisualList.tsx
@@ -85,7 +85,8 @@ const Visual = ({
           <CardSection>
             <Stack>
               <H3 noId>{visualName}</H3>
-              <CodeBlock className="orbit-language-jsx">{exampleCode(visualName)}</CodeBlock>
+              {/* eslint-disable-next-line tailwindcss/no-custom-classname */}
+              <CodeBlock className="language-jsx">{exampleCode(visualName)}</CodeBlock>
               {actions(visualObject, copied, copy)}
             </Stack>
           </CardSection>

diff --git a/packages/orbit-components/src/Checkbox/index.tsx b/packages/orbit-components/src/Checkbox/index.tsx
@@ -90,7 +90,7 @@ const Checkbox = React.forwardRef<HTMLInputElement, Props>((props, ref) => {
         </div>,
       )}
       {(label || info) && (
-        <div className={cx("ms-xs flex flex-1 flex-col", disabled ? "opacity-50" : "opacity-10")}>
+        <div className={cx("ms-xs flex flex-1 flex-col", disabled ? "opacity-50" : "opacity-100")}>
           {label && (
             <span className="font-base text-form-element-normal text-form-element-label-foreground [&_.orbit-text]:text-form-element-normal [&_.orbit-text]:text-form-element-label-foreground [&_.orbit-text]:leading-small font-medium leading-normal [&_.orbit-text]:font-medium">
               {label}

diff --git a/packages/orbit-components/src/Drawer/index.tsx b/packages/orbit-components/src/Drawer/index.tsx
@@ -102,7 +102,7 @@ const Drawer = ({
         "z-drawer",
         "duration-fast transition-colors ease-in-out",
         overlayShown ? "visible" : "invisible",
-        shown ? "bg-drawer-overlay-background" : "orbit-transparent",
+        shown ? "bg-drawer-overlay-background" : "bg-transparent",
       )}
       onClick={handleOnClose}
       data-test={dataTest}
@@ -139,7 +139,7 @@ const Drawer = ({
               suppressed && !bordered ? "bg-cloud-light" : "bg-white-normal",
               fixedHeader && "z-sticky sticky top-0",
               onlyIcon ? "justify-end" : "justify-between",
-              bordered && "border-cloud-normal border-x-0 border-b border-solid",
+              bordered && "border-cloud-normal border-x-0 border-b border-t-0 border-solid",
               !noPadding && "px-md lm:ps-xl lm:pe-lg py-0",
             )}
           >

diff --git a/packages/orbit-components/src/Modal/index.tsx b/packages/orbit-components/src/Modal/index.tsx
@@ -463,7 +463,7 @@ const Modal = React.forwardRef<Instance, Props>(
                     "lm:[&_.orbit-modal-footer]:!p-xl",
                     fullyScrolled && "lm:[&_.orbit-modal-footer]:absolute",
                   ]
-                : "lm:[&_.orbit-modal-footer]:p-xl]",
+                : "lm:[&_.orbit-modal-footer]:p-xl",
               fullyScrolled && "lm:[&_.orbit-modal-footer]:shadow-none",
               scrolled
                 ? [
@@ -494,7 +494,7 @@ const Modal = React.forwardRef<Instance, Props>(
                   scrolled && "shadow-fixed bg-white-normal",
                   "[&_+_.orbit-modal-section:first-of-type]:pt-xxxl [&_+_.orbit-modal-section:first-of-type]:bt-0 [&_+_.orbit-modal-section:first-of-type]:m-0",
                   "[&_.orbit-button-primitive]:me-xxs [&_.orbit-button-primitive]:pointer-events-auto",
-                  "[&_.orbit-button-primitive_svg]:duration-fast [&_.orbit-button-primitive_svg]:text-ink-normal [&_.orbit-button-primitive_svg]:transition-colors [&_.orbit-button-primitive_svg]:ease-in-out",
+                  "[&_.orbit-button-primitive_svg]:duration-fast [&_.orbit-button-primitive_svg]:text-ink-normal [&_.orbit-button-primitive_svg]:transition-[color] [&_.orbit-button-primitive_svg]:ease-in-out",
                   "[&_.orbit-button-primitive:hover_svg]:text-ink-light-hover [&_.orbit-button-primitive:active_svg]:text-ink-light-active",
                 )}
                 data-test="CloseContainer"

diff --git a/packages/orbit-components/src/Radio/index.tsx b/packages/orbit-components/src/Radio/index.tsx
@@ -28,7 +28,7 @@ const Radio = React.forwardRef<HTMLInputElement, Props>((props, ref) => {
     <label
       htmlFor={id}
       className={cx(
-        "font-base text-form-element-label-foreground relative flex w-full items-start",
+        "font-base text-form-element-label-foreground relative flex w-full [align-items:self-start]",
         disabled ? "cursor-not-allowed" : "cursor-pointer",
         !disabled && [
           !checked &&
@@ -85,7 +85,7 @@ const Radio = React.forwardRef<HTMLInputElement, Props>((props, ref) => {
         <div
           className={cx(
             "ms-xs flex flex-1 flex-col font-medium",
-            disabled ? "opacity-50" : "opacity-10",
+            disabled ? "opacity-50" : "opacity-100",
           )}
         >
           {label && (

diff --git a/packages/orbit-components/src/primitives/TooltipPrimitive/index.tsx b/packages/orbit-components/src/primitives/TooltipPrimitive/index.tsx
@@ -24,7 +24,7 @@ export const TooltipWrapper = React.forwardRef<
         block ? "flex" : "inline-flex",
         enabled &&
           !removeUnderlinedText &&
-          "[&_.orbit-text]:orbit-decoration-current [&_.orbit-text]:inline-block [&_.orbit-text]:underline [&_.orbit-text]:decoration-dotted",
+          "[&_.orbit-text]:inline-block [&_.orbit-text]:underline [&_.orbit-text]:decoration-current [&_.orbit-text]:decoration-dotted",
       )}
       ref={ref}
       role="button"

diff --git a/packages/orbit-tailwind-preset/src/presets/foundation/getTailwindTheme.ts b/packages/orbit-tailwind-preset/src/presets/foundation/getTailwindTheme.ts
@@ -6,6 +6,8 @@ const getTailwindTheme = (theme: typeof defaultTokens) => {
   return {
     colors: {
       transparent: "transparent",
+      current: "currentColor",
+      inherit: "inherit",
       blue: {
         dark: theme.paletteBlueDark,
         "dark-active": theme.paletteBlueDarkActive,