Merge pull request #17994 from overleaf/mf-create-config-contact-form-website-redesign

[web][website-redesign] Migrate "for government" and "back to school 2023" CMS page to website redesign style by repurposing the "new page style" option on CMS

GitOrigin-RevId: 5f5b3bde7be21746c48718253252c8634a20bb19
This commit is contained in:
M Fahru 2024-04-24 05:13:35 -07:00 committed by Copybot
parent f3ccafee94
commit 56a0a33b70
3 changed files with 42 additions and 43 deletions

View file

@ -4,17 +4,16 @@
including About and Blog
*/
.cms-page {
&.page-style {
/*
Links and Buttons
*/
&.website-redesign {
h1 {
font-size: 2rem; // 32px
}
a {
color: @link-color;
&:hover {
color: @link-hover-color;
}
h2 {
font-size: 1.5rem; // 24px
}
/* Buttons */
// correct color property set on <a> above:
.reset-btns;
.alert {
@ -25,6 +24,31 @@
.btn-alert-info;
}
}
blockquote.quote-picture-bottom {
padding: (@line-height-computed / 2) @line-height-computed;
.quote-picture-and-person {
font-size: 18px;
}
.quote-by-position {
font-weight: 400;
}
}
}
.section-row {
margin: 0 auto;
/* match .col-sm-12 */
/* @grid-gutter-width is used for margins */
max-width: (@screen-sm) - @grid-gutter-width!important;
@media (min-width: @screen-md-min) {
max-width: (@screen-md) - @grid-gutter-width!important;
}
@media (min-width: @screen-lg-min) {
max-width: (@screen-lg) - @grid-gutter-width!important;
}
}
padding-bottom: 0;

View file

@ -87,3 +87,10 @@
background-color: @ol-blue-gray-1;
border-radius: @card-border-radius;
}
.website-redesign {
.card {
background-color: @card-gray-bg-color;
border-radius: 24px;
}
}

View file

@ -1,37 +1,5 @@
.page-style {
background-color: @white;
a:not(.btn) {
text-decoration: underline;
}
.page-header {
border-bottom: none;
margin: 0;
margin-top: 60px !important;
padding: 0;
text-align: center;
}
.card {
background-color: @card-gray-bg-color;
border-radius: 24px;
}
.website-redesign {
video {
clip-path: inset(0 0); // fix Safari bug that will sometimes add border
}
.section-row {
margin: 0 auto;
/* match .col-sm-12 */
/* @grid-gutter-width is used for margins */
max-width: (@screen-sm) - @grid-gutter-width!important;
@media (min-width: @screen-md-min) {
max-width: (@screen-md) - @grid-gutter-width!important;
}
@media (min-width: @screen-lg-min) {
max-width: (@screen-lg) - @grid-gutter-width!important;
}
}
}