mirror of
https://github.com/pure-css/pure.git
synced 2024-11-24 10:44:21 +00:00
docs: switch cdn from unpkg to jsdelivr (#1034)
This commit is contained in:
parent
a8610c0842
commit
85351ff262
@ -76,13 +76,13 @@ This assumes the following repo's are cloned and `npm` installed:
|
|||||||
|
|
||||||
## Publish pure to NPM
|
## Publish pure to NPM
|
||||||
|
|
||||||
From the `pure` repo run the following command to publish Pure to NPM. This will ensure `unpkg.com` CDN gets the new files.
|
From the `pure` repo run the following command to publish Pure to NPM. This will ensure `jsdelivr.com` CDN gets the new files.
|
||||||
|
|
||||||
```bash
|
```bash
|
||||||
npm publish .
|
npm publish .
|
||||||
```
|
```
|
||||||
|
|
||||||
Verify via https://unpkg.com/purecss@VERSION
|
Verify via https://www.jsdelivr.com/package/npm/purecss
|
||||||
|
|
||||||
## Draft releases on Github
|
## Draft releases on Github
|
||||||
|
|
||||||
|
@ -13,7 +13,7 @@ const pureMin = fs.readFileSync(path.resolve(pureFiles, 'pure-min.css'), 'utf8')
|
|||||||
const sriHash = crypto.createHash('sha384').update(pureMin, 'utf8').digest('base64');
|
const sriHash = crypto.createHash('sha384').update(pureMin, 'utf8').digest('base64');
|
||||||
|
|
||||||
// copy/pastable code snippet for users
|
// copy/pastable code snippet for users
|
||||||
module.exports.PURE_DOWNLOAD_SNIPPET = `<link rel="stylesheet" href="https://unpkg.com/purecss@${version}/build/pure-min.css" integrity="sha384-${sriHash}" crossorigin="anonymous">`;
|
module.exports.PURE_DOWNLOAD_SNIPPET = `<link rel="stylesheet" href="https://cdn.jsdelivr.net/npm/purecss@${version}/build/pure-min.css" integrity="sha384-${sriHash}" crossorigin="anonymous">`;
|
||||||
|
|
||||||
// calculate each pure module size
|
// calculate each pure module size
|
||||||
module.exports.moduleSizes = function moduleSizes() {
|
module.exports.moduleSizes = function moduleSizes() {
|
||||||
|
@ -1,4 +1,5 @@
|
|||||||
import Link from '@docusaurus/Link';
|
import Link from '@docusaurus/Link';
|
||||||
|
import useDocusaurusContext from '@docusaurus/useDocusaurusContext';
|
||||||
import React from 'react';
|
import React from 'react';
|
||||||
import Layout from '../../theme/Layout';
|
import Layout from '../../theme/Layout';
|
||||||
import Header from '../../../components/Header';
|
import Header from '../../../components/Header';
|
||||||
@ -9,6 +10,14 @@ const title = 'Base';
|
|||||||
const description = 'Leveraging Normalize.css, an HTML5-ready alternative to CSS resets.';
|
const description = 'Leveraging Normalize.css, an HTML5-ready alternative to CSS resets.';
|
||||||
|
|
||||||
function Base() {
|
function Base() {
|
||||||
|
const context = useDocusaurusContext();
|
||||||
|
const {siteConfig = {}} = context;
|
||||||
|
const {
|
||||||
|
customFields: {
|
||||||
|
pureVersion,
|
||||||
|
},
|
||||||
|
} = siteConfig;
|
||||||
|
|
||||||
return (
|
return (
|
||||||
<Layout description={description} title={title}>
|
<Layout description={description} title={title}>
|
||||||
<Header description={description} title={title} />
|
<Header description={description} title={title} />
|
||||||
@ -21,7 +30,7 @@ function Base() {
|
|||||||
</p>
|
</p>
|
||||||
|
|
||||||
<CodeBlock wrap={true}>
|
<CodeBlock wrap={true}>
|
||||||
{'<link rel="stylesheet" href="https://unpkg.com/purecss@1.0.1/build/base-min.css">'}
|
{`<link rel="stylesheet" href="https://cdn.jsdelivr.net/npm/purecss@${pureVersion}/build/base-min.css">`}
|
||||||
</CodeBlock>
|
</CodeBlock>
|
||||||
|
|
||||||
<h3>A bit about Normalize.css</h3>
|
<h3>A bit about Normalize.css</h3>
|
||||||
|
@ -42,12 +42,12 @@ function Customize() {
|
|||||||
<tbody>
|
<tbody>
|
||||||
<tr>
|
<tr>
|
||||||
<td>Responsive Rollup</td>
|
<td>Responsive Rollup</td>
|
||||||
<td>https://unpkg.com/purecss@{pureVersion}/build/pure-min.css</td>
|
<td>https://cdn.jsdelivr.net/npm/purecss@{pureVersion}/build/pure-min.css</td>
|
||||||
<td>{fileSize({ module: 'pure', filesizes })}</td>
|
<td>{fileSize({ module: 'pure', filesizes })}</td>
|
||||||
</tr>
|
</tr>
|
||||||
<tr>
|
<tr>
|
||||||
<td>Non-Responsive Rollup</td>
|
<td>Non-Responsive Rollup</td>
|
||||||
<td>https://unpkg.com/purecss@{pureVersion}/build/pure-nr-min.css</td>
|
<td>https://cdn.jsdelivr.net/npm/purecss@{pureVersion}/build/pure-nr-min.css</td>
|
||||||
<td>{fileSize({ module: 'pure-nr', filesizes })}</td>
|
<td>{fileSize({ module: 'pure-nr', filesizes })}</td>
|
||||||
</tr>
|
</tr>
|
||||||
</tbody>
|
</tbody>
|
||||||
@ -63,7 +63,7 @@ function Customize() {
|
|||||||
<h3>Alternate CDNs</h3>
|
<h3>Alternate CDNs</h3>
|
||||||
|
|
||||||
<p>
|
<p>
|
||||||
The main host for Pure is the unpkg CDN where Pure is available over HTTPS. The following table lists alternate CDNs where Pure is hosted.
|
The main host for Pure is the jsDelivr CDN where Pure is available over HTTPS. The following table lists alternate CDNs where Pure is hosted.
|
||||||
</p>
|
</p>
|
||||||
|
|
||||||
<div className="table-responsive">
|
<div className="table-responsive">
|
||||||
@ -132,35 +132,35 @@ function Customize() {
|
|||||||
<tbody>
|
<tbody>
|
||||||
<tr>
|
<tr>
|
||||||
<td>Base</td>
|
<td>Base</td>
|
||||||
<td>https://unpkg.com/purecss@{pureVersion}/build/base-min.css</td>
|
<td>https://cdn.jsdelivr.net/npm/purecss@{pureVersion}/build/base-min.css</td>
|
||||||
</tr>
|
</tr>
|
||||||
<tr>
|
<tr>
|
||||||
<td>Buttons</td>
|
<td>Buttons</td>
|
||||||
<td>https://unpkg.com/purecss@{pureVersion}/build/buttons-min.css</td>
|
<td>https://cdn.jsdelivr.net/npm/purecss@{pureVersion}/build/buttons-min.css</td>
|
||||||
</tr>
|
</tr>
|
||||||
<tr>
|
<tr>
|
||||||
<td>Forms (Responsive)</td>
|
<td>Forms (Responsive)</td>
|
||||||
<td>https://unpkg.com/purecss@{pureVersion}/build/forms-min.css</td>
|
<td>https://cdn.jsdelivr.net/npm/purecss@{pureVersion}/build/forms-min.css</td>
|
||||||
</tr>
|
</tr>
|
||||||
<tr>
|
<tr>
|
||||||
<td>Forms (Non-Responsive)</td>
|
<td>Forms (Non-Responsive)</td>
|
||||||
<td>https://unpkg.com/purecss@{pureVersion}/build/forms-nr-min.css</td>
|
<td>https://cdn.jsdelivr.net/npm/purecss@{pureVersion}/build/forms-nr-min.css</td>
|
||||||
</tr>
|
</tr>
|
||||||
<tr>
|
<tr>
|
||||||
<td>Grids (Base)</td>
|
<td>Grids (Base)</td>
|
||||||
<td>https://unpkg.com/purecss@{pureVersion}/build/grids-min.css</td>
|
<td>https://cdn.jsdelivr.net/npm/purecss@{pureVersion}/build/grids-min.css</td>
|
||||||
</tr>
|
</tr>
|
||||||
<tr>
|
<tr>
|
||||||
<td>Grids (Responsive)</td>
|
<td>Grids (Responsive)</td>
|
||||||
<td>https://unpkg.com/purecss@{pureVersion}/build/grids-responsive-min.css</td>
|
<td>https://cdn.jsdelivr.net/npm/purecss@{pureVersion}/build/grids-responsive-min.css</td>
|
||||||
</tr>
|
</tr>
|
||||||
<tr>
|
<tr>
|
||||||
<td>Menus (Responsive)</td>
|
<td>Menus (Responsive)</td>
|
||||||
<td>https://unpkg.com/purecss@{pureVersion}/build/menus-min.css</td>
|
<td>https://cdn.jsdelivr.net/npm/purecss@{pureVersion}/build/menus-min.css</td>
|
||||||
</tr>
|
</tr>
|
||||||
<tr>
|
<tr>
|
||||||
<td>Tables</td>
|
<td>Tables</td>
|
||||||
<td>https://unpkg.com/purecss@{pureVersion}/build/tables-min.css</td>
|
<td>https://cdn.jsdelivr.net/npm/purecss@{pureVersion}/build/tables-min.css</td>
|
||||||
</tr>
|
</tr>
|
||||||
</tbody>
|
</tbody>
|
||||||
</table>
|
</table>
|
||||||
@ -169,7 +169,7 @@ function Customize() {
|
|||||||
<SectionHeader heading="Combo Handling" />
|
<SectionHeader heading="Combo Handling" />
|
||||||
|
|
||||||
<p>
|
<p>
|
||||||
jsDelivr is a CDN that supports combo handling. Here's an example of a combo URL that includes the same CSS <a href="/base/">Base</a>, <a href="/grids/">Grids</a>, and <a href="/forms/">Forms</a> as above.
|
jsDelivr is also a CDN that supports combo handling. Here's an example of a combo URL that includes the same CSS <a href="/base/">Base</a>, <a href="/grids/">Grids</a>, and <a href="/forms/">Forms</a> as above.
|
||||||
</p>
|
</p>
|
||||||
|
|
||||||
<CodeBlock>
|
<CodeBlock>
|
||||||
|
@ -481,7 +481,7 @@ function Grids() {
|
|||||||
</p>
|
</p>
|
||||||
|
|
||||||
<CodeBlock>
|
<CodeBlock>
|
||||||
{`<link rel="stylesheet" href="https://unpkg.com/purecss@${pureVersion}/build/grids-responsive-min.css" />`}
|
{`<link rel="stylesheet" href="https://cdn.jsdelivr.net/npm/purecss@${pureVersion}/build/grids-responsive-min.css" />`}
|
||||||
</CodeBlock>
|
</CodeBlock>
|
||||||
|
|
||||||
<h3>Pure's Regular Grid vs. Responsive Grid</h3>
|
<h3>Pure's Regular Grid vs. Responsive Grid</h3>
|
||||||
@ -824,9 +824,9 @@ function Grids() {
|
|||||||
|
|
||||||
<CodeBlock>
|
<CodeBlock>
|
||||||
{stripIndent`
|
{stripIndent`
|
||||||
<link rel="stylesheet" href="https://unpkg.com/purecss@${pureVersion}/build/base-min.css">
|
<link rel="stylesheet" href="https://cdn.jsdelivr.net/npm/purecss@${pureVersion}/build/base-min.css">
|
||||||
<link rel="stylesheet" href="https://unpkg.com/purecss@${pureVersion}/build/grids-min.css">
|
<link rel="stylesheet" href="https://cdn.jsdelivr.net/npm/purecss@${pureVersion}/build/grids-min.css">
|
||||||
<link rel="stylesheet" href="https://unpkg.com/purecss@${pureVersion}/build/grids-responsive-min.css">
|
<link rel="stylesheet" href="https://cdn.jsdelivr.net/npm/purecss@${pureVersion}/build/grids-responsive-min.css">
|
||||||
`}
|
`}
|
||||||
</CodeBlock>
|
</CodeBlock>
|
||||||
|
|
||||||
|
@ -27,7 +27,7 @@ function Start() {
|
|||||||
<SectionHeader heading="Add Pure to Your Page" />
|
<SectionHeader heading="Add Pure to Your Page" />
|
||||||
|
|
||||||
<p>
|
<p>
|
||||||
You can add Pure to your page via the <b>free unpkg CDN</b>. Just add the following <code><link></code> element into your page's <code><head></code>, before your project's stylesheets.
|
You can add Pure to your page via the <b>free jsDelivr CDN</b>. Just add the following <code><link></code> element into your page's <code><head></code>, before your project's stylesheets.
|
||||||
</p>
|
</p>
|
||||||
</div>
|
</div>
|
||||||
|
|
||||||
@ -100,7 +100,7 @@ function Start() {
|
|||||||
</p>
|
</p>
|
||||||
|
|
||||||
<CodeBlock wrap={true}>
|
<CodeBlock wrap={true}>
|
||||||
{`<link rel="stylesheet" href="https://unpkg.com/purecss@${pureVersion}/build/grids-responsive-min.css">`}
|
{`<link rel="stylesheet" href="https://cdn.jsdelivr.net/npm/purecss@${pureVersion}/build/grids-responsive-min.css">`}
|
||||||
</CodeBlock>
|
</CodeBlock>
|
||||||
|
|
||||||
<p>
|
<p>
|
||||||
@ -318,7 +318,7 @@ function Start() {
|
|||||||
|
|
||||||
<title>Your page title</title>
|
<title>Your page title</title>
|
||||||
|
|
||||||
<link rel="stylesheet" href="https://unpkg.com/purecss@1.0.1/build/pure-min.css"></head>
|
<link rel="stylesheet" href="https://cdn.jsdelivr.net/npm/purecss@1.0.1/build/pure-min.css"></head>
|
||||||
|
|
||||||
<body>
|
<body>
|
||||||
<!--
|
<!--
|
||||||
|
Loading…
Reference in New Issue
Block a user