info/developer-roadmap
1
0
Fork 0
mirror of https://github.com/kamranahmedse/developer-roadmap.git synced 2025-08-29 12:10:22 +02:00
Code Issues Releases Wiki Activity

Add TNS banner

Browse Source
This commit is contained in:
Kamran Ahmed
2023-01-04 20:08:53 +04:00
parent a178eac1bb
commit 4e44595948
4 changed files with 39 additions and 31 deletions
Download Patch File Download Diff File Expand all files Collapse all files

2
bin/roadmap-metas.cjs
View File

@@ -92,7 +92,7 @@ module.exports = {
react: { react: {
dimensions: { dimensions: {
width: 968, width: 968,
height: 2570.26, height: 1570.26,
}, },
}, },
'software-architect': { 'software-architect': {

2
src/components/InteractiveRoadmap/InteractiveRoadmap.astro
View File

@@ -30,7 +30,7 @@ const { roadmapId, jsonUrl, dimensions = null, description, roadmapPermalink } =
slot="after-header" slot="after-header"
/> />
<div class="bg-gray-50 py-4 sm:py-10"> <div class="bg-gray-50 py-4 sm:py-12">
<div class="max-w-[1000px] container relative"> <div class="max-w-[1000px] container relative">
<ShareIcons <ShareIcons
description={description} description={description}

30
src/components/ResourcesAlert.astro
View File

@@ -6,12 +6,19 @@ export interface Props {
} }
const { roadmapPermalink } = Astro.props; const { roadmapPermalink } = Astro.props;
const roadmapId = roadmapPermalink.replace(/\//, '');
const roadmapTitle = roadmapId === 'devops' ? 'DevOps' : `${roadmapId.charAt(0).toUpperCase()} ${roadmapId.slice(1)}`;
--- ---
<!-- Desktop: Roadmap Resources - Alert --> <div class="mt-4 sm:mt-7 border rounded-md mb-0 sm:-mb-[82px]">
<div <!-- Alert for the Sister Site -->
class="hidden sm:flex justify-between mb-0 sm:-mb-16 mt-7 px-2 bg-white border rounded-md items-center" <div class="px-2 py-1.5 border-b bg-gray-100 hidden sm:block">
> <p class="text-sm">Get the latest {roadmapTitle} news from our sister site <a href="#" class="font-semibold underline">TheNewStack.io</a></p>
</div>
<!-- Desktop: Roadmap Resources - Alert -->
<div class="hidden sm:flex justify-between px-2 bg-white items-center rounded-bl-md rounded-br-md">
<p class="text-sm"> <p class="text-sm">
<span <span
class="text-yellow-900 bg-yellow-200 py-0.5 px-1 text-xs rounded-sm font-medium uppercase mr-0.5" class="text-yellow-900 bg-yellow-200 py-0.5 px-1 text-xs rounded-sm font-medium uppercase mr-0.5"
@@ -27,15 +34,16 @@ const { roadmapPermalink } = Astro.props;
<Icon icon="search" /> <Icon icon="search" />
<span class="ml-2">Search Topics</span> <span class="ml-2">Search Topics</span>
</a> </a>
</div> </div>
<!-- Mobile - Roadmap resources alert --> <!-- Mobile - Roadmap resources alert -->
<p <p
class="block sm:hidden text-sm border border-yellow-500 text-yellow-700 rounded-md py-1.5 px-2 bg-white mt-5 relative" class="block sm:hidden text-sm border border-yellow-500 text-yellow-700 rounded-md py-1.5 px-2 bg-white relative"
> >
We have added resources. Try clicking roadmap nodes or visit{" "} Click roadmap items for resources or visit{" "}
<a href={`${roadmapPermalink}/topics`} class="text-blue-700 underline"> <a href={`${roadmapPermalink}/topics`} class="text-blue-700 underline">
resources list resources list
</a> </a>
. .
</p> </p>
</div>

2
src/roadmaps/react/react.md
View File

@@ -9,7 +9,7 @@ description: "Everything that is there to learn about React and the ecosystem in
hasTopics: true hasTopics: true
dimensions: dimensions:
width: 968 width: 968
height: 2570.26 height: 1570.26
seo: seo:
title: "React Developer Roadmap: Learn to become a React developer" title: "React Developer Roadmap: Learn to become a React developer"
description: "Community driven, articles, resources, guides, interview questions, quizzes for react development. Learn to become a modern React developer by following the steps, skills, resources and guides listed in this roadmap." description: "Community driven, articles, resources, guides, interview questions, quizzes for react development. Learn to become a modern React developer by following the steps, skills, resources and guides listed in this roadmap."