mirrors/picocss
1
0
Fork 0
mirror of https://github.com/picocss/pico.git synced 2025-04-27 03:36:13 -04:00
Code Issues Projects Releases Packages Wiki Activity Actions

Merge pull request #239 from picocss/dev

Browse source 
v1.5.5
This commit is contained in:
Lucas Larroche 2022-09-13 08:55:28 +07:00 • committed by GitHub
commit 3e664e0d62
No known key found for this signature in database
GPG key ID: 4AEE18F83AFDEB23
45 changed files with 144 additions and 92 deletions
Download patch file Download diff file Expand all files Collapse all files

5
README.md
View file

@ -124,6 +124,9 @@ Minimalist templates to discover Pico in action:
- **[Preview](https://picocss.com/examples/preview/)**
A starter example with all elements and components used in Pico
- **[Right-to-left (RTL) preview](https://picocss.com/examples/preview-rtl/)**
A starter example in Arabic with all the elements and components used in Pico
- **[Class-less](https://picocss.com/examples/classless/)**
Just a pure semantic HTML markup, without `.classes`
@ -139,7 +142,7 @@ Minimalist templates to discover Pico in action:
- **[Sign in](https://picocss.com/examples/sign-in/)**
A minimalist layout for Login pages
- **[Bootstrap grid system](https://picocss.com/examples/bootstrap-grid/)**
- **[Pico + Bootstrap grid system](https://picocss.com/examples/bootstrap-grid/)**
Custom CSS build with the Bootstrap grid system to manage complex grid layouts in Pico
All examples are open-sourced in [picocss/examples](https://github.com/picocss/examples).

28
css/pico.classless.css
View file

@ -1,6 +1,6 @@
@charset "UTF-8";
/*!
* Pico.css v1.5.4 (https://picocss.com)
* Pico.css v1.5.5 (https://picocss.com)
* Copyright 2019-2022 - Licensed under MIT
*/
/**
@ -1940,20 +1940,26 @@ nav :where(a, [role=link]):is([aria-current], :hover, :active, :focus) {
}
nav[aria-label=breadcrumb] {
align-items: center;
justify-content: left;
justify-content: start;
}
nav[aria-label=breadcrumb] ul li {
-webkit-padding-start: 0;
padding-inline-start: 0;
nav[aria-label=breadcrumb] ul li:not(:first-child) {
-webkit-margin-start: var(--nav-link-spacing-horizontal);
margin-inline-start: var(--nav-link-spacing-horizontal);
}
nav[aria-label=breadcrumb] ul li:not(:last-child) a::after {
-webkit-padding-start: 0.5rem;
padding-inline-start: 0.5rem;
nav[aria-label=breadcrumb] ul li:not(:last-child) ::after {
position: absolute;
width: calc(var(--nav-link-spacing-horizontal) * 2);
-webkit-margin-start: calc(var(--nav-link-spacing-horizontal) / 2);
margin-inline-start: calc(var(--nav-link-spacing-horizontal) / 2);
content: "/";
color: var(--muted-color);
text-align: center;
}
nav[aria-label=breadcrumb] a[aria-current=page] {
nav[aria-label=breadcrumb] a[aria-current] {
background-color: transparent;
color: inherit;
text-decoration: none;
pointer-events: none;
}
nav [role=button] {
margin-right: inherit;
@ -1977,6 +1983,10 @@ aside li [role=button] {
margin: inherit;
}
[dir=rtl] nav[aria-label=breadcrumb] ul li:not(:last-child) ::after {
content: "\\";
}
/**
* Progress
*/

2
css/pico.classless.css.map
View file

File diff suppressed because one or more lines are too long

4
css/pico.classless.min.css vendored
View file

File diff suppressed because one or more lines are too long

2
css/pico.classless.min.css.map
View file

File diff suppressed because one or more lines are too long

28
css/pico.css
View file

@ -1,6 +1,6 @@
@charset "UTF-8";
/*!
* Pico.css v1.5.4 (https://picocss.com)
* Pico.css v1.5.5 (https://picocss.com)
* Copyright 2019-2022 - Licensed under MIT
*/
/**
@ -2128,20 +2128,26 @@ nav :where(a, [role=link]):is([aria-current], :hover, :active, :focus) {
}
nav[aria-label=breadcrumb] {
align-items: center;
justify-content: left;
justify-content: start;
}
nav[aria-label=breadcrumb] ul li {
-webkit-padding-start: 0;
padding-inline-start: 0;
nav[aria-label=breadcrumb] ul li:not(:first-child) {
-webkit-margin-start: var(--nav-link-spacing-horizontal);
margin-inline-start: var(--nav-link-spacing-horizontal);
}
nav[aria-label=breadcrumb] ul li:not(:last-child) a::after {
-webkit-padding-start: 0.5rem;
padding-inline-start: 0.5rem;
nav[aria-label=breadcrumb] ul li:not(:last-child) ::after {
position: absolute;
width: calc(var(--nav-link-spacing-horizontal) * 2);
-webkit-margin-start: calc(var(--nav-link-spacing-horizontal) / 2);
margin-inline-start: calc(var(--nav-link-spacing-horizontal) / 2);
content: "/";
color: var(--muted-color);
text-align: center;
}
nav[aria-label=breadcrumb] a[aria-current=page] {
nav[aria-label=breadcrumb] a[aria-current] {
background-color: transparent;
color: inherit;
text-decoration: none;
pointer-events: none;
}
nav [role=button] {
margin-right: inherit;
@ -2165,6 +2171,10 @@ aside li [role=button] {
margin: inherit;
}
[dir=rtl] nav[aria-label=breadcrumb] ul li:not(:last-child) ::after {
content: "\\";
}
/**
* Progress
*/

2
css/pico.css.map
View file

File diff suppressed because one or more lines are too long

28
css/pico.fluid.classless.css
View file

@ -1,6 +1,6 @@
@charset "UTF-8";
/*!
* Pico.css v1.5.4 (https://picocss.com)
* Pico.css v1.5.5 (https://picocss.com)
* Copyright 2019-2022 - Licensed under MIT
*/
/**
@ -1910,20 +1910,26 @@ nav :where(a, [role=link]):is([aria-current], :hover, :active, :focus) {
}
nav[aria-label=breadcrumb] {
align-items: center;
justify-content: left;
justify-content: start;
}
nav[aria-label=breadcrumb] ul li {
-webkit-padding-start: 0;
padding-inline-start: 0;
nav[aria-label=breadcrumb] ul li:not(:first-child) {
-webkit-margin-start: var(--nav-link-spacing-horizontal);
margin-inline-start: var(--nav-link-spacing-horizontal);
}
nav[aria-label=breadcrumb] ul li:not(:last-child) a::after {
-webkit-padding-start: 0.5rem;
padding-inline-start: 0.5rem;
nav[aria-label=breadcrumb] ul li:not(:last-child) ::after {
position: absolute;
width: calc(var(--nav-link-spacing-horizontal) * 2);
-webkit-margin-start: calc(var(--nav-link-spacing-horizontal) / 2);
margin-inline-start: calc(var(--nav-link-spacing-horizontal) / 2);
content: "/";
color: var(--muted-color);
text-align: center;
}
nav[aria-label=breadcrumb] a[aria-current=page] {
nav[aria-label=breadcrumb] a[aria-current] {
background-color: transparent;
color: inherit;
text-decoration: none;
pointer-events: none;
}
nav [role=button] {
margin-right: inherit;
@ -1947,6 +1953,10 @@ aside li [role=button] {
margin: inherit;
}
[dir=rtl] nav[aria-label=breadcrumb] ul li:not(:last-child) ::after {
content: "\\";
}
/**
* Progress
*/

2
css/pico.fluid.classless.css.map
View file

File diff suppressed because one or more lines are too long

4
css/pico.fluid.classless.min.css vendored
View file

File diff suppressed because one or more lines are too long

2
css/pico.fluid.classless.min.css.map
View file

File diff suppressed because one or more lines are too long

4
css/pico.min.css vendored
View file

File diff suppressed because one or more lines are too long

2
css/pico.min.css.map
View file

File diff suppressed because one or more lines are too long

2
css/pico.slim.css
View file

@ -1,5 +1,5 @@
/*!
* Pico.css v1.5.4 (https://picocss.com)
* Pico.css v1.5.5 (https://picocss.com)
* Copyright 2019-2022 - Licensed under MIT
*
* Slim version example

2
css/pico.slim.css.map
View file

File diff suppressed because one or more lines are too long

2
css/pico.slim.min.css vendored
View file

@ -1,5 +1,5 @@
/*!
* Pico.css v1.5.4 (https://picocss.com)
* Pico.css v1.5.5 (https://picocss.com)
* Copyright 2019-2022 - Licensed under MIT
*
* Slim version example

2
css/pico.slim.min.css.map
View file

File diff suppressed because one or more lines are too long

2
docs/accordions.html
View file

File diff suppressed because one or more lines are too long

2
docs/buttons.html
View file

File diff suppressed because one or more lines are too long

2
docs/cards.html
View file

File diff suppressed because one or more lines are too long

2
docs/classless.html
View file

File diff suppressed because one or more lines are too long

2
docs/containers.html
View file

File diff suppressed because one or more lines are too long

2
docs/customization.html
View file

File diff suppressed because one or more lines are too long

2
docs/dropdowns.html
View file

File diff suppressed because one or more lines are too long

2
docs/forms.html
View file

File diff suppressed because one or more lines are too long

2
docs/grid.html
View file

File diff suppressed because one or more lines are too long

2
docs/index.html
View file

File diff suppressed because one or more lines are too long

2
docs/loading.html
View file

File diff suppressed because one or more lines are too long

2
docs/modal.html
View file

File diff suppressed because one or more lines are too long

10
docs/navs.html
View file

File diff suppressed because one or more lines are too long

2
docs/progress.html
View file

File diff suppressed because one or more lines are too long

2
docs/rtl.html
View file

File diff suppressed because one or more lines are too long

2
docs/scroller.html
View file

File diff suppressed because one or more lines are too long

2
docs/src/_head.html
View file

@ -5,4 +5,4 @@
<link rel="shortcut icon" href="https://picocss.com/favicon.ico">
<link rel="stylesheet" href="../css/pico.min.css">
<link rel="stylesheet" href="css/pico.docs.min.css">
<link rel="canonical" href="https://www.picocss.com/docs/${props.canonical}">
<link rel="canonical" href="https://picocss.com/docs/${props.canonical}">

20
docs/src/navs.html
View file

@ -117,22 +117,18 @@
</footer>
</article>
<p>With <code><i>aria-label</i>=<u>"breadcrumb"</u></code>, you can turn a nav into a breadcrumb, specifying the current page with: <code><i>aria-current</i>=<u>"page"</u></code>.</p>
<p>With <code><i>aria-label</i>=<u>"breadcrumb"</u></code>, you can turn a nav into a breadcrumb.</p>
<article aria-label="breadcrumb nav example">
<article aria-label="Breadcrumb example">
<nav aria-label="breadcrumb">
<ul>
<li>
<a href="#">First link</a>
<a href="#" onclick="event.preventDefault()">Home</a>
</li>
<li>
<a href="#">Second link</a>
</li>
<li>
<a aria-current="page">
Last link
</a>
<a href="#" onclick="event.preventDefault()">Category</a>
</li>
<li>Page</li>
</ul>
</nav>
@ -140,9 +136,9 @@
<pre><code>&lt;<b>nav</b> <i>aria-label</i>=<u>"breadcrumb"</u>&gt;
&lt;<b>ul</b>&gt;
&lt;<b>li</b>&gt;&lt;<b>a</b> <i>href</i>=<u>"#"</u>&gt;First link&lt;<b>/a</b>&gt;&lt;<b>/li</b>&gt;
&lt;<b>li</b>&gt;&lt;<b>a</b> <i>href</i>=<u>"#"</u>&gt;Second link&lt;<b>/a</b>&gt;&lt;<b>/li</b>&gt;
&lt;<b>li</b>&gt;&lt;<b>a</b> <i>aria-current</i>=<u>"page"</u>&gt;Last link&lt;<b>/a</b>&gt;&lt;<b>/li</b>&gt;
&lt;<b>li</b>&gt;&lt;<b>a</b> <i>href</i>=<u>"#"</u>&gt;Home&lt;<b>/a</b>&gt;&lt;<b>/li</b>&gt;
&lt;<b>li</b>&gt;&lt;<b>a</b> <i>href</i>=<u>"#"</u>&gt;Category&lt;<b>/a</b>&gt;&lt;<b>/li</b>&gt;
&lt;<b>li</b>&gt;Page&lt;<b>/li</b>&gt;
&lt;<b>/ul</b>&gt;
&lt;/<b>nav</b>&gt;</code></pre>

2
docs/tables.html
View file

File diff suppressed because one or more lines are too long

2
docs/themes.html
View file

File diff suppressed because one or more lines are too long

2
docs/tooltips.html
View file

File diff suppressed because one or more lines are too long

2
docs/typography.html
View file

File diff suppressed because one or more lines are too long

2
docs/we-love-classes.html
View file

File diff suppressed because one or more lines are too long

4
package-lock.json generated
View file

@ -1,12 +1,12 @@
{
"name": "@picocss/pico",
"version": "1.5.4",
"version": "1.5.5",
"lockfileVersion": 2,
"requires": true,
"packages": {
"": {
"name": "@picocss/pico",
"version": "1.5.4",
"version": "1.5.5",
"license": "MIT",
"devDependencies": {
"@babel/cli": "^7.18.10",

2
package.json
View file

@ -1,6 +1,6 @@
{
"name": "@picocss/pico",
"version": "1.5.4",
"version": "1.5.5",
"description": "Minimal CSS Framework for semantic HTML",
"author": "Lucas Larroche",
"main": "css/pico.min.css",

33
scss/components/_nav.scss
View file

@ -66,22 +66,30 @@ nav {
// Breadcrumb
&[aria-label="breadcrumb"] {
align-items: center;
justify-content: left;
justify-content: start;
& ul li {
padding-inline-start: 0;
&:not(:first-child) {
margin-inline-start: var(--nav-link-spacing-horizontal);
}
&:not(:last-child) {
a::after {
padding-inline-start: 0.5rem;
::after {
position: absolute;
width: calc(var(--nav-link-spacing-horizontal) * 2);
margin-inline-start: calc(var(--nav-link-spacing-horizontal) / 2);
content: "/";
color: var(--muted-color);
text-align: center;
}
}
}
& a[aria-current="page"] {
& a[aria-current] {
background-color: transparent;
color: inherit;
text-decoration: none;
pointer-events: none;
}
}
@ -116,3 +124,18 @@ aside {
}
}
}
// Breadcrumb RTL
[dir="rtl"] {
nav {
&[aria-label="breadcrumb"] {
& ul li {
&:not(:last-child) {
::after {
content: "\\";
}
}
}
}
}
}

2
scss/pico.scss
View file

@ -1,5 +1,5 @@
/*!
* Pico.css v1.5.4 (https://picocss.com)
* Pico.css v1.5.5 (https://picocss.com)
* Copyright 2019-2022 - Licensed under MIT
*/

2
scss/pico.slim.scss
View file

@ -1,5 +1,5 @@
/*!
* Pico.css v1.5.4 (https://picocss.com)
* Pico.css v1.5.5 (https://picocss.com)
* Copyright 2019-2022 - Licensed under MIT
*
* Slim version example