FIX - TASKER UI: однострочные свойства и popover поверх карточки
This commit is contained in:
@@ -128,10 +128,7 @@ export const MemberOptions = observer(function MemberOptions(props: Props) {
|
|||||||
return createPortal(
|
return createPortal(
|
||||||
<Combobox.Options data-prevent-outside-click static>
|
<Combobox.Options data-prevent-outside-click static>
|
||||||
<div
|
<div
|
||||||
className={cn(
|
className={cn("nodedc-dropdown-surface nodedc-external-popup-anchor z-[760] my-1 w-52", optionsClassName)}
|
||||||
"nodedc-dropdown-surface z-30 my-1 w-52",
|
|
||||||
optionsClassName
|
|
||||||
)}
|
|
||||||
ref={setPopperElement}
|
ref={setPopperElement}
|
||||||
style={{
|
style={{
|
||||||
...styles.popper,
|
...styles.popper,
|
||||||
@@ -143,7 +140,7 @@ export const MemberOptions = observer(function MemberOptions(props: Props) {
|
|||||||
<Combobox.Input
|
<Combobox.Input
|
||||||
as="input"
|
as="input"
|
||||||
ref={inputRef}
|
ref={inputRef}
|
||||||
className="w-full bg-transparent py-0 text-12 text-secondary placeholder:text-placeholder outline-none focus:outline-none"
|
className="w-full bg-transparent py-0 text-12 text-secondary outline-none placeholder:text-placeholder focus:outline-none"
|
||||||
value={query}
|
value={query}
|
||||||
onChange={(e) => setQuery(e.target.value)}
|
onChange={(e) => setQuery(e.target.value)}
|
||||||
placeholder={t("search")}
|
placeholder={t("search")}
|
||||||
|
|||||||
@@ -139,7 +139,7 @@ export const WorkItemStateDropdownBase = observer(function WorkItemStateDropdown
|
|||||||
ref={setReferenceElement}
|
ref={setReferenceElement}
|
||||||
type="button"
|
type="button"
|
||||||
className={cn(
|
className={cn(
|
||||||
"clickable block h-full w-full rounded-full border-0 bg-transparent shadow-none outline-none focus:outline-none focus-visible:outline-none focus-visible:ring-0",
|
"clickable block h-full w-full rounded-full border-0 bg-transparent shadow-none outline-none focus:outline-none focus-visible:ring-0 focus-visible:outline-none",
|
||||||
buttonContainerClassName
|
buttonContainerClassName
|
||||||
)}
|
)}
|
||||||
onClick={handleOnClick}
|
onClick={handleOnClick}
|
||||||
@@ -154,7 +154,7 @@ export const WorkItemStateDropdownBase = observer(function WorkItemStateDropdown
|
|||||||
ref={setReferenceElement}
|
ref={setReferenceElement}
|
||||||
type="button"
|
type="button"
|
||||||
className={cn(
|
className={cn(
|
||||||
"clickable block h-full max-w-full rounded-full border-0 bg-transparent shadow-none outline-none focus:outline-none focus-visible:outline-none focus-visible:ring-0",
|
"clickable block h-full max-w-full rounded-full border-0 bg-transparent shadow-none outline-none focus:outline-none focus-visible:ring-0 focus-visible:outline-none",
|
||||||
{
|
{
|
||||||
"cursor-not-allowed text-secondary": disabled,
|
"cursor-not-allowed text-secondary": disabled,
|
||||||
"cursor-pointer": !disabled,
|
"cursor-pointer": !disabled,
|
||||||
@@ -189,10 +189,7 @@ export const WorkItemStateDropdownBase = observer(function WorkItemStateDropdown
|
|||||||
<span className="flex-grow truncate text-left">{selectedState?.name ?? t("state")}</span>
|
<span className="flex-grow truncate text-left">{selectedState?.name ?? t("state")}</span>
|
||||||
)}
|
)}
|
||||||
{dropdownArrow && (
|
{dropdownArrow && (
|
||||||
<ChevronDownIcon
|
<ChevronDownIcon className={cn("h-2.5 w-2.5 flex-shrink-0", dropdownArrowClassName)} aria-hidden="true" />
|
||||||
className={cn("h-2.5 w-2.5 flex-shrink-0", dropdownArrowClassName)}
|
|
||||||
aria-hidden="true"
|
|
||||||
/>
|
|
||||||
)}
|
)}
|
||||||
</>
|
</>
|
||||||
)}
|
)}
|
||||||
@@ -214,9 +211,9 @@ export const WorkItemStateDropdownBase = observer(function WorkItemStateDropdown
|
|||||||
>
|
>
|
||||||
{isOpen &&
|
{isOpen &&
|
||||||
createPortal(
|
createPortal(
|
||||||
<Combobox.Options data-prevent-outside-click className="fixed z-30" static>
|
<Combobox.Options data-prevent-outside-click className="nodedc-external-popup-anchor fixed z-[760]" static>
|
||||||
<div
|
<div
|
||||||
className="nodedc-dropdown-surface z-30 my-1 w-52"
|
className="nodedc-dropdown-surface nodedc-external-popup-anchor z-[760] my-1 w-52"
|
||||||
ref={setPopperElement}
|
ref={setPopperElement}
|
||||||
style={styles.popper}
|
style={styles.popper}
|
||||||
{...attributes.popper}
|
{...attributes.popper}
|
||||||
@@ -226,7 +223,7 @@ export const WorkItemStateDropdownBase = observer(function WorkItemStateDropdown
|
|||||||
<Combobox.Input
|
<Combobox.Input
|
||||||
as="input"
|
as="input"
|
||||||
ref={inputRef}
|
ref={inputRef}
|
||||||
className="w-full bg-transparent py-0 text-12 text-secondary placeholder:text-placeholder outline-none focus:outline-none"
|
className="w-full bg-transparent py-0 text-12 text-secondary outline-none placeholder:text-placeholder focus:outline-none"
|
||||||
value={query}
|
value={query}
|
||||||
onChange={(e) => setQuery(e.target.value)}
|
onChange={(e) => setQuery(e.target.value)}
|
||||||
placeholder={t("common.search.label")}
|
placeholder={t("common.search.label")}
|
||||||
|
|||||||
@@ -2403,7 +2403,8 @@
|
|||||||
var(--nodedc-list-property-icon-size)
|
var(--nodedc-list-property-icon-size)
|
||||||
var(--nodedc-list-property-icon-size)
|
var(--nodedc-list-property-icon-size)
|
||||||
var(--nodedc-list-property-icon-size);
|
var(--nodedc-list-property-icon-size);
|
||||||
grid-auto-flow: row;
|
grid-template-rows: var(--nodedc-list-property-chip-height);
|
||||||
|
grid-auto-flow: column;
|
||||||
justify-content: start;
|
justify-content: start;
|
||||||
align-items: center;
|
align-items: center;
|
||||||
column-gap: 0.28rem !important;
|
column-gap: 0.28rem !important;
|
||||||
@@ -2419,6 +2420,7 @@
|
|||||||
height: var(--nodedc-list-property-chip-height) !important;
|
height: var(--nodedc-list-property-chip-height) !important;
|
||||||
width: 100%;
|
width: 100%;
|
||||||
min-width: 0;
|
min-width: 0;
|
||||||
|
grid-row: 1;
|
||||||
align-items: center;
|
align-items: center;
|
||||||
justify-content: center;
|
justify-content: center;
|
||||||
}
|
}
|
||||||
@@ -2735,6 +2737,7 @@
|
|||||||
.nodedc-list-property-attachments,
|
.nodedc-list-property-attachments,
|
||||||
.nodedc-list-property-links {
|
.nodedc-list-property-links {
|
||||||
grid-column: auto;
|
grid-column: auto;
|
||||||
|
grid-row: auto;
|
||||||
width: auto;
|
width: auto;
|
||||||
}
|
}
|
||||||
}
|
}
|
||||||
|
|||||||
@@ -142,7 +142,7 @@ export function MultiSelectDropdown(props: IMultiSelectDropdown) {
|
|||||||
|
|
||||||
{isOpen &&
|
{isOpen &&
|
||||||
createPortal(
|
createPortal(
|
||||||
<Combobox.Options data-prevent-outside-click className="fixed z-30" static>
|
<Combobox.Options data-prevent-outside-click className="nodedc-external-popup-anchor fixed z-[760]" static>
|
||||||
<div
|
<div
|
||||||
className={cn("nodedc-dropdown-surface my-1 w-56", optionsContainerClassName)}
|
className={cn("nodedc-dropdown-surface my-1 w-56", optionsContainerClassName)}
|
||||||
ref={setPopperElement}
|
ref={setPopperElement}
|
||||||
|
|||||||
@@ -141,7 +141,7 @@ export function Dropdown(props: ISingleSelectDropdown) {
|
|||||||
|
|
||||||
{isOpen &&
|
{isOpen &&
|
||||||
createPortal(
|
createPortal(
|
||||||
<Combobox.Options data-prevent-outside-click className="fixed z-30" static>
|
<Combobox.Options data-prevent-outside-click className="nodedc-external-popup-anchor fixed z-[760]" static>
|
||||||
<div
|
<div
|
||||||
className={cn("nodedc-dropdown-surface my-1 w-56", optionsContainerClassName)}
|
className={cn("nodedc-dropdown-surface my-1 w-56", optionsContainerClassName)}
|
||||||
ref={setPopperElement}
|
ref={setPopperElement}
|
||||||
|
|||||||
Reference in New Issue
Block a user