Fix z-indexes

pull/5722/head
Kamran Ahmed 8 months ago
parent ee8fb3414a
commit 7acdbcb4c9
  1. 2
      src/components/CreateTeam/SelectRoadmapModal.tsx
  2. 2
      src/components/CreateTeam/UpdateTeamResourceModal.tsx
  3. 2
      src/components/RoadmapTitleQuestion.tsx
  4. 3
      src/components/TeamProgress/MemberCustomProgressModal.tsx
  5. 2
      src/components/TeamProgress/MemberProgressModal.tsx
  6. 2
      src/components/UserProgress/ModalLoader.tsx
  7. 2
      src/components/UserProgress/UserCustomProgressModal.tsx
  8. 2
      src/components/UserProgress/UserProgressModal.tsx

@ -68,7 +68,7 @@ export function SelectRoadmapModal(props: SelectRoadmapModalProps) {
); );
return ( return (
<div className="fixed left-0 right-0 top-0 z-50 h-full items-center justify-center overflow-y-auto overflow-x-hidden overscroll-contain bg-black/50"> <div className="fixed left-0 right-0 top-0 z-[100] h-full items-center justify-center overflow-y-auto overflow-x-hidden overscroll-contain bg-black/50">
<div className="relative mx-auto h-full w-full max-w-2xl p-4 md:h-auto"> <div className="relative mx-auto h-full w-full max-w-2xl p-4 md:h-auto">
<div <div
ref={popupBodyEl} ref={popupBodyEl}

@ -148,7 +148,7 @@ export function UpdateTeamResourceModal(props: ProgressMapProps) {
}, []); }, []);
return ( return (
<div className="fixed left-0 right-0 top-0 z-50 h-full items-center justify-center overflow-y-auto overflow-x-hidden overscroll-contain bg-black/50"> <div className="fixed left-0 right-0 top-0 z-[100] h-full items-center justify-center overflow-y-auto overflow-x-hidden overscroll-contain bg-black/50">
<div className="relative mx-auto h-full w-full max-w-4xl p-4 md:h-auto"> <div className="relative mx-auto h-full w-full max-w-4xl p-4 md:h-auto">
<div <div
id={'customized-roadmap'} id={'customized-roadmap'}

@ -21,7 +21,7 @@ export function RoadmapTitleQuestion(props: RoadmapTitleQuestionProps) {
return ( return (
<div className="relative hidden border-t text-sm font-medium sm:block"> <div className="relative hidden border-t text-sm font-medium sm:block">
{isAnswerVisible && ( {isAnswerVisible && (
<div className="fixed left-0 right-0 top-0 z-50 h-full items-center justify-center overflow-y-auto overflow-x-hidden overscroll-contain bg-black/50"></div> <div className="fixed left-0 right-0 top-0 z-[100] h-full items-center justify-center overflow-y-auto overflow-x-hidden overscroll-contain bg-black/50"></div>
)} )}
<h2 <h2
className="z-50 flex cursor-pointer items-center px-2 py-2.5 text-base font-medium" className="z-50 flex cursor-pointer items-center px-2 py-2.5 text-base font-medium"

@ -215,7 +215,7 @@ export function MemberCustomProgressModal(props: ProgressMapProps) {
}, []); }, []);
return ( return (
<div className="fixed left-0 right-0 top-0 z-50 h-full items-center justify-center overflow-y-auto overflow-x-hidden overscroll-contain bg-black/50"> <div className="fixed left-0 right-0 top-0 z-[100] h-full items-center justify-center overflow-y-auto overflow-x-hidden overscroll-contain bg-black/50">
<div <div
id="original-roadmap" id="original-roadmap"
className="relative mx-auto h-full w-full max-w-4xl p-4 md:h-auto" className="relative mx-auto h-full w-full max-w-4xl p-4 md:h-auto"
@ -237,6 +237,7 @@ export function MemberCustomProgressModal(props: ProgressMapProps) {
<div className="px-4 pb-2"> <div className="px-4 pb-2">
<ReadonlyEditor <ReadonlyEditor
variant="modal" variant="modal"
hasMinimap={false}
roadmap={roadmap!} roadmap={roadmap!}
className="min-h-[400px]" className="min-h-[400px]"
onRendered={() => { onRendered={() => {

@ -260,7 +260,7 @@ export function MemberProgressModal(props: ProgressMapProps) {
}, [member]); }, [member]);
return ( return (
<div className="fixed left-0 right-0 top-0 z-50 h-full items-center justify-center overflow-y-auto overflow-x-hidden overscroll-contain bg-black/50"> <div className="fixed left-0 right-0 top-0 z-[100] h-full items-center justify-center overflow-y-auto overflow-x-hidden overscroll-contain bg-black/50">
<div <div
id={'customized-roadmap'} id={'customized-roadmap'}
className="relative mx-auto h-full w-full max-w-4xl p-4 md:h-auto" className="relative mx-auto h-full w-full max-w-4xl p-4 md:h-auto"

@ -11,7 +11,7 @@ export function ModalLoader(props: ModalLoaderProps) {
const { isLoading, text, error } = props; const { isLoading, text, error } = props;
return ( return (
<div className="fixed left-0 right-0 top-0 z-50 h-full items-center justify-center overflow-y-auto overflow-x-hidden overscroll-contain bg-black/50"> <div className="fixed left-0 right-0 top-0 z-[100] h-full items-center justify-center overflow-y-auto overflow-x-hidden overscroll-contain bg-black/50">
<div className="relative mx-auto flex h-full w-full items-center justify-center"> <div className="relative mx-auto flex h-full w-full items-center justify-center">
<div className="popup-body relative rounded-lg bg-white p-5 shadow"> <div className="popup-body relative rounded-lg bg-white p-5 shadow">
<div className="flex items-center"> <div className="flex items-center">

@ -156,7 +156,7 @@ export function UserCustomProgressModal(props: ProgressMapProps) {
return ( return (
<div <div
id={'user-progress-modal'} id={'user-progress-modal'}
className="fixed left-0 right-0 top-0 z-50 h-full items-center justify-center overflow-y-auto overflow-x-hidden overscroll-contain bg-black/50" className="fixed left-0 right-0 top-0 z-[100] h-full items-center justify-center overflow-y-auto overflow-x-hidden overscroll-contain bg-black/50"
> >
<div className="relative mx-auto h-full w-full max-w-4xl p-4 md:h-auto"> <div className="relative mx-auto h-full w-full max-w-4xl p-4 md:h-auto">
<div <div

@ -209,7 +209,7 @@ export function UserProgressModal(props: ProgressMapProps) {
return ( return (
<div <div
id={'user-progress-modal'} id={'user-progress-modal'}
className="fixed left-0 right-0 top-0 z-50 h-full items-center justify-center overflow-y-auto overflow-x-hidden overscroll-contain bg-black/50" className="fixed left-0 right-0 top-0 z-[100] h-full items-center justify-center overflow-y-auto overflow-x-hidden overscroll-contain bg-black/50"
> >
<div className="relative mx-auto h-full w-full max-w-4xl p-4 md:h-auto"> <div className="relative mx-auto h-full w-full max-w-4xl p-4 md:h-auto">
<div <div

Loading…
Cancel
Save