mirrors/picocss
1
0
Fork 0
mirror of https://github.com/picocss/pico.git synced 2025-04-20 08:45:06 -04:00
Code Issues Projects Releases Packages Wiki Activity Actions

chore: change CDN from unpkg to jsdelivr

Browse source
This commit is contained in:
Lucas Larroche 2023-04-08 12:38:51 +07:00
parent 3f3962df83
commit 19e34a3552
5 changed files with 16 additions and 16 deletions
Download patch file Download diff file Expand all files Collapse all files

14
README.md
View file

@ -14,8 +14,8 @@
</p> </p>
## Pico.css ## Pico.css
[![Standard gzipped CSS](https://img.badgesize.io/picocss/pico/master/css/pico.min.css?compression=gzip&color=1095c1&label=Standard%20CSS)](https://unpkg.com/@picocss/pico@latest/css/pico.min.css) [![Standard gzipped CSS](https://img.badgesize.io/picocss/pico/master/css/pico.min.css?compression=gzip&color=1095c1&label=Standard%20CSS)](https://cdn.jsdelivr.net/npm/@picocss/pico@1/css/pico.min.css)
[![Classless gzipped CSS](https://img.badgesize.io/picocss/pico/master/css/pico.classless.min.css?compression=gzip&color=1095c1&label=Classless%20CSS)](https://unpkg.com/@picocss/pico@latest/css/pico.classless.min.css) [![Classless gzipped CSS](https://img.badgesize.io/picocss/pico/master/css/pico.classless.min.css?compression=gzip&color=1095c1&label=Classless%20CSS)](https://cdn.jsdelivr.net/npm/@picocss/pico@1/css/pico.classless.min.css)
[![Github release](https://img.shields.io/github/v/release/picocss/pico?color=1095c1&logo=github&logoColor=white)](https://github.com/picocss/pico/releases/latest) [![Github release](https://img.shields.io/github/v/release/picocss/pico?color=1095c1&logo=github&logoColor=white)](https://github.com/picocss/pico/releases/latest)
[![npm version](https://img.shields.io/npm/v/@picocss/pico?color=1095c1)](https://www.npmjs.com/package/@picocss/pico) [![npm version](https://img.shields.io/npm/v/@picocss/pico?color=1095c1)](https://www.npmjs.com/package/@picocss/pico)
[![License](https://img.shields.io/badge/license-MIT-%231095c1)](https://github.com/picocss/pico/blob/master/LICENSE.md) [![License](https://img.shields.io/badge/license-MIT-%231095c1)](https://github.com/picocss/pico/blob/master/LICENSE.md)
@ -60,10 +60,10 @@ There are 4 ways to get started with pico.css:
**Install from CDN** **Install from CDN**
Alternatively, you can use [unpkg CDN](https://unpkg.com/@picocss/pico@1.*/) to link pico.css. Alternatively, you can use [jsDelivr CDN](https://www.jsdelivr.com/package/npm/@picocss/pico) to link pico.css.
```html ```html
<link rel="stylesheet" href="https://unpkg.com/@picocss/pico@1.*/css/pico.min.css"> <link rel="stylesheet" href="https://cdn.jsdelivr.net/npm/@picocss/pico@1/css/pico.min.css">
``` ```
**Install with NPM** **Install with NPM**
@ -87,13 +87,13 @@ In this version, `header`, `main` and `footer` act as containers.
Use the default `.classless` version if you need centered viewports: Use the default `.classless` version if you need centered viewports:
```html ```html
<link rel="stylesheet" href="https://unpkg.com/@picocss/pico@1.*/css/pico.classless.min.css"> <link rel="stylesheet" href="https://cdn.jsdelivr.net/npm/@picocss/pico@1/css/pico.classless.min.css">
``` ```
Or use the `.fluid.classless` version if you need a fluid container: Or use the `.fluid.classless` version if you need a fluid container:
```html ```html
<link rel="stylesheet" href="https://unpkg.com/@picocss/pico@1.*/css/pico.fluid.classless.min.css"> <link rel="stylesheet" href="https://cdn.jsdelivr.net/npm/@picocss/pico@1/css/pico.fluid.classless.min.css">
``` ```
Then just write pure HTML, and it should look great: Then just write pure HTML, and it should look great:
@ -104,7 +104,7 @@ Then just write pure HTML, and it should look great:
<head> <head>
<meta charset="utf-8"> <meta charset="utf-8">
<meta name="viewport" content="width=device-width, initial-scale=1"> <meta name="viewport" content="width=device-width, initial-scale=1">
<link rel="stylesheet" href="https://unpkg.com/@picocss/pico@1.*/css/pico.classless.min.css"> <link rel="stylesheet" href="https://cdn.jsdelivr.net/npm/@picocss/pico@1/css/pico.classless.min.css">
<title>Hello, world!</title> <title>Hello, world!</title>
</head> </head>
<body> <body>

6
docs/classless.html
View file

@ -4,10 +4,10 @@
<b>body</b> > <b>footer</b> { <b>body</b> > <b>footer</b> {
<em>…</em> <em>…</em>
} }
</code></pre><p><strong>Usage:</strong></p><p>Use the default <code>.classless</code> version if you need centered viewports:</p><pre><code>&lt;<b>link</b> <i>rel</i>=<u>"stylesheet</u>" <i>href</i>=<u>"css/pico.classless.min.css"</u>&gt;</code></pre><p>Or use the <code>.fluid.classless</code> version if you need a fluid container:</p><pre><code>&lt;<b>link</b> <i>rel</i>=<u>"stylesheet</u>" <i>href</i>=<u>"css/pico.fluid.classless.min.css"</u>&gt;</code></pre><p>These <code>.classless</code> versions are also available on <a href="https://unpkg.com/@picocss/pico@1.*/">unpkg CDN</a>:</p><pre><code><em>// Centered viewport</em> </code></pre><p><strong>Usage:</strong></p><p>Use the default <code>.classless</code> version if you need centered viewports:</p><pre><code>&lt;<b>link</b> <i>rel</i>=<u>"stylesheet</u>" <i>href</i>=<u>"css/pico.classless.min.css"</u>&gt;</code></pre><p>Or use the <code>.fluid.classless</code> version if you need a fluid container:</p><pre><code>&lt;<b>link</b> <i>rel</i>=<u>"stylesheet</u>" <i>href</i>=<u>"css/pico.fluid.classless.min.css"</u>&gt;</code></pre><p>These <code>.classless</code> versions are also available on <a href="https://www.jsdelivr.com/package/npm/@picocss/pico">jsDelivr CDN</a>:</p><pre><code><em>// Centered viewport</em>
&lt;<b>link</b> <i>rel</i>=<u>"stylesheet"</u> <i>href</i>=<u>"https://unpkg.com/@picocss/pico@1.*/css/pico.classless.min.css"</u>&gt; &lt;<b>link</b> <i>rel</i>=<u>"stylesheet"</u> <i>href</i>=<u>"https://cdn.jsdelivr.net/npm/@picocss/pico@1/css/pico.classless.min.css"</u>&gt;
</code></pre><pre><code><em>// Fluid viewport</em> </code></pre><pre><code><em>// Fluid viewport</em>
&lt;<b>link</b> <i>rel</i>=<u>"stylesheet"</u> <i>href</i>=<u>"https://unpkg.com/@picocss/pico@1.*/css/pico.fluid.classless.min.css"</u>&gt; &lt;<b>link</b> <i>rel</i>=<u>"stylesheet"</u> <i>href</i>=<u>"https://cdn.jsdelivr.net/npm/@picocss/pico@1/css/pico.fluid.classless.min.css"</u>&gt;
</code></pre><p>If you need to customize the default parent (<code>&lt;<b>body</b>&gt;</code>) for <code>&lt;<b>header</b>&gt;</code>, <code>&lt;<b>main</b>&gt;</code>, and <code>&lt;<b>footer</b>&gt;</code>, you can recompile Pico by defining another CSS selector.</p><p>Useful for <a href="https://reactjs.org/">React</a>, <a href="https://www.gatsbyjs.com/">Gatsby</a> or <a href="https://nextjs.org/">Next.js</a>.</p><pre><code><em>/* Custom Class-less version for React */</em> </code></pre><p>If you need to customize the default parent (<code>&lt;<b>body</b>&gt;</code>) for <code>&lt;<b>header</b>&gt;</code>, <code>&lt;<b>main</b>&gt;</code>, and <code>&lt;<b>footer</b>&gt;</code>, you can recompile Pico by defining another CSS selector.</p><p>Useful for <a href="https://reactjs.org/">React</a>, <a href="https://www.gatsbyjs.com/">Gatsby</a> or <a href="https://nextjs.org/">Next.js</a>.</p><pre><code><em>/* Custom Class-less version for React */</em>
<em>// Set the root element</em> <em>// Set the root element</em>

2
docs/index.html
View file

File diff suppressed because one or more lines are too long

6
docs/src/classless.html
View file

@ -36,14 +36,14 @@
<pre><code>&lt;<b>link</b> <i>rel</i>=<u>"stylesheet</u>" <i>href</i>=<u>"css/pico.classless.min.css"</u>&gt;</code></pre> <pre><code>&lt;<b>link</b> <i>rel</i>=<u>"stylesheet</u>" <i>href</i>=<u>"css/pico.classless.min.css"</u>&gt;</code></pre>
<p>Or use the <code>.fluid.classless</code> version if you need a fluid container:</p> <p>Or use the <code>.fluid.classless</code> version if you need a fluid container:</p>
<pre><code>&lt;<b>link</b> <i>rel</i>=<u>"stylesheet</u>" <i>href</i>=<u>"css/pico.fluid.classless.min.css"</u>&gt;</code></pre> <pre><code>&lt;<b>link</b> <i>rel</i>=<u>"stylesheet</u>" <i>href</i>=<u>"css/pico.fluid.classless.min.css"</u>&gt;</code></pre>
<p>These <code>.classless</code> versions are also available on <a href="https://unpkg.com/@picocss/pico@1.*/">unpkg CDN</a>:</p> <p>These <code>.classless</code> versions are also available on <a href="https://www.jsdelivr.com/package/npm/@picocss/pico">jsDelivr CDN</a>:</p>
<pre><code><em>// Centered viewport</em> <pre><code><em>// Centered viewport</em>
&lt;<b>link</b> <i>rel</i>=<u>"stylesheet"</u> <i>href</i>=<u>"https://unpkg.com/@picocss/pico@1.*/css/pico.classless.min.css"</u>&gt; &lt;<b>link</b> <i>rel</i>=<u>"stylesheet"</u> <i>href</i>=<u>"https://cdn.jsdelivr.net/npm/@picocss/pico@1/css/pico.classless.min.css"</u>&gt;
</code></pre> </code></pre>
<pre><code><em>// Fluid viewport</em> <pre><code><em>// Fluid viewport</em>
&lt;<b>link</b> <i>rel</i>=<u>"stylesheet"</u> <i>href</i>=<u>"https://unpkg.com/@picocss/pico@1.*/css/pico.fluid.classless.min.css"</u>&gt; &lt;<b>link</b> <i>rel</i>=<u>"stylesheet"</u> <i>href</i>=<u>"https://cdn.jsdelivr.net/npm/@picocss/pico@1/css/pico.fluid.classless.min.css"</u>&gt;
</code></pre> </code></pre>
<p>If you need to customize the default parent (<code>&lt;<b>body</b>&gt;</code>) for <code>&lt;<b>header</b>&gt;</code>, <code>&lt;<b>main</b>&gt;</code>, and <code>&lt;<b>footer</b>&gt;</code>, you can recompile Pico by defining another CSS selector.</p> <p>If you need to customize the default parent (<code>&lt;<b>body</b>&gt;</code>) for <code>&lt;<b>header</b>&gt;</code>, <code>&lt;<b>main</b>&gt;</code>, and <code>&lt;<b>footer</b>&gt;</code>, you can recompile Pico by defining another CSS selector.</p>

4
docs/src/index.html
View file

@ -25,8 +25,8 @@
<p><a href="https://github.com/picocss/pico/archive/refs/heads/master.zip">Download Pico</a> and link <code>/css/pico.min.css</code> in the <code>&lt;<b>head</b>&gt;</code> of your website.</p> <p><a href="https://github.com/picocss/pico/archive/refs/heads/master.zip">Download Pico</a> and link <code>/css/pico.min.css</code> in the <code>&lt;<b>head</b>&gt;</code> of your website.</p>
<pre><code>&lt;<b>link</b> <i>rel</i>=<u>"stylesheet"</u> <i>href</i>=<u>"css/pico.min.css"</u>&gt;</code></pre> <pre><code>&lt;<b>link</b> <i>rel</i>=<u>"stylesheet"</u> <i>href</i>=<u>"css/pico.min.css"</u>&gt;</code></pre>
<h3>Install from CDN</h3> <h3>Install from CDN</h3>
<p>Alternatively, you can use <a href="https://unpkg.com/@picocss/pico@1.*/">unpkg CDN</a> to link pico.css</p> <p>Alternatively, you can use <a href="https://www.jsdelivr.com/package/npm/@picocss/pico">jsDelivr CDN</a> to link pico.css</p>
<pre><code>&lt;<b>link</b> <i>rel</i>=<u>"stylesheet"</u> <i>href</i>=<u>"https://unpkg.com/@picocss/pico@1.*/css/pico.min.css"</u>&gt;</code></pre> <pre><code>&lt;<b>link</b> <i>rel</i>=<u>"stylesheet"</u> <i>href</i>=<u>"https://cdn.jsdelivr.net/npm/@picocss/pico@1/css/pico.min.css"</u>&gt;</code></pre>
<h3>Install with NPM</h3> <h3>Install with NPM</h3>
<pre><code><b>npm</b> <i>install</i> <u>@picocss/pico</u></code></pre> <pre><code><b>npm</b> <i>install</i> <u>@picocss/pico</u></code></pre>
<h3>Install with Composer</h3> <h3>Install with Composer</h3>