Make topic overlay renderer agnostic

pull/3356/head
Kamran Ahmed 2 years ago
parent badb2c029d
commit 5f2836a148
  1. 7
      src/components/TopicOverlay/TopicOverlay.astro
  2. 4
      src/pages/[roadmapId]/index.astro
  3. 4
      src/pages/best-practices/[bestPracticeId].astro

@ -3,11 +3,10 @@ import Icon from '../Icon.astro';
import Loader from '../Loader.astro';
export interface Props {
roadmapId: string;
contentContributionLink: string;
}
const { roadmapId } = Astro.props;
const githubLink = `https://github.com/kamranahmedse/developer-roadmap/tree/master/src/roadmaps/${roadmapId}/content`;
const { contentContributionLink } = Astro.props;
---
<div id='topic-overlay' class='hidden'>
@ -60,7 +59,7 @@ const githubLink = `https://github.com/kamranahmedse/developer-roadmap/tree/mast
brief description and a few links to learn more about this topic <a
target='_blank'
class='underline text-blue-700'
href={githubLink}>on GitHub repository.</a
href={contentContributionLink}>on GitHub repository.</a
>.
</p>
</div>

@ -47,6 +47,8 @@ if (roadmapData.schema) {
if (roadmapFAQs.length) {
jsonLdSchema.push(generateFAQSchema(roadmapFAQs));
}
const contentContributionLink = `https://github.com/kamranahmedse/developer-roadmap/tree/master/src/roadmaps/${roadmapId}/content`;
---
<BaseLayout
@ -75,7 +77,7 @@ if (roadmapFAQs.length) {
!roadmapData.isUpcoming && roadmapData.jsonUrl && (
<div class='max-w-[1000px] container relative'>
<ShareIcons description={roadmapData.featuredDescription} pageUrl={`https://roadmap.sh/${roadmapId}`} />
<TopicOverlay roadmapId={roadmapId} />
<TopicOverlay contentContributionLink={contentContributionLink} />
<FrameRenderer roadmapId={roadmapId} jsonUrl={roadmapData.jsonUrl} dimensions={roadmapData.dimensions} />
</div>

@ -4,6 +4,7 @@ import CaptchaScripts from '../../components/Captcha/CaptchaScripts.astro';
import FrameRenderer from '../../components/FrameRenderer/FrameRenderer.astro';
import MarkdownFile from '../../components/MarkdownFile.astro';
import ShareIcons from '../../components/ShareIcons/ShareIcons.astro';
import TopicOverlay from '../../components/TopicOverlay/TopicOverlay.astro';
import UpcomingForm from '../../components/UpcomingForm.astro';
import BaseLayout from '../../layouts/BaseLayout.astro';
import { BestPracticeFrontmatter, getBestPracticeIds } from '../../lib/best-pratice';
@ -40,6 +41,8 @@ if (bestPracticeData.schema) {
})
);
}
const contentContributionLink = `https://github.com/kamranahmedse/developer-roadmap/tree/master/src/best-practices/${bestPracticeId}/content`;
---
<BaseLayout
@ -69,6 +72,7 @@ if (bestPracticeData.schema) {
description={bestPracticeData.featuredDescription}
pageUrl={`https://roadmap.sh/best-practices/${bestPracticeId}`}
/>
<TopicOverlay contentContributionLink={contentContributionLink} />
<FrameRenderer
roadmapId={bestPracticeId}

Loading…
Cancel
Save