diff --git a/assets/css/extended/newsletter.scss b/assets/css/extended/newsletter.scss
index 49a7aad..136ba92 100644
--- a/assets/css/extended/newsletter.scss
+++ b/assets/css/extended/newsletter.scss
@@ -27,8 +27,9 @@ body.type-newsletter {
     --icon-font-size: 24px;
   }
 
-  /* a links in section page content and regular page post-content */
+  /* a links in section/archives page content and regular page post-content */
   &.kind-section .main .content a,
+  &.layout-archives .main .content a,
   &.kind-page .post-content a {
     font-weight: 500;
     color: var(--primary);
@@ -86,8 +87,9 @@ body.type-newsletter {
   }
 }
 
-body.type-newsletter.kind-section {
-  /* section page layout */
+body.type-newsletter.kind-section,
+body.type-newsletter.layout-archives {
+  /* section/archives page */
 
   .main {
     border: var(--main-border);
@@ -129,21 +131,16 @@ body.type-newsletter.kind-section {
       @media screen and (max-width: $small) {
         margin-top: calc(var(--icon-length));
       }
+    }
 
-      .entry-header {
-        text-align: center;
-        margin-bottom: calc(var(--content-gap) * 1.5);
-        h1 {
-          // back to default
-          font-size: 36px;
-        }
-        .subtitle {
-          color: var(--secondary);
-        }
-      }
-      // .entry-content {
-      //   font-size: 16px;
-      // }
+    h1 {
+      text-align: center;
+      margin-top: var(--gap);
+      margin-bottom: calc(var(--content-gap) * 1);
+    }
+    .subtitle {
+      text-align: center;
+      color: var(--secondary);
     }
 
     h2 {
@@ -214,7 +211,7 @@ body.type-newsletter.kind-section {
   }
 }
 
-/* regular page layout */
+/* regular page */
 body.type-newsletter.kind-page {
   .newsletter-brand {
     --icon-length: 50px;
@@ -286,7 +283,6 @@ body.type-newsletter.kind-page {
     border-bottom-color: var(--signature);
   }
 
-
   .newsletter-sub {
     margin-top: var(--gap);
     background-color: var(--signature-bg-dim);
diff --git a/layouts/newsletter/archives.html b/layouts/newsletter/archives.html
new file mode 100644
index 0000000..ae19b5a
--- /dev/null
+++ b/layouts/newsletter/archives.html
@@ -0,0 +1,33 @@
+{{- define "main" }}
+<div class="main-icon">＠</div>
+
+<div class="content">
+  <h1>{{ .Title }}</h1>
+  {{- partial "newsletter_sub_form.html"}}
+
+  {{/* get pages from the current page's section */}}
+  {{- $sections := slice .Section }}
+  {{- $pages := where (where site.RegularPages "Section" "in" $sections) "Params.hidden" "!=" true }}
+
+  {{/* TODO statistics */}}
+  <div class="list">
+  {{- range $pages }}
+    <div class="item">
+      <div class="date">
+        {{- if not .Date.IsZero -}}
+          {{ .Date | time.Format (default "January 2, 2006" site.Params.DateFormat) }}
+        {{- end }}
+      </div>
+      <div class="title">
+        <a href="{{ .Permalink }}">{{- .Title }}
+          {{- if .Draft }}<em>[Draft]</em>{{- end }}
+          {{- if .Weight }}<em>[Pinned]</em>{{- end }}
+        </a>
+      </div>
+      <div class="issueno">{{ with .Param "issueno" }}#{{ . }}{{ end }}</div>
+    </div>
+  {{- end }}
+  </div>
+
+</div>
+{{ end }}
diff --git a/layouts/newsletter/section.html b/layouts/newsletter/section.html
index 11d52ab..28ac710 100644
--- a/layouts/newsletter/section.html
+++ b/layouts/newsletter/section.html
@@ -4,11 +4,10 @@
 <div class="main-icon">＠</div>
 
 <div class="content">
+  <h1>{{ .Title }}</h1>
+  {{ with .Param "subtitle" }}<div class="subtitle">{{ . }}</div>{{ end }}
+
   <div class="first-entry">
-    <header class="entry-header">
-      <h1>{{ .Title }}</h1>
-      {{ with .Param "subtitle" }}<div class="subtitle">{{ . }}</div>{{ end }}
-    </header>
     <section class="entry-content">{{ .Description | markdownify }}</section>
     {{- partial "newsletter_sub_form.html"}}
   </div>