From 714ff062f518444ee7182d491bd638706cb3d72e Mon Sep 17 00:00:00 2001 From: Lucas Larroche Date: Sun, 9 Apr 2023 10:50:09 +0700 Subject: [PATCH] chore: update example links --- docs/classless.html | 2 +- docs/customization.html | 2 +- docs/grid.html | 2 +- docs/modal.html | 2 +- docs/rtl.html | 2 +- docs/src/classless.html | 2 +- docs/src/customization.html | 2 +- docs/src/grid.html | 2 +- docs/src/modal.html | 2 +- docs/src/rtl.html | 2 +- 10 files changed, 10 insertions(+), 10 deletions(-) diff --git a/docs/classless.html b/docs/classless.html index 8c323f65..631e1d03 100644 --- a/docs/classless.html +++ b/docs/classless.html @@ -1,4 +1,4 @@ -Class-less version • Pico CSS

Class-less version

For wild HTML purists!

Pico provides a .classless version (example).

In this version, <header>, <main>, and <footer> act as containers to define a centered or a fluid viewport.

// Containers
+Class-less version • Pico CSS

Class-less version

For wild HTML purists!

Pico provides a .classless version (example).

In this version, <header>, <main>, and <footer> act as containers to define a centered or a fluid viewport.

// Containers
 body > header,
 body > main,
 body > footer {
diff --git a/docs/customization.html b/docs/customization.html
index 49622678..86eeaa67 100644
--- a/docs/customization.html
+++ b/docs/customization.html
@@ -56,4 +56,4 @@
 @import "@picocss/pico/scss/pico/layout/document";
 @import "@picocss/pico/scss/pico/layout/sectioning";
 
-

Compiling a custom SASS version allows you to create a lighter version with only the components that are useful to you. Example here: scss/pico.slim.scss.


Code licensed MIT

\ No newline at end of file +

Compiling a custom SASS version allows you to create a lighter version with only the components that are useful to you.


Code licensed MIT

\ No newline at end of file diff --git a/docs/grid.html b/docs/grid.html index d69c0d9d..961592c4 100644 --- a/docs/grid.html +++ b/docs/grid.html @@ -3,4 +3,4 @@ <div>2</div> <div>3</div> <div>4</div> -</div>

Columns intentionally collapses below large devices (992px)

To go further, discover how to merge Pico with the Bootstrap grid system.

 More about grids

As Pico focuses on native HTML elements, we kept this grid system very minimalist.

A complete grid system in flexbox, with all the ordering, offsetting and, breakpoints utilities, can be heavier than the total size of the Pico library. Not really in the Pico spirit.

If you need a quick way to prototyping or build a complex layout, you can look at Flexbox grid layouts. For example, Bootstrap Grid System only or Flexbox Grid.

If you need a light and custom grid, you can look at CSS Grid Generators. For example, CSS Grid Generator, Layoutit! or Griddy.

Alternatively, you can learn about CSS Grid.

\ No newline at end of file +</div>

Columns intentionally collapses below large devices (992px)

To go further, discover how to merge Pico with the Bootstrap grid system.

 More about grids

As Pico focuses on native HTML elements, we kept this grid system very minimalist.

A complete grid system in flexbox, with all the ordering, offsetting and, breakpoints utilities, can be heavier than the total size of the Pico library. Not really in the Pico spirit.

If you need a quick way to prototyping or build a complex layout, you can look at Flexbox grid layouts. For example, Bootstrap Grid System only or Flexbox Grid.

If you need a light and custom grid, you can look at CSS Grid Generators. For example, CSS Grid Generator, Layoutit! or Griddy.

Alternatively, you can learn about CSS Grid.

\ No newline at end of file diff --git a/docs/modal.html b/docs/modal.html index 6d91dd73..89537403 100644 --- a/docs/modal.html +++ b/docs/modal.html @@ -62,7 +62,7 @@ </a> </footer> </article> -</dialog>

Pico does not include JavaScript code. You will need to implement your JS to interact with modals.

As a starting point, you can look at the JavaScript used in this documentation: js/modal.js.

To make a modal appear, add the open attribute to the <dialog> container.

<!-- Open modal-->
+</dialog>

Pico does not include JavaScript code. You will need to implement your JS to interact with modals.

As a starting point, you can look at this example: modal.js.

To make a modal appear, add the open attribute to the <dialog> container.

<!-- Open modal-->
 <dialog open>
   <article>
   
diff --git a/docs/rtl.html b/docs/rtl.html
index b19a900e..d4b57ff8 100644
--- a/docs/rtl.html
+++ b/docs/rtl.html
@@ -1,4 +1,4 @@
-RTL (Right-To-Left) • Pico CSS

RTL

Support for right-to-left text in Pico.

To enable RTL in Pico you need to set dir="rtl"on the <html> element (example).

<!doctype html>
+RTL (Right-To-Left) • Pico CSS

RTL

Support for right-to-left text in Pico.

To enable RTL in Pico you need to set dir="rtl"on the <html> element (example).

<!doctype html>
 <html dir="rtl" lang="ar">
   ...
 </html>

ℹ️ The RTL feature is still experimental and will probably evolve.


Code licensed MIT

\ No newline at end of file diff --git a/docs/src/classless.html b/docs/src/classless.html index 8e3422bf..67dec34d 100644 --- a/docs/src/classless.html +++ b/docs/src/classless.html @@ -20,7 +20,7 @@

Class-less version

For wild HTML purists!

-

Pico provides a .classless version (example).

+

Pico provides a .classless version (example).

In this version, <header>, <main>, and <footer> act as containers to define a centered or a fluid viewport.

// Containers
diff --git a/docs/src/customization.html b/docs/src/customization.html
index 427a4fce..298fa966 100644
--- a/docs/src/customization.html
+++ b/docs/src/customization.html
@@ -118,7 +118,7 @@
 
 
-

Compiling a custom SASS version allows you to create a lighter version with only the components that are useful to you. Example here: scss/pico.slim.scss.

+

Compiling a custom SASS version allows you to create a lighter version with only the components that are useful to you.

${require('./_footer.html')} diff --git a/docs/src/grid.html b/docs/src/grid.html index 78c3fcce..0479881f 100644 --- a/docs/src/grid.html +++ b/docs/src/grid.html @@ -39,7 +39,7 @@

Columns intentionally collapses below large devices (992px)

-

To go further, discover how to merge Pico with the Bootstrap grid system.

+

To go further, discover how to merge Pico with the Bootstrap grid system.

Pico does not include JavaScript code. You will need to implement your JS to interact with modals.

-

As a starting point, you can look at the JavaScript used in this documentation: js/modal.js.

+

As a starting point, you can look at this example: modal.js.

To make a modal appear, add the open attribute to the <dialog> container.

<!-- Open modal-->
diff --git a/docs/src/rtl.html b/docs/src/rtl.html
index 5dd9df0b..b7d39f6f 100644
--- a/docs/src/rtl.html
+++ b/docs/src/rtl.html
@@ -20,7 +20,7 @@
             

RTL

Support for right-to-left text in Pico.

-

To enable RTL in Pico you need to set dir="rtl"on the <html> element (example).

+

To enable RTL in Pico you need to set dir="rtl"on the <html> element (example).

<!doctype html>
 <html dir="rtl" lang="ar">