Customize Styles

Style props are exposed for you to customize the look and feel of your guestbook.

Props

For SignLegacy

Prop NameDescriptionRequiredExample
projectIdspecify project id for the guestbook✅ yesprojectId="legacyxyz"
cardStyleoverride card style❌ nocardStyle={{border: '0px solid #3f8758', p: 4, maxWidth: '800px', borderRadius: 10}}
buttonStyleoverride button style❌ nobuttonStyle={{border: "4px solid rgba(255, 255, 255, 0.1)", borderRadius: "16px", height: "60px", backgroundColor: "#3f8758", textTransform: 'none', fontSize: 20, ':hover': { background: '#3f8758', opacity: 0.8 } }}
buttonLabeloverride sign button label❌ nobuttonLabel={"Sign here"}
showLegacyshow learn more text❌ noshowLegacy={true}
messageoverride sign info text❌ nomessage={"Click here to sign."}
modalStyleoverride modal style (dangerously set)❌ nomodalStyle={ position: 'absolute', top: '50%', left: '50%', transform: 'translate(-50%, -50%)', width: 445, background: 'white', border: '0px', borderRadius: 10, boxShadow: 24, marginLeft: 'auto', marginRight: 'auto', p: 5}

For SignersList

Prop NameDescriptionRequiredExample
projectIdspecify project id for the guestbook✅ yesprojectId="legacyxyz"
cardStyleoverride card style❌ nocardStyle={{border: '0px solid #3f8758', p: 4, maxWidth: '800px', borderRadius: 10}}