newsletter regular page responsive

and fix <a> style
This commit is contained in:
Reorx 2022-09-08 00:28:03 +08:00
parent c757e80859
commit a0225ef9dc
1 changed files with 28 additions and 14 deletions

View File

@ -27,8 +27,9 @@ body.type-newsletter {
--icon-font-size: 24px; --icon-font-size: 24px;
} }
.main { /* a links in section page content and regular page post-content */
a { &.kind-section .main .content a,
&.kind-page .post-content a {
font-weight: 500; font-weight: 500;
color: var(--primary); color: var(--primary);
box-shadow: var(--link-underline-shadow); box-shadow: var(--link-underline-shadow);
@ -38,7 +39,6 @@ body.type-newsletter {
box-shadow: var(--link-hover-underline-shadow); box-shadow: var(--link-hover-underline-shadow);
} }
} }
}
/* shared */ /* shared */
.sub-form { .sub-form {
@ -71,7 +71,7 @@ body.type-newsletter {
background-color: var(--signature); background-color: var(--signature);
color: var(--theme); color: var(--theme);
padding: 12px 15px; padding: 12px 15px;
margin-left: 20px; margin-left: var(--content-gap);
white-space: nowrap; white-space: nowrap;
} }
} }
@ -217,6 +217,8 @@ body.type-newsletter.kind-section {
/* regular page layout */ /* regular page layout */
body.type-newsletter.kind-page { body.type-newsletter.kind-page {
.newsletter-brand { .newsletter-brand {
--icon-length: 50px;
--padding: 15px;
display: flex; display: flex;
background-color: var(--signature-bg-dim); background-color: var(--signature-bg-dim);
transition: var(--link-transition); transition: var(--link-transition);
@ -235,7 +237,7 @@ body.type-newsletter.kind-page {
background-color: var(--signature); background-color: var(--signature);
} }
.name { .name {
padding: 0 20px; padding: 0 var(--padding);
font-weight: bolder; font-weight: bolder;
color: var(--signature); color: var(--signature);
} }
@ -249,7 +251,7 @@ body.type-newsletter.kind-page {
color: transparent; color: transparent;
display: flex; display: flex;
align-items: center; align-items: center;
padding-right: 15px; padding-right: var(--padding);
transition: var(--link-transition); transition: var(--link-transition);
} }
@ -264,11 +266,23 @@ body.type-newsletter.kind-page {
} }
} }
} }
@media screen and (max-width: $small) {
.newsletter-brand {
font-size: 24px;
.remark {
margin-left: auto;
padding-right: var(--padding);
}
.arrow {
display: none;
}
}
}
.post-title { .post-title {
font-size: 36px; font-size: 36px;
} }
.post-footer { .post-footer {
border-bottom: 0; border-bottom-color: var(--signature);
} }
} }