feat: add custom renderer for roadmaps (#5691)

* wip

* fix: update packages

* wip

* wip

* feat: editor content generator

* fix: add dimensions

* feat: add renderer

* feat: add progress modal renderer

* Add API design roadmap

* Update API roadmap rendering

* fix: button click

* fix: link item

* feat: render pdf for editor roadmaps

* Add API roadmap

* Fix broken link of full-stack roadmap

* Update content dir

* Fix typos in api roadmap

* Add assets for pdf and svg

* Add content for api roadmap

* Add todo

* fix: close on editor roadmap select

* Update link not working

* Add api roadmap to get-started and roadmaps page

---------

Co-authored-by: Arik Chakma <arikchangma@gmail.com>

src/components/TopicDetail/TopicDetail.tsx

@@ -225,11 +225,12 @@ export function TopicDetail(props: TopicDetailProps) {
         className="fixed right-0 top-0 z-40 flex h-screen w-full flex-col overflow-y-auto bg-white p-4 focus:outline-0 sm:max-w-[600px] sm:p-6"
       >
         {isLoading && (
-          <div className="flex w-full justify-center">
+          <div className="flex w-full h-full items-center justify-center">
             <Spinner
               outerFill="#d1d5db"
-              className="h-6 w-6 sm:h-12 sm:w-12"
+              className="h-6 w-6 sm:h-8 sm:w-8"
               innerFill="#2563eb"
+              isDualRing={false}
             />
           </div>
         )}