rsnext/examples/with-route-as-modal/app-styles.module.css

.content {
  display: flex;
  justify-content: center;
  align-items: center;
}
Add Route as Modal Page Example (#12945) ### Add dynamic routes to _with-route-as-modal_ example This PR adds [dynamic routes](https://nextjs.org/docs/routing/dynamic-routes), [getStaticPaths](https://nextjs.org/docs/basic-features/data-fetching#getstaticpaths-static-generation), and [getStaticProps](https://nextjs.org/docs/basic-features/data-fetching#getstaticprops-static-generation) to the with-route-as-modal example. This change might also clear up some confusion here on https://github.com/zeit/next.js/issues/11971 Additionally this PR makes sure each modal route is also a modal page. This is an important distinction and makes sure the experience is the same should the URL (route) be shared as a link. In other words, `index.js` need not be the only "entrypoint" to browsing the website. With the additions in this PR, each post page is an actual page, so if you were to share the link for Post 3 you'd get this: <img src="https://user-images.githubusercontent.com/7191639/82058282-25ad7780-968a-11ea-94f1-9b4a36abccf9.png" width="200px" /> (clickable outer region brings you back to the 'gallery') Update: I have also included the `pathname` to signal the difference in which page component is rendered Rather than this (previously): <img src="https://user-images.githubusercontent.com/7191639/82058199-0878a900-968a-11ea-97d2-e9e20c9267fc.png" width="200px" /> I have used a similar approach [here 🔗](https://hashiconf.com/digital-june/schedule/the-hitchhikers-guide-to-terraform-your-infrastructure) 2020-05-27 23:22:33 +02:00			`.content {`
			`display: flex;`
			`justify-content: center;`
			`align-items: center;`
			`}`