Infrastructure/logto
0
Fork 0
mirror of https://github.com/logto-io/logto.git synced 2025-01-06 20:40:08 -05:00
Code Issues Activity

refactor(console): remove draggle preview item background (#2364)

Browse source
This commit is contained in:
Xiao Yijun 2022-11-09 15:25:32 +08:00 committed by GitHub
parent ec36266a1b
commit 605161b8d2
No known key found for this signature in database
GPG key ID: 4AEE18F83AFDEB23
5 changed files with 20 additions and 3 deletions
Show stats Download patch file Download diff file Expand all files Collapse all files

5
packages/console/src/components/Transfer/DraggableItem.tsx
View file

@ -11,6 +11,7 @@ type Props = {
sortIndex: number;
moveItem: (dragIndex: number, hoverIndex: number) => void;
children: ReactNode;
className?: string;
};
type DragItemProps = {
@ -21,7 +22,7 @@ type DragItemProps = {
const dragType = 'TransferItem';
const DraggableItem = ({ id, children, sortIndex, moveItem }: Props) => {
const DraggableItem = ({ id, children, sortIndex, moveItem, className }: Props) => {
const ref = useRef<HTMLDivElement>(null);
const { setIsDragging } = useContext(DragDropContext);
const [{ handlerId }, drop] = useDrop<DragItemProps, void, { handlerId: Nullable<Identifier> }>({
@ -99,7 +100,7 @@ const DraggableItem = ({ id, children, sortIndex, moveItem }: Props) => {
}, [setIsDragging, isDragging]);
return (
<div ref={ref} style={{ opacity }} data-handler-id={handlerId}>
<div ref={ref} style={{ opacity }} data-handler-id={handlerId} className={className}>
{children}
</div>
);

4
packages/console/src/pages/SignInExperience/tabs/SignUpAndSignInTab/components/SignInMethodEditBox/index.module.scss
View file

@ -1,5 +1,9 @@
@use '@/scss/underscore' as _;
.draggleItemContainer {
transform: translate(0, 0);
}
.signInMethodItem {
display: flex;
align-items: center;

2
packages/console/src/pages/SignInExperience/tabs/SignUpAndSignInTab/components/SignInMethodEditBox/index.tsx
View file

@ -9,6 +9,7 @@ import { signInIdentifiers, signInIdentifierToRequiredConnectorMapping } from '.
import ConnectorSetupWarning from '../ConnectorSetupWarning';
import AddButton from './AddButton';
import SignInMethodItem from './SignInMethodItem';
import * as styles from './index.module.scss';
import type { SignInMethod } from './types';
import {
computeOnSignInMethodAppended,
@ -125,6 +126,7 @@ const SignInMethodEditBox = ({
id={signInMethod.identifier}
sortIndex={index}
moveItem={onMoveItem}
className={styles.draggleItemContainer}
>
<SignInMethodItem
signInMethod={signInMethod}

4
packages/console/src/pages/SignInExperience/tabs/SignUpAndSignInTab/components/SocialConnectorEditBox/index.module.scss
View file

@ -1,5 +1,9 @@
@use '@/scss/underscore' as _;
.draggleItemContainer {
transform: translate(0, 0);
}
.setUpHint {
font: var(--font-body-medium);
color: var(--color-text-secondary);

8
packages/console/src/pages/SignInExperience/tabs/SignUpAndSignInTab/components/SocialConnectorEditBox/index.tsx
View file

@ -62,7 +62,13 @@ const SocialConnectorEditBox = ({ value, onChange }: Props) => {
<div>
<DragDropProvider>
{selectedConnectorItems.map((item, index) => (
<DraggableItem key={item.id} id={item.id} sortIndex={index} moveItem={onMoveItem}>
<DraggableItem
key={item.id}
id={item.id}
sortIndex={index}
moveItem={onMoveItem}
className={styles.draggleItemContainer}
>
<SelectedConnectorItem
data={item}
onDelete={(target) => {