fix(examples): hide not yet customized Bootstrap's examples to avoid …

…misuse (#932)

site/content/docs/5.1/examples/_index.md

@@ -5,6 +5,14 @@ description: Quickly get a project started with any of our examples ranging from
 aliases: "/examples/"
 ---
 
+{{< callout info >}}
+**Some examples are missing here.**
+
+They are tracked in [#410](https://github.com/Orange-OpenSource/Orange-Boosted-Bootstrap/issues/410) and will be shipped as soon as possible.
+
+One of the missing examples has priority? Feel free to contact a member of the [Core team]({{< docsref "/about/team" >}}) or add a comment directly [in the corresponding issue](https://github.com/Orange-OpenSource/Orange-Boosted-Bootstrap/issues/410) to let us know.
+{{</ callout >}}
+
 {{< list-examples.inline >}}
 {{ range $entry := $.Site.Data.examples -}}
   <h2 id="{{ $entry.category | urlize }}">{{ $entry.category }}</h2>

site/content/docs/5.1/examples/grid/index.html

@@ -9,12 +9,12 @@
 
 <main>
   <div class="container">
-    <h1>Bootstrap grid examples</h1>
-    <p class="lead">Basic grid layouts to get you familiar with building within the Bootstrap grid system.</p>
-    <p>In these examples the <code>.themed-grid-col</code> class is added to the columns to add some theming. This is not a class that is available in Bootstrap by default.</p>
+    <h1>Boosted grid examples</h1>
+    <p class="lead">Basic grid layouts to get you familiar with building within the Boosted grid system.</p>
+    <p>In these examples the <code>.themed-grid-col</code> class is added to the columns to add some theming. This is not a class that is available in Boosted by default.</p>
 
     <h2 class="mt-4">Five grid tiers</h2>
-    <p>There are five tiers to the Bootstrap grid system, one for each range of devices we support. Each tier starts at a minimum viewport size and automatically applies to the larger devices unless overridden.</p>
+    <p>There are five tiers to the Boosted grid system, one for each range of devices we support. Each tier starts at a minimum viewport size and automatically applies to the larger devices unless overridden.</p>
 
     <div class="row mb-3">
       <div class="col-4 themed-grid-col">.col-4</div>
@@ -109,7 +109,7 @@ <h2 class="mt-4">Two columns with two nested columns</h2>
     <hr class="my-4">
 
     <h2 class="mt-4">Mixed: mobile and desktop</h2>
-    <p>The Bootstrap v5 grid system has six tiers of classes: xs (extra small, this class infix is not used), sm (small), md (medium), lg (large), xl (x-large), and xxl (xx-large). You can use nearly any combination of these classes to create more dynamic and flexible layouts.</p>
+    <p>The Boosted v5 grid system has six tiers of classes: xs (extra small, this class infix is not used), sm (small), md (medium), lg (large), xl (x-large), and xxl (xx-large). You can use nearly any combination of these classes to create more dynamic and flexible layouts.</p>
     <p>Each tier of classes scales up, meaning if you plan on setting the same widths for md, lg, xl and xxl, you only need to specify md.</p>
     <div class="row mb-3">
       <div class="col-md-8 themed-grid-col">.col-md-8</div>
@@ -175,7 +175,7 @@ <h2 class="mt-4">Gutters</h2>
     <hr class="my-4">
 
     <h2 class="mt-4">Containers</h2>
-    <p>Additional classes added in Bootstrap v4.4 allow containers that are 100% wide until a particular breakpoint. v5 adds a new <code>xxl</code> breakpoint.</p>
+    <p>Additional classes added in Boosted v4.4 allow containers that are 100% wide until a particular breakpoint. v5 adds a new <code>xxl</code> breakpoint.</p>
   </div>
 
   <div class="container themed-container">.container</div>

site/content/docs/5.1/examples/masonry/index.html

@@ -8,16 +8,16 @@
 ---
 
 <main class="container py-5">
-  <h1>Bootstrap and Masonry</h1>
-  <p class="lead">Integrate <a href="https://masonry.desandro.com/">Masonry</a> with the Bootstrap grid system and cards component.</p>
+  <h1>Boosted and Masonry</h1>
+  <p class="lead">Integrate <a href="https://masonry.desandro.com/">Masonry</a> with the Boosted grid system and cards component.</p>
 
-  <p>Masonry is not included in Bootstrap. Add it by including the JavaScript plugin manually, or using a CDN like so:</p>
+  <p>Masonry is not included in Boosted. Add it by including the JavaScript plugin manually, or using a CDN like so:</p>
 
   <pre tabindex="0"><code>
 &lt;script src=&quot;https://cdn.jsdelivr.net/npm/masonry-layout@4.2.2/dist/masonry.pkgd.min.js&quot; integrity=&quot;sha384-GNFwBvfVxBkLMJpYMOABq3c+d3KnQxudP/mGPkzpZSTYykLBNsZEnG2D9G/X/+7D&quot; crossorigin=&quot;anonymous&quot; async&gt;&lt;/script&gt;
   </code></pre>
 
-  <p>By adding <code>data-masonry='{"percentPosition": true }'</code> to the <code>.row</code> wrapper, we can combine the powers of Bootstrap's responsive grid and Masonry's positioning.</p>
+  <p>By adding <code>data-masonry='{"percentPosition": true }'</code> to the <code>.row</code> wrapper, we can combine the powers of Boosted's responsive grid and Masonry's positioning.</p>
 
   <hr class="my-5">
 

site/data/examples.yml

@@ -1,90 +1,90 @@
-- category: Snippets
-  description: "Common patterns for building sites and apps that build on existing components and utilities with custom CSS and more."
-  examples:
-    - name: Headers
-      description: "Display your branding, navigation, search, and more with these header components"
-    - name: Heroes
-      description: "Set the stage on your homepage with heroes that feature clear calls to action."
-    - name: Features
-      description: "Explain the features, benefits, or other details in your marketing content."
-    - name: Sidebars
-      description: "Common navigation patterns ideal for offcanvas or multi-column layouts."
-    - name: Footers
-      description: "Finish every page strong with an awesome footer, big or small."
-    - name: Dropdowns
-      description: "Enhance your dropdowns with filters, icons, custom styles, and more."
-    - name: List groups
-      description: "Extend list groups with utilities and custom styles for any content."
-    - name: Modals
-      description: "Transform modals to serve any purpose, from feature tours to dialogs."
+# - category: Snippets
+#   description: "Common patterns for building sites and apps that build on existing components and utilities with custom CSS and more."
+#   examples:
+#     - name: Headers
+#       description: "Display your branding, navigation, search, and more with these header components"
+#     - name: Heroes
+#       description: "Set the stage on your homepage with heroes that feature clear calls to action."
+#     - name: Features
+#       description: "Explain the features, benefits, or other details in your marketing content."
+#     - name: Sidebars
+#       description: "Common navigation patterns ideal for offcanvas or multi-column layouts."
+#     - name: Footers
+#       description: "Finish every page strong with an awesome footer, big or small."
+#     - name: Dropdowns
+#       description: "Enhance your dropdowns with filters, icons, custom styles, and more."
+#     - name: List groups
+#       description: "Extend list groups with utilities and custom styles for any content."
+#     - name: Modals
+#       description: "Transform modals to serve any purpose, from feature tours to dialogs."
 
-- category: Custom Components
-  description: "Brand new components and templates to help folks quickly get started with Boosted and demonstrate best practices for adding onto the framework."
-  examples:
-    - name: Album
-      description: "Simple one-page template for photo galleries, portfolios, and more."
-    - name: Pricing
-      description: "Example pricing page built with Cards and featuring a custom header and footer."
-    - name: Checkout
-      description: "Custom checkout form showing our form components and their validation features."
-    - name: Product
-      description: "Lean product-focused marketing page with extensive grid and image work."
-    - name: Cover
-      description: "A one-page template for building simple and beautiful home pages."
-    - name: Carousel
-      description: "Customize the navbar and carousel, then add some new components."
-    - name: Blog
-      description: "Magazine like blog template with header, navigation, featured content."
-    - name: Dashboard
-      description: "Basic admin dashboard shell with fixed sidebar and navbar."
-    - name: Sign-in
-      description: "Custom form layout and design for a simple sign in form."
-    - name: Sticky footer
-      description: "Attach a footer to the bottom of the viewport when page content is short."
-    - name: Sticky footer navbar
-      description: "Attach a footer to the bottom of the viewport with a fixed top navbar."
-    - name: Jumbotron
-      description: "Use utilities to recreate and enhance Bootstrap 4's jumbotron."      
+# - category: Custom Components
+#   description: "Brand new components and templates to help folks quickly get started with Boosted and demonstrate best practices for adding onto the framework."
+#   examples:
+#     - name: Album
+#       description: "Simple one-page template for photo galleries, portfolios, and more."
+#     - name: Pricing
+#       description: "Example pricing page built with Cards and featuring a custom header and footer."
+#     - name: Checkout
+#       description: "Custom checkout form showing our form components and their validation features."
+#     - name: Product
+#       description: "Lean product-focused marketing page with extensive grid and image work."
+#     - name: Cover
+#       description: "A one-page template for building simple and beautiful home pages."
+#     - name: Carousel
+#       description: "Customize the navbar and carousel, then add some new components."
+#     - name: Blog
+#       description: "Magazine like blog template with header, navigation, featured content."
+#     - name: Dashboard
+#       description: "Basic admin dashboard shell with fixed sidebar and navbar."
+#     - name: Sign-in
+#       description: "Custom form layout and design for a simple sign in form."
+#     - name: Sticky footer
+#       description: "Attach a footer to the bottom of the viewport when page content is short."
+#     - name: Sticky footer navbar
+#       description: "Attach a footer to the bottom of the viewport with a fixed top navbar."
+#     - name: Jumbotron
+#       description: "Use utilities to recreate and enhance Bootstrap 4's jumbotron."
 
 - category: Framework
   description: "Examples that focus on implementing uses of built-in components provided by Boosted."
   examples:
-    - name: "Starter template"
-      description: "Nothing but the basics: compiled CSS and JavaScript."
+    # - name: "Starter template"
+    #   description: "Nothing but the basics: compiled CSS and JavaScript."
     - name: Grid
       description: "Multiple examples of grid layouts with all four tiers, nesting, and more."
-    - name: Cheatsheet
-      description: "Kitchen sink of Boosted components."
-    - name: Cheatsheet RTL
-      description: "Kitchen sink of Boosted components, RTL."
+    # - name: Cheatsheet
+    #   description: "Kitchen sink of Boosted components."
+    # - name: Cheatsheet RTL
+    #   description: "Kitchen sink of Boosted components, RTL."
 
-- category: Navbars
-  description: "Taking the default navbar component and showing how it can be moved, placed, and extended."
-  examples:
-    - name: Navbars
-      description: "Demonstration of all responsive and container options for the navbar."
-    - name: Navbar static
-      description: "Single navbar example of a static top navbar along with some additional content."
-    - name: Navbar fixed
-      description: "Single navbar example with a fixed top navbar along with some additional content."
-    - name: Navbar bottom
-      description: "Single navbar example with a bottom navbar along with some additional content."
-    - name: Offcanvas navbar
-      description: "Turn your expandable navbar into a sliding offcanvas menu (doesn't use our offcanvas component)."      
+# - category: Navbars
+#   description: "Taking the default navbar component and showing how it can be moved, placed, and extended."
+#   examples:
+#     - name: Navbars
+#       description: "Demonstration of all responsive and container options for the navbar."
+#     - name: Navbar static
+#       description: "Single navbar example of a static top navbar along with some additional content."
+#     - name: Navbar fixed
+#       description: "Single navbar example with a fixed top navbar along with some additional content."
+#     - name: Navbar bottom
+#       description: "Single navbar example with a bottom navbar along with some additional content."
+#     - name: Offcanvas navbar
+#       description: "Turn your expandable navbar into a sliding offcanvas menu (doesn't use our offcanvas component)."
 
-- category: RTL
-  description: "See Boosted's RTL version in action with these modified Custom Components examples."
-  examples:
-    - name: Album RTL
-      description: "Simple one-page template for photo galleries, portfolios, and more."
-    - name: Checkout RTL
-      description: "Custom checkout form showing our form components and their validation features."
-    - name: Carousel RTL
-      description: "Customize the navbar and carousel, then add some new components."
-    - name: Blog RTL
-      description: "Magazine like blog template with header, navigation, featured content."
-    - name: Dashboard RTL
-      description: "Basic admin dashboard shell with fixed sidebar and navbar."
+# - category: RTL
+#   description: "See Boosted's RTL version in action with these modified Custom Components examples."
+#   examples:
+#     - name: Album RTL
+#       description: "Simple one-page template for photo galleries, portfolios, and more."
+#     - name: Checkout RTL
+#       description: "Custom checkout form showing our form components and their validation features."
+#     - name: Carousel RTL
+#       description: "Customize the navbar and carousel, then add some new components."
+#     - name: Blog RTL
+#       description: "Magazine like blog template with header, navigation, featured content."
+#     - name: Dashboard RTL
+#       description: "Basic admin dashboard shell with fixed sidebar and navbar."
 
 - category: Integrations
   description: "Integrations with external libraries."