Make sure we show developers to include the MD Font after the MDL libs
Nicolas Garnier
parent
d631e81365
commit
16e745460d
|
|
@ -29,15 +29,15 @@ CodeBlockCodePen.prototype.init = function() {
|
|||
|
||||
// Also insert the MDL Library.
|
||||
var mdlLibs = [
|
||||
// TODO: Remove below before launch. For testing only.
|
||||
'<!-- For testing. TODO: Remove before launch -->',
|
||||
'<link rel="stylesheet" href="https://storage.googleapis.com/materialdesignlite/material.css">',
|
||||
'<script src="https://storage.googleapis.com/materialdesignlite/material.min.js"></script>',
|
||||
'<!-- Material Design Lite -->',
|
||||
'<script src="$$hosted_libs_prefix$$/$$version$$/material.min.js"></script>',
|
||||
'<link rel="stylesheet" href="$$hosted_libs_prefix$$/$$version$$/material.indigo-pink.min.css">',
|
||||
'<!-- Material Design icon font -->',
|
||||
'<link rel="stylesheet" href="//fonts.googleapis.com/icon?family=Material+Icons">',
|
||||
// TODO: Remove below before launch. For testing only.
|
||||
'<!-- For testing. TODO: Remove before launch -->',
|
||||
'<link rel="stylesheet" href="https://storage.googleapis.com/materialdesignlite/material.css">',
|
||||
'<script src="https://storage.googleapis.com/materialdesignlite/material.min.js"></script>'
|
||||
'<link rel="stylesheet" href="//fonts.googleapis.com/icon?family=Material+Icons">'
|
||||
];
|
||||
|
||||
for (var i = 0, len = this.htmlCodeBlocks.length; i < len; i++) {
|
||||
|
|
|
|||
|
|
@ -33,16 +33,15 @@
|
|||
<link rel="canonical" href="http://www.example.com/">
|
||||
-->
|
||||
|
||||
<!-- Fonts -->
|
||||
<link href='https://fonts.googleapis.com/css?family=Roboto:regular,bold,italic,thin,light,bolditalic,black,medium&lang=en' rel='stylesheet' type='text/css'>
|
||||
<link href="https://fonts.googleapis.com/icon?family=Material+Icons"
|
||||
rel="stylesheet">
|
||||
|
||||
<!-- Page styles -->
|
||||
<link rel="stylesheet" href="https://cdnjs.cloudflare.com/ajax/libs/prism/0.0.1/prism.min.css">
|
||||
<link rel="stylesheet" href="{{page.include_prefix}}material.min.css">
|
||||
<link rel="stylesheet" href="{{page.include_prefix}}assets/main.css">
|
||||
<script src="{{page.include_prefix}}material.min.js"></script>
|
||||
|
||||
<!-- Fonts -->
|
||||
<link href='https://fonts.googleapis.com/css?family=Roboto:regular,bold,italic,thin,light,bolditalic,black,medium&lang=en' rel='stylesheet' type='text/css'>
|
||||
<link href="https://fonts.googleapis.com/icon?family=Material+Icons" rel="stylesheet">
|
||||
</head>
|
||||
<body class="{{page.bodyclass}}">
|
||||
<div class="docs-layout mdl-layout mdl-js-layout">
|
||||
|
|
|
|||
|
|
@ -37,9 +37,9 @@
|
|||
<div class="mdl-tabs__panel is-active" id="tab1">
|
||||
<div class="code-with-text">
|
||||
Just add the following <code><link></code> and <code><script></code> elements into your HTML pages:
|
||||
<pre class="language-markup codepen-button-disabled"><code><link rel="stylesheet" href="//fonts.googleapis.com/icon?family=Material+Icons">
|
||||
<link rel="stylesheet" href="$$hosted_libs_prefix$$/$$version$$/material.indigo-pink.min.css">
|
||||
<script src="$$hosted_libs_prefix$$/$$version$$/material.min.js"></script></code></pre>
|
||||
<pre class="language-markup codepen-button-disabled"><code><link rel="stylesheet" href="$$hosted_libs_prefix$$/$$version$$/material.indigo-pink.min.css">
|
||||
<script src="$$hosted_libs_prefix$$/$$version$$/material.min.js"></script>
|
||||
<link rel="stylesheet" href="//fonts.googleapis.com/icon?family=Material+Icons"></code></pre>
|
||||
</div>
|
||||
<h4>Choose color scheme</h4>
|
||||
<p>
|
||||
|
|
@ -52,9 +52,9 @@
|
|||
</p>
|
||||
<div class="code-with-text">
|
||||
Refer to these files by adding a <code><link></code> and a <code><script></code> elements into your HTML pages and also include the Material Icon font:
|
||||
<pre class="language-markup codepen-button-disabled"><code><link rel="stylesheet" href="//fonts.googleapis.com/icon?family=Material+Icons">
|
||||
<link rel="stylesheet" href="./material.min.css">
|
||||
<script src="./material.min.js"></script></code></pre>
|
||||
<pre class="language-markup codepen-button-disabled"><code><link rel="stylesheet" href="./material.min.css">
|
||||
<script src="./material.min.js"></script>
|
||||
<link rel="stylesheet" href="//fonts.googleapis.com/icon?family=Material+Icons"></code></pre>
|
||||
</div>
|
||||
</div>
|
||||
<div class="mdl-tabs__panel" id="tab3">
|
||||
|
|
@ -76,9 +76,9 @@ gulp</code></pre>
|
|||
</p>
|
||||
<div class="code-with-text">
|
||||
Refer to these files by adding a <code><link></code> and a <code><script></code> element into your HTML pages and also include the Material Icon font:
|
||||
<pre class="language-markup codepen-button-disabled"><code><link rel="stylesheet" href="//fonts.googleapis.com/icon?family=Material+Icons">
|
||||
<link rel="stylesheet" href="./material.min.css">
|
||||
<script src="./material.min.js"></script></code></pre>
|
||||
<pre class="language-markup codepen-button-disabled"><code><link rel="stylesheet" href="./material.min.css">
|
||||
<script src="./material.min.js"></script>
|
||||
<link rel="stylesheet" href="//fonts.googleapis.com/icon?family=Material+Icons"></code></pre>
|
||||
</div>
|
||||
<div class="caption">
|
||||
<h4>
|
||||
|
|
@ -100,9 +100,9 @@ gulp</code></pre>
|
|||
</p>
|
||||
<div class="code-with-text">
|
||||
Refer to these files by adding a <code><link></code> and a <code><script></code> element into your HTML pages and also include the Material Icon font:
|
||||
<pre class="language-markup codepen-button-disabled"><code><link rel="stylesheet" href="//fonts.googleapis.com/icon?family=Material+Icons">
|
||||
<link rel="stylesheet" href="/node_modules/material-design-lite/material.min.css">
|
||||
<script src="/node_modules/material-design-lite/material.min.js"></script></code></pre>
|
||||
<pre class="language-markup codepen-button-disabled"><code><link rel="stylesheet" href="/node_modules/material-design-lite/material.min.css">
|
||||
<script src="/node_modules/material-design-lite/material.min.js"></script>
|
||||
<link rel="stylesheet" href="//fonts.googleapis.com/icon?family=Material+Icons"></code></pre>
|
||||
</div>
|
||||
<div class="caption">
|
||||
<h4>
|
||||
|
|
@ -124,9 +124,9 @@ gulp</code></pre>
|
|||
</p>
|
||||
<div class="code-with-text">
|
||||
Refer to these files by adding a <code><link></code> and a <code><script></code> element into your HTML pages and also include the Material Icon font:
|
||||
<pre class="language-markup codepen-button-disabled"><code><link rel="stylesheet" href="https://fonts.googleapis.com/icon?family=Material+Icons">
|
||||
<link rel="stylesheet" href="/node_modules/material-design-lite/material.min.css">
|
||||
<script src="/node_modules/material-design-lite/material.min.js"></script></code></pre>
|
||||
<pre class="language-markup codepen-button-disabled"><code><link rel="stylesheet" href="/node_modules/material-design-lite/material.min.css">
|
||||
<script src="/node_modules/material-design-lite/material.min.js"></script>
|
||||
<link rel="stylesheet" href="//fonts.googleapis.com/icon?family=Material+Icons"></code></pre>
|
||||
</div>
|
||||
<div class="caption">
|
||||
<h4>
|
||||
|
|
|
|||
Loading…
Reference in New Issue