Comments (3)
Thanks for this @ianmclaughlin
For inlined we can embed these styles and use !important
However I was under the impression iOS Mail would automatically invert. Adding something like this just gives you more control over those dark mode colors. Could you share a screenshot?
This is what I see in Gmail app when switching between light and dark mode. And this is what Litmus shows me for iPhone 15 (I don't have Apple Mail on iOS handy).
from responsive-html-email-template.
I should probably have mentioned, I was including images. Reading around I came across this https://www.dyspatch.io/blog/the-danger-of-dark-mode-and-email/ and this https://www.campaignmonitor.com/resources/guides/dark-mode-in-email so I tried the media query.
from responsive-html-email-template.
Hi there! I got a question about your last reply. when you added that media query for dark mode. does not be affecting by other Mail clients? like outlook or gmail? also you are not adding any !important in those queries so maybe mail client can change it for you. I like this simple template for that but I would like to make it maybe not bullet proof but close.
Any recommendation it would be appreciate it though. @leemunroe
I almost forget to say something. if I want to add like a head image I'm not referring to top top of the email but more like simple image. where exactly you have add html I added after and then in tbody I just added new for example:
<table border="0" cellpadding="0" cellspacing="0" class="main" role="presentation" style="border-collapse: separate; mso-table-lspace: 0pt; mso-table-rspace: 0pt; background: #ffffff; border: 1px solid #eaebed; border-radius: 16px; width: 100%;" width="100%"><!-- START MAIN CONTENT AREA --> <tbody> <tr> <td><a href="[EXAMPLE]"><img alt="Example ALT." src="[EXAMPLE].PNG" style="max-width: 100%; border-width: 0px; border-style: solid; width: 500px;" /> </a></td> </tr>
Also I added max-width:100% to make it responsive otherwise the responsive didn't work at all the image just stuck there.
If you consider this is not a good place to add you can let me know.
and again thanks!
Regards
from responsive-html-email-template.
Related Issues (20)
- Outlook: the css is not working properly? HOT 4
- If placeholder keys are used rather than text, the template is easier to use as-is HOT 11
- Hola
- Where should I include the license notice ? HOT 2
- is it possible to change the border-radius of the button? HOT 1
- Fun: Unsubscribe gif link is broken HOT 3
- Social icons in footer addition HOT 11
- Side Cross Element HOT 1
- Inlined version CSS problems on the Gmail mobile app for both iOS and Android HOT 1
- Html 1 HOT 1
- email template is not centered in Apple Mail app HOT 5
- The "fork me" banner overlaps with content HOT 2
- Just a mention - Referenced your HTML Template in my code HOT 1
- Make README.md more interactive
- New phone works great until I enter old email addresses.
- Missing css classes HOT 1
- how to modify width on desktop?... HOT 1
- "content-block" Style Class HOT 3
- Not Issue but question
Recommend Projects
-
React
A declarative, efficient, and flexible JavaScript library for building user interfaces.
-
Vue.js
🖖 Vue.js is a progressive, incrementally-adoptable JavaScript framework for building UI on the web.
-
Typescript
TypeScript is a superset of JavaScript that compiles to clean JavaScript output.
-
TensorFlow
An Open Source Machine Learning Framework for Everyone
-
Django
The Web framework for perfectionists with deadlines.
-
Laravel
A PHP framework for web artisans
-
D3
Bring data to life with SVG, Canvas and HTML. 📊📈🎉
-
Recommend Topics
-
javascript
JavaScript (JS) is a lightweight interpreted programming language with first-class functions.
-
web
Some thing interesting about web. New door for the world.
-
server
A server is a program made to process requests and deliver data to clients.
-
Machine learning
Machine learning is a way of modeling and interpreting data that allows a piece of software to respond intelligently.
-
Visualization
Some thing interesting about visualization, use data art
-
Game
Some thing interesting about game, make everyone happy.
Recommend Org
-
Facebook
We are working to build community through open source technology. NB: members must have two-factor auth.
-
Microsoft
Open source projects and samples from Microsoft.
-
Google
Google ❤️ Open Source for everyone.
-
Alibaba
Alibaba Open Source for everyone
-
D3
Data-Driven Documents codes.
-
Tencent
China tencent open source team.
from responsive-html-email-template.