Skip to content

Instantly share code, notes, and snippets.

@alberto-marin

alberto-marin/snippets.cson

Created April 8, 2017 07:53
Show Gist options
  • Save alberto-marin/268811fa566829f59f1572bb6758e946 to your computer and use it in GitHub Desktop.
Save alberto-marin/268811fa566829f59f1572bb6758e946 to your computer and use it in GitHub Desktop.
Download ZIP
AMP (Accelerated Mobile Pages) html boilerplate for atom.io
Raw
snippets.cson
# Your snippets
#
# Atom snippets allow you to enter a simple prefix in the editor and hit tab to
# expand the prefix into a larger code block with templated values
#
# Atom Flight Manual:
# http://flight-manual.atom.io/using-atom/sections/basic-customization/#_cson
#
'.text.html':
'AMP HTML Project':
'prefix': 'amp:html'
'body': '<!DOCTYPE html>\n
<html amp lang="en">\n
<head>\n\t
<meta charset="utf-8">\n\t
<script async src="https://cdn.ampproject.org/v0.js"></script>\n\t
<title>Hello, AMPs</title>\n\t
<link rel="canonical" href="http://example.ampproject.org/article-metadata.html" />\n\t
<meta name="viewport" content="width=device-width,minimum-scale=1,initial-scale=1">\n\t
<script type="application/ld+json">\n\t\t
{\n\t\t\t
"@context": "http://schema.org",\n\t\t\t
"@type": "NewsArticle",\n\t\t\t
"headline": "Open-source framework for publishing content",\n\t\t\t
"datePublished": "2015-10-07T12:02:41Z",\n\t\t\t
"image": ["logo.jpg"]\n\t\t
}\n\t
</script>\n\t
<style amp-boilerplate>\n\t\t
body {\n\t\t\t
-webkit-animation:-amp-start 8s steps(1,end) 0 1 normal both;\n\t\t\t
-moz-animation:-amp-start 8s steps(1,end) 0 1 normal both;\n\t\t\t
-ms-animation:-amp-start 8s steps(1,end) 0 1 normal both;\n\t\t\t
animation:-amp-start 8s steps(1,end) 0 1 normal both\n\t\t
}\n\t\t
@-webkit-keyframes -amp-start {\n\t\t\t
from { visibility:hidden }\n\t\t\t
to { visibility:visible }\n\t\t
}\n\t\t
@-moz-keyframes -amp-start {\n\t\t\t
from { visibility:hidden }\n\t\t\t
to { visibility:visible }\n\t\t
}\n\t\t
@-ms-keyframes -amp-start {\n\t\t\t
from { visibility:hidden }\n\t\t\t
to { visibility:visible }\n\t\t
}\n\t\t
@-o-keyframes -amp-start {\n\t\t\t
from { visibility:hidden }\n\t\t\t
to { visibility:visible }\n\t\t
}\n\t\t
@keyframes -amp-start {\n\t\t\t
from { visibility:hidden }\n\t\t\t
to { visibility:visible }\n\t\t
}\n\t
</style>\n\t
<noscript>\n\t\t
<style amp-boilerplate>\n\t\t\t
body {\n\t\t\t\t
-webkit-animation:none;\n\t\t\t\t
-moz-animation:none;\n\t\t\t\t
-ms-animation:none;\n\t\t\t\t
animation:none\n\t\t\t
}\n\t\t
</style>\n\t
</noscript>\n
</head>\n
<body>\n\n\t
<h1>Welcome to the mobile web</h1>\n\n
</body>\n
</html>'
@alberto-marin
Copy link
Author

screen shot 2017-04-08 at 09 00 16

Start typing am... and we see the dropdown menu

Sign up for free to join this conversation on GitHub. Already have an account? Sign in to comment