Skip to content

Instantly share code, notes, and snippets.

HTeuMeuLeu hteumeuleu

Block or report user

Report or block hteumeuleu

Hide content and notifications from this user.

Learn more about blocking users

Contact Support about this user’s behavior.

Learn more about reporting abuse

Report abuse
View GitHub Profile
@hteumeuleu
hteumeuleu / darkModeHandler.ts
Last active Dec 6, 2018
Outlook.com darkModeHandler
View darkModeHandler.ts
import Color from 'color';
import ContentHandler from 'owa-controls-content-handler/lib/schema/ContentHandler';
import { getPaletteAsRawColors } from 'owa-theme';
export const DARK_MODE_HANDLER_NAME = 'darkModeHandler';
const VALID_CONTRAST_VALUE = 4.5;
const DARK_MODE_SELECTOR = '*';
const EMPTY_STRING = '';
const ATTR_COLOR = 'color';
@hteumeuleu
hteumeuleu / the-fab-four-outlook-com-dark-mode.html
Last active Oct 24, 2018
The Fab Four in Outlook.com dark mode
View the-fab-four-outlook-com-dark-mode.html
<div class="rps_ef59"><style type="text/css"><!-- .rps_ef59 html, .rps_ef59 body
{ min-width: 260px; min-height: 100%; padding: 0; margin: 0 auto; background: #fff; }
.rps_ef59 a img
{ border: none; }
.rps_ef59 .x_ReadMsgBody
{ width: 100%; }
.rps_ef59 .x_ExternalClass
{ width: 100%; }
.rps_ef59 .x_ExternalClass *
{ line-height: 100%; }
@hteumeuleu
hteumeuleu / apple-arkit2-ios12-test.html
Created Sep 26, 2018
Apple AR Kit 2 in an email test
View apple-arkit2-ios12-test.html
<!DOCTYPE html>
<html lang="en">
<head>
<meta charset="UTF-8">
<title>iOS 12 ARKit 2</title>
<style>
body { font:1em "SF Pro Display", "SF Pro Icons", "Helvetica Neue", "Helvetica", "Arial", sans-serif; }
a { color:#0070c9; }
</style>
<meta name="x-apple-disable-message-reformatting" />
@hteumeuleu
hteumeuleu / gmail.html
Created Aug 24, 2018
Gmail Confidential Mode Email
View gmail.html
<html>
<head></head>
<body>
<div style="width: 100%; padding: 24px 0 16px 0; background-color: #f5f5f5; text-align: center;">
<div style="display: inline-block; width: 90%; max-width: 680px; min-width: 280px; text-align: left; font-family: Roboto,Arial,Helvetica,sans-serif; font-size: 13px;" dir="ltr">
<div style="display: block; padding: 0 2px;">
<div style="display: block; background: #fff; height: 2px;"></div>
</div>
<div style="border-left: 1px solid f0f0f0; border-right: 1px solid #f0f0f0; border-bottom: 1px solid #f0f0f0;">
<div style="padding: 24px 32px 24px 32px; background: #fff; border-right: 1px solid #eaeaea; border-left: 1px solid #eaeaea; border-bottom: 1px solid #eaeaea;">
@hteumeuleu
hteumeuleu / mso-allowpng.html
Created Jul 6, 2018
Is AllowPNG actually useful ?
View mso-allowpng.html
<!DOCTYPE html>
<html xmlns:v="urn:schemas-microsoft-com:vml" xmlns:o="urn:schemas-microsoft-com:office:office" lang="fr">
<head>
<meta charset="UTF-8">
<title>Document</title>
<!--[if mso]>
<xml>
<o:OfficeDocumentSettings>
<o:AllowPNG/>
<o:PixelsPerInch>96</o:PixelsPerInch>
@hteumeuleu
hteumeuleu / img-video.html
Created Jun 19, 2018
Testing support for <img src="video.mp4"> in email clients
View img-video.html
<!DOCTYPE html>
<html lang="en">
<head>
<meta charset="UTF-8">
<title>Testing support for &lt;img src="video.mp4"&gt; in email clients</title>
<style>
body { font-family: -apple-system,BlinkMacSystemFont,"Segoe UI",Roboto,Oxygen-Sans,Ubuntu,Cantarell,"Helvetica Neue",sans-serif; }
</style>
</head>
<body>
@hteumeuleu
hteumeuleu / outlook-adaptive-card-flight.html
Created May 7, 2018
Outlook Adaptive Card - Flight Itinerary Example
View outlook-adaptive-card-flight.html
<div class="_14Jtf8DbUC3EHtjC4hMK4V"><div class="ac-container" tabindex="0" aria-label="<s>Your flight is confirmed for you and 3 other passengers from San Francisco to Amsterdam on Friday, October 10 8:30 AM</s>" style="display: flex; flex-direction: column; justify-content: flex-start; background-color: rgb(255, 255, 255); box-sizing: border-box; flex: 0 0 auto; padding: 20px;"><div class="ac-columnSet" style="display: flex; justify-content: flex-start; box-sizing: border-box; flex: 0 0 auto;"><div class="ac-container" style="display: flex; flex-direction: column; justify-content: center; box-sizing: border-box; min-width: 0px; flex: 1 1 50px;"><div style="overflow: hidden; font-family: &quot;Segoe UI&quot;; text-align: left; font-size: 17px; line-height: 22.61px; color: rgb(51, 51, 51); font-weight: 400; white-space: nowrap; text-overflow: ellipsis; box-sizing: border-box; flex: 0 0 auto;"><p style="margin-top: 0px; width: 100%; overflow: hidden; text-overflow: ellipsis; margin-bottom: 0px;"><strong>FLIGHT
@hteumeuleu
hteumeuleu / gmail-animation.html
Created Apr 26, 2018
The new Gmail loading animation is just HTML and CSS.
View gmail-animation.html
<style>
body{margin:0;width:100%;height:100%} body,td,input,textarea,select{font-family:arial,sans-serif} input,textarea,select{font-size:100%} #loading{position:absolute;width:100%;height:100%;z-index:1000;background-color:#fff} .msg{ color: #757575; font: 20px/20px Arial, sans-serif; letter-spacing: .2px; text-align: center } #nlpt{ animation: a-s .5s 2.5s 1 forwards; background-color: #f1f1f1; height: 4px; margin: 56px auto 20px; opacity: 0; overflow: hidden; position: relative; width: 300px } #nlpt::before{ animation: a-lb 20s 3s linear forwards; background-color: #db4437; content: ''; display: block; height: 100%; position: absolute; transform: translateX(-300px); width: 100% } @keyframes a-lb{ 0%{transform:translateX(-300px)}5%{transform:translateX(-240px)}15%{transform:translateX(-30px)}25%{transform:translateX(-30px)}30%{transform:translateX(-20px)}45%{transform:translateX(-20px)}50%{transform:translateX(-15px)}65%{transform:translateX(-15px)}70%{transform:translateX(-10px)}95%{transform:translateX(-1
@hteumeuleu
hteumeuleu / mailchimp-2018.html
Created Jan 25, 2018
What's new in Mailchimp ? (newsletter from January 2018)
View mailchimp-2018.html
<!doctype html>
<html xmlns:fb="http://www.facebook.com/2008/fbml" xmlns:og="http://opengraph.org/schema/"> <head>
<meta property="og:title" content="What’s new in MailChimp?"/>
<meta property="fb:page_id" content="43929265776" />
<meta name="viewport" content="width=device-width, initial-scale=1, maximum-scale=1" />
<meta name="referrer" content="origin" />
<!-- NAME: FALL COLORS -->
<!--[if gte mso 15]>
<xml>
@hteumeuleu
hteumeuleu / netflix-stranger-things-2.html
Created Oct 19, 2017
Netflix Stranger Things 2 Email
View netflix-stranger-things-2.html
<!DOCTYPE html PUBLIC "-//W3C//DTD XHTML 1.0 Transitional //EN" "http://www.w3.org/TR/xhtml1/DTD/xhtml1-transitional.dtd">
<html>
<head>
<meta charset="utf-8">
<meta http-equiv="X-UA-Compatible" content="IE=edge">
<meta name="viewport" content="width=device-width, initial-scale=1">
<style>
@media yahoo
{
table
You can’t perform that action at this time.