Skip to content

Commit 2bd000d

Browse files
StoneMoneyStoneMoney
committed
Polish Round
1 parent 9dcb04a commit 2bd000d

6 files changed

Lines changed: 154 additions & 13 deletions

File tree

‎dist/engrid.css‎

Lines changed: 66 additions & 3 deletions
Original file line numberDiff line numberDiff line change
@@ -19,7 +19,7 @@
1919
*
2020
* ENGRID PAGE TEMPLATE ASSETS
2121
*
22-
* Date: Monday, June 15, 2026 @ 16:41:40 ET
22+
* Date: Tuesday, June 16, 2026 @ 13:58:56 ET
2323
* By: nick
2424
* ENGrid styles: v0.25.6
2525
* ENGrid scripts: v0.25.6
@@ -8017,6 +8017,7 @@ body[data-engrid-debug]:before{
80178017
--md:16px;
80188018
--lg:24px;
80198019
--xl:32px;
8020+
--2xl:48px;
80208021
--3xl:64px;
80218022
--engrid__body_background-color:var(--color_snow);
80228023
--engrid__body_padding:0 64px;
@@ -8029,6 +8030,7 @@ body[data-engrid-debug]:before{
80298030
--engrid__content-footer_padding:var(--3xl);
80308031
--engrid__content-footer_background-color:var(--color_earth);
80318032
--engrid__content-footer_color:var(--color_white);
8033+
--fields_spacing-block:12px;
80328034
--click-to-expand__copy-area_height:126px;
80338035
--click-to-expand__cta-image_height:26px;
80348036
--default_font-family:"Helvetica Neue", var(--native-fonts__sans-serif);
@@ -8065,8 +8067,8 @@ body[data-engrid-debug]:before{
80658067
--input_box-shadow:unset;
80668068
--input_padding:16.5px 20px;
80678069
--radio_font-size:20px;
8068-
--checkbox_width:24px;
8069-
--checkbox_height:24px;
8070+
--checkbox_width:26px;
8071+
--checkbox_height:26px;
80708072
--checkbox_border-radius:4px;
80718073
--button_color:var(--color_earth);
80728074
--button_border-color:var(--color_evergreen);
@@ -8085,6 +8087,7 @@ body[data-engrid-debug]:before{
80858087
--donation-amount__button_color_checked:var(--button_color_checked);
80868088
--donation-amount__button_text-transform:capitalize;
80878089
--donation-amount__button_font-weight:700;
8090+
--donation-amount__button_font-size:24px;
80888091
--recurring-frequency__button_border-radius:100px;
80898092
--recurring-frequency__button_background-color:#0000;
80908093
--recurring-frequency__button_background-color_checked:#0000;
@@ -8128,6 +8131,13 @@ body[data-engrid-debug]:before{
81288131
-webkit-text-decoration:underline;
81298132
text-decoration:underline;
81308133
}
8134+
[data-engrid-theme=tpl] hr{
8135+
margin-block-end:var(--lg);
8136+
margin-block-start:var(--lg);
8137+
}
8138+
[data-engrid-theme=tpl] input[type=checkbox]+label{
8139+
align-items:flex-start;
8140+
}
81318141
[data-engrid-theme=tpl] .body-title h1{
81328142
max-width:500px;
81338143
}
@@ -8429,6 +8439,20 @@ body[data-engrid-theme=tpl]:not(#en__pagebuilder) .click-to-expand:not(.expanded
84298439
top:-12px;
84308440
transform:translateX(-50%);
84318441
}
8442+
[data-engrid-theme=tpl] .radio-to-buttons_donationAmt .en__field--donationAmt .en__field__item:not(.en__field__item--other) .en__field__label:after{
8443+
-webkit-box-orient:vertical;
8444+
-webkit-line-clamp:1;
8445+
line-clamp:1;
8446+
font-family:Helvetica Neue;
8447+
font-size:24px;
8448+
font-style:italic;
8449+
font-weight:400;
8450+
letter-spacing:.24px;
8451+
line-height:16px;
8452+
opacity:1;
8453+
text-overflow:ellipsis;
8454+
text-transform:lowercase;
8455+
}
84328456
[data-engrid-theme=tpl] .give-by-select-wrapper .en__field__label{
84338457
display:flex;
84348458
gap:25px;
@@ -8511,6 +8535,9 @@ body[data-engrid-theme=tpl]:not(#en__pagebuilder) .click-to-expand:not(.expanded
85118535
[data-engrid-theme=tpl] .remember-me{
85128536
margin-top:-16px;
85138537
}
8538+
[data-engrid-theme=tpl] .rememberme-wrapper{
8539+
padding-bottom:0;
8540+
}
85148541
[data-engrid-theme=tpl] .link-list ul{
85158542
margin:0;
85168543
padding:0;
@@ -8578,6 +8605,7 @@ body[data-engrid-theme=tpl]:not(#en__pagebuilder) .click-to-expand:not(.expanded
85788605
margin-block-start:var(--xl);
85798606
}
85808607
[data-engrid-theme=tpl] .content-footer .footer-main-copy{
8608+
--p_font-family:var(--default_font-family);
85818609
margin-top:var(--xl);
85828610
}
85838611
[data-engrid-theme=tpl] .content-footer .footer-main-copy img{
@@ -8665,6 +8693,21 @@ body[data-engrid-theme=tpl]:not(#en__pagebuilder) .click-to-expand:not(.expanded
86658693
mask:url("data:image/svg+xml;charset=utf-8,%3Csvg width='29' height='19' fill='none' xmlns='http://www.w3.org/2000/svg'%3E%3Cpath fill-rule='evenodd' clip-rule='evenodd' d='M5.68 18.645c8.328-4.171 13.516-5.875 22.857-7.055-.505-4.58-1.742-8.403-4.624-11.59C17.57.18 9.947 2.127-.001 5.698c4.977 4.597 6.772 7.745 5.681 12.947' fill='%23362229'/%3E%3C/svg%3E") no-repeat center/contain;
86668694
width:29px;
86678695
}
8696+
[data-engrid-theme=tpl] .tippy-box{
8697+
background-color:#fff;
8698+
box-shadow:0 8px 16px 0 #23325924;
8699+
color:#000;
8700+
max-width:267px !important;
8701+
}
8702+
[data-engrid-theme=tpl] .tippy-box .tippy-content{
8703+
font-family:var(--p_font-family);
8704+
font-size:15px;
8705+
line-height:21px;
8706+
padding:var(--md);
8707+
}
8708+
[data-engrid-theme=tpl] .tippy-box .tippy-arrow{
8709+
color:#fff;
8710+
}
86688711
@media (max-width:767.99px){
86698712
[data-engrid-theme=tpl][data-engrid-layout]{
86708713
--engrid__body-headerOutside_padding:24px 22px var(--lg) 22px;
@@ -8675,6 +8718,15 @@ body[data-engrid-theme=tpl]:not(#en__pagebuilder) .click-to-expand:not(.expanded
86758718
--engrid__content-footer_padding:40px 22px;
86768719
--h1_font-size:32px;
86778720
--h1_line-height:36px;
8721+
--default_font-size:18px;
8722+
--default_line-height:27px;
8723+
--input_font-size:18px;
8724+
--input_line-height:27px;
8725+
--label_font-size:22px;
8726+
--label_line-height:32px;
8727+
--radio_font-size:15px;
8728+
--radio_line-height:27px;
8729+
--fields_spacing-block:8px;
86788730
--recurring-frequency__button_font-size:24px;
86798731
--recurring-frequency__button_line-height:16px;
86808732
--recurring-frequency__button_count:2;
@@ -8728,6 +8780,17 @@ body[data-engrid-theme=tpl]:not(#en__pagebuilder) .click-to-expand:not(.expanded
87288780
font-size:18px;
87298781
max-width:300px;
87308782
}
8783+
[data-engrid-theme=tpl][data-engrid-layout] .content-footer p{
8784+
margin-block-end:var(--md);
8785+
margin-block-start:var(--md);
8786+
}
8787+
[data-engrid-theme=tpl][data-engrid-layout] .content-footer .tpl-footer-logo{
8788+
margin-block-end:var(--2xl);
8789+
margin-block-start:var(--2xl);
8790+
}
8791+
[data-engrid-theme=tpl][data-engrid-layout] .content-footer .footer-links{
8792+
margin-bottom:var(--md);
8793+
}
87318794
[data-engrid-theme=tpl][data-engrid-layout]:not(#en__pagebuilder) .page-backgroundImage img{
87328795
display:unset;
87338796
}

‎dist/engrid.js‎

Lines changed: 2 additions & 2 deletions
Original file line numberDiff line numberDiff line change
@@ -17,7 +17,7 @@
1717
*
1818
* ENGRID PAGE TEMPLATE ASSETS
1919
*
20-
* Date: Monday, June 15, 2026 @ 16:41:40 ET
20+
* Date: Tuesday, June 16, 2026 @ 13:58:56 ET
2121
* By: nick
2222
* ENGrid styles: v0.25.6
2323
* ENGrid scripts: v0.25.6
@@ -27052,7 +27052,7 @@ class SuggestedAmount {
2705227052

2705327053
class Confetti {
2705427054
constructor() {
27055-
_defineProperty(this, "pieceCount", 200);
27055+
_defineProperty(this, "pieceCount", Math.round(window.innerWidth / 100 * 10));
2705627056
_defineProperty(this, "launchDelay", 1000);
2705727057
_defineProperty(this, "cleanupDelay", 3000);
2705827058
_defineProperty(this, "colors", ['#f7931e', '#5DD8D8', '#39B54A', '#CEE4C5', '#362229']);

‎dist/engrid.min.css‎

Lines changed: 2 additions & 2 deletions
Some generated files are not rendered by default. Learn more about customizing how changed files appear on GitHub.

‎dist/engrid.min.js‎

Lines changed: 2 additions & 2 deletions
Some generated files are not rendered by default. Learn more about customizing how changed files appear on GitHub.

‎src/sass/themes/tpl.scss‎

Lines changed: 81 additions & 3 deletions
Original file line numberDiff line numberDiff line change
@@ -20,6 +20,7 @@
2020
--md: 16px;
2121
--lg: 24px;
2222
--xl: 32px;
23+
--2xl: 48px;
2324
--3xl: 64px;
2425

2526
--engrid__body_background-color: var(--color_snow);
@@ -34,6 +35,8 @@
3435
--engrid__content-footer_background-color: var(--color_earth);
3536
--engrid__content-footer_color: var(--color_white);
3637

38+
--fields_spacing-block: 12px;
39+
3740
--click-to-expand__copy-area_height: 126px;
3841
--click-to-expand__cta-image_height: 26px;
3942
// TYPOGRAPHY DEFAULT
@@ -99,8 +102,8 @@
99102

100103
--radio_font-size: 20px;
101104

102-
--checkbox_width: 24px;
103-
--checkbox_height: 24px;
105+
--checkbox_width: 26px;
106+
--checkbox_height: 26px;
104107
--checkbox_border-radius: 4px;
105108

106109
// TYPOGRAPHY INPUT:FOCUS
@@ -134,6 +137,7 @@
134137
--donation-amount__button_color_checked: var(--button_color_checked);
135138
--donation-amount__button_text-transform: capitalize;
136139
--donation-amount__button_font-weight: 700;
140+
--donation-amount__button_font-size: 24px;
137141
--recurring-frequency__button_border-radius: 100px;
138142
--recurring-frequency__button_background-color: transparent;
139143
--recurring-frequency__button_background-color_checked: transparent;
@@ -187,6 +191,15 @@
187191
text-decoration: underline;
188192
}
189193

194+
hr {
195+
margin-block-start: var(--lg);
196+
margin-block-end: var(--lg);
197+
}
198+
199+
input[type=checkbox]+label {
200+
align-items: flex-start;
201+
}
202+
190203
.body-title h1 {
191204
max-width: 500px;
192205
}
@@ -544,6 +557,21 @@
544557
}
545558
}
546559

560+
.en__field--donationAmt .en__field__item:not(.en__field__item--other) .en__field__label::after {
561+
-webkit-box-orient: vertical;
562+
-webkit-line-clamp: 1;
563+
line-clamp: 1;
564+
text-overflow: ellipsis;
565+
font-family: "Helvetica Neue";
566+
font-size: 24px;
567+
font-style: italic;
568+
font-weight: 400;
569+
line-height: 16px;
570+
letter-spacing: 0.24px;
571+
text-transform: lowercase;
572+
opacity: 1;
573+
}
574+
547575
}
548576

549577
.give-by-select-wrapper {
@@ -656,6 +684,10 @@
656684
margin-top: -16px;
657685
}
658686

687+
.rememberme-wrapper {
688+
padding-bottom: 0;
689+
}
690+
659691
.link-list ul {
660692
padding: 0;
661693
margin: 0;
@@ -732,6 +764,7 @@
732764
}
733765

734766
.footer-main-copy {
767+
--p_font-family: var(--default_font-family);
735768
margin-top: var(--xl);
736769

737770
img {
@@ -815,7 +848,7 @@
815848
z-index: 9999;
816849
overflow: hidden;
817850

818-
> div {
851+
>div {
819852
position: absolute;
820853
top: var(--start-y);
821854
left: var(--x);
@@ -846,6 +879,24 @@
846879
}
847880
}
848881

882+
.tippy-box {
883+
max-width: 267px !important;
884+
background-color: white;
885+
color: black;
886+
box-shadow: 0 8px 16px 0 rgba(35, 50, 89, 0.14);
887+
888+
.tippy-content {
889+
padding: var(--md);
890+
font-family: var(--p_font-family);
891+
font-size: 15px;
892+
line-height: 21px;
893+
}
894+
895+
.tippy-arrow {
896+
color: white;
897+
}
898+
}
899+
849900
}
850901

851902
/* Add your custom theme styles here */
@@ -860,6 +911,17 @@
860911
--h1_font-size: 32px;
861912
--h1_line-height: 36px;
862913

914+
--default_font-size: 18px;
915+
--default_line-height: 27px;
916+
--input_font-size: 18px;
917+
--input_line-height: 27px;
918+
--label_font-size: 22px;
919+
--label_line-height: 32px;
920+
--radio_font-size: 15px;
921+
--radio_line-height: 27px;
922+
923+
--fields_spacing-block: 8px;
924+
863925
--recurring-frequency__button_font-size: 24px;
864926
--recurring-frequency__button_line-height: 16px;
865927
--recurring-frequency__button_count: 2;
@@ -932,6 +994,22 @@
932994
max-width: 300px;
933995
}
934996

997+
.content-footer {
998+
p {
999+
margin-block-start: var(--md);
1000+
margin-block-end: var(--md);
1001+
}
1002+
1003+
.tpl-footer-logo {
1004+
margin-block-start: var(--2xl);
1005+
margin-block-end: var(--2xl);
1006+
}
1007+
1008+
.footer-links {
1009+
margin-bottom: var(--md);
1010+
}
1011+
}
1012+
9351013

9361014
&:not(#en__pagebuilder) {
9371015
.page-backgroundImage img {

‎src/scripts/confetti.ts‎

Lines changed: 1 addition & 1 deletion
Original file line numberDiff line numberDiff line change
@@ -1,7 +1,7 @@
11
import { ENGrid } from "@4site/engrid-scripts";
22

33
export default class Confetti {
4-
private readonly pieceCount = 200;
4+
private readonly pieceCount = Math.round((window.innerWidth / 100) * 10);
55
private readonly launchDelay = 1000;
66
private readonly cleanupDelay = 3000;
77
private readonly colors = ['#f7931e', '#5DD8D8', '#39B54A', '#CEE4C5', '#362229'];

0 commit comments

Comments
 (0)