Skip to content
New issue

Have a question about this project? Sign up for a free GitHub account to open an issue and contact its maintainers and the community.

By clicking “Sign up for GitHub”, you agree to our terms of service and privacy statement. We’ll occasionally send you account related emails.

Already on GitHub? Sign in to your account

YSHOP2-1216: Added DropdownMenu component #245

Merged
merged 11 commits into from
Jan 29, 2024
Merged

YSHOP2-1216: Added DropdownMenu component #245

merged 11 commits into from
Jan 29, 2024

Conversation

GhitaNektt
Copy link
Contributor

@GhitaNektt GhitaNektt commented Jan 24, 2024

JIRA Ticket

YSHOP2-1216

QA Steps

Note

Leave empty when you have nothing to say

@GhitaNektt GhitaNektt added the ⏳ in progress Still in development phase. label Jan 24, 2024
@GhitaNektt GhitaNektt self-assigned this Jan 24, 2024
-m "Merged main to resolve conflicts"
@GhitaNektt GhitaNektt added 💻 Ready for review Requires a review from another developer. and removed ⏳ in progress Still in development phase. labels Jan 24, 2024

const show = ref(false);
const DropdownMenu = ref();
const toggleMenu = () => {
Copy link
Collaborator

Choose a reason for hiding this comment

The reason will be displayed to describe this comment to others. Learn more.

Always separate refs from others

@GhitaNektt GhitaNektt added ⏳ in progress Still in development phase. and removed 💻 Ready for review Requires a review from another developer. labels Jan 26, 2024
});
};

onClickOutside(DropdownMenuContainer, () => show.value = false);
Copy link
Contributor

Choose a reason for hiding this comment

The reason will be displayed to describe this comment to others. Learn more.

Suggested change
onClickOutside(DropdownMenuContainer, () => show.value = false);
const handleScroll = () => {
show.value = false;
};
onMounted(() => {
window.addEventListener('scroll', handleScroll);
});
onUnmounted(() => {
window.removeEventListener('scroll', handleScroll);
});
onClickOutside(DropdownMenuContainer, () => show.value = false);

Copy link
Contributor

@mosarabi mosarabi Jan 29, 2024

Choose a reason for hiding this comment

The reason will be displayed to describe this comment to others. Learn more.

Would you mind to add scroll event to hide menu when user start scrolling

@@ -0,0 +1,85 @@
<script setup lang="ts">
import { nextTick, ref } from 'vue';
Copy link
Contributor

@mosarabi mosarabi Jan 29, 2024

Choose a reason for hiding this comment

The reason will be displayed to describe this comment to others. Learn more.

Suggested change
import { nextTick, ref } from 'vue';
import { nextTick, ref, onMounted, onUnmounted } from 'vue';

max-width: 100%;
margin: 0;
}
</style>
Copy link
Contributor

Choose a reason for hiding this comment

The reason will be displayed to describe this comment to others. Learn more.

I think no need to create this component
What d u think?

@eihabkhan1
Copy link
Collaborator

Can we set the cursor to pointer on the items

@GhitaNektt
Copy link
Contributor Author

Can we set the cursor to pointer on the items

yeah sure

@GhitaNektt GhitaNektt merged commit 71836a8 into main Jan 29, 2024
1 check passed
@GhitaNektt GhitaNektt deleted the YSHOP2-1216 branch January 29, 2024 11:15
Sign up for free to join this conversation on GitHub. Already have an account? Sign in to comment
Labels
⏳ in progress Still in development phase.
Projects
None yet
Development

Successfully merging this pull request may close these issues.

None yet

3 participants