Fixed styling issue from Article/Blog view (#302)

pantheon-systems · Aug 22, 2024 · 25fee21 · 25fee21
1 parent 785530c
commit 25fee21
Show file tree

Hide file tree

Showing 6 changed files with 5 additions and 20 deletions.
diff --git a/starters/nextjs-starter-approuter-ts/app/articles/[...uri]/page.tsx b/starters/nextjs-starter-approuter-ts/app/articles/[...uri]/page.tsx
@@ -6,7 +6,7 @@ import { ArticleView, getServersideArticle } from "./article-view";
 export default async function ArticlePage({ params, searchParams }) {
   return (
     <Layout>
-      <div className="prose mx-4 mt-16 text-black sm:mx-6 lg:mx-auto">
+      <div className="prose mx-4 mt-16 text-black sm:mx-6 md:mx-auto">
         <Suspense fallback={<SkeletonArticleView />}>
           <ArticleView params={params} searchParams={searchParams} />
         </Suspense>

diff --git a/starters/nextjs-starter-approuter-ts/tailwind.config.cjs b/starters/nextjs-starter-approuter-ts/tailwind.config.cjs
@@ -13,11 +13,6 @@ module.exports = {
             maxWidth: "80ch",
             img: {
               borderRadius: "1rem",
-              maxWidth: "none !important",
-              maxHeight: "none !important",
-              aspectRatio: "3/2",
-              marginTop: "4rem !important",
-              marginBottom: "4rem !important",
             },
             a: {
               color: "rgb(17, 85, 204)", // "dark cornflower blue 2" in Google Docs

diff --git a/starters/nextjs-starter-ts/pages/articles/[...uri].tsx b/starters/nextjs-starter-ts/pages/articles/[...uri].tsx
@@ -43,8 +43,8 @@ export default function ArticlePage({ article, grant }: ArticlePageProps) {
           }}
         />
 
-        <div className="prose mx-4 mt-16 text-black sm:mx-6 lg:mx-auto">
-          <ArticleView article={article} onlyContent />
+        <div className="prose mx-4 mt-16 text-black sm:mx-6 md:mx-auto">
+          <ArticleView article={article} />
         </div>
       </Layout>
     </PantheonProvider>

diff --git a/starters/nextjs-starter-ts/tailwind.config.cjs b/starters/nextjs-starter-ts/tailwind.config.cjs
@@ -12,11 +12,6 @@ module.exports = {
             maxWidth: "80ch",
             img: {
               borderRadius: "1rem",
-              maxWidth: "none !important",
-              maxHeight: "none !important",
-              aspectRatio: "3/2",
-              marginTop: "4rem !important",
-              marginBottom: "4rem !important",
             },
             a: {
               color: "rgb(17, 85, 204)", // "dark cornflower blue 2" in Google Docs

diff --git a/starters/nextjs-starter/pages/articles/[...uri].jsx b/starters/nextjs-starter/pages/articles/[...uri].jsx
@@ -37,8 +37,8 @@ export default function ArticlePage({ article, grant }) {
           }}
         />
 
-        <div className="prose mx-4 mt-16 text-black sm:mx-6 lg:mx-auto">
-          <ArticleView article={article} onlyContent />
+        <div className="prose mx-4 mt-16 text-black sm:mx-6 md:mx-auto">
+          <ArticleView article={article} />
         </div>
       </Layout>
     </PantheonProvider>

diff --git a/starters/nextjs-starter/tailwind.config.cjs b/starters/nextjs-starter/tailwind.config.cjs
@@ -12,11 +12,6 @@ module.exports = {
             maxWidth: "80ch",
             img: {
               borderRadius: "1rem",
-              maxWidth: "none !important",
-              maxHeight: "none !important",
-              aspectRatio: "3/2",
-              marginTop: "4rem !important",
-              marginBottom: "4rem !important",
             },
             a: {
               color: "rgb(17, 85, 204)", // "dark cornflower blue 2" in Google Docs