Skip to content
New issue

Have a question about this project? Sign up for a free GitHub account to open an issue and contact its maintainers and the community.

Sign up for GitHub

By clicking “Sign up for GitHub”, you agree to our terms of service and privacy statement. We’ll occasionally send you account related emails.

Already on GitHub? Sign in to your account

Jump to bottom

Add component: Preheader #63

Closed
niloysikdar opened this issue Jul 6, 2022 · 1 comment · Fixed by #64
Closed

Add component: Preheader #63

niloysikdar opened this issue Jul 6, 2022 · 1 comment · Fixed by #64
Assignees
@niloysikdar
Labels
2 2 story points GSoC 2022 Issues and Pull Requests under Google Summer of Code 2022 released
Milestone
GSoC 2022 - Sprint E

Comments

@niloysikdar
Copy link
Member

niloysikdar commented Jul 6, 2022 •
edited
Loading

Description:

  • Email Preheader text is a small line of text that appears after the subject line in an email inbox. Email preheaders give a short summary of the contents of an email, and may appear differently on mobile and web email clients.

  • Adding Preheader:

    • Add text as the first text within the body tag of your email
    • Put the text in a div style
    • Use the div style to hide the text from the actual email

  • To email clients, the preheader text will show up as the first text in the email. When someone opens the email, that text will be hidden (because of the hidden div style).

  • https://www.activecampaign.com/blog/email-preheader

Outcome:

  • Working Preheader component.

Reference/Example Code to add Preheader:

image
@niloysikdar niloysikdar added GSoC 2022 Issues and Pull Requests under Google Summer of Code 2022 2 2 story points labels Jul 6, 2022
@niloysikdar niloysikdar moved this to Todo in React Email Jul 6, 2022
@niloysikdar niloysikdar added this to the GSoC 2022 - Sprint D milestone Jul 6, 2022
@niloysikdar niloysikdar self-assigned this Jul 6, 2022
@niloysikdar niloysikdar changed the title Add Preheader Add component: Preheader Jul 6, 2022
@niloysikdar niloysikdar moved this from Todo to In Progress in React Email Jul 14, 2022
niloysikdar added a commit that referenced this issue Jul 14, 2022
@niloysikdar
feat(component): add Preheader
d27b530 
add a Preheader component with text prop to render preheader text on the email clients

resolves #63

Signed-off-by: Niloy Sikdar <niloysikdar30@gmail.com>
@niloysikdar niloysikdar mentioned this issue Jul 14, 2022
Merged
niloysikdar added a commit that referenced this issue Jul 16, 2022
@niloysikdar
fix(component): fix Preheader
26b2a4f 
Fix Preheader styling props

resolves #63

Signed-off-by: Niloy Sikdar <niloysikdar30@gmail.com>
niloysikdar added a commit that referenced this issue Jul 16, 2022
@niloysikdar
fix(component): fix Preheader
57d41e8 
Fix Preheader styling props

resolves #63

Signed-off-by: Niloy Sikdar <niloysikdar30@gmail.com>
agentmilindu pushed a commit that referenced this issue Jul 16, 2022
@niloysikdar
feat(component): add Preheader (#64)
84884dc 
* feat(component): add Preheader

add a Preheader component with text prop to render preheader text on the email clients

resolves #63

Signed-off-by: Niloy Sikdar <niloysikdar30@gmail.com>

* fix(component): fix Preheader

Fix Preheader styling props

resolves #63

Signed-off-by: Niloy Sikdar <niloysikdar30@gmail.com>
Repository owner moved this from In Progress to Done in React Email Jul 16, 2022
github-actions bot pushed a commit that referenced this issue Jul 16, 2022
@semantic-release-bot
chore(release): 1.6.0 [skip ci]
e8ee676 
# [1.6.0](v1.5.0...v1.6.0) (2022-07-16)

### Features

* **component:** add Preheader ([#64](#64)) ([84884dc](84884dc)), closes [#63](#63) [#63](#63)
@github-actions
Copy link

🎉 This PR is included in version 1.6.0 🎉

@niloysikdar niloysikdar moved this from Done to Released in React Email Jul 23, 2022
Sign up for free to join this conversation on GitHub. Already have an account? Sign in to comment
Assignees

@niloysikdar niloysikdar

Labels
2 2 story points GSoC 2022 Issues and Pull Requests under Google Summer of Code 2022 released
Projects
React Email
Status: Released
Milestone
GSoC 2022 - Sprint E
Development

Successfully merging a pull request may close this issue.

feat(component): add Preheader leopardslab/react-email
2 participants
@agentmilindu @niloysikdar