feat: improve blogLayout style

kuizuo · Dec 26, 2023 · 310a6a0 · 310a6a0
1 parent 9e12f2c
commit 310a6a0
Show file tree

Hide file tree

Showing 5 changed files with 7 additions and 6 deletions.
diff --git a/src/css/custom.scss b/src/css/custom.scss
@@ -262,9 +262,10 @@ div[class^='announcementBar_'] {
   border-left: 3px solid #ff000080;
 }
 
-.blogPost-container {
+.blog-card {
   border-radius: var(--ifm-pagination-nav-border-radius);
   margin-top: 0;
+
   background: var(--blog-item-background-color);
   box-shadow: var(--blog-item-shadow);
   padding: 1em 1.25em 0.75em;

diff --git a/src/theme/BlogLayout/index.tsx b/src/theme/BlogLayout/index.tsx
@@ -17,10 +17,10 @@ export default function BlogLayout(props: Props): JSX.Element {
           <main
             className={clsx('col', {
               'col--8': hasSidebar,
-              'col--9 col--offset-1': !hasSidebar,
+              'col--8 col--offset-2': !hasSidebar,
             })}
             itemScope
-            itemType="http://schema.org/Blog"
+            itemType="h ttp://schema.org/Blog"
           >
             {children}
           </main>

diff --git a/src/theme/BlogPostItem/Container/styles.module.css b/src/theme/BlogPostItem/Container/styles.module.css
@@ -8,7 +8,7 @@ html[data-theme='dark'] {
 
 .article {
   position: relative;
-  border: 1px solid var(--border-color);
+  /* border: 1px solid var(--border-color); */
 }
 
 .cover {

diff --git a/src/theme/BlogPostItem/index.tsx b/src/theme/BlogPostItem/index.tsx
@@ -10,7 +10,7 @@ import type { Props } from '@theme/BlogPostItem'
 // apply a bottom margin in list view
 function useContainerClassName() {
   const { isBlogPostPage } = useBlogPost()
-  return !isBlogPostPage ? 'blogPost-container margin-bottom--lg' : 'blogPost-container'
+  return !isBlogPostPage ? 'blog-card margin-bottom--lg' : ''
 }
 
 export default function BlogPostItem({ children, className }: Props): JSX.Element {

diff --git a/src/theme/BlogPostPage/index.tsx b/src/theme/BlogPostPage/index.tsx
@@ -30,7 +30,7 @@ function BlogPostPageContent({
 
   return (
     <BlogLayout
-      sidebar={sidebar}
+      // sidebar={sidebar}
       toc={
         !hideTableOfContents && toc.length > 0 ? (
           <TOC