asyavee/medusa-store
1
0
Fork 0
Code Issues Pull Requests Actions 2 Packages Projects Releases Wiki Activity

docs: improve tailwind configuration (#5215)

Browse Source
This commit is contained in:
Shahed Nasser
2023-09-26 15:08:30 +03:00
committed by GitHub
parent 240c439beb
commit 63aea62d7a
98 changed files with 643 additions and 894 deletions
Download Patch File Download Diff File Expand all files Collapse all files
www/packages/docs-ui/src/components/Select/Badge/index.tsx
+8 -17
View File
@@ -54,7 +54,7 @@ export const SelectBadge = ({
<>
<span
className={clsx(
"text-medusa-fg-base dark:text-medusa-fg-base-dark",
"text-medusa-fg-base",
"text-compact-x-small-plus",
"inline-block max-w-[60px] overflow-hidden text-ellipsis"
)}
@@ -63,10 +63,7 @@ export const SelectBadge = ({
</span>
{!isAllSelected && selectedOptions.length > 1 && (
<span
className={clsx(
"text-medusa-fg-subtle dark:text-medusa-fg-subtle-dark",
"text-compact-x-small"
)}
className={clsx("text-medusa-fg-subtle", "text-compact-x-small")}
>
{" "}
+ {selectedOptions.length}
@@ -80,14 +77,13 @@ export const SelectBadge = ({
<div className={clsx("relative", className)}>
<div
className={clsx(
"border-medusa-border-base dark:border-medusa-border-base-dark rounded-sm border border-solid",
"hover:bg-medusa-bg-subtle-hover dark:hover:bg-medusa-bg-subtle-hover-dark",
"border-medusa-border-base rounded-sm border border-solid",
"hover:bg-medusa-bg-subtle-hover",
"py-docs_0.25 h-fit cursor-pointer px-docs_0.5",
"flex items-center gap-[6px] whitespace-nowrap",
"text-medusa-fg-subtle dark:text-medusa-fg-subtle-dark",
!open && "bg-medusa-bg-subtle dark:bg-medusa-bg-subtle-dark",
open &&
"bg-medusa-bg-subtle-hover dark:bg-medusa-bg-subtle-hover-dark",
"text-medusa-fg-subtle",
!open && "bg-medusa-bg-subtle",
open && "bg-medusa-bg-subtle-hover",
className
)}
ref={ref}
@@ -97,12 +93,7 @@ export const SelectBadge = ({
}
}}
>
<span
className={clsx(
"text-medusa-fg-subtle dark:text-medusa-fg-subtle-dark",
"text-compact-x-small"
)}
>
<span className={clsx("text-medusa-fg-subtle", "text-compact-x-small")}>
Show results from:{" "}
</span>
{getSelectedText()}
www/packages/docs-ui/src/components/Select/Dropdown/index.tsx
+4 -8
View File
@@ -87,7 +87,7 @@ export const SelectDropdown = ({
key={index}
className={clsx(
"pr-docs_0.75 relative rounded-docs_sm py-docs_0.5 pl-docs_2.5",
"hover:bg-medusa-bg-base-hover dark:hover:bg-medusa-bg-base-hover-dark",
"hover:bg-medusa-bg-base-hover",
"[&>svg]:left-docs_0.75 cursor-pointer [&>svg]:absolute [&>svg]:top-docs_0.5",
!isSelected && "text-compact-small",
isSelected && "text-compact-small-plus"
@@ -102,12 +102,8 @@ export const SelectDropdown = ({
>
{isSelected && (
<>
{multiple && (
<CheckMini className="text-medusa-fg-base dark:text-medusa-fg-base-dark" />
)}
{!multiple && (
<EllipseMiniSolid className="text-medusa-fg-base dark:text-medusa-fg-base-dark" />
)}
{multiple && <CheckMini className="text-medusa-fg-base" />}
{!multiple && <EllipseMiniSolid className="text-medusa-fg-base" />}
</>
)}
{option.label}
@@ -128,7 +124,7 @@ export const SelectDropdown = ({
<ul
className={clsx(
"p-docs_0.25 mb-0 w-full overflow-auto rounded-docs_DEFAULT",
"bg-medusa-bg-base dark:bg-medusa-bg-base-dark text-medusa-fg-base dark:text-medusa-fg-base-dark",
"bg-medusa-bg-base text-medusa-fg-base",
"shadow-flyout dark:shadow-flyout-dark list-none"
)}
>
www/packages/docs-ui/src/components/Select/Input/index.tsx
+10 -12
View File
@@ -45,19 +45,17 @@ export const SelectInput = ({
<div
className={clsx(
"px-docs_0.75 relative py-[9px]",
"border-medusa-border-base dark:border-medusa-border-base-dark rounded-docs_sm border border-solid",
"bg-medusa-bg-field dark:bg-medusa-bg-field-dark shadow-button-neutral dark:shadow-button-neutral-dark",
"hover:bg-medusa-bg-field-hover dark:hover:bg-medusa-bg-field-hover-dark",
"border-medusa-border-base rounded-docs_sm border border-solid",
"bg-medusa-bg-field shadow-button-neutral dark:shadow-button-neutral-dark",
"hover:bg-medusa-bg-field-hover",
"active:shadow-active dark:active:shadow-active-dark",
"focus:shadow-active dark:focus:shadow-active-dark",
"text-medusa-fg-base dark:text-medusa-fg-base-dark text-compact-medium",
"disabled:bg-medusa-bg-disabled dark:disabled:bg-medusa-bg-disabled-dark",
"disabled:text-medusa-fg-disabled dark:disabled:text-medusa-fg-disabled-dark",
"text-medusa-fg-base text-compact-medium",
"disabled:bg-medusa-bg-disabled",
"disabled:text-medusa-fg-disabled",
"flex items-center gap-docs_0.5",
!hasSelectedValues &&
"placeholder:text-medusa-fg-muted dark:placeholder:text-medusa-fg-muted-dark",
hasSelectedValues &&
"placeholder:text-medusa-fg-base dark:placeholder:text-medusa-fg-base-dark",
!hasSelectedValues && "placeholder:text-medusa-fg-muted",
hasSelectedValues && "placeholder:text-medusa-fg-base",
className
)}
ref={ref}
@@ -82,7 +80,7 @@ export const SelectInput = ({
</span>
{showClearButton && (
<XMarkMini
className="text-medusa-tag-neutral-icon dark:text-medusa-tag-neutral-icon-dark"
className="text-medusa-tag-neutral-icon"
onClick={(e) => {
e.stopPropagation()
setSelected?.([])
@@ -101,7 +99,7 @@ export const SelectInput = ({
? selectedValues[0].label
: props.placeholder}
</span>
<ChevronUpDown className="text-medusa-fg-muted dark:text-medusa-fg-muted-dark" />
<ChevronUpDown className="text-medusa-fg-muted" />
<input
type="hidden"
name={props.name}