` or a block level element (e.g., ``) with the `.blockquote-footer` class. Be sure to wrap the name of the source work in `` as well.
-
-{{< example >}}
-
-
- A well-known quote, contained in a blockquote element.
-
-
-
-{{< /example >}}
-
-### Alignment
-
-Use text utilities as needed to change the alignment of your blockquote.
-
-{{< example >}}
-
-
- A well-known quote, contained in a blockquote element.
-
-
-
-{{< /example >}}
-
-{{< example >}}
-
-
- A well-known quote, contained in a blockquote element.
-
-
-
-{{< /example >}}
-
-## Lists
-
-### Unstyled
-
-Remove the default `list-style` and left margin on list items (immediate children only). **This only applies to immediate children list items**, meaning you will need to add the class for any nested lists as well.
-
-{{< example >}}
-
- - This is a list.
- - It appears completely unstyled.
- - Structurally, it's still a list.
- - However, this style only applies to immediate child elements.
- - Nested lists:
-
- - are unaffected by this style
- - will still show a bullet
- - and have appropriate left margin
-
-
- - This may still come in handy in some situations.
-
-{{< /example >}}
-
-### Inline
-
-Remove a list's bullets and apply some light `margin` with a combination of two classes, `.list-inline` and `.list-inline-item`.
-
-{{< example >}}
-
- - This is a list item.
- - And another one.
- - But they're displayed inline.
-
-{{< /example >}}
-
-### Description list alignment
-
-Align terms and descriptions horizontally by using our grid system's predefined classes (or semantic mixins). For longer terms, you can optionally add a `.text-truncate` class to truncate the text with an ellipsis.
-
-{{< example >}}
-
- - Description lists
- - A description list is perfect for defining terms.
-
- - Term
- -
-
Definition for the term.
- And some more placeholder definition text.
-
-
- - Another term
- - This definition is short, so no extra paragraphs or anything.
-
- - Truncated term is truncated
- - This can be useful when space is tight. Adds an ellipsis at the end.
-
- - Nesting
- -
-
- - Nested definition list
- - I heard you like definition lists. Let me put a definition list inside your definition list.
-
-
-
-{{< /example >}}
-
-## Responsive font sizes
-
-In Bootstrap 5, we've enabled responsive font sizes by default, allowing text to scale more naturally across device and viewport sizes. Have a look at the [RFS page]({{< docsref "/getting-started/rfs" >}}) to find out how this works.
diff --git a/site/content/docs/5.0/customize/color.md b/site/content/docs/5.0/customize/color.md
deleted file mode 100644
index 452b3d77c..000000000
--- a/site/content/docs/5.0/customize/color.md
+++ /dev/null
@@ -1,108 +0,0 @@
----
-layout: docs
-title: Color
-description: Bootstrap is supported by an extensive color system that themes our styles and components. This enables more comprehensive customization and extension for any project.
-group: customize
-toc: true
----
-
-## Theme colors
-
-We use a subset of all colors to create a smaller color palette for generating color schemes, also available as Sass variables and a Sass map in Bootstrap's `scss/_variables.scss` file.
-
-
- {{< theme-colors.inline >}}
- {{- range (index $.Site.Data "theme-colors") }}
-
- {{ end -}}
- {{< /theme-colors.inline >}}
-
- {{< theme-colors.inline >}}
- {{- range $color := $.Site.Data.colors }}
- {{- if (and (not (eq $color.name "white")) (not (eq $color.name "gray")) (not (eq $color.name "gray-dark"))) }}
-
-
- ${{ $color.name }}
- {{ $color.hex }}
-
- {{ range (seq 100 100 900) }}
-
${{ $color.name }}-{{ . }}
- {{ end }}
-
- {{ end -}}
- {{ end -}}
-
-
-
- $gray-500
- #adb5bd
-
- {{- range $.Site.Data.grays }}
-
$gray-{{ .name }}
- {{ end -}}
-
- {{< /theme-colors.inline >}}
-
-
-
- $black
- #000
-
-
- $white
- #fff
-
-
-
-
- This is a callout. We built it custom for our docs so our messages to you stand out. It has three variants via modifier classes.
-
-
...
-```
-
-In your CSS, you'd have something like the following where the bulk of the styling is done via `.callout`. Then, the unique styles between each variant is controlled via modifier class.
-
-```scss
-// Base class
-.callout {}
-
-// Modifier classes
-.callout-info {}
-.callout-warning {}
-.callout-danger {}
-```
-
-For the callouts, that unique styling is just a `border-left-color`. When you combine that base class with one of those modifier classes, you get your complete component family:
-
-{{< callout info >}}
-**This is an info callout.** Example text to show it in action.
-{{< /callout >}}
-
-{{< callout warning >}}
-**This is a warning callout.** Example text to show it in action.
-{{< /callout >}}
-
-{{< callout danger >}}
-**This is a danger callout.** Example text to show it in action.
-{{< /callout >}}
diff --git a/site/content/docs/5.0/customize/css-variables.md b/site/content/docs/5.0/customize/css-variables.md
deleted file mode 100644
index a2d0f33b7..000000000
--- a/site/content/docs/5.0/customize/css-variables.md
+++ /dev/null
@@ -1,50 +0,0 @@
----
-layout: docs
-title: CSS variables
-description: Use Bootstrap's CSS custom properties for fast and forward-looking design and development.
-group: customize
-toc: true
----
-
-Bootstrap includes around two dozen [CSS custom properties (variables)](https://developer.mozilla.org/en-US/docs/Web/CSS/Using_CSS_custom_properties) in its compiled CSS, with dozens more on the way for improved customization on a per-component basis. These provide easy access to commonly used values like our theme colors, breakpoints, and primary font stacks when working in your browser's inspector, a code sandbox, or general prototyping.
-
-**All our custom properties are prefixed with `bs-`** to avoid conflicts with third party CSS.
-
-## Root variables
-
-Here are the variables we include (note that the `:root` is required) that can be accessed anywhere Bootstrap's CSS is loaded. They're located in our `_root.scss` file and included in our compiled dist files.
-
-```css
-{{< root.inline >}}
-{{- $css := readFile "dist/css/bootstrap.css" -}}
-{{- $match := findRE ":root {([^}]*)}" $css 1 -}}
-
-{{- if (eq (len $match) 0) -}}
-{{- errorf "Got no matches for :root in %q!" $.Page.Path -}}
-{{- end -}}
-
-{{- index $match 0 -}}
-
-{{< /root.inline >}}
-```
-
-## Component variables
-
-We're also beginning to make use of custom properties as local variables for various components. This way we can reduce our compiled CSS, ensure styles aren't inherited in places like nested tables, and allow some basic restyling and extending of Bootstrap components after Sass compilation.
-
-Have a look at our table documentation for some [insight into how we're using CSS variables]({{< docsref "/content/tables#how-do-the-variants-and-accented-tables-work" >}}).
-
-We're also using CSS variables across our grids—primarily for gutters—with more component usage coming in the future.
-
-## Examples
-
-CSS variables offer similar flexibility to Sass's variables, but without the need for compilation before being served to the browser. For example, here we're resetting our page's font and link styles with CSS variables.
-
-```css
-body {
- font: 1rem/1.5 var(--bs-font-sans-serif);
-}
-a {
- color: var(--bs-blue);
-}
-```
diff --git a/site/content/docs/5.0/customize/optimize.md b/site/content/docs/5.0/customize/optimize.md
deleted file mode 100644
index fbf3f6b05..000000000
--- a/site/content/docs/5.0/customize/optimize.md
+++ /dev/null
@@ -1,79 +0,0 @@
----
-layout: docs
-title: Optimize
-description: Keep your projects lean, responsive, and maintainable so you can deliver the best experience and focus on more important jobs.
-group: customize
-toc: true
----
-
-## Lean Sass imports
-
-When using Sass in your asset pipeline, make sure you optimize Bootstrap by only `@import`ing the components you need. Your largest optimizations will likely come from the `Layout & Components` section of our `bootstrap.scss`.
-
-{{< scss-docs name="import-stack" file="scss/bootstrap.scss" >}}
-
-
-If you're not using a component, comment it out or delete it entirely. For example, if you're not using the carousel, remove that import to save some file size in your compiled CSS. Keep in mind there are some dependencies across Sass imports that may make it more difficult to omit a file.
-
-## Lean JavaScript
-
-Bootstrap's JavaScript includes every component in our primary dist files (`bootstrap.js` and `bootstrap.min.js`), and even our primary dependency (Popper) with our bundle files (`bootstrap.bundle.js` and `bootstrap.bundle.min.js`). While you're customizing via Sass, be sure to remove related JavaScript.
-
-For instance, assuming you're using your own JavaScript bundler like Webpack or Rollup, you'd only import the JavaScript you plan on using. In the example below, we show how to just include our modal JavaScript:
-
-```js
-// Import just what we need
-
-// import 'bootstrap/js/dist/alert';
-// import 'bootstrap/js/dist/button';
-// import 'bootstrap/js/dist/carousel';
-// import 'bootstrap/js/dist/collapse';
-// import 'bootstrap/js/dist/dropdown';
-import 'bootstrap/js/dist/modal';
-// import 'bootstrap/js/dist/popover';
-// import 'bootstrap/js/dist/scrollspy';
-// import 'bootstrap/js/dist/tab';
-// import 'bootstrap/js/dist/toast';
-// import 'bootstrap/js/dist/tooltip';
-```
-
-This way, you're not including any JavaScript you don't intend to use for components like buttons, carousels, and tooltips. If you're importing dropdowns, tooltips or popovers, be sure to list the Popper dependency in your `package.json` file.
-
-{{< callout info >}}
-### Default Exports
-
-Files in `bootstrap/js/dist` use the **default export**, so if you want to use one of them you have to do the following:
-
-```js
-import Modal from 'bootstrap/js/dist/modal'
-
-const modal = new Modal(document.getElementById('myModal'))
-```
-{{< /callout >}}
-
-## Autoprefixer .browserslistrc
-
-Bootstrap depends on Autoprefixer to automatically add browser prefixes to certain CSS properties. Prefixes are dictated by our `.browserslistrc` file, found in the root of the Bootstrap repo. Customizing this list of browsers and recompiling the Sass will automatically remove some CSS from your compiled CSS, if there are vendor prefixes unique to that browser or version.
-
-## Unused CSS
-
-_Help wanted with this section, please consider opening a PR. Thanks!_
-
-While we don't have a prebuilt example for using [PurgeCSS](https://github.com/FullHuman/purgecss) with Bootstrap, there are some helpful articles and walkthroughs that the community has written. Here are some options:
-
--
--
-
-Lastly, this [CSS Tricks article on unused CSS](https://css-tricks.com/how-do-you-remove-unused-css-from-a-site/) shows how to use PurgeCSS and other similar tools.
-
-## Minify and gzip
-
-Whenever possible, be sure to compress all the code you serve to your visitors. If you're using Bootstrap dist files, try to stick to the minified versions (indicated by the `.min.css` and `.min.js` extensions). If you're building Bootstrap from the source with your own build system, be sure to implement your own minifiers for HTML, CSS, and JS.
-
-## Nonblocking files
-
-_Help wanted with this section, please consider opening a PR. Thanks!_
-
-## Always use https
-
-_Help wanted with this section, please consider opening a PR. Thanks!_
diff --git a/site/content/docs/5.0/customize/options.md b/site/content/docs/5.0/customize/options.md
deleted file mode 100644
index ff7c58095..000000000
--- a/site/content/docs/5.0/customize/options.md
+++ /dev/null
@@ -1,29 +0,0 @@
----
-layout: docs
-title: Options
-description: Quickly customize Bootstrap with built-in variables to easily toggle global CSS preferences for controlling style and behavior.
-group: customize
----
-
-Customize Bootstrap with our built-in custom variables file and easily toggle global CSS preferences with new `$enable-*` Sass variables. Override a variable's value and recompile with `npm run test` as needed.
-
-You can find and customize these variables for key global options in Bootstrap's `scss/_variables.scss` file.
-
-{{< bs-table "table text-start" >}}
-| Variable | Values | Description |
-| ------------------------------ | ---------------------------------- | -------------------------------------------------------------------------------------- |
-| `$spacer` | `1rem` (default), or any value > 0 | Specifies the default spacer value to programmatically generate our [spacer utilities]({{< docsref "/utilities/spacing" >}}). |
-| `$enable-rounded` | `true` (default) or `false` | Enables predefined `border-radius` styles on various components. |
-| `$enable-shadows` | `true` or `false` (default) | Enables predefined decorative `box-shadow` styles on various components. Does not affect `box-shadow`s used for focus states. |
-| `$enable-gradients` | `true` or `false` (default) | Enables predefined gradients via `background-image` styles on various components. |
-| `$enable-transitions` | `true` (default) or `false` | Enables predefined `transition`s on various components. |
-| `$enable-reduced-motion` | `true` (default) or `false` | Enables the [`prefers-reduced-motion` media query]({{< docsref "/getting-started/accessibility#reduced-motion" >}}), which suppresses certain animations/transitions based on the users' browser/operating system preferences. |
-| `$enable-grid-classes` | `true` (default) or `false` | Enables the generation of CSS classes for the grid system (e.g. `.row`, `.col-md-1`, etc.). |
-| `$enable-caret` | `true` (default) or `false` | Enables pseudo element caret on `.dropdown-toggle`. |
-| `$enable-button-pointers` | `true` (default) or `false` | Add "hand" cursor to non-disabled button elements. |
-| `$enable-rfs` | `true` (default) or `false` | Globally enables [RFS]({{< docsref "/getting-started/rfs" >}}). |
-| `$enable-validation-icons` | `true` (default) or `false` | Enables `background-image` icons within textual inputs and some custom forms for validation states. |
-| `$enable-negative-margins` | `true` or `false` (default) | Enables the generation of [negative margin utilities]({{< docsref "/utilities/spacing#negative-margin" >}}). |
-| `$enable-deprecation-messages` | `true` or `false` (default) | Set to `true` to show warnings when using any of the deprecated mixins and functions that are planned to be removed in `v5`. |
-| `$enable-important-utilities` | `true` (default) or `false` | Enables the `!important` suffix in utility classes. |
-{{< /bs-table >}}
diff --git a/site/content/docs/5.0/customize/overview.md b/site/content/docs/5.0/customize/overview.md
deleted file mode 100644
index ce94ebfc4..000000000
--- a/site/content/docs/5.0/customize/overview.md
+++ /dev/null
@@ -1,51 +0,0 @@
----
-layout: docs
-title: Customize
-description: Learn how to theme, customize, and extend Bootstrap with Sass, a boatload of global options, an expansive color system, and more.
-group: customize
-toc: false
-aliases: "/docs/5.0/customize/"
-sections:
- - title: Sass
- description: Utilize our source Sass files to take advantage of variables, maps, mixins, and functions.
- - title: Options
- description: Customize Bootstrap with built-in variables to easily toggle global CSS preferences.
- - title: Color
- description: Learn about and customize the color systems that support the entire toolkit.
- - title: Components
- description: Learn how we build nearly all our components responsively and with base and modifier classes.
- - title: CSS variables
- description: Use Bootstrap's CSS custom properties for fast and forward-looking design and development.
- - title: Optimize
- description: Keep your projects lean, responsive, and maintainable so you can deliver the best experience.
----
-
-## Overview
-
-There are multiple ways to customize Bootstrap. Your best path can depend on your project, the complexity of your build tools, the version of Bootstrap you're using, browser support, and more.
-
-Our two preferred methods are:
-
-1. Using Bootstrap [via package manager]({{< docsref "/getting-started/download#package-managers" >}}) so you can use and extend our source files.
-2. Using Bootstrap's compiled distribution files or [jsDelivr]({{< docsref "/getting-started/download#cdn-via-jsdelivr" >}}) so you can add onto or override Bootstrap's styles.
-
-While we cannot go into details here on how to use every package manager, we can give some guidance on [using Bootstrap with your own Sass compiler]({{< docsref "/customize/sass" >}}).
-
-For those who want to use the distribution files, review the [getting started page]({{< docsref "/getting-started/introduction" >}}) for how to include those files and an example HTML page. From there, consult the docs for the layout, components, and behaviors you'd like to use.
-
-As you familiarize yourself with Bootstrap, continue exploring this section for more details on how to utilize our global options, making use of and changing our color system, how we build our components, how to use our growing list of CSS custom properties, and how to optimize your code when building with Bootstrap.
-
-## CSPs and embedded SVGs
-
-Several Bootstrap components include embedded SVGs in our CSS to style components consistently and easily across browsers and devices. **For organizations with more strict CSP configurations**, we've documented all instances of our embedded SVGs (all of which are applied via `background-image`) so you can more thoroughly review your options.
-
-- [Accordion]({{< docsref "/components/accordion" >}})
-- [Close button]({{< docsref "/components/close-button" >}}) (used in alerts and modals)
-- [Form checkboxes and radio buttons]({{< docsref "/forms/checks-radios" >}})
-- [Form switches]({{< docsref "/forms/checks-radios#switches" >}})
-- [Form validation icons]({{< docsref "/forms/validation#server-side" >}})
-- [Select menus]({{< docsref "/forms/select" >}})
-- [Carousel controls]({{< docsref "/components/carousel#with-controls" >}})
-- [Navbar toggle buttons]({{< docsref "/components/navbar#responsive-behaviors" >}})
-
-Based on [community conversation](https://github.com/twbs/bootstrap/issues/25394), some options for addressing this in your own codebase include replacing the URLs with locally hosted assets, removing the images and using inline images (not possible in all components), and modifying your CSP. Our recommendation is to carefully review your own security policies and decide on a best path forward, if necessary.
\ No newline at end of file
diff --git a/site/content/docs/5.0/customize/sass.md b/site/content/docs/5.0/customize/sass.md
deleted file mode 100644
index d21dff7aa..000000000
--- a/site/content/docs/5.0/customize/sass.md
+++ /dev/null
@@ -1,252 +0,0 @@
----
-layout: docs
-title: Sass
-description: Utilize our source Sass files to take advantage of variables, maps, mixins, and functions to help you build faster and customize your project.
-group: customize
-toc: true
----
-
-Utilize our source Sass files to take advantage of variables, maps, mixins, and more.
-
-## File structure
-
-Whenever possible, avoid modifying Bootstrap's core files. For Sass, that means creating your own stylesheet that imports Bootstrap so you can modify and extend it. Assuming you're using a package manager like npm, you'll have a file structure that looks like this:
-
-```text
-your-project/
-├── scss
-│ └── custom.scss
-└── node_modules/
- └── bootstrap
- ├── js
- └── scss
-```
-
-If you've downloaded our source files and aren't using a package manager, you'll want to manually setup something similar to that structure, keeping Bootstrap's source files separate from your own.
-
-```text
-your-project/
-├── scss
-│ └── custom.scss
-└── bootstrap/
- ├── js
- └── scss
-```
-
-## Importing
-
-In your `custom.scss`, you'll import Bootstrap's source Sass files. You have two options: include all of Bootstrap, or pick the parts you need. We encourage the latter, though be aware there are some requirements and dependencies across our components. You also will need to include some JavaScript for our plugins.
-
-```scss
-// Custom.scss
-// Option A: Include all of Bootstrap
-
-@import "../node_modules/bootstrap/scss/bootstrap";
-```
-
-```scss
-// Custom.scss
-// Option B: Include parts of Bootstrap
-
-// Required
-@import "../node_modules/bootstrap/scss/functions";
-@import "../node_modules/bootstrap/scss/variables";
-@import "../node_modules/bootstrap/scss/mixins";
-
-// Optional
-@import "../node_modules/bootstrap/scss/root";
-@import "../node_modules/bootstrap/scss/reboot";
-@import "../node_modules/bootstrap/scss/type";
-@import "../node_modules/bootstrap/scss/images";
-@import "../node_modules/bootstrap/scss/containers";
-@import "../node_modules/bootstrap/scss/grid";
-```
-
-With that setup in place, you can begin to modify any of the Sass variables and maps in your `custom.scss`. You can also start to add parts of Bootstrap under the `// Optional` section as needed. We suggest using the full import stack from our `bootstrap.scss` file as your starting point.
-
-## Variable defaults
-
-Every Sass variable in Bootstrap includes the `!default` flag allowing you to override the variable's default value in your own Sass without modifying Bootstrap's source code. Copy and paste variables as needed, modify their values, and remove the `!default` flag. If a variable has already been assigned, then it won't be re-assigned by the default values in Bootstrap.
-
-You will find the complete list of Bootstrap's variables in `scss/_variables.scss`. Some variables are set to `null`, these variables don't output the property unless they are overridden in your configuration.
-
-Variable overrides within the same Sass file can come before or after the default variables. However, when overriding across Sass files, your overrides must come before you import Bootstrap's Sass files.
-
-Here's an example that changes the `background-color` and `color` for the `` when importing and compiling Bootstrap via npm:
-
-```scss
-// Your variable overrides
-$body-bg: #000;
-$body-color: #111;
-
-// Bootstrap and its default variables
-@import "../node_modules/bootstrap/scss/bootstrap";
-```
-
-Repeat as necessary for any variable in Bootstrap, including the global options below.
-
-## Maps and loops
-
-Bootstrap includes a handful of Sass maps, key value pairs that make it easier to generate families of related CSS. We use Sass maps for our colors, grid breakpoints, and more. Just like Sass variables, all Sass maps include the `!default` flag and can be overridden and extended.
-
-Some of our Sass maps are merged into empty ones by default. This is done to allow easy expansion of a given Sass map, but comes at the cost of making _removing_ items from a map slightly more difficult.
-
-### Modify map
-
-All variables in the `$theme-colors` map are defined as standalone variables. To modify an existing color in our `$theme-colors` map, add the following to your custom Sass file:
-
-```scss
-$primary: #0074d9;
-$danger: #ff4136;
-```
-
-Later on, theses variables are set in Bootstrap's `$theme-colors` map:
-
-```scss
-$theme-colors: (
- "primary": $primary,
- "danger": $danger
-);
-```
-
-### Add to map
-
-Add new colors to `$theme-colors`, or any other map, by creating a new Sass map with your custom values and merging it with the original map. In this case, we'll create a new `$custom-colors` map and merge it with `$theme-colors`.
-
-```scss
-// Create your own map
-$custom-colors: (
- "custom-color": #900
-);
-
-// Merge the maps
-$theme-colors: map-merge($theme-colors, $custom-colors);
-```
-
-### Remove from map
-
-To remove colors from `$theme-colors`, or any other map, use `map-remove`. Be aware you must insert it between our requirements and options:
-
-```scss
-// Required
-@import "../node_modules/bootstrap/scss/functions";
-@import "../node_modules/bootstrap/scss/variables";
-@import "../node_modules/bootstrap/scss/mixins";
-
-$theme-colors: map-remove($theme-colors, "info", "light", "dark");
-
-// Optional
-@import "../node_modules/bootstrap/scss/root";
-@import "../node_modules/bootstrap/scss/reboot";
-@import "../node_modules/bootstrap/scss/type";
-...
-```
-
-## Required keys
-
-Bootstrap assumes the presence of some specific keys within Sass maps as we used and extend these ourselves. As you customize the included maps, you may encounter errors where a specific Sass map's key is being used.
-
-For example, we use the `primary`, `success`, and `danger` keys from `$theme-colors` for links, buttons, and form states. Replacing the values of these keys should present no issues, but removing them may cause Sass compilation issues. In these instances, you'll need to modify the Sass code that makes use of those values.
-
-## Functions
-
-### Colors
-
-Next to the [Sass maps]({{< docsref "/customize/color#color-sass-maps" >}}) we have, theme colors can also be used as standalone variables, like `$primary`.
-
-```scss
-.custom-element {
- color: $gray-100;
- background-color: $dark;
-}
-```
-
-You can lighten or darken colors with Bootstrap's `tint-color()` and `shade-color()` functions. These functions will mix colors with black or white, unlike Sass' native `lighten()` and `darken()` functions which will change the lightness by a fixed amount, which often doesn't lead to the desired effect.
-
-{{< scss-docs name="color-functions" file="scss/_functions.scss" >}}
-
-In practice, you'd call the function and pass in the color and weight parameters.
-
-```scss
-.custom-element {
- color: tint-color($primary, 10%);
-}
-
-.custom-element-2 {
- color: shade-color($danger, 30%);
-}
-```
-
-### Color contrast
-
-In order to meet [WCAG 2.0 accessibility standards for color contrast](https://www.w3.org/TR/UNDERSTANDING-WCAG20/visual-audio-contrast-contrast.html), authors **must** provide [a contrast ratio of at least 4.5:1](https://www.w3.org/WAI/WCAG20/quickref/20160105/Overview.php#visual-audio-contrast-contrast), with very few exceptions.
-
-An additional function we include in Bootstrap is the color contrast function, `color-contrast`. It utilizes the [WCAG 2.0 algorithm](https://www.w3.org/TR/WCAG20-TECHS/G17.html#G17-tests) for calculating contrast thresholds based on [relative luminance](https://www.w3.org/WAI/GL/wiki/Relative_luminance) in a `sRGB` colorspace to automatically return a light (`#fff`), dark (`#212529`) or black (`#000`) contrast color based on the specified base color. This function is especially useful for mixins or loops where you're generating multiple classes.
-
-For example, to generate color swatches from our `$theme-colors` map:
-
-```scss
-@each $color, $value in $theme-colors {
- .swatch-#{$color} {
- color: color-contrast($value);
- }
-}
-```
-
-It can also be used for one-off contrast needs:
-
-```scss
-.custom-element {
- color: color-contrast(#000); // returns `color: #fff`
-}
-```
-
-You can also specify a base color with our color map functions:
-
-```scss
-.custom-element {
- color: color-contrast($dark); // returns `color: #fff`
-}
-```
-
-### Escape SVG
-
-We use the `escape-svg` function to escape the `<`, `>` and `#` characters for SVG background images. When using the `escape-svg` function, data URIs must be quoted.
-
-### Add and Subtract functions
-
-We use the `add` and `subtract` functions to wrap the CSS `calc` function. The primary purpose of these functions is to avoid errors when a "unitless" `0` value is passed into a `calc` expression. Expressions like `calc(10px - 0)` will return an error in all browsers, despite being mathematically correct.
-
-Example where the calc is valid:
-
-```scss
-$border-radius: .25rem;
-$border-width: 1px;
-
-.element {
- // Output calc(.25rem - 1px) is valid
- border-radius: calc($border-radius - $border-width);
-}
-
-.element {
- // Output the same calc(.25rem - 1px) as above
- border-radius: subtract($border-radius, $border-width);
-}
-```
-
-Example where the calc is invalid:
-
-```scss
-$border-radius: .25rem;
-$border-width: 0;
-
-.element {
- // Output calc(.25rem - 0) is invalid
- border-radius: calc($border-radius - $border-width);
-}
-
-.element {
- // Output .25rem
- border-radius: subtract($border-radius, $border-width);
-}
-```
diff --git a/site/content/docs/5.0/examples/_index.md b/site/content/docs/5.0/examples/_index.md
deleted file mode 100644
index 4d747cd78..000000000
--- a/site/content/docs/5.0/examples/_index.md
+++ /dev/null
@@ -1,36 +0,0 @@
----
-layout: single
-title: Examples
-description: Quickly get a project started with any of our examples ranging from using parts of the framework to custom components and layouts.
-aliases: "/examples/"
----
-
-{{< list-examples.inline >}}
-{{ range $entry := $.Site.Data.examples -}}
- {{ $entry.category }}
- {{ $entry.description }}
- {{ if eq $entry.category "RTL" -}}
-
-
The RTL feature is still experimental and will probably evolve according to user feedback. Spotted something or have an improvement to suggest? Open an issue, we'd love to get your insights.
-
{{ end }}
-
- {{ if (eq (add $i 1) $len) }}
-
-
مثال الألبوم
-
شيء قصير وقائد حول المجموعة أدناه - محتوياتها ، ومنشئها ، وما إلى ذلك. اجعلها قصيرة ولطيفة ، ولكن ليست قصيرة جدًا حتى لا يتخطى الناس ببساطة هذه المجموعة تمامًا.
-
- الدعوة الرئيسية للعمل
- عمل ثانوي
-
-
-
-
-
-
-
-
- {{< placeholder width="100%" height="225" background="#55595c" color="#eceeef" class="card-img-top" text="ظفري" >}}
-
-
هذه بطاقة أوسع مع نص داعم أدناه كمقدمة طبيعية لمحتوى إضافي. هذا المحتوى أطول قليلاً.
-
-
-
-
-
-
9 دقائق
-
-
-
-
-
-
- {{< placeholder width="100%" height="225" background="#55595c" color="#eceeef" class="card-img-top" text="ظفري" >}}
-
-
هذه بطاقة أوسع مع نص داعم أدناه كمقدمة طبيعية لمحتوى إضافي. هذا المحتوى أطول قليلاً.
-
-
-
-
-
-
9 دقائق
-
-
-
-
-
-
- {{< placeholder width="100%" height="225" background="#55595c" color="#eceeef" class="card-img-top" text="ظفري" >}}
-
-
هذه بطاقة أوسع مع نص داعم أدناه كمقدمة طبيعية لمحتوى إضافي. هذا المحتوى أطول قليلاً.
-
-
-
-
-
-
9 دقائق
-
-
-
-
-
-
-
- {{< placeholder width="100%" height="225" background="#55595c" color="#eceeef" class="card-img-top" text="ظفري" >}}
-
-
هذه بطاقة أوسع مع نص داعم أدناه كمقدمة طبيعية لمحتوى إضافي. هذا المحتوى أطول قليلاً.
-
-
-
-
-
-
9 دقائق
-
-
-
-
-
-
- {{< placeholder width="100%" height="225" background="#55595c" color="#eceeef" class="card-img-top" text="ظفري" >}}
-
-
هذه بطاقة أوسع مع نص داعم أدناه كمقدمة طبيعية لمحتوى إضافي. هذا المحتوى أطول قليلاً.
-
-
-
-
-
-
9 دقائق
-
-
-
-
-
-
- {{< placeholder width="100%" height="225" background="#55595c" color="#eceeef" class="card-img-top" text="ظفري" >}}
-
-
هذه بطاقة أوسع مع نص داعم أدناه كمقدمة طبيعية لمحتوى إضافي. هذا المحتوى أطول قليلاً.
-
-
-
-
-
-
9 دقائق
-
-
-
-
-
-
-
- {{< placeholder width="100%" height="225" background="#55595c" color="#eceeef" class="card-img-top" text="ظفري" >}}
-
-
هذه بطاقة أوسع مع نص داعم أدناه كمقدمة طبيعية لمحتوى إضافي. هذا المحتوى أطول قليلاً.
-
-
-
-
-
-
9 دقائق
-
-
-
-
-
-
- {{< placeholder width="100%" height="225" background="#55595c" color="#eceeef" class="card-img-top" text="ظفري" >}}
-
-
هذه بطاقة أوسع مع نص داعم أدناه كمقدمة طبيعية لمحتوى إضافي. هذا المحتوى أطول قليلاً.
-
-
-
-
-
-
9 دقائق
-
-
-
-
-
-
- {{< placeholder width="100%" height="225" background="#55595c" color="#eceeef" class="card-img-top" text="ظفري" >}}
-
-
هذه بطاقة أوسع مع نص داعم أدناه كمقدمة طبيعية لمحتوى إضافي. هذا المحتوى أطول قليلاً.
-
-
-
-
-
-
9 دقائق
-
-
-
-
-
-
-
-
-
Album example
-
Something short and leading about the collection below—its contents, the creator, etc. Make it short and sweet, but not too short so folks don’t simply skip over it entirely.
-
- Main call to action
- Secondary action
-
-
-
-
-
-
-
-
- {{< placeholder width="100%" height="225" background="#55595c" color="#eceeef" class="card-img-top" text="Thumbnail" >}}
-
-
This is a wider card with supporting text below as a natural lead-in to additional content. This content is a little bit longer.
-
-
-
-
-
-
9 mins
-
-
-
-
-
-
- {{< placeholder width="100%" height="225" background="#55595c" color="#eceeef" class="card-img-top" text="Thumbnail" >}}
-
-
This is a wider card with supporting text below as a natural lead-in to additional content. This content is a little bit longer.
-
-
-
-
-
-
9 mins
-
-
-
-
-
-
- {{< placeholder width="100%" height="225" background="#55595c" color="#eceeef" class="card-img-top" text="Thumbnail" >}}
-
-
This is a wider card with supporting text below as a natural lead-in to additional content. This content is a little bit longer.
-
-
-
-
-
-
9 mins
-
-
-
-
-
-
-
- {{< placeholder width="100%" height="225" background="#55595c" color="#eceeef" class="card-img-top" text="Thumbnail" >}}
-
-
This is a wider card with supporting text below as a natural lead-in to additional content. This content is a little bit longer.
-
-
-
-
-
-
9 mins
-
-
-
-
-
-
- {{< placeholder width="100%" height="225" background="#55595c" color="#eceeef" class="card-img-top" text="Thumbnail" >}}
-
-
This is a wider card with supporting text below as a natural lead-in to additional content. This content is a little bit longer.
-
-
-
-
-
-
9 mins
-
-
-
-
-
-
- {{< placeholder width="100%" height="225" background="#55595c" color="#eceeef" class="card-img-top" text="Thumbnail" >}}
-
-
This is a wider card with supporting text below as a natural lead-in to additional content. This content is a little bit longer.
-
-
-
-
-
-
9 mins
-
-
-
-
-
-
-
- {{< placeholder width="100%" height="225" background="#55595c" color="#eceeef" class="card-img-top" text="Thumbnail" >}}
-
-
This is a wider card with supporting text below as a natural lead-in to additional content. This content is a little bit longer.
-
-
-
-
-
-
9 mins
-
-
-
-
-
-
- {{< placeholder width="100%" height="225" background="#55595c" color="#eceeef" class="card-img-top" text="Thumbnail" >}}
-
-
This is a wider card with supporting text below as a natural lead-in to additional content. This content is a little bit longer.
-
-
-
-
-
-
9 mins
-
-
-
-
-
-
- {{< placeholder width="100%" height="225" background="#55595c" color="#eceeef" class="card-img-top" text="Thumbnail" >}}
-
-
This is a wider card with supporting text below as a natural lead-in to additional content. This content is a little bit longer.
-
-
-
-
-
-
9 mins
-
-
-
-
-
-
-
-
-
عنوان مشاركة مدونة مميزة أطول
-
أسطر نصية متعددة تشكل الجزء الأمامي ، لإعلام القراء الجدد بسرعة وكفاءة حول أكثر الأشياء إثارة للاهتمام في محتويات هذه المشاركة.
-
أكمل القراءة...
-
-
-
-
-
-
العالمية
-
مشاركة مميزة
-
12 نوفمبر
-
هذه بطاقة أوسع مع نص داعم أدناه كمقدمة طبيعية لمحتوى إضافي.
-
أكمل القراءة
-
-
- {{< placeholder width="200" height="250" background="#55595c" color="#eceeef" text="ظفري" >}}
-
-
-
-
-
-
-
التصميم
-
عنوان الوظيفة
-
11 نوفمبر
-
هذه بطاقة أوسع مع نص داعم أدناه كمقدمة طبيعية لمحتوى إضافي.
-
أكمل القراءة
-
-
- {{< placeholder width="200" height="250" background="#55595c" color="#eceeef" text="ظفري" >}}
-
-
-
-
-
-
- من Firehose
-
-
-
- عينة مشاركة مدونة
- 1 يناير 2014 بواسطة Mark
-
- تعرض مشاركة المدونة هذه بضعة أنواع مختلفة من المحتوى الذي يتم دعمه وتصميمه باستخدام Bootstrap. الطباعة الأساسية والصور والرموز كلها مدعومة.
-
- إذ مدن وبداية الجنود, ثم ٠٨٠٤ الثقيل هذه. ولم وقرى ومحاولة أي, وقام أراضي وصل مع. ما أخذ يتمكن الصعداء الإثنان, أم هامش أعمال إتفاقية ضرب. عدم إذ بقسوة غرّة، ممثّلة, تم وحتّى تعديل لها. عن ولم بسبب الأوروبيّون, ما كما وتنامت الإتفاقية. وقامت وبعدما بتخصيص و بال, سكان إعلان غريمه الا أي.
-
- ذلك هناك ألمانيا إذ. فعل الجنوبي اليابانية بل, جُل مع إنطلاق الموسوعة. واشتدّت وحلفاؤها عن دنو. عن إيو كثيرة المجتمع, وفي شمال حالية انذار أي. إنطلاق تزامناً بالإنزال و تلك.
-
- إذ دار السفن الخارجية, عل شيء الأسيوي شموليةً, الفترة والإتحاد أن الا. هو الحكم الحكومة حين. تم ليرتفع بأضرار التبرعات مما, حاول ساعة عن يكن. حيث مع حاول أجزاء الهجوم, يتم بـ قبضتهم الفرنسي.
- عنوان
- جُل عن اللا وقوعها،, دنو ثم وترك سكان الشمال, كل ذلك وأزيز والقرى. أم عدد مهمّات الساحل, قد تاريخ أفريقيا الإحتفاظ دول. مدن لبلجيكا، واندونيسيا، كل, مع أسر الشمال الأرضية بالسيطرة. في فقامت والروسية كلّ. عن فعل فسقط استبدال.
- العنوان الفرعي
- موالية استدعى كل حيث, وبدون الأولية الاندونيسية و كما. فعل قد لعدم اليابانية, اليميني الساحلية أن جهة. جُل ما اليميني العسكري الدنمارك. إذ وفي الموسوعة الأمريكي, سابق الأمريكية ثم مدن. تم وفي أوروبا بلديهما ماليزيا،, ويتّفق بالجانب وقد أي.
- Example code block
- تحت بولندا، مليارات لم. الشهير الإنزال وفي بل, مع قبل واتّجه الخاسر باستخدام. قدما يونيو مواقعها يكن و, سابق أراضي الإكتفاء حتى كل, و جعل مهمّات المتحدة. أخذ عل الثقيل الضروري لإنعدام, دول جيما أراض الدولارات تم. الخاطفة استعملت وباستثناء ثم انه, به، جدول الأهداف ماليزيا، ان. عن هناك الإحتفاظ غير.
- العنوان الفرعي
- مرجع استدعى بريطانيا ذلك عن, ٣٠ كان ألمّ الشّعبين الأمريكي. دار تغييرات الشرقية التجارية كل, تم يتبقّ للحكومة كلّ. ثمّة الشتاء الساحل و الى, بل أثره، فاتّبع يتم. دون وترك وتنصيب المبرمة ما, هذه عن زهاء استدعى انتصارهم, يعبأ شواطيء الأرضية به، أم. والتي وفرنسا الأولية بـ هذه, قائمة الوزراء ضرب أي.
-
- - بل دفّة فسقط بال, الله تغييرات الرئيسية من مدن. كرسي الأمم ويكيبيديا،.
- - لم عدد يطول جديدة ولاتّساع. أم تلك وحتّى.
- - ذات مئات المشترك بالمحور عن وشعار.
-
- لكل خلاف وترك المؤلّفة بل. ٣٠ حين أواخر أصقاع. بلا مع أوزار النزاع, مع إيطاليا بالرّغم بالمطالبة ومن. ان دول الحرة وقدّموا لتقليعة. الحرة بريطانيا، إذ وصل, الى وقام أجزاء أوراقهم عن. الباهضة الخاسرة حيث و.
-
- - عرض قتيل، الجنرال الأوروبي ما, ثم تعد بقعة.
- - ثم الا الجوي اوروبا, و غير العسكري التبرعات, ترتيب مواقعها أوراقهم ضرب في إذ.
- - علاقة يتعلّق وبلجيكا، على مع, الجنود الخطّة جُل عل, فقد ان سقوط.
-
- الشرق، وصافرات الساحلية بل بلا. ٠٨٠٤ ودول العناد انه أن. في تونس أوزار مقاومة وصل, قد وقد حلّت دأبوا رجوعهم. أفاق والعتاد لم قبل, عن كلّ منتصف محاولات. المشترك الأولية ان كلا, ألمّ إحتار التقليدية و مدن. عن عدد تسمّى المسرح الطرفين.
-
-
-
- مشاركة مدونة أخرى
- 23 ديسمبر 2013 بواسطة Jacob
-
- إذ مدن وبداية الجنود, ثم ٠٨٠٤ الثقيل هذه. ولم وقرى ومحاولة أي, وقام أراضي وصل مع. ما أخذ يتمكن الصعداء الإثنان, أم هامش أعمال إتفاقية ضرب. عدم إذ بقسوة غرّة، ممثّلة, تم وحتّى تعديل لها. عن ولم بسبب الأوروبيّون, ما كما وتنامت الإتفاقية. وقامت وبعدما بتخصيص و بال, سكان إعلان غريمه الا أي.
-
- ذلك هناك ألمانيا إذ. فعل الجنوبي اليابانية بل, جُل مع إنطلاق الموسوعة. واشتدّت وحلفاؤها عن دنو. عن إيو كثيرة المجتمع, وفي شمال حالية انذار أي. إنطلاق تزامناً بالإنزال و تلك.
-
- إذ دار السفن الخارجية, عل شيء الأسيوي شموليةً, الفترة والإتحاد أن الا. هو الحكم الحكومة حين. تم ليرتفع بأضرار التبرعات مما, حاول ساعة عن يكن. حيث مع حاول أجزاء الهجوم, يتم بـ قبضتهم الفرنسي.
- جُل عن اللا وقوعها،, دنو ثم وترك سكان الشمال, كل ذلك وأزيز والقرى. أم عدد مهمّات الساحل, قد تاريخ أفريقيا الإحتفاظ دول. مدن لبلجيكا، واندونيسيا، كل, مع أسر الشمال الأرضية بالسيطرة. في فقامت والروسية كلّ. عن فعل فسقط استبدال.
-
-
-
- ميزة جديدة
- 14 ديسمبر 2013 بواسطة Jacob
-
- تحت بولندا، مليارات لم. الشهير الإنزال وفي بل, مع قبل واتّجه الخاسر باستخدام. قدما يونيو مواقعها يكن و, سابق أراضي الإكتفاء حتى كل, و جعل مهمّات المتحدة. أخذ عل الثقيل الضروري لإنعدام, دول جيما أراض الدولارات تم. الخاطفة استعملت وباستثناء ثم انه, به، جدول الأهداف ماليزيا، ان. عن هناك الإحتفاظ غير.
- مرجع استدعى بريطانيا ذلك عن, ٣٠ كان ألمّ الشّعبين الأمريكي. دار تغييرات الشرقية التجارية كل, تم يتبقّ للحكومة كلّ. ثمّة الشتاء الساحل و الى, بل أثره، فاتّبع يتم. دون وترك وتنصيب المبرمة ما, هذه عن زهاء استدعى انتصارهم, يعبأ شواطيء الأرضية به، أم. والتي وفرنسا الأولية بـ هذه, قائمة الوزراء ضرب أي.
-
- - بل دفّة فسقط بال, الله تغييرات الرئيسية من مدن. كرسي الأمم ويكيبيديا،.
- - لم عدد يطول جديدة ولاتّساع. أم تلك وحتّى.
- - ذات مئات المشترك بالمحور عن وشعار.
-
- لكل خلاف وترك المؤلّفة بل. ٣٠ حين أواخر أصقاع. بلا مع أوزار النزاع, مع إيطاليا بالرّغم بالمطالبة ومن. ان دول الحرة وقدّموا لتقليعة. الحرة بريطانيا، إذ وصل, الى وقام أجزاء أوراقهم عن. الباهضة الخاسرة حيث و.
-
-
-
-
-
-
-
-
-
حول
-
بل مدن وإعلان بتخصيص إيطاليا. حيث عقبت أساسي وتنامت و, وباءت وايرلندا وقد بـ, مرمى سقطت إحكام يكن و. كل ومن تصفح بالرّغم الاندونيسية. ٣٠ انتباه والروسية كلّ, الوراء ولكسمبورغ عن لكل. الخاصّة والإتحاد لان بل, وقد الهجوم وتنامت و.
-
-
-
-
-
-
-
-
-
-
Title of a longer featured blog post
-
Multiple lines of text that form the lede, informing new readers quickly and efficiently about what’s most interesting in this post’s contents.
-
Continue reading...
-
-
-
-
-
-
World
-
Featured post
-
Nov 12
-
This is a wider card with supporting text below as a natural lead-in to additional content.
-
Continue reading
-
-
- {{< placeholder width="200" height="250" background="#55595c" color="#eceeef" text="Thumbnail" >}}
-
-
-
-
-
-
-
Design
-
Post title
-
Nov 11
-
This is a wider card with supporting text below as a natural lead-in to additional content.
-
Continue reading
-
-
- {{< placeholder width="200" height="250" background="#55595c" color="#eceeef" text="Thumbnail" >}}
-
-
-
-
-
-
- From the Firehose
-
-
-
- Sample blog post
- January 1, 2014 by Mark
-
- This blog post shows a few different types of content that’s supported and styled with Bootstrap. Basic typography, images, and code are all supported.
-
- Yeah, she dances to her own beat. Oh, no. You could've been the greatest. 'Cause, baby, you're a firework. Maybe a reason why all the doors are closed. Open up your heart and just let it begin. So très chic, yeah, she's a classic.
-
- Bikinis, zucchinis, Martinis, no weenies. I know there will be sacrifice but that's the price. This is how we do it. I'm not sticking around to watch you go down. You think you're so rock and roll, but you're really just a joke. I know one spark will shock the world, yeah yeah. Can't replace you with a million rings.
-
- Trying to connect the dots, don't know what to tell my boss. Before you met me I was alright but things were kinda heavy. You just gotta ignite the light and let it shine. Glitter all over the room pink flamingos in the pool.
- Heading
- Suiting up for my crowning battle. If you only knew what the future holds. Bring the beat back. Peach-pink lips, yeah, everybody stares.
- Sub-heading
- You give a hundred reasons why, and you say you're really gonna try. Straight stuntin' yeah we do it like that. Calling out my name. ‘Cause I, I’m capable of anything.
- Example code block
- Before you met me I was alright but things were kinda heavy. You just gotta ignite the light and let it shine.
- Sub-heading
- You got the finest architecture. Passport stamps, she's cosmopolitan. Fine, fresh, fierce, we got it on lock. Never planned that one day I'd be losing you. She eats your heart out.
-
- - Got a motel and built a fort out of sheets.
- - Your kiss is cosmic, every move is magic.
- - Suiting up for my crowning battle.
-
- Takes you miles high, so high, 'cause she’s got that one international smile.
-
- - Scared to rock the boat and make a mess.
- - I could have rewrite your addiction.
- - I know you get me so I let my walls come down.
-
- After a hurricane comes a rainbow.
-
-
-
- Another blog post
- December 23, 2013 by Jacob
-
- I am ready for the road less traveled. Already brushing off the dust. Yeah, you're lucky if you're on her plane. I used to bite my tongue and hold my breath. Uh, She’s a beast. I call her Karma (come back). Black ray-bans, you know she's with the band. I can't sleep let's run away and don't ever look back, don't ever look back.
-
- Growing fast into a bolt of lightning. Be careful Try not to lead her on
-
- I'm intrigued, for a peek, heard it's fascinating. Oh oh! Wanna be a victim ready for abduction. She's got that international smile, oh yeah, she's got that one international smile. Do you ever feel, feel so paper thin. I’m gon’ put her in a coma. Sun-kissed skin so hot we'll melt your popsicle.
- This is transcendental, on another level, boy, you're my lucky star.
-
-
-
- New feature
- December 14, 2013 by Chris
-
- From Tokyo to Mexico, to Rio. Yeah, you take me to utopia. I'm walking on air. We'd make out in your Mustang to Radiohead. I mean the ones, I mean like she's the one. Sun-kissed skin so hot we'll melt your popsicle. Slow cooking pancakes for my boy, still up, still fresh as a Daisy.
-
- - I hope you got a healthy appetite.
- - You're never gonna be unsatisfied.
- - Got a motel and built a fort out of sheets.
-
- Don't need apologies. Boy, you're an alien your touch so foreign, it's supernatural, extraterrestrial. Talk about our future like we had a clue. I can feel a phoenix inside of me.
-
-
-
-
-
-
-
-
-
About
-
Saw you downtown singing the Blues. Watch you circle the drain. Why don't you let me stop by? Heavy is the head that wears the crown. Yes, we make angels cry, raining down on earth from up above.
-
-
-
-
-
-
-
-
-
-
-
-
-
-
-
- {{< placeholder width="100%" height="100%" background="#777" color="#777" text="false" title="false" >}}
-
-
-
عنوان المثال.
-
نهاية الأوضاع ان أضف, هو مما رجوعهم وقدّموا. أي عدد الدمج نهاية وأكثرها, المسرح الباهضة وبولندا حول و, كل أما سياسة أسابيع. مع حيث قُدُماً الكونجرس, بها و خيار ٢٠٠٤, كلا في مكّن وقام. مع يكن زهاء بالفشل, الجوي الصين الشمال إذ على.
-
سجل اليوم
-
-
-
-
- {{< placeholder width="100%" height="100%" background="#777" color="#777" text="false" title="false" >}}
-
-
-
عنوان مثال آخر.
-
ثم تزامناً الفرنسي الإقتصادية دار. لكل عن الضغوط المتّبعة, أن حتى إختار المدن بالإنزال. عن الشمل بالفشل تلك, بل أراض أوزار بلديهما حول. دون لكون والتي ثم, كُلفة ويعزى استطاعوا أن لمّ. جُل بخطوط واحدة البشريةً.
-
أعرف أكثر
-
-
-
-
- {{< placeholder width="100%" height="100%" background="#777" color="#777" text="false" title="false" >}}
-
-
-
واحد أكثر لقياس جيد.
-
قررت العصبة إيطاليا وتم أن, عن سكان وقامت الحكومة وفي. كان بـ اوروبا اليابانية, ثمّة بوابة يتعلّق عل بعض. عدم رئيس الآلاف أن حدى.
-
تصفح المعرض
-
-
-
-
-
-
- السابق
-
-
-
- التالى
-
-
-
-
-
-
- {{< placeholder width="140" height="140" background="#777" color="#777" class="rounded-circle" >}}
-
عنوان
-
ان وتم عجّل الأجل, قبل نتيجة المشترك بـ, أي جعل جورج أوزار المسرح. أن وإعلان الساحل تلك, مكن ان استبدال الباهضة التكاليف. الى ماذا اليميني الحكومة في, إجلاء نتيجة قبل تم. مساعدة بولندا، أي هذه الحكم.
-
عرض التفاصيل
-
-
- {{< placeholder width="140" height="140" background="#777" color="#777" class="rounded-circle" >}}
-
عنوان
-
هو أخر إتفاقية الدولارات الأوروبيّون, ثانية طوكيو و به،, ونتج أعمال مما أم. عن الا يونيو أفريقيا, السيطرة التقليدي ومن ٣٠. هو الغالي الإتفاقية ويكيبيديا، مكن, و الى هُزم اعتداء وايرلندا. وقبل بمباركة الأوروبيّون عن فقد, بتحدّي والفلبين ما كلا.
-
عرض التفاصيل
-
-
- {{< placeholder width="140" height="140" background="#777" color="#777" class="rounded-circle" >}}
-
عنوان
-
غير عن الثقيل وسمّيت الأوضاع, لم تاريخ بالحرب للسيطرة حين, دار اللا تطوير تم. الى بشرية اليابان في. أما الشهيرة الإثنان وايرلندا ما, لإعلان واشتدّت و مدن. في غير والحزب للسيطرة الإكتفاء. ثانية الكونجرس الا من, جُل ٣٠ وبداية الشرقية.
-
عرض التفاصيل
-
-
-
-
-
-
-
-
-
-
-
العنوان الأول المميز. سيذهل عقلك.
-
في التخطيط التجارية هذا, إذ هذه الشمل موالية الخاطفة. أحدث وبدون اتفاق من غير, جعل عل أطراف مشاركة الأعمال. بل الى قادة واحدة, لهيمنة التجارية حتى ثم. هو وبالرغم ابتدعها بال. بوابة ماشاء أما أي, ما وفي أحكم غريمه التقليدية.
-
-
- {{< placeholder width="500" height="500" background="#eee" color="#aaa" class="bd-placeholder-img-lg featurette-image img-fluid mx-auto" >}}
-
-
-
-
-
-
-
-
أوه نعم ، هذا جيد. شاهد بنفسك.
-
صفحة وحرمان الأراضي أم أخذ, قد ذلك الثقيلة المتاخمة وبريطانيا. أخذ أن اللا لإعلان لهيمنة, وفي كل موالية الشّعبين. تكاليف الخاسرة لمّ لم, إذ بحق موالية الثقيلة. العظمى والفلبين تم عرض, جمعت شعار الحرة حيث بل. عرض و وترك اللازمة.
-
-
- {{< placeholder width="500" height="500" background="#eee" color="#aaa" class="bd-placeholder-img-lg featurette-image img-fluid mx-auto" >}}
-
-
-
-
-
-
-
-
وأخيرًا ، هذا. كش ملك.
-
تحرّك أراضي هذا عن, كرسي وكسبت يتم بل. بحق بل القوى وفنلندا, الجو واُسدل التكاليف وتم تم, بسبب ا السادس كان أن. وبعد ميناء من بلا, تصفح يتبقّ تلك هو. ان دول بخطوط وإعلان ومطالبة, المزيفة الأوروبية، عل حدى قام.
-
-
- {{< placeholder width="500" height="500" background="#eee" color="#aaa" class="bd-placeholder-img-lg featurette-image img-fluid mx-auto" >}}
-
-
-
-
-
-
-
-
more */
-}
-
-/* Thin out the marketing headings */
-.featurette-heading {
- font-weight: 300;
- line-height: 1;
-}
-
-
-/* RESPONSIVE CSS
--------------------------------------------------- */
-
-@media (min-width: 40em) {
- /* Bump up size of carousel content */
- .carousel-caption p {
- margin-bottom: 1.25rem;
- font-size: 1.25rem;
- line-height: 1.4;
- }
-
- .featurette-heading {
- font-size: 50px;
- }
-}
-
-@media (min-width: 62em) {
- .featurette-heading {
- margin-top: 7rem;
- }
-}
diff --git a/site/content/docs/5.0/examples/carousel/index.html b/site/content/docs/5.0/examples/carousel/index.html
deleted file mode 100644
index 2c0bc5129..000000000
--- a/site/content/docs/5.0/examples/carousel/index.html
+++ /dev/null
@@ -1,166 +0,0 @@
----
-layout: examples
-title: Carousel Template
-extra_css:
- - "carousel.css"
----
-
-
-
-
-
-
-
-
-
-
-
-
-
- {{< placeholder width="100%" height="100%" background="#777" color="#777" text="false" title="false" >}}
-
-
-
Example headline.
-
Some representative placeholder content for the first slide of the carousel.
-
Sign up today
-
-
-
-
- {{< placeholder width="100%" height="100%" background="#777" color="#777" text="false" title="false" >}}
-
-
-
Another example headline.
-
Some representative placeholder content for the second slide of the carousel.
-
Learn more
-
-
-
-
- {{< placeholder width="100%" height="100%" background="#777" color="#777" text="false" title="false" >}}
-
-
-
One more for good measure.
-
Some representative placeholder content for the third slide of this carousel.
-
Browse gallery
-
-
-
-
-
-
- Previous
-
-
-
- Next
-
-
-
-
-
-
- {{< placeholder width="140" height="140" background="#777" color="#777" class="rounded-circle" >}}
-
Heading
-
Some representative placeholder content for the three columns of text below the carousel. This is the first column.
-
View details »
-
-
- {{< placeholder width="140" height="140" background="#777" color="#777" class="rounded-circle" >}}
-
Heading
-
Another exciting bit of representative placeholder content. This time, we've moved on to the second column.
-
View details »
-
-
- {{< placeholder width="140" height="140" background="#777" color="#777" class="rounded-circle" >}}
-
Heading
-
And lastly this, the third column of representative placeholder content.
-
View details »
-
-
-
-
-
-
-
-
-
-
-
First featurette heading. It’ll blow your mind.
-
Some great placeholder content for the first featurette here. Imagine some exciting prose here.
-
-
- {{< placeholder width="500" height="500" background="#eee" color="#aaa" class="bd-placeholder-img-lg featurette-image img-fluid mx-auto" >}}
-
-
-
-
-
-
-
-
Oh yeah, it’s that good. See for yourself.
-
Another featurette? Of course. More placeholder content here to give you an idea of how this layout would work with some actual real-world content in place.
-
-
- {{< placeholder width="500" height="500" background="#eee" color="#aaa" class="bd-placeholder-img-lg featurette-image img-fluid mx-auto" >}}
-
-
-
-
-
-
-
-
And lastly, this one. Checkmate.
-
And yes, this is the last block of representative placeholder content. Again, not really intended to be actually read, simply here to give you a better view of what this would look like with some actual content. Your content.
-
-
- {{< placeholder width="500" height="500" background="#eee" color="#aaa" class="bd-placeholder-img-lg featurette-image img-fluid mx-auto" >}}
-
-
-
-
-
-
-
-
-
- محتويات
-
-
-
-
-
- {{< example show_markup="false" >}}
-
العرض 1
-
العرض 2
-
العرض 3
-
العرض 4
-
العرض 5
-
العرض 6
- {{< /example >}}
-
- {{< example show_markup="false" >}}
-
عنوان 1
-
عنوان 2
-
عنوان 3
-
عنوان 4
-
عنوان 5
-
عنوان 6
- {{< /example >}}
-
- {{< example show_markup="false" >}}
-
- حيث وبدون الساحة وقوعها، أي, فقد عل مكّن تمهيد قتيل،. ولم والحزب الشرقي و, أضف بالفشل الخاسر استمرار ان. كل أما وحرمان للإتحاد, ٣٠ سبتمبر استعملت جهة, لعملة الثقيلة المتاخمة على لم. أي نفس دارت والفلبين.
-
- {{< /example >}}
-
- {{< example show_markup="false" >}}
-
يمكنك استخدام علامة العلامة لتحديد نص .
-
من المفترض أن يتم التعامل مع هذا السطر كنص محذوف.
-
من المفترض أن يتم التعامل مع هذا السطر على أنه لم يعد دقيقًا.
-
من المفترض أن يتم التعامل مع هذا السطر كإضافة إلى المستند.
-
سيتم عرض هذا السطر كما هو مسطر.
-
من المفترض أن يتم التعامل مع هذا السطر على أنه طباعة جيدة.
-
تم تقديم هذا السطر كنص عريض.
-
تم تقديم هذا السطر كنص مائل.
- {{< /example >}}
-
- {{< example show_markup="false" >}}
-
- بين كرسي والمعدات بالولايات تم. الذود اتّجة التقليدية يتم و, حيث وقرى.
-
-
- {{< /example >}}
-
- {{< example show_markup="false" >}}
-
- - معقل الطريق واقتصار أم قام.
- - أمّا ولكسمبورغ ثم جُل, هو.
- - ان وبحلول لمحاكم الخارجية ومن.
- - بها بل العظمى إيطاليا الساحلية.
- - مدن قد وبحلول وأكثرها الدنمارك.
-
- - به، المشترك إتفاقية.
- - لإعادة الواقعة و.
- - وترك وانتهاءً ضرب.
- - الشتاء العالم، أي.
-
-
- - ودول يتسنّى بتطويق لمّ في.
- - بعض و مرمى يتسنّى, في.
- - أسيا اعلان ومحاولة عل انه.
-
- {{< /example >}}
-
- {{< example show_markup="false" >}}
-
- - لمّ مع.
- - أم دون.
- - ذات بل.
-
- {{< /example >}}
-
- {{< example show_markup="false" >}}
- {{< placeholder width="100%" height="250" class="bd-placeholder-img-lg img-fluid" text="صورة مستجيبة" >}}
- {{< /example >}}
-
- {{< example show_markup="false" >}}
- {{< placeholder width="200" height="200" class="img-thumbnail" title="صورة عنصر نائب مربع عام مع حدود بيضاء حولها ، مما يجعلها تشبه صورة تم التقاطها بكاميرا فورية قديمة" >}}
- {{< /example >}}
-
-
-
-
-
-
- {{< example show_markup="false" >}}
-
-
-
- | # |
- الاسم الاول |
- الكنية |
- اسم مستعار |
-
-
-
-
- | 1 |
- Mark |
- Otto |
- @mdo |
-
-
- | 2 |
- Jacob |
- Thornton |
- @fat |
-
-
- | 3 |
- Larry the Bird |
- @twitter |
-
-
-
- {{< /example >}}
-
- {{< example show_markup="false" >}}
-
-
-
- | # |
- الاسم الاول |
- الكنية |
- اسم مستعار |
-
-
-
-
- | 1 |
- Mark |
- Otto |
- @mdo |
-
-
- | 2 |
- Jacob |
- Thornton |
- @fat |
-
-
- | 3 |
- Larry the Bird |
- @twitter |
-
-
-
- {{< /example >}}
-
- {{< example show_markup="false" >}}
-
-
-
- | Class |
- عنوان |
- عنوان |
-
-
-
-
- | Default |
- زنزانة |
- زنزانة |
-
- {{< table.inline >}}
- {{- range (index $.Site.Data "theme-colors") }}
-
- | {{ .name | title }} |
- زنزانة |
- زنزانة |
-
- {{- end -}}
- {{< /table.inline >}}
-
-
- {{< /example >}}
-
- {{< example show_markup="false" >}}
-
-
-
- | # |
- الاسم الاول |
- الكنية |
- اسم مستعار |
-
-
-
-
- | 1 |
- Mark |
- Otto |
- @mdo |
-
-
- | 2 |
- Jacob |
- Thornton |
- @fat |
-
-
- | 3 |
- Larry the Bird |
- @twitter |
-
-
-
- {{< /example >}}
-
- {{< example show_markup="false" >}}
-
- {{< placeholder width="400" height="300" class="figure-img img-fluid rounded" >}}
- شرح للصورة أعلاه.
-
- {{< /example >}}
-
-
-
-
-
-
-
- مكونات
-
-
-
-
-
- {{< example show_markup="false" >}}
-
-
-
-
-
- أخر جمعت اليها وحرمان بـ, لمّ حالية الربيع، ثم, بل حين سكان الأراضي. من سكان الإتفاقية عدم, بقصف واعتلاء بل جهة, ولم وبعد المؤلّفة هو. أمدها واقتصار ويكيبيديا إذ بعد, الطرفين والعتاد عل قبل. أدنى المؤلّفة إذ عدم, وبعد الثالث في جهة.
-
-
-
-
-
-
-
- أخر جمعت اليها وحرمان بـ, لمّ حالية الربيع، ثم, بل حين سكان الأراضي. من سكان الإتفاقية عدم, بقصف واعتلاء بل جهة, ولم وبعد المؤلّفة هو. أمدها واقتصار ويكيبيديا إذ بعد, الطرفين والعتاد عل قبل. أدنى المؤلّفة إذ عدم, وبعد الثالث في جهة.
-
-
-
-
-
-
-
- أخر جمعت اليها وحرمان بـ, لمّ حالية الربيع، ثم, بل حين سكان الأراضي. من سكان الإتفاقية عدم, بقصف واعتلاء بل جهة, ولم وبعد المؤلّفة هو. أمدها واقتصار ويكيبيديا إذ بعد, الطرفين والعتاد عل قبل. أدنى المؤلّفة إذ عدم, وبعد الثالث في جهة.
-
-
-
-
- {{< /example >}}
-
- {{< example show_markup="false" >}}
- {{< alerts.inline >}}
- {{- range (index $.Site.Data "theme-colors") }}
-
- تنبيه {{ .name }} بسيط مع
رابط مثال. أعطها نقرة إذا أردت.
-
-
{{ end -}}
- {{< /alerts.inline >}}
- {{< /example >}}
-
- {{< example show_markup="false" >}}
-
-
أحسنت!
-
لقد نجحت في قراءة رسالة التنبيه المهمة هذه. سيتم تشغيل نص المثال هذا لفترة أطول قليلاً حتى تتمكن من رؤية كيفية عمل التباعد داخل التنبيه مع هذا النوع من المحتوى.
-
-
كلما احتجت إلى ذلك ، تأكد من استخدام أدوات الهامش للحفاظ على الأشياء لطيفة ومرتبة.
-
- {{< /example >}}
-
- {{< example show_markup="false" >}}
-
عنوان المثال جديد
-
عنوان المثال جديد
-
عنوان المثال جديد
-
عنوان المثال جديد
-
عنوان المثال جديد
-
عنوان المثال جديد
-
عنوان المثال جديد
-
عنوان المثال جديد
- {{< /example >}}
-
- {{< example show_markup="false" >}}
- {{< badge.inline >}}
- {{- range (index $.Site.Data "theme-colors") }}
-
{{ .name | title }}{{- end -}}
- {{< /badge.inline >}}
- {{< /example >}}
-
- {{< example show_markup="false" >}}
-
- {{< /example >}}
-
- {{< example show_markup="false" >}}
- {{< buttons.inline >}}
- {{- range (index $.Site.Data "theme-colors") }}
-
- {{- end -}}
- {{< /buttons.inline >}}
-
-
- {{< /example >}}
-
- {{< example show_markup="false" >}}
- {{< buttons.inline >}}
- {{- range (index $.Site.Data "theme-colors") }}
-
- {{- end -}}
- {{< /buttons.inline >}}
- {{< /example >}}
-
- {{< example show_markup="false" >}}
-
-
-
- {{< /example >}}
-
-
-
-
-
-
- {{< example show_markup="false" >}}
-
- {{< /example >}}
-
- {{< example show_markup="false" >}}
-
-
-
- {{< placeholder width="100%" height="180" class="card-img-top" text="غطاء الصورة" >}}
-
-
عنوان البطاقة
-
بعض الأمثلة السريعة للنصوص للبناء على عنوان البطاقة وتشكيل الجزء الأكبر من محتوى البطاقة.
-
اذهب لمكان ما
-
-
-
-
-
-
-
-
عنوان البطاقة
-
بعض الأمثلة السريعة للنصوص للبناء على عنوان البطاقة وتشكيل الجزء الأكبر من محتوى البطاقة.
-
اذهب لمكان ما
-
-
-
-
-
-
-
-
عنوان البطاقة
-
بعض الأمثلة السريعة للنصوص للبناء على عنوان البطاقة وتشكيل الجزء الأكبر من محتوى البطاقة.
-
-
- - أسر كل أراض.
- - شرسة مشارف واستمرت.
- - مكن إذ كانتا.
-
-
-
-
-
-
-
-
- {{< placeholder width="100%" height="250" text="صورة" >}}
-
-
-
-
عنوان البطاقة
-
هذه بطاقة أوسع مع نص داعم أدناه كمقدمة طبيعية لمحتوى إضافي. هذا المحتوى أطول قليلاً.
-
آخر تحديث منذ 3 دقائق
-
-
-
-
-
-
- {{< /example >}}
-
- {{< example show_markup="false" >}}
-
-
-
-
-
-
-
-
- {{< placeholder width="800" height="400" class="bd-placeholder-img-lg d-block w-100" color="#555" background="#777" text="الشريحة الأولى" >}}
-
-
تسمية الشريحة الأولى
-
إستعمل تحرّكت المتحدة كان ما. لم وفي الشرقي المتاخمة تعد.
-
-
-
- {{< placeholder width="800" height="400" class="bd-placeholder-img-lg d-block w-100" color="#444" background="#666" text="الشريحة الثانية" >}}
-
-
تسمية الشريحة الثانية
-
أجزاء الخاسرة التّحول ٣٠ انه, وصل أن عالمية التحالف التجارية.
-
-
-
- {{< placeholder width="800" height="400" class="bd-placeholder-img-lg d-block w-100" color="#333" background="#555" text="الشريحة الثالثة" >}}
-
-
تسمية الشريحة الثالثة
-
ان فقد ترتيب والديون. وتتحمّل الحيلولة أخذ قد. ضرب بل.
-
-
-
-
-
- السابق
-
-
-
- التالى
-
-
- {{< /example >}}
-
- {{< example show_markup="false" >}}
-
-
-
-
-
-
-
-
-
-
-
-
-
-
- {{< /example >}}
-
- {{< example show_markup="false" >}}
-
-
-
-
-
-
-
-
-
-
-
-
-
-
-
-
-
-
-
-
-
-
-
-
-
-
-
-
-
-
- {{< /example >}}
-
- {{< example show_markup="false" >}}
-
-
-
-
-
-
-
-
-
-
-
-
-
-
- {{< /example >}}
-
- {{< example show_markup="false" >}}
-
- {{< /example >}}
-
- {{< example show_markup="false" >}}
-
- - الفرنسية الأثناء، أي.
- - كلّ في تعداد.
- - وتم الأخذ أساسي.
- - لدحر بشرية ابتدعها.
- - لكون أسيا ولاتّساع.
-
- {{< /example >}}
-
- {{< example show_markup="false" >}}
-
- - الفرنسية الأثناء، أي.
- - كلّ في تعداد.
- - وتم الأخذ أساسي.
- - لدحر بشرية ابتدعها.
- - لكون أسيا ولاتّساع.
-
- {{< /example >}}
-
- {{< example show_markup="false" >}}
-
- {{< /example >}}
-
- {{< example show_markup="false" >}}
-
-
-
-
-
-
- {{< /example >}}
-
- {{< example show_markup="false" >}}
-
- {{< /example >}}
-
- {{< example show_markup="false" >}}
-
-
-
-
هو أسيا والإتحاد أضف, فشكّل الإتفاقية ذلك في. اكتوبر والعتاد و لمّ, وفي أم ٢٠٠٤ وإقامة الانجليزية. وجزر المضي التقليدي ان أما. كلا لإنعدام استراليا، بـ, ٣٠ أضف بوابة أوزار مساعدة. ما السيطرة الأرضية دار, هو بال الساحة الموسوعة.
-
-
-
بفرض البشريةً ذلك أي, ٣٠ تنفّس ليركز الإطلاق جُل. يكن ألمّ أمام في. بفرض الصينية الخاسرة هو لها. ومن معاملة وحلفاؤها كل. بلا يعادل العظمى مع. بـ بحث وجزر الصعداء الأعمال, لكون نتيجة هذا من. مع ثانية أوروبا بحث, كلّ بتطويق واستمرت أن.
-
-
-
- {{< /example >}}
-
- {{< example show_markup="false" >}}
-
- {{< /example >}}
-
- {{< example show_markup="false" >}}
-
-
-
- {{< /example >}}
-
- {{< example show_markup="false" >}}
-
- {{< /example >}}
-
- {{< example show_markup="false" >}}
-
-
-
-
- {{< /example >}}
-
-
-
-
-
-
- {{< example show_markup="false" >}}
-
-
-
-
-
- {{< /example >}}
-
- {{< example show_markup="false" >}}
-
- {{< /example >}}
-
-
-
-
-
@fat
-
إنطلاق العالمي ما هذه, لم فسقط عُقر الهادي جُل. بعد ٣٠ شرسة النزاع اليميني. عن بحث اتّجة الصينية, مع وأزيز الفرنسية مدن, عدد مرجع العالمية لبلجيكا، أن. طوكيو أعلنت حيث بل. الأخذ واندونيسيا، إذ ذلك, به، قد معاملة وقوعها،. ولم التي إبّان بالفشل ٣٠, جنوب مشاركة حيث أم.
-
@mdo
-
بل الشتاء، بمحاولة جُل, فعل ببعض الأراضي مع. أما لم الأولى تكاليف, في بحشد جنوب الدول دون. في لمحاكم الإنزال تلك, أي بين الصفحة النزاع. عن دول فسقط احداث. وباءت التقليدي أم حيث, دنو ماذا واستمرت بل, غير ٣٠ بقعة هناك وفنلندا.
-
واحد
-
وزارة العاصمة الأوربيين حتى بـ. إذ دول مقاطعة بالرغم الأوروبي, كلّ هو نهاية لبولندا،, إذ مما ماشاء إتفاقية. إذ جهة تسبب وانتهاءً, تم تعد الذود أعلنت الأمريكية. ضرب نقطة حالية أن, ثم مارد للصين جديداً بين, بعد بل العظمى ابتدعها والفرنسي. ثم جعل يذكر ووصف, أثره، وعُرفت هو كان, بها قُدُماً البولندي ان. العالمي الجديدة، الفرنسية عرض كل.
-
اثنان
-
إذ قِبل أعلنت عرض. ما به، هاربر قتيل، الإكتفاء, أوزار المنتصر لبولندا، بلا بـ. وبدون بزمام وبحلول جُل أن, مكن أي لعدم مشارف. تم أخر دفّة وصغار وبالتحديد،, وقد اعلان العالم واشتدّت عن. أي حين الأولية لبولندا،, كما مايو وحتّى فرنسا ثم.
-
ثلاثة
-
لم هذا تسمّى إعادة مليون, ان يذكر فرنسا كما. إذ الدول الشتوية وأكثرها مدن. عرض بفرض بتحدّي الأوضاع تم. أحدث شاسعة تكبّد أخر من, ٣٠ حتى الخاطفة العالمية, هناك عالمية وقد لم. بشرية إتفاقية عل جهة, كل هُزم كانتا ضرب.
-
أن كلّ صفحة إعادة الأمريكية. بحث تشكيل ويعزى وتزويده بل. وحتّى وإعلان أن دار, من مكّن الصينية المشتّتون مكن, وبحلول للمجهود الأمريكي أن بحق. أم جهة وجهان الأرض.
-
-
-
- {{< example show_markup="false" >}}
- {{< spinner.inline >}}
- {{- range (index $.Site.Data "theme-colors") }}
-
- جار التحميل...
-
- {{- end -}}
- {{< /spinner.inline >}}
- {{< /example >}}
-
- {{< example show_markup="false" >}}
- {{< spinner.inline >}}
- {{- range (index $.Site.Data "theme-colors") }}
-
- جار التحميل...
-
- {{- end -}}
- {{< /spinner.inline >}}
- {{< /example >}}
-
- {{< example show_markup="false" class="bg-dark p-5 align-items-center" >}}
-
-
-
- مرحبا بالعالم! هذه رسالة نخب.
-
-
- {{< /example >}}
-
- {{< example show_markup="false" class="tooltip-demo" >}}
-
-
-
-
-
- {{< /example >}}
-
-
-
-
-
-
-
-
-
لن أغلق إذا نقرت خارج لي. لا تحاول حتى الضغط على مفتاح الهروب.
-
-
-
-
-
-
-
-
-
-
علاقة الشمال والفرنسي لها أن. المحيط الشهيرة البولندي دون أي, لم على مليون الثالث، بالسيطرة, نفس ان واحدة المجتمع والكوري. أي أثره، الأمم دار, مع وسفن وقام سكان انه. كان بهيئة الإمداد هو, بينما تطوير يعادل هذه بل, قد خيار يقوم أعلنت بلا. ما مسرح ٢٠٠٤ عدم, حصدت الصفحة المؤلّفة أخذ هو. هذا عل الدول الفرنسية, معقل مهمّات إذ مدن. تجهيز ألمانيا دار بل.
-
لان تم بسبب مئات الفترة. جهة تنفّس المشترك ٣٠, وباءت اوروبا دنو لم, أم جعل كرسي إختار وبريطانيا. مما رئيس الله الأثناء، ٣٠, الأمم الشتاء البولندي بين في, دول ان حلّت الأوروبيّون. بوابة العصبة البرية هو تحت, أضف أم الجوي أراضي, مدن العظمى قُدُماً ايطاليا، هو. حدى ثم تنفّس كنقطة, أن أما اعتداء واُسدل بالجانب.
-
انتهت اكتوبر واندونيسيا، حين بـ. غير بالرغم التقليدي في, و أما بزمام ا لإنعدام. هو كُلفة وانتهاءً حول. جُل مكّن الصين ان, ترتيب الأجل أوراقهم لها كل.
-
هذا وبعض قِبل من, هو ميناء فهرست قبضتهم يبق. كانت لهيمنة للإتحاد على إذ, بحشد مسرح بها أن. قد ومن الأوضاع اليابان للإتحاد, و قررت المارق عرض, أواخر محاولات بها قد. مايو لهيمنة بريطانيا مدن بل.
-
وفي الثالث، الإثنان من, أم وعلى مهمّات على, بـ فرنسية بولندا، لها. لمّ ان قامت تعديل المدن, ٣٠ لمحاكم المعاهدات إيو. كثيرة أدوات ويكيبيديا و بها, أم جدول العصبة بحث. أساسي معارضة بـ هذه, شيء مسرح واتّجه الشّعبين ٣٠. بينما واحدة إذ لمّ.
-
علاقة الشمال والفرنسي لها أن. المحيط الشهيرة البولندي دون أي, لم على مليون الثالث، بالسيطرة, نفس ان واحدة المجتمع والكوري. أي أثره، الأمم دار, مع وسفن وقام سكان انه. كان بهيئة الإمداد هو, بينما تطوير يعادل هذه بل, قد خيار يقوم أعلنت بلا. ما مسرح ٢٠٠٤ عدم, حصدت الصفحة المؤلّفة أخذ هو. هذا عل الدول الفرنسية, معقل مهمّات إذ مدن. تجهيز ألمانيا دار بل.
-
لان تم بسبب مئات الفترة. جهة تنفّس المشترك ٣٠, وباءت اوروبا دنو لم, أم جعل كرسي إختار وبريطانيا. مما رئيس الله الأثناء، ٣٠, الأمم الشتاء البولندي بين في, دول ان حلّت الأوروبيّون. بوابة العصبة البرية هو تحت, أضف أم الجوي أراضي, مدن العظمى قُدُماً ايطاليا، هو. حدى ثم تنفّس كنقطة, أن أما اعتداء واُسدل بالجانب.
-
انتهت اكتوبر واندونيسيا، حين بـ. غير بالرغم التقليدي في, و أما بزمام ا لإنعدام. هو كُلفة وانتهاءً حول. جُل مكّن الصين ان, ترتيب الأجل أوراقهم لها كل.
-
هذا وبعض قِبل من, هو ميناء فهرست قبضتهم يبق. كانت لهيمنة للإتحاد على إذ, بحشد مسرح بها أن. قد ومن الأوضاع اليابان للإتحاد, و قررت المارق عرض, أواخر محاولات بها قد. مايو لهيمنة بريطانيا مدن بل.
-
وفي الثالث، الإثنان من, أم وعلى مهمّات على, بـ فرنسية بولندا، لها. لمّ ان قامت تعديل المدن, ٣٠ لمحاكم المعاهدات إيو. كثيرة أدوات ويكيبيديا و بها, أم جدول العصبة بحث. أساسي معارضة بـ هذه, شيء مسرح واتّجه الشّعبين ٣٠. بينما واحدة إذ لمّ.
-
علاقة الشمال والفرنسي لها أن. المحيط الشهيرة البولندي دون أي, لم على مليون الثالث، بالسيطرة, نفس ان واحدة المجتمع والكوري. أي أثره، الأمم دار, مع وسفن وقام سكان انه. كان بهيئة الإمداد هو, بينما تطوير يعادل هذه بل, قد خيار يقوم أعلنت بلا. ما مسرح ٢٠٠٤ عدم, حصدت الصفحة المؤلّفة أخذ هو. هذا عل الدول الفرنسية, معقل مهمّات إذ مدن. تجهيز ألمانيا دار بل.
-
لان تم بسبب مئات الفترة. جهة تنفّس المشترك ٣٠, وباءت اوروبا دنو لم, أم جعل كرسي إختار وبريطانيا. مما رئيس الله الأثناء، ٣٠, الأمم الشتاء البولندي بين في, دول ان حلّت الأوروبيّون. بوابة العصبة البرية هو تحت, أضف أم الجوي أراضي, مدن العظمى قُدُماً ايطاليا، هو. حدى ثم تنفّس كنقطة, أن أما اعتداء واُسدل بالجانب.
-
انتهت اكتوبر واندونيسيا، حين بـ. غير بالرغم التقليدي في, و أما بزمام ا لإنعدام. هو كُلفة وانتهاءً حول. جُل مكّن الصين ان, ترتيب الأجل أوراقهم لها كل.
-
هذا وبعض قِبل من, هو ميناء فهرست قبضتهم يبق. كانت لهيمنة للإتحاد على إذ, بحشد مسرح بها أن. قد ومن الأوضاع اليابان للإتحاد, و قررت المارق عرض, أواخر محاولات بها قد. مايو لهيمنة بريطانيا مدن بل.
-
وفي الثالث، الإثنان من, أم وعلى مهمّات على, بـ فرنسية بولندا، لها. لمّ ان قامت تعديل المدن, ٣٠ لمحاكم المعاهدات إيو. كثيرة أدوات ويكيبيديا و بها, أم جدول العصبة بحث. أساسي معارضة بـ هذه, شيء مسرح واتّجه الشّعبين ٣٠. بينما واحدة إذ لمّ.
-
علاقة الشمال والفرنسي لها أن. المحيط الشهيرة البولندي دون أي, لم على مليون الثالث، بالسيطرة, نفس ان واحدة المجتمع والكوري. أي أثره، الأمم دار, مع وسفن وقام سكان انه. كان بهيئة الإمداد هو, بينما تطوير يعادل هذه بل, قد خيار يقوم أعلنت بلا. ما مسرح ٢٠٠٤ عدم, حصدت الصفحة المؤلّفة أخذ هو. هذا عل الدول الفرنسية, معقل مهمّات إذ مدن. تجهيز ألمانيا دار بل.
-
لان تم بسبب مئات الفترة. جهة تنفّس المشترك ٣٠, وباءت اوروبا دنو لم, أم جعل كرسي إختار وبريطانيا. مما رئيس الله الأثناء، ٣٠, الأمم الشتاء البولندي بين في, دول ان حلّت الأوروبيّون. بوابة العصبة البرية هو تحت, أضف أم الجوي أراضي, مدن العظمى قُدُماً ايطاليا، هو. حدى ثم تنفّس كنقطة, أن أما اعتداء واُسدل بالجانب.
-
انتهت اكتوبر واندونيسيا، حين بـ. غير بالرغم التقليدي في, و أما بزمام ا لإنعدام. هو كُلفة وانتهاءً حول. جُل مكّن الصين ان, ترتيب الأجل أوراقهم لها كل.
-
هذا وبعض قِبل من, هو ميناء فهرست قبضتهم يبق. كانت لهيمنة للإتحاد على إذ, بحشد مسرح بها أن. قد ومن الأوضاع اليابان للإتحاد, و قررت المارق عرض, أواخر محاولات بها قد. مايو لهيمنة بريطانيا مدن بل.
-
-
-
-
-
-
- Contents
-
-
-
-
-
- {{< example show_markup="false" >}}
-
Display 1
-
Display 2
-
Display 3
-
Display 4
-
Display 5
-
Display 6
- {{< /example >}}
-
- {{< example show_markup="false" >}}
-
Heading 1
-
Heading 2
-
Heading 3
-
Heading 4
-
Heading 5
-
Heading 6
- {{< /example >}}
-
- {{< example show_markup="false" >}}
-
- This is a lead paragraph. It stands out from regular paragraphs.
-
- {{< /example >}}
-
- {{< example show_markup="false" >}}
-
You can use the mark tag to highlight text.
-
This line of text is meant to be treated as deleted text.
-
This line of text is meant to be treated as no longer accurate.
-
This line of text is meant to be treated as an addition to the document.
-
This line of text will render as underlined.
-
This line of text is meant to be treated as fine print.
-
This line rendered as bold text.
-
This line rendered as italicized text.
- {{< /example >}}
-
- {{< example show_markup="false" >}}
-
- A well-known quote, contained in a blockquote element.
-
-
- {{< /example >}}
-
- {{< example show_markup="false" >}}
-
- - This is a list.
- - It appears completely unstyled.
- - Structurally, it's still a list.
- - However, this style only applies to immediate child elements.
- - Nested lists:
-
- - are unaffected by this style
- - will still show a bullet
- - and have appropriate left margin
-
-
- - This may still come in handy in some situations.
-
- {{< /example >}}
-
- {{< example show_markup="false" >}}
-
- - This is a list item.
- - And another one.
- - But they're displayed inline.
-
- {{< /example >}}
-
- {{< example show_markup="false" >}}
- {{< placeholder width="100%" height="250" class="bd-placeholder-img-lg img-fluid" text="Responsive image" >}}
- {{< /example >}}
-
- {{< example show_markup="false" >}}
- {{< placeholder width="200" height="200" class="img-thumbnail" title="A generic square placeholder image with a white border around it, making it resemble a photograph taken with an old instant camera" >}}
- {{< /example >}}
-
-
-
-
-
-
- {{< example show_markup="false" >}}
-
-
-
- | # |
- First |
- Last |
- Handle |
-
-
-
-
- | 1 |
- Mark |
- Otto |
- @mdo |
-
-
- | 2 |
- Jacob |
- Thornton |
- @fat |
-
-
- | 3 |
- Larry the Bird |
- @twitter |
-
-
-
- {{< /example >}}
-
- {{< example show_markup="false" >}}
-
-
-
- | # |
- First |
- Last |
- Handle |
-
-
-
-
- | 1 |
- Mark |
- Otto |
- @mdo |
-
-
- | 2 |
- Jacob |
- Thornton |
- @fat |
-
-
- | 3 |
- Larry the Bird |
- @twitter |
-
-
-
- {{< /example >}}
-
- {{< example show_markup="false" >}}
-
-
-
- | Class |
- Heading |
- Heading |
-
-
-
-
- | Default |
- Cell |
- Cell |
-
- {{< table.inline >}}
- {{- range (index $.Site.Data "theme-colors") }}
-
- | {{ .name | title }} |
- Cell |
- Cell |
-
- {{- end -}}
- {{< /table.inline >}}
-
-
- {{< /example >}}
-
- {{< example show_markup="false" >}}
-
-
-
- | # |
- First |
- Last |
- Handle |
-
-
-
-
- | 1 |
- Mark |
- Otto |
- @mdo |
-
-
- | 2 |
- Jacob |
- Thornton |
- @fat |
-
-
- | 3 |
- Larry the Bird |
- @twitter |
-
-
-
- {{< /example >}}
-
- {{< example show_markup="false" >}}
-
- {{< placeholder width="400" height="300" class="figure-img img-fluid rounded" >}}
- A caption for the above image.
-
- {{< /example >}}
-
-
-
-
-
-
-
- Components
-
-
-
-
-
- {{< example show_markup="false" >}}
-
-
-
-
-
- This is the first item's accordion body. It is hidden by default, until the collapse plugin adds the appropriate classes that we use to style each element. These classes control the overall appearance, as well as the showing and hiding via CSS transitions. You can modify any of this with custom CSS or overriding our default variables. It's also worth noting that just about any HTML can go within the .accordion-body, though the transition does limit overflow.
-
-
-
-
-
-
-
- This is the second item's accordion body. It is hidden by default, until the collapse plugin adds the appropriate classes that we use to style each element. These classes control the overall appearance, as well as the showing and hiding via CSS transitions. You can modify any of this with custom CSS or overriding our default variables. It's also worth noting that just about any HTML can go within the .accordion-body, though the transition does limit overflow.
-
-
-
-
-
-
-
- This is the third item's accordion body. It is hidden by default, until the collapse plugin adds the appropriate classes that we use to style each element. These classes control the overall appearance, as well as the showing and hiding via CSS transitions. You can modify any of this with custom CSS or overriding our default variables. It's also worth noting that just about any HTML can go within the .accordion-body, though the transition does limit overflow.
-
-
-
-
- {{< /example >}}
-
- {{< example show_markup="false" >}}
- {{< alerts.inline >}}
- {{- range (index $.Site.Data "theme-colors") }}
-
- A simple {{ .name }} alert with
an example link. Give it a click if you like.
-
-
{{ end -}}
- {{< /alerts.inline >}}
- {{< /example >}}
-
- {{< example show_markup="false" >}}
-
-
Well done!
-
Aww yeah, you successfully read this important alert message. This example text is going to run a bit longer so that you can see how spacing within an alert works with this kind of content.
-
-
Whenever you need to, be sure to use margin utilities to keep things nice and tidy.
-
- {{< /example >}}
-
- {{< example show_markup="false" >}}
-
Example heading New
-
Example heading New
-
Example heading New
-
Example heading New
-
Example heading New
-
Example heading New
-
Example heading New
-
Example heading New
- {{< /example >}}
-
- {{< example show_markup="false" >}}
- {{< badge.inline >}}
- {{- range (index $.Site.Data "theme-colors") }}
-
{{ .name | title }}{{- end -}}
- {{< /badge.inline >}}
- {{< /example >}}
-
- {{< example show_markup="false" >}}
-
- {{< /example >}}
-
- {{< example show_markup="false" >}}
- {{< buttons.inline >}}
- {{- range (index $.Site.Data "theme-colors") }}
-
- {{- end -}}
- {{< /buttons.inline >}}
-
-
- {{< /example >}}
-
- {{< example show_markup="false" >}}
- {{< buttons.inline >}}
- {{- range (index $.Site.Data "theme-colors") }}
-
- {{- end -}}
- {{< /buttons.inline >}}
- {{< /example >}}
-
- {{< example show_markup="false" >}}
-
-
-
- {{< /example >}}
-
-
-
-
-
-
- {{< example show_markup="false" >}}
-
- {{< /example >}}
-
- {{< example show_markup="false" >}}
-
-
-
- {{< placeholder width="100%" height="180" class="card-img-top" text="Image cap" >}}
-
-
Card title
-
Some quick example text to build on the card title and make up the bulk of the card's content.
-
Go somewhere
-
-
-
-
-
-
-
-
Card title
-
Some quick example text to build on the card title and make up the bulk of the card's content.
-
Go somewhere
-
-
-
-
-
-
-
-
Card title
-
Some quick example text to build on the card title and make up the bulk of the card's content.
-
-
- - An item
- - A second item
- - A third item
-
-
-
-
-
-
-
-
- {{< placeholder width="100%" height="250" text="Image" >}}
-
-
-
-
Card title
-
This is a wider card with supporting text below as a natural lead-in to additional content. This content is a little bit longer.
-
Last updated 3 mins ago
-
-
-
-
-
-
- {{< /example >}}
-
- {{< example show_markup="false" >}}
-
-
-
-
-
-
-
-
- {{< placeholder width="800" height="400" class="bd-placeholder-img-lg d-block w-100" color="#555" background="#777" text="First slide" >}}
-
-
First slide label
-
Some representative placeholder content for the first slide.
-
-
-
- {{< placeholder width="800" height="400" class="bd-placeholder-img-lg d-block w-100" color="#444" background="#666" text="Second slide" >}}
-
-
Second slide label
-
Some representative placeholder content for the second slide.
-
-
-
- {{< placeholder width="800" height="400" class="bd-placeholder-img-lg d-block w-100" color="#333" background="#555" text="Third slide" >}}
-
-
Third slide label
-
Some representative placeholder content for the third slide.
-
-
-
-
-
- Previous
-
-
-
- Next
-
-
- {{< /example >}}
-
- {{< example show_markup="false" >}}
-
-
-
-
-
-
-
-
-
-
-
-
-
-
- {{< /example >}}
-
- {{< example show_markup="false" >}}
-
-
-
-
-
-
-
-
-
-
-
-
-
-
-
-
-
-
-
-
-
-
-
-
-
-
-
-
-
-
- {{< /example >}}
-
- {{< example show_markup="false" >}}
-
-
-
-
-
-
-
-
-
-
-
-
-
-
- {{< /example >}}
-
- {{< example show_markup="false" >}}
-
- {{< /example >}}
-
- {{< example show_markup="false" >}}
-
- - A disabled item
- - A second item
- - A third item
- - A fourth item
- - And a fifth one
-
- {{< /example >}}
-
- {{< example show_markup="false" >}}
-
- - An item
- - A second item
- - A third item
- - A fourth item
- - And a fifth one
-
- {{< /example >}}
-
- {{< example show_markup="false" >}}
-
- {{< /example >}}
-
- {{< example show_markup="false" >}}
-
-
-
-
-
-
- {{< /example >}}
-
- {{< example show_markup="false" >}}
-
- {{< /example >}}
-
- {{< example show_markup="false" >}}
-
-
-
-
Placeholder content for the tab panel. This one relates to the home tab. Takes you miles high, so high, 'cause she’s got that one international smile. There's a stranger in my bed, there's a pounding in my head. Oh, no. In another life I would make you stay. ‘Cause I, I’m capable of anything. Suiting up for my crowning battle. Used to steal your parents' liquor and climb to the roof. Tone, tan fit and ready, turn it up cause its gettin' heavy. Her love is like a drug. I guess that I forgot I had a choice.
-
-
-
Placeholder content for the tab panel. This one relates to the profile tab. You got the finest architecture. Passport stamps, she's cosmopolitan. Fine, fresh, fierce, we got it on lock. Never planned that one day I'd be losing you. She eats your heart out. Your kiss is cosmic, every move is magic. I mean the ones, I mean like she's the one. Greetings loved ones let's take a journey. Just own the night like the 4th of July! But you'd rather get wasted.
-
-
-
- {{< /example >}}
-
- {{< example show_markup="false" >}}
-
- {{< /example >}}
-
- {{< example show_markup="false" >}}
-
-
-
- {{< /example >}}
-
- {{< example show_markup="false" >}}
-
- {{< /example >}}
-
- {{< example show_markup="false" >}}
-
-
-
-
- {{< /example >}}
-
-
-
-
-
-
- {{< example show_markup="false" >}}
-
-
-
-
-
- {{< /example >}}
-
- {{< example show_markup="false" >}}
-
- {{< /example >}}
-
-
-
-
-
@fat
-
Placeholder content for the scrollspy example. You got the finest architecture. Passport stamps, she's cosmopolitan. Fine, fresh, fierce, we got it on lock. Never planned that one day I'd be losing you. She eats your heart out. Your kiss is cosmic, every move is magic. I mean the ones, I mean like she's the one. Greetings loved ones let's take a journey. Just own the night like the 4th of July! But you'd rather get wasted.
-
@mdo
-
Placeholder content for the scrollspy example. 'Cause she's the muse and the artist. (This is how we do) So you wanna play with magic. So just be sure before you give it all to me. I'm walking, I'm walking on air (tonight). Skip the talk, heard it all, time to walk the walk.
-
one
-
Placeholder content for the scrollspy example. Takes you miles high, so high, 'cause she’s got that one international smile. There's a stranger in my bed, there's a pounding in my head. Oh, no. In another life I would make you stay. ‘Cause I, I’m capable of anything. Suiting up for my crowning battle. Used to steal your parents' liquor and climb to the roof. Tone, tan fit and ready, turn it up cause its gettin' heavy. Her love is like a drug. I guess that I forgot I had a choice.
-
two
-
Placeholder content for the scrollspy example. It's time to bring out the big balloons. I'm walking, I'm walking on air (tonight). Yeah, we maxed our credit cards and got kicked out of the bar. Yo, shout out to all you kids, buying bottle service, with your rent money. I'm ma get your heart racing in my skin-tight jeans. If you get the chance you better keep her. Yo, shout out to all you kids, buying bottle service, with your rent money.
-
three
-
Placeholder content for the scrollspy example. If you wanna dance, if you want it all, you know that I'm the girl that you should call. Walk through the storm I would. So let me get you in your birthday suit. The one that got away. Last Friday night, yeah I think we broke the law, always say we're gonna stop. 'Cause she's a little bit of Yoko, And she's a little bit of 'Oh no'. I want the jaw droppin', eye poppin', head turnin', body shockin'. Yeah, we maxed our credit cards and got kicked out of the bar.
-
And some more placeholder content, for good measure.
-
-
-
- {{< example show_markup="false" >}}
- {{< spinner.inline >}}
- {{- range (index $.Site.Data "theme-colors") }}
-
- Loading...
-
- {{- end -}}
- {{< /spinner.inline >}}
- {{< /example >}}
-
- {{< example show_markup="false" >}}
- {{< spinner.inline >}}
- {{- range (index $.Site.Data "theme-colors") }}
-
- Loading...
-
- {{- end -}}
- {{< /spinner.inline >}}
- {{< /example >}}
-
- {{< example show_markup="false" class="bg-dark p-5 align-items-center" >}}
-
-
-
- Hello, world! This is a toast message.
-
-
- {{< /example >}}
-
- {{< example show_markup="false" class="tooltip-demo" >}}
-
-
-
-
-
- {{< /example >}}
-
-
-
-
-
-
-
-
-
I will not close if you click outside me. Don't even try to press escape key.
-
-
-
-
-
-
-
-
-
-
What follows is just some placeholder text for this modal dialog. I feel like I'm already there. I’m gon’ put her in a coma. Boom, boom, boom. You're reading me like erotica, boy, you make me feel exotic, yeah. Happy birthday. From Tokyo to Mexico, to Rio. I knew you were.
-
Last Friday night. Calling out my name. Kiss her, touch her, squeeze her buns. Heavy is the head that wears the crown. So open up your heart and just let it begin. Boy all this time was worth the waiting. You know that I'm the girl that you should call. End of the rainbow looking treasure. You're reading me like erotica, boy, you make me feel exotic, yeah. Do you know that there's still a chance for you 'Cause there's a spark in you? So I sat quietly, agreed politely. From Tokyo to Mexico, to Rio.
-
Don't be a shy kinda guy I'll bet it's beautiful. You fall asleep during foreplay, 'Cause the pills you take, are more your forte. Open up your heart. You're never gonna be unsatisfied. Know that you are worthy. This one goes out to the ladies at breakfast in last night's dress. You think you've seen her in a magazine. I should've told you what you meant to me 'Cause now I pay the price. Takes you miles high, so high, 'cause she’s got that one international smile.
-
Yo, shout out to all you kids, buying bottle service, with your rent money. So I sat quietly, agreed politely. They say, be afraid you're not like the others, futuristic lover. Boom, boom, boom. Don't need apologies. We can dance, until we die, you and I, will be young forever. If you choose to walk away, don’t walk away. You know that I'm the girl that you should call. This Friday night, do it all again.
-
I'm walking on air. But lil' mama so dope. It's time to bring out the big balloons. Are you ready for, ready for. The boys break their necks try'na to creep a little sneak peek. Summer after high school when we first met. If you want it all. (This is how we do) You open my eyes and I'm ready to go, lead me into the light.
-
Growing fast into a bolt of lightning. We freak in my jeep, Snoop Doggy Dogg on the stereo. Baby do you dare to do this? Open up your heart and just let it begin. Peach-pink lips, yeah, everybody stares. Be your teenage dream tonight. Are you brave enough to let me see your peacock? You think I'm funny when I tell the punchline wrong. Woo! I knew you were. All this money can't buy me a time machine. I can't sleep let's run away and don't ever look back, don't ever look back.
-
Make it like your birthday everyday. I'm not sticking around to watch you go down. Uh-huh, I see you. For you I'll risk it all, all. I’m gon’ put her in a coma. She ride me like a roller coaster. You hear my voice, you hear that sound. 'Cause I will love you unconditionally (oh yeah). They say, be afraid you're not like the others, futuristic lover. There is no fear now, let go and just be free, I will love you unconditionally.
-
We can dance, until we die, you and I, will be young forever. Pop your Pérignon. Last Friday night, yeah I think we broke the law, always say we're gonna stop. Don't need apologies. Give you something good to celebrate. But don’t make me your enemy, your enemy, your enemy. Flowers in her hair, she don't care. Tone, tan fit and ready, turn it up cause its gettin' heavy.
-
-
-
-
-
-
-
-
-
نموذج الخروج
-
فيما يلي مثال على نموذج تم إنشاؤه بالكامل باستخدام عناصر تحكم النموذج في Bootstrap. لكل مجموعة نماذج مطلوبة حالة تحقق يمكن تشغيلها بمحاولة إرسال النموذج دون استكماله.
-
-
-
- عربتك
- 3
-
-
- -
-
-
اسم المنتج
- وصف مختصر
-
- $12
-
- -
-
-
المنتج الثاني
- وصف مختصر
-
- $8
-
- -
-
-
البند الثالث
- وصف مختصر
-
- $5
-
- -
-
-
رمز ترويجي
- EXAMPLECODE
-
- -$5
-
- -
- مجموع (USD)
- $20
-
-
-
-
-
-
-
عنوان وصول الفواتير
-
-
-
-
-
-
-
-
-
Checkout form
-
Below is an example form built entirely with Bootstrap’s form controls. Each required form group has a validation state that can be triggered by attempting to submit the form without completing it.
-
-
-
- Your cart
- 3
-
-
- -
-
-
Product name
- Brief description
-
- $12
-
- -
-
-
Second product
- Brief description
-
- $8
-
- -
-
-
Third item
- Brief description
-
- $5
-
- -
-
-
Promo code
- EXAMPLECODE
-
- −$5
-
- -
- Total (USD)
- $20
-
-
-
-
-
-
-
-
-
-
-
-
-
- Cover your page.
- Cover is a one-page template for building simple and beautiful home pages. Download, edit the text, and add your own fullscreen background photo to make it your own.
-
- Learn more
-
-
-
-
-
-
-
-
-
-
-
-
-
- عنوان القسم
-
-
-
-
- | # |
- العنوان |
- العنوان |
- العنوان |
- العنوان |
-
-
-
-
- | 1,001 |
- أم. |
- و. |
- ثمّة. |
- ويتّفق. |
-
-
- | 1,002 |
- أضف. |
- ما. |
- من. |
- أم. |
-
-
- | 1,003 |
- دار. |
- ذلك. |
- يبق. |
- المتحدة. |
-
-
- | 1,003 |
- فكانت. |
- الخارجية. |
- الآخر. |
- حتى. |
-
-
- | 1,004 |
- أم. |
- و. |
- ثمّة. |
- ويتّفق. |
-
-
- | 1,005 |
- أضف. |
- ما. |
- من. |
- أم. |
-
-
- | 1,006 |
- دار. |
- ذلك. |
- يبق. |
- المتحدة. |
-
-
- | 1,007 |
- أم. |
- و. |
- ثمّة. |
- ويتّفق. |
-
-
- | 1,008 |
- أضف. |
- ما. |
- من. |
- أم. |
-
-
- | 1,009 |
- دار. |
- ذلك. |
- يبق. |
- المتحدة. |
-
-
- | 1,010 |
- أم. |
- و. |
- ثمّة. |
- ويتّفق. |
-
-
- | 1,011 |
- أضف. |
- ما. |
- من. |
- أم. |
-
-
- | 1,012 |
- دار. |
- ذلك. |
- يبق. |
- المتحدة. |
-
-
- | 1,013 |
- أم. |
- و. |
- ثمّة. |
- ويتّفق. |
-
-
- | 1,014 |
- أضف. |
- ما. |
- من. |
- أم. |
-
-
- | 1,015 |
- دار. |
- ذلك. |
- يبق. |
- المتحدة. |
-
-
-
-
-
-
-
-
-
-
-
-
-
-
- Section title
-
-
-
-
- | # |
- Header |
- Header |
- Header |
- Header |
-
-
-
-
- | 1,001 |
- random |
- data |
- placeholder |
- text |
-
-
- | 1,002 |
- placeholder |
- irrelevant |
- visual |
- layout |
-
-
- | 1,003 |
- data |
- rich |
- dashboard |
- tabular |
-
-
- | 1,003 |
- information |
- placeholder |
- illustrative |
- data |
-
-
- | 1,004 |
- text |
- random |
- layout |
- dashboard |
-
-
- | 1,005 |
- dashboard |
- irrelevant |
- text |
- placeholder |
-
-
- | 1,006 |
- dashboard |
- illustrative |
- rich |
- data |
-
-
- | 1,007 |
- placeholder |
- tabular |
- information |
- irrelevant |
-
-
- | 1,008 |
- random |
- data |
- placeholder |
- text |
-
-
- | 1,009 |
- placeholder |
- irrelevant |
- visual |
- layout |
-
-
- | 1,010 |
- data |
- rich |
- dashboard |
- tabular |
-
-
- | 1,011 |
- information |
- placeholder |
- illustrative |
- data |
-
-
- | 1,012 |
- text |
- placeholder |
- layout |
- dashboard |
-
-
- | 1,013 |
- dashboard |
- irrelevant |
- text |
- visual |
-
-
- | 1,014 |
- dashboard |
- illustrative |
- rich |
- data |
-
-
- | 1,015 |
- random |
- tabular |
- information |
- text |
-
-
-
-
-
-
-
-
Bootstrap grid examples
-
Basic grid layouts to get you familiar with building within the Bootstrap grid system.
-
In these examples the .themed-grid-col class is added to the columns to add some theming. This is not a class that is available in Bootstrap by default.
-
-
Five grid tiers
-
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.
-
-
-
.col-4
-
.col-4
-
.col-4
-
-
-
-
.col-sm-4
-
.col-sm-4
-
.col-sm-4
-
-
-
-
.col-md-4
-
.col-md-4
-
.col-md-4
-
-
-
-
.col-lg-4
-
.col-lg-4
-
.col-lg-4
-
-
-
-
.col-xl-4
-
.col-xl-4
-
.col-xl-4
-
-
-
-
.col-xxl-4
-
.col-xxl-4
-
.col-xxl-4
-
-
-
Three equal columns
-
Get three equal-width columns starting at desktops and scaling to large desktops. On mobile devices, tablets and below, the columns will automatically stack.
-
-
.col-md-4
-
.col-md-4
-
.col-md-4
-
-
-
Three equal columns alternative
-
By using the .row-cols-* classes, you can easily create a grid with equal columns.
-
-
.col child of .row-cols-md-3
-
.col child of .row-cols-md-3
-
.col child of .row-cols-md-3
-
-
-
Three unequal columns
-
Get three columns starting at desktops and scaling to large desktops of various widths. Remember, grid columns should add up to twelve for a single horizontal block. More than that, and columns start stacking no matter the viewport.
-
-
.col-md-3
-
.col-md-6
-
.col-md-3
-
-
-
Two columns
-
Get two columns starting at desktops and scaling to large desktops.
-
-
.col-md-8
-
.col-md-4
-
-
-
Full width, single column
-
- No grid classes are necessary for full-width elements.
-
-
-
-
-
Two columns with two nested columns
-
Per the documentation, nesting is easy—just put a row of columns within an existing column. This gives you two columns starting at desktops and scaling to large desktops, with another two (equal widths) within the larger column.
-
At mobile device sizes, tablets and down, these columns and their nested columns will stack.
-
-
-
- .col-md-8
-
-
-
.col-md-6
-
.col-md-6
-
-
-
.col-md-4
-
-
-
-
-
Mixed: mobile and desktop
-
The Bootstrap v4 grid system has five tiers of classes: xs (extra small, this class infix is not used), sm (small), md (medium), lg (large), and xl (extra large). You can use nearly any combination of these classes to create more dynamic and flexible layouts.
-
Each tier of classes scales up, meaning if you plan on setting the same widths for md, lg and xl, you only need to specify md.
-
-
.col-md-8
-
.col-6 .col-md-4
-
-
-
.col-6 .col-md-4
-
.col-6 .col-md-4
-
.col-6 .col-md-4
-
-
-
-
-
-
Mixed: mobile, tablet, and desktop
-
-
.col-sm-6 .col-lg-8
-
.col-6 .col-lg-4
-
-
-
.col-6 .col-sm-4
-
.col-6 .col-sm-4
-
.col-6 .col-sm-4
-
-
-
-
-
Gutters
-
With .gx-* classes, the horizontal gutters can be adjusted.
-
-
.col with .gx-4 gutters
-
.col with .gx-4 gutters
-
.col with .gx-4 gutters
-
.col with .gx-4 gutters
-
.col with .gx-4 gutters
-
.col with .gx-4 gutters
-
-
Use the .gy-* classes to control the vertical gutters.
-
-
.col with .gy-4 gutters
-
.col with .gy-4 gutters
-
.col with .gy-4 gutters
-
.col with .gy-4 gutters
-
.col with .gy-4 gutters
-
.col with .gy-4 gutters
-
-
With .g-* classes, the gutters in both directions can be adjusted.
-
-
.col with .g-3 gutters
-
.col with .g-3 gutters
-
.col with .g-3 gutters
-
.col with .g-3 gutters
-
.col with .g-3 gutters
-
.col with .g-3 gutters
-
-
-
-
-
Containers
-
Additional classes added in Bootstrap v4.4 allow containers that are 100% wide until a particular breakpoint. v5 adds a new xxl breakpoint.
-
.container
- .container-sm
- .container-md
- .container-lg
- .container-xl
- .container-xxl
- .container-fluid
-
diff --git a/site/content/docs/5.0/examples/masonry/index.html b/site/content/docs/5.0/examples/masonry/index.html
deleted file mode 100644
index 9061d7cce..000000000
--- a/site/content/docs/5.0/examples/masonry/index.html
+++ /dev/null
@@ -1,105 +0,0 @@
----
-layout: examples
-title: Masonry example
-extra_js:
- - src: "https://cdn.jsdelivr.net/npm/masonry-layout@4.2.2/dist/masonry.pkgd.min.js"
- integrity: "sha384-GNFwBvfVxBkLMJpYMOABq3c+d3KnQxudP/mGPkzpZSTYykLBNsZEnG2D9G/X/+7D"
- async: true
----
-
-
- Bootstrap and Masonry
- Integrate Masonry with the Bootstrap grid system and cards component.
-
- Masonry is not included in Bootstrap. Add it by including the JavaScript plugin manually, or using a CDN like so:
-
-
-<script src="https://cdn.jsdelivr.net/npm/masonry-layout@4.2.2/dist/masonry.pkgd.min.js" integrity="sha384-GNFwBvfVxBkLMJpYMOABq3c+d3KnQxudP/mGPkzpZSTYykLBNsZEnG2D9G/X/+7D" crossorigin="anonymous" async></script>
-
-
- By adding data-masonry='{"percentPosition": true }' to the .row wrapper, we can combine the powers of Bootstrap's responsive grid and Masonry's positioning.
-
-
-
-
-
-
- {{< placeholder width="100%" height="200" class="card-img-top" text="Image cap" >}}
-
-
Card title that wraps to a new line
-
This is a longer card with supporting text below as a natural lead-in to additional content. This content is a little bit longer.
-
-
-
-
-
-
-
- A well-known quote, contained in a blockquote element.
-
-
-
-
-
-
-
- {{< placeholder width="100%" height="200" class="card-img-top" text="Image cap" >}}
-
-
Card title
-
This card has supporting text below as a natural lead-in to additional content.
-
Last updated 3 mins ago
-
-
-
-
-
-
-
- A well-known quote, contained in a blockquote element.
-
-
-
-
-
-
-
-
-
Card title
-
This card has a regular title and short paragraph of text below it.
-
Last updated 3 mins ago
-
-
-
-
-
- {{< placeholder width="100%" height="260" class="card-img" text="Card image" >}}
-
-
-
-
-
-
- A well-known quote, contained in a blockquote element.
-
-
-
-
-
-
-
-
-
Card title
-
This is another card with title and supporting text below. This card has some additional content to make it slightly taller overall.
-
Last updated 3 mins ago
-
-
-
-
-
Navbar example
-
This example is a quick exercise to illustrate how fixed to top navbar works. As you scroll, it will remain fixed to the top of your browser’s viewport.
-
}}" role="button">View navbar docs »
-
-
Navbar example
-
This example is a quick exercise to illustrate how the top-aligned navbar works. As you scroll, this navbar remains in its original position and moves with the rest of the page.
-
}}" role="button">View navbar docs »
-
-
Matching .container-xl...
-
-
-
-
-
-
-
-
-
Navbar examples
-
This example is a quick exercise to illustrate how the navbar and its contents work. Some navbars extend the width of the viewport, others are confined within a .container. For positioning of navbars, checkout the }}">top and }}">fixed top examples.
-
At the smallest breakpoint, the collapse plugin is used to hide the links and show a menu button to toggle the collapsed content.
-
- }}" role="button">View navbar docs »
-
-
-
-
-
-
-
-
Bootstrap
- Since 2011
-
-
-
Recent updates
-
- {{< placeholder width="32" height="32" background="#007bff" color="#007bff" class="flex-shrink-0 me-2 rounded" >}}
-
- @username
- Some representative placeholder content, with some information about this user. Imagine this being some sort of status update, perhaps?
-
-
-
- {{< placeholder width="32" height="32" background="#e83e8c" color="#e83e8c" class="flex-shrink-0 me-2 rounded" >}}
-
- @username
- Some more representative placeholder content, related to this other user. Another status update, perhaps.
-
-
-
- {{< placeholder width="32" height="32" background="#6f42c1" color="#6f42c1" class="flex-shrink-0 me-2 rounded" >}}
-
- @username
- This user also gets some representative placeholder content. Maybe they did something interesting, and you really want to highlight this in the recent updates.
-
-
-
- All updates
-
-
-
Suggestions
-
- {{< placeholder width="32" height="32" background="#007bff" color="#007bff" class="flex-shrink-0 me-2 rounded" >}}
-
-
-
- {{< placeholder width="32" height="32" background="#007bff" color="#007bff" class="flex-shrink-0 me-2 rounded" >}}
-
-
-
- {{< placeholder width="32" height="32" background="#007bff" color="#007bff" class="flex-shrink-0 me-2 rounded" >}}
-
-
-
- All suggestions
-
-
-
-
-
-
-
$0 / mo
-
- - 10 users included
- - 2 GB of storage
- - Email support
- - Help center access
-
-
-
-
-
-
-
-
-
-
$15 / mo
-
- - 20 users included
- - 10 GB of storage
- - Priority email support
- - Help center access
-
-
-
-
-
-
-
-
-
-
$29 / mo
-
- - 30 users included
- - 15 GB of storage
- - Phone and email support
- - Help center access
-
-
-
-
-
-
-
-
Punny headline
-
And an even wittier subheading to boot. Jumpstart your marketing efforts with this example based on Apple’s marketing pages.
-
Coming soon
-
-
-
-
-
-
-
Another headline
-
And an even wittier subheading.
-
-
-
-
-
-
Another headline
-
And an even wittier subheading.
-
-
-
-
-
-
-
Another headline
-
And an even wittier subheading.
-
-
-
-
-
-
Another headline
-
And an even wittier subheading.
-
-
-
-
-
-
-
Another headline
-
And an even wittier subheading.
-
-
-
-
-
-
Another headline
-
And an even wittier subheading.
-
-
-
-
-
-
-
Another headline
-
And an even wittier subheading.
-
-
-
-
-
-
Another headline
-
And an even wittier subheading.
-
-
-
-
-
Bootstrap starter template
-
Use this document as a way to quickly start any new project.
All you get is this text and a mostly barebones HTML document.
-
-
Sticky footer with fixed navbar
-
Pin a footer to the bottom of the viewport in desktop browsers with this custom HTML and CSS. A fixed navbar has been added with padding-top: 60px; on the main > .container.
-
Back to }}">the default sticky footer minus the navbar.
-
+ 
+
+ 
-
-
-Thanks to [BrowserStack](https://www.browserstack.com/) for providing the infrastructure that allows us to test in real browsers!
-
-
-## Sponsors
-
-Support this project by becoming a sponsor. Your logo will show up here with a link to your website. [[Become a sponsor](https://opencollective.com/bootstrap#sponsor)]
-
-[](https://opencollective.com/bootstrap/sponsor/0/website)
-[](https://opencollective.com/bootstrap/sponsor/1/website)
-[](https://opencollective.com/bootstrap/sponsor/2/website)
-[](https://opencollective.com/bootstrap/sponsor/3/website)
-[](https://opencollective.com/bootstrap/sponsor/4/website)
-[](https://opencollective.com/bootstrap/sponsor/5/website)
-[](https://opencollective.com/bootstrap/sponsor/6/website)
-[](https://opencollective.com/bootstrap/sponsor/7/website)
-[](https://opencollective.com/bootstrap/sponsor/8/website)
-[](https://opencollective.com/bootstrap/sponsor/9/website)
-
-
-## Backers
-
-Thank you to all our backers! 🙏 [[Become a backer](https://opencollective.com/bootstrap#backer)]
-
-[](https://opencollective.com/bootstrap#backers)
-
-
## Copyright and license
-Code and documentation copyright 2011–2021 the [Bootstrap Authors](https://github.com/twbs/bootstrap/graphs/contributors) and [Twitter, Inc.](https://twitter.com) Code released under the [MIT License](https://github.com/twbs/bootstrap/blob/main/LICENSE). Docs released under [Creative Commons](https://creativecommons.org/licenses/by/3.0/).
+Code and documentation copyright 2011-2018 the [Bootstrap Authors](https://github.com/twbs/bootstrap/graphs/contributors) and [Twitter, Inc.](https://twitter.com) Code released under the [MIT License](https://github.com/twbs/bootstrap/blob/master/LICENSE). Docs released under [Creative Commons](https://github.com/twbs/bootstrap/blob/master/docs/LICENSE).
diff --git a/SECURITY.md b/SECURITY.md
deleted file mode 100644
index e79dcd8d2..000000000
--- a/SECURITY.md
+++ /dev/null
@@ -1,7 +0,0 @@
-# Reporting Security Issues
-
-The Bootstrap team and community take security issues in Bootstrap seriously. We appreciate your efforts to responsibly disclose your findings, and will make every effort to acknowledge your contributions.
-
-To report a security issue, email [security@getbootstrap.com](mailto:security@getbootstrap.com) and include the word "SECURITY" in the subject line.
-
-We'll endeavor to respond quickly, and will keep you updated throughout the process.
diff --git a/_config.yml b/_config.yml
new file mode 100644
index 000000000..586f02931
--- /dev/null
+++ b/_config.yml
@@ -0,0 +1,63 @@
+# Dependencies
+markdown: kramdown
+highlighter: rouge
+
+kramdown:
+ auto_ids: true
+
+# Permalinks
+permalink: pretty
+
+# Server
+source: "site"
+destination: ./_gh_pages
+host: 0.0.0.0
+port: 9001
+baseurl: ""
+url: "https://getbootstrap.com"
+encoding: UTF-8
+exclude:
+ - docs/4.1/assets/scss/
+
+plugins:
+ - jekyll-redirect-from
+ - jekyll-sitemap
+ - jekyll-toc
+
+# Social
+title: Bootstrap
+description: "The most popular HTML, CSS, and JS library in the world."
+twitter: getbootstrap
+authors: "Mark Otto, Jacob Thornton, and Bootstrap contributors"
+social_image_path: /docs/4.1/assets/brand/bootstrap-social.png
+social_logo_path: /docs/4.1/assets/brand/bootstrap-social-logo.png
+
+# Custom variables
+current_version: 4.1.2
+current_ruby_version: 4.1.2
+docs_version: 4.1
+repo: "https://github.com/twbs/bootstrap"
+slack: "https://bootstrap-slack.herokuapp.com"
+blog: "https://blog.getbootstrap.com"
+expo: "https://expo.getbootstrap.com"
+jobs: "https://jobs.getbootstrap.com"
+themes: "https://themes.getbootstrap.com"
+
+download:
+ source: "https://github.com/twbs/bootstrap/archive/v4.1.2.zip"
+ dist: "https://github.com/twbs/bootstrap/releases/download/v4.1.2/bootstrap-4.1.2-dist.zip"
+
+cdn:
+ # See https://www.srihash.org for info on how to generate the hashes
+ css: "https://stackpath.bootstrapcdn.com/bootstrap/4.1.2/css/bootstrap.min.css"
+ css_hash: "sha384-Smlep5jCw/wG7hdkwQ/Z5nLIefveQRIY9nfy6xoR1uRYBtpZgI6339F5dgvm/e9B"
+ js: "https://stackpath.bootstrapcdn.com/bootstrap/4.1.2/js/bootstrap.min.js"
+ js_hash: "sha384-o+RDsa0aLu++PJvFqy8fFScvbHFLtbvScb8AjopnFD+iEQ7wo/CG0xlczd+2O/em"
+ jquery: "https://code.jquery.com/jquery-3.3.1.slim.min.js"
+ jquery_hash: "sha384-q8i/X+965DzO0rT7abK41JStQIAqVgRVzpbzo5smXKp4YfRvH+8abtTE1Pi6jizo"
+ popper: "https://cdnjs.cloudflare.com/ajax/libs/popper.js/1.14.3/umd/popper.min.js"
+ popper_hash: "sha384-ZMP7rVo3mIykV+2+9J3UJ46jBk0WLaUAdn689aCwoqbBJiSnjAK/l8WvCWPIPm49"
+
+toc:
+ min_level: 2
+ max_level: 4
diff --git a/build/.eslintrc.json b/build/.eslintrc.json
index 679bd26f7..76e7f37b6 100644
--- a/build/.eslintrc.json
+++ b/build/.eslintrc.json
@@ -8,7 +8,13 @@
},
"extends": "../.eslintrc.json",
"rules": {
+ "consistent-return": "off",
+ "func-style": "off",
"no-console": "off",
- "strict": "error"
+ "no-magic-numbers": "off",
+ "no-process-env": "off",
+ "no-process-exit": "off",
+ "no-sync": "off",
+ "spaced-comment": "off"
}
}
diff --git a/build/.htmllintrc b/build/.htmllintrc
new file mode 100644
index 000000000..d5cf54f5b
--- /dev/null
+++ b/build/.htmllintrc
@@ -0,0 +1,44 @@
+{
+ "attr-bans": ["align", "background", "bgcolor", "border", "frameborder", "longdesc", "marginwidth", "marginheight", "scrolling"],
+ "attr-name-style": false,
+ "attr-no-dup": true,
+ "attr-no-unsafe-char": true,
+ "attr-quote-style": "double",
+ "attr-req-value": true,
+ "attr-validate": false,
+ "class-no-dup": true,
+ "class-style": "none",
+ "doctype-first": true,
+ "doctype-html5": true,
+ "fig-req-figcaption": false,
+ "focusable-tabindex-style": true,
+ "head-req-title": true,
+ "head-valid-content-model": false,
+ "href-style": false,
+ "html-req-lang": true,
+ "html-valid-content-model": false,
+ "id-class-ignore-regex": "(onclick|content|[a-z]+([A-Z][a-z])+)",
+ "id-class-no-ad": true,
+ "id-class-style": false,
+ "id-no-dup": true,
+ "img-req-alt": "allownull",
+ "img-req-src": false,
+ "indent-style": "spaces",
+ "indent-width": 2,
+ "input-radio-req-name": false,
+ "input-req-label": false,
+ "label-req-for": true,
+ "lang-style": "case",
+ "line-no-trailing-whitespace": false,
+ "line-end-style": "lf",
+ "spec-char-escape": false,
+ "table-req-header": false,
+ "tag-bans": ["b", "i"],
+ "tag-close": true,
+ "tag-name-lowercase": true,
+ "tag-name-match": true,
+ "tag-self-close": false,
+ "text-ignore-regex": false,
+ "title-max-len": 70,
+ "title-no-dup": true
+}
diff --git a/build/banner.js b/build/banner.js
deleted file mode 100644
index df82ff32e..000000000
--- a/build/banner.js
+++ /dev/null
@@ -1,14 +0,0 @@
-'use strict'
-
-const pkg = require('../package.json')
-const year = new Date().getFullYear()
-
-function getBanner(pluginFilename) {
- return `/*!
- * Bootstrap${pluginFilename ? ` ${pluginFilename}` : ''} v${pkg.version} (${pkg.homepage})
- * Copyright 2011-${year} ${pkg.author}
- * Licensed under MIT (https://github.com/twbs/bootstrap/blob/main/LICENSE)
- */`
-}
-
-module.exports = getBanner
diff --git a/build/build-plugins.js b/build/build-plugins.js
deleted file mode 100644
index d1930b855..000000000
--- a/build/build-plugins.js
+++ /dev/null
@@ -1,188 +0,0 @@
-#!/usr/bin/env node
-
-/*!
- * Script to build our plugins to use them separately.
- * Copyright 2020-2021 The Bootstrap Authors
- * Copyright 2020-2021 Twitter, Inc.
- * Licensed under MIT (https://github.com/twbs/bootstrap/blob/main/LICENSE)
- */
-
-'use strict'
-
-const path = require('path')
-const rollup = require('rollup')
-const { babel } = require('@rollup/plugin-babel')
-const banner = require('./banner.js')
-
-const rootPath = path.resolve(__dirname, '../js/dist/')
-const plugins = [
- babel({
- // Only transpile our source code
- exclude: 'node_modules/**',
- // Include the helpers in each file, at most one copy of each
- babelHelpers: 'bundled'
- })
-]
-const bsPlugins = {
- Data: path.resolve(__dirname, '../js/src/dom/data.js'),
- EventHandler: path.resolve(__dirname, '../js/src/dom/event-handler.js'),
- Manipulator: path.resolve(__dirname, '../js/src/dom/manipulator.js'),
- SelectorEngine: path.resolve(__dirname, '../js/src/dom/selector-engine.js'),
- Alert: path.resolve(__dirname, '../js/src/alert.js'),
- Base: path.resolve(__dirname, '../js/src/base-component.js'),
- Button: path.resolve(__dirname, '../js/src/button.js'),
- Carousel: path.resolve(__dirname, '../js/src/carousel.js'),
- Collapse: path.resolve(__dirname, '../js/src/collapse.js'),
- Dropdown: path.resolve(__dirname, '../js/src/dropdown.js'),
- Modal: path.resolve(__dirname, '../js/src/modal.js'),
- Popover: path.resolve(__dirname, '../js/src/popover.js'),
- ScrollSpy: path.resolve(__dirname, '../js/src/scrollspy.js'),
- Tab: path.resolve(__dirname, '../js/src/tab.js'),
- Toast: path.resolve(__dirname, '../js/src/toast.js'),
- Tooltip: path.resolve(__dirname, '../js/src/tooltip.js')
-}
-
-const defaultPluginConfig = {
- external: [
- bsPlugins.Data,
- bsPlugins.Base,
- bsPlugins.EventHandler,
- bsPlugins.SelectorEngine
- ],
- globals: {
- [bsPlugins.Data]: 'Data',
- [bsPlugins.Base]: 'Base',
- [bsPlugins.EventHandler]: 'EventHandler',
- [bsPlugins.SelectorEngine]: 'SelectorEngine'
- }
-}
-
-const getConfigByPluginKey = pluginKey => {
- if (
- pluginKey === 'Data' ||
- pluginKey === 'Manipulator' ||
- pluginKey === 'EventHandler' ||
- pluginKey === 'SelectorEngine' ||
- pluginKey === 'Util' ||
- pluginKey === 'Sanitizer'
- ) {
- return {
- external: []
- }
- }
-
- if (pluginKey === 'Alert' || pluginKey === 'Tab') {
- return defaultPluginConfig
- }
-
- if (
- pluginKey === 'Base' ||
- pluginKey === 'Button' ||
- pluginKey === 'Carousel' ||
- pluginKey === 'Collapse' ||
- pluginKey === 'Modal' ||
- pluginKey === 'ScrollSpy'
- ) {
- const config = Object.assign(defaultPluginConfig)
- config.external.push(bsPlugins.Manipulator)
- config.globals[bsPlugins.Manipulator] = 'Manipulator'
- return config
- }
-
- if (pluginKey === 'Dropdown' || pluginKey === 'Tooltip') {
- const config = Object.assign(defaultPluginConfig)
- config.external.push(bsPlugins.Manipulator, '@popperjs/core')
- config.globals[bsPlugins.Manipulator] = 'Manipulator'
- config.globals['@popperjs/core'] = 'Popper'
- return config
- }
-
- if (pluginKey === 'Popover') {
- return {
- external: [
- bsPlugins.Data,
- bsPlugins.SelectorEngine,
- bsPlugins.Tooltip
- ],
- globals: {
- [bsPlugins.Data]: 'Data',
- [bsPlugins.SelectorEngine]: 'SelectorEngine',
- [bsPlugins.Tooltip]: 'Tooltip'
- }
- }
- }
-
- if (pluginKey === 'Toast') {
- return {
- external: [
- bsPlugins.Data,
- bsPlugins.Base,
- bsPlugins.EventHandler,
- bsPlugins.Manipulator
- ],
- globals: {
- [bsPlugins.Data]: 'Data',
- [bsPlugins.Base]: 'Base',
- [bsPlugins.EventHandler]: 'EventHandler',
- [bsPlugins.Manipulator]: 'Manipulator'
- }
- }
- }
-}
-
-const utilObjects = new Set([
- 'Util',
- 'Sanitizer'
-])
-
-const domObjects = new Set([
- 'Data',
- 'EventHandler',
- 'Manipulator',
- 'SelectorEngine'
-])
-
-const build = async plugin => {
- console.log(`Building ${plugin} plugin...`)
-
- const { external, globals } = getConfigByPluginKey(plugin)
- const pluginFilename = path.basename(bsPlugins[plugin])
- let pluginPath = rootPath
-
- if (utilObjects.has(plugin)) {
- pluginPath = `${rootPath}/util/`
- }
-
- if (domObjects.has(plugin)) {
- pluginPath = `${rootPath}/dom/`
- }
-
- const bundle = await rollup.rollup({
- input: bsPlugins[plugin],
- plugins,
- external
- })
-
- await bundle.write({
- banner: banner(pluginFilename),
- format: 'umd',
- name: plugin,
- sourcemap: true,
- globals,
- file: path.resolve(__dirname, `${pluginPath}/${pluginFilename}`)
- })
-
- console.log(`Building ${plugin} plugin... Done!`)
-}
-
-const main = async () => {
- try {
- await Promise.all(Object.keys(bsPlugins).map(plugin => build(plugin)))
- } catch (error) {
- console.error(error)
-
- process.exit(1)
- }
-}
-
-main()
diff --git a/build/change-version.js b/build/change-version.js
old mode 100644
new mode 100755
index 8086ed774..7102dc083
--- a/build/change-version.js
+++ b/build/change-version.js
@@ -2,9 +2,9 @@
/*!
* Script to update version number references in the project.
- * Copyright 2017-2021 The Bootstrap Authors
- * Copyright 2017-2021 Twitter, Inc.
- * Licensed under MIT (https://github.com/twbs/bootstrap/blob/main/LICENSE)
+ * Copyright 2017-2018 The Bootstrap Authors
+ * Copyright 2017-2018 Twitter, Inc.
+ * Licensed under MIT (https://github.com/twbs/bootstrap/blob/master/LICENSE)
*/
'use strict'
@@ -17,11 +17,11 @@ sh.config.fatal = true
// Blame TC39... https://github.com/benjamingr/RegExp.escape/issues/37
function regExpQuote(string) {
- return string.replace(/[$()*+-.?[\\\]^{|}]/g, '\\$&')
+ return string.replace(/[-\\^$*+?.()|[\]{}]/g, '\\$&')
}
function regExpQuoteReplacement(string) {
- return string.replace(/\$/g, '$$')
+ return string.replace(/[$]/g, '$$')
}
const DRY_RUN = false
@@ -30,21 +30,18 @@ function walkAsync(directory, excludedDirectories, fileCallback, errback) {
if (excludedDirectories.has(path.parse(directory).base)) {
return
}
-
fs.readdir(directory, (err, names) => {
if (err) {
errback(err)
return
}
-
- names.forEach(name => {
+ names.forEach((name) => {
const filepath = path.join(directory, name)
fs.lstat(filepath, (err, stats) => {
if (err) {
process.nextTick(errback, err)
return
}
-
if (stats.isDirectory()) {
process.nextTick(walkAsync, filepath, excludedDirectories, fileCallback, errback)
} else if (stats.isFile()) {
@@ -58,21 +55,18 @@ function walkAsync(directory, excludedDirectories, fileCallback, errback) {
function replaceRecursively(directory, excludedDirectories, allowedExtensions, original, replacement) {
original = new RegExp(regExpQuote(original), 'g')
replacement = regExpQuoteReplacement(replacement)
- const updateFile = DRY_RUN ?
- filepath => {
- if (allowedExtensions.has(path.parse(filepath).ext)) {
- console.log(`FILE: ${filepath}`)
- } else {
- console.log(`EXCLUDED:${filepath}`)
- }
- } :
- filepath => {
- if (allowedExtensions.has(path.parse(filepath).ext)) {
- sh.sed('-i', original, replacement, filepath)
- }
+ const updateFile = DRY_RUN ? (filepath) => {
+ if (allowedExtensions.has(path.parse(filepath).ext)) {
+ console.log(`FILE: ${filepath}`)
+ } else {
+ console.log(`EXCLUDED:${filepath}`)
}
-
- walkAsync(directory, excludedDirectories, updateFile, err => {
+ } : (filepath) => {
+ if (allowedExtensions.has(path.parse(filepath).ext)) {
+ sh.sed('-i', original, replacement, filepath)
+ }
+ }
+ walkAsync(directory, excludedDirectories, updateFile, (err) => {
console.error('ERROR while traversing directory!:')
console.error(err)
process.exit(1)
@@ -85,17 +79,15 @@ function main(args) {
console.error('Got arguments:', args)
process.exit(1)
}
-
const oldVersion = args[0]
const newVersion = args[1]
const EXCLUDED_DIRS = new Set([
'.git',
- '_gh_pages',
'node_modules',
'vendor'
])
const INCLUDED_EXTENSIONS = new Set([
- // This extension allowlist is how we avoid modifying binary files
+ // This extension whitelist is how we avoid modifying binary files
'',
'.css',
'.html',
diff --git a/build/gcp-key.json.enc b/build/gcp-key.json.enc
new file mode 100644
index 000000000..6e1856a2f
Binary files /dev/null and b/build/gcp-key.json.enc differ
diff --git a/build/generate-sri.js b/build/generate-sri.js
index 221873b8f..10936e8a1 100644
--- a/build/generate-sri.js
+++ b/build/generate-sri.js
@@ -5,60 +5,56 @@
* Remember to use the same vendor files as the CDN ones,
* otherwise the hashes won't match!
*
- * Copyright 2017-2021 The Bootstrap Authors
- * Copyright 2017-2021 Twitter, Inc.
- * Licensed under MIT (https://github.com/twbs/bootstrap/blob/main/LICENSE)
+ * Copyright 2017-2018 The Bootstrap Authors
+ * Copyright 2017-2018 Twitter, Inc.
+ * Licensed under MIT (https://github.com/twbs/bootstrap/blob/master/LICENSE)
*/
'use strict'
-const crypto = require('crypto')
const fs = require('fs')
const path = require('path')
+const sriToolbox = require('sri-toolbox')
const sh = require('shelljs')
sh.config.fatal = true
-const configFile = path.join(__dirname, '../config.yml')
+const configFile = path.join(__dirname, '../_config.yml')
// Array of objects which holds the files to generate SRI hashes for.
// `file` is the path from the root folder
-// `configPropertyName` is the config.yml variable's name of the file
+// `configPropertyName` is the _config.yml variable's name of the file
const files = [
{
file: 'dist/css/bootstrap.min.css',
configPropertyName: 'css_hash'
},
- {
- file: 'dist/css/bootstrap.rtl.min.css',
- configPropertyName: 'css_rtl_hash'
- },
{
file: 'dist/js/bootstrap.min.js',
configPropertyName: 'js_hash'
},
{
- file: 'dist/js/bootstrap.bundle.min.js',
- configPropertyName: 'js_bundle_hash'
+ file: 'site/docs/4.1/assets/js/vendor/jquery-slim.min.js',
+ configPropertyName: 'jquery_hash'
},
{
- file: 'node_modules/@popperjs/core/dist/umd/popper.min.js',
+ file: 'site/docs/4.1/assets/js/vendor/popper.min.js',
configPropertyName: 'popper_hash'
}
]
-files.forEach(file => {
+files.forEach((file) => {
fs.readFile(file.file, 'utf8', (err, data) => {
if (err) {
throw err
}
- const algo = 'sha384'
- const hash = crypto.createHash(algo).update(data, 'utf8').digest('base64')
- const integrity = `${algo}-${hash}`
+ const integrity = sriToolbox.generate({
+ algorithms: ['sha384']
+ }, data)
console.log(`${file.configPropertyName}: ${integrity}`)
- sh.sed('-i', new RegExp(`^(\\s+${file.configPropertyName}:\\s+["'])\\S*(["'])`), `$1${integrity}$2`, configFile)
+ sh.sed('-i', new RegExp(`(\\s${file.configPropertyName}:\\s+"|')(\\S+)("|')`), `$1${integrity}$3`, configFile)
})
})
diff --git a/build/lint-vars.js b/build/lint-vars.js
new file mode 100644
index 000000000..1b8d71cc6
--- /dev/null
+++ b/build/lint-vars.js
@@ -0,0 +1,82 @@
+#!/usr/bin/env node
+
+/*!
+ * Script to find unused Sass variables.
+ * Copyright 2017-2018 The Bootstrap Authors
+ * Copyright 2017-2018 Twitter, Inc.
+ * Licensed under MIT (https://github.com/twbs/bootstrap/blob/master/LICENSE)
+ */
+
+'use strict'
+
+const fs = require('fs')
+const path = require('path')
+const glob = require('glob')
+
+// Blame TC39... https://github.com/benjamingr/RegExp.escape/issues/37
+function regExpQuote(str) {
+ return str.replace(/[-\\^$*+?.()|[\]{}]/g, '\\$&')
+}
+
+let globalSuccess = true
+
+function findUnusedVars(dir) {
+ if (!(fs.existsSync(dir) && fs.statSync(dir).isDirectory())) {
+ console.log(`"${dir}": Not a valid directory!`)
+ process.exit(1)
+ }
+
+ console.log(`Finding unused variables in "${dir}"...`)
+
+ // A variable to handle success/failure message in this function
+ let unusedVarsFound = false
+
+ // Array of all Sass files' content
+ const sassFiles = glob.sync(path.join(dir, '**/*.scss'))
+ // String of all Sass files' content
+ let sassFilesString = ''
+
+ sassFiles.forEach((file) => {
+ sassFilesString += fs.readFileSync(file, 'utf8')
+ })
+
+ // Array of all Sass variables
+ const variables = sassFilesString.match(/(^\$[a-zA-Z0-9_-]+[^:])/gm)
+
+ console.log(`Found ${variables.length} total variables.`)
+
+ // Loop through each variable
+ variables.forEach((variable) => {
+ const re = new RegExp(regExpQuote(variable), 'g')
+ const count = (sassFilesString.match(re) || []).length
+
+ if (count === 1) {
+ console.log(`Variable "${variable}" is not being used.`)
+ unusedVarsFound = true
+ globalSuccess = false
+ }
+ })
+
+ if (unusedVarsFound === false) {
+ console.log(`No unused variables found in "${dir}".`)
+ }
+}
+
+function main(args) {
+ if (args.length < 1) {
+ console.log('Wrong arguments!')
+ console.log('Usage: lint-vars.js folder [, folder2...]')
+ process.exit(1)
+ }
+
+ args.forEach((arg) => {
+ findUnusedVars(arg)
+ })
+
+ if (globalSuccess === false) {
+ process.exit(1)
+ }
+}
+
+// The first and second args are: path/to/node script.js
+main(process.argv.slice(2))
diff --git a/build/postcss.config.js b/build/postcss.config.js
index b179a0e77..157291ffd 100644
--- a/build/postcss.config.js
+++ b/build/postcss.config.js
@@ -1,19 +1,14 @@
'use strict'
-module.exports = ctx => {
- return {
- map: ctx.file.dirname.includes('examples') ?
- false :
- {
- inline: false,
- annotation: true,
- sourcesContent: true
- },
- plugins: {
- autoprefixer: {
- cascade: false
- },
- rtlcss: ctx.env === 'RTL' ? {} : false
+module.exports = (ctx) => ({
+ map: ctx.file.dirname.includes('examples') ? false : {
+ inline: false,
+ annotation: true,
+ sourcesContent: true
+ },
+ plugins: {
+ autoprefixer: {
+ cascade: false
}
}
-}
+})
diff --git a/build/rollup.config.js b/build/rollup.config.js
index 7f9c1c7e1..93370d31d 100644
--- a/build/rollup.config.js
+++ b/build/rollup.config.js
@@ -1,50 +1,53 @@
'use strict'
-const path = require('path')
-const { babel } = require('@rollup/plugin-babel')
-const { nodeResolve } = require('@rollup/plugin-node-resolve')
-const replace = require('@rollup/plugin-replace')
-const banner = require('./banner.js')
+const path = require('path')
+const babel = require('rollup-plugin-babel')
+const resolve = require('rollup-plugin-node-resolve')
-const BUNDLE = process.env.BUNDLE === 'true'
-const ESM = process.env.ESM === 'true'
+const pkg = require(path.resolve(__dirname, '../package.json'))
+const BUNDLE = process.env.BUNDLE === 'true'
+const year = new Date().getFullYear()
-let fileDest = `bootstrap${ESM ? '.esm' : ''}`
-const external = ['@popperjs/core']
+let fileDest = 'bootstrap.js'
+const external = ['jquery', 'popper.js']
const plugins = [
babel({
- // Only transpile our source code
- exclude: 'node_modules/**',
- // Include the helpers in the bundle, at most one copy of each
- babelHelpers: 'bundled'
+ exclude: 'node_modules/**', // Only transpile our source code
+ externalHelpersWhitelist: [ // Include only required helpers
+ 'defineProperties',
+ 'createClass',
+ 'inheritsLoose',
+ 'defineProperty',
+ 'objectSpread'
+ ]
})
]
const globals = {
- '@popperjs/core': 'Popper'
+ jquery: 'jQuery', // Ensure we use jQuery which is always available even in noConflict mode
+ 'popper.js': 'Popper'
}
if (BUNDLE) {
- fileDest += '.bundle'
+ fileDest = 'bootstrap.bundle.js'
// Remove last entry in external array to bundle Popper
external.pop()
- delete globals['@popperjs/core']
- plugins.push(replace({ 'process.env.NODE_ENV': '"production"' }), nodeResolve())
+ delete globals['popper.js']
+ plugins.push(resolve())
}
-const rollupConfig = {
- input: path.resolve(__dirname, `../js/index.${ESM ? 'esm' : 'umd'}.js`),
+module.exports = {
+ input: path.resolve(__dirname, '../js/src/index.js'),
output: {
- banner,
- file: path.resolve(__dirname, `../dist/js/${fileDest}.js`),
- format: ESM ? 'esm' : 'umd',
- globals
+ banner: `/*!
+ * Bootstrap v${pkg.version} (${pkg.homepage})
+ * Copyright 2011-${year} ${pkg.author}
+ * Licensed under MIT (https://github.com/twbs/bootstrap/blob/master/LICENSE)
+ */`,
+ file: path.resolve(__dirname, `../dist/js/${fileDest}`),
+ format: 'umd',
+ globals,
+ name: 'bootstrap'
},
external,
plugins
}
-
-if (!ESM) {
- rollupConfig.output.name = 'bootstrap'
-}
-
-module.exports = rollupConfig
diff --git a/build/sauce_browsers.json b/build/sauce_browsers.json
new file mode 100644
index 000000000..b112d9c5b
--- /dev/null
+++ b/build/sauce_browsers.json
@@ -0,0 +1,65 @@
+[
+ {
+ "browserName": "safari",
+ "platform": "OS X 10.11",
+ "version": "latest"
+ },
+ {
+ "browserName": "chrome",
+ "platform": "OS X 10.11",
+ "version": "latest"
+ },
+ {
+ "browserName": "firefox",
+ "platform": "OS X 10.11",
+ "version": "latest"
+ },
+ {
+ "browserName": "MicrosoftEdge",
+ "platform": "Windows 10",
+ "version": "latest"
+ },
+ {
+ "browserName": "internet explorer",
+ "version": "11",
+ "platform": "Windows 8.1"
+ },
+ {
+ "browserName": "internet explorer",
+ "version": "10",
+ "platform": "Windows 8"
+ },
+ {
+ "browserName": "chrome",
+ "platform": "Windows 10",
+ "version": "latest"
+ },
+ {
+ "browserName": "firefox",
+ "platform": "Windows 10",
+ "version": "latest"
+ },
+ {
+ "browserName": "iphone",
+ "deviceName": "iPhone Simulator",
+ "platformName": "OS X 10.11",
+ "version": "9.3"
+ },
+ {
+ "browserName": "chrome",
+ "platform": "Linux",
+ "version": "latest"
+ },
+ {
+ "browserName": "firefox",
+ "platform": "Linux",
+ "version": "latest"
+ },
+ {
+ "platform": "Linux",
+ "browserName": "android",
+ "deviceName": "Android Emulator",
+ "version": "latest",
+ "deviceType": "phone"
+ }
+]
diff --git a/build/saucelabs-unit-test.js b/build/saucelabs-unit-test.js
new file mode 100644
index 000000000..b4d952536
--- /dev/null
+++ b/build/saucelabs-unit-test.js
@@ -0,0 +1,116 @@
+/*!
+ * Script to run our Sauce Labs tests.
+ * Copyright 2017-2018 The Bootstrap Authors
+ * Copyright 2017-2018 Twitter, Inc.
+ * Licensed under MIT (https://github.com/twbs/bootstrap/blob/master/LICENSE)
+ */
+
+/*
+Docs: https://wiki.saucelabs.com/display/DOCS/Platform+Configurator
+Mac Opera is not currently supported by Sauce Labs
+Win Opera 15+ is not currently supported by Sauce Labs
+iOS Chrome is not currently supported by Sauce Labs
+*/
+
+'use strict'
+
+const path = require('path')
+const JSUnitSaucelabs = require('jsunitsaucelabs')
+
+const jsUnitSaucelabs = new JSUnitSaucelabs({
+ username: process.env.SAUCE_USERNAME,
+ password: process.env.SAUCE_ACCESS_KEY,
+ build: process.env.TRAVIS_JOB_ID
+})
+
+const testURL = 'http://localhost:3000/js/tests/index.html?hidepassed'
+const browsersFile = require(path.resolve(__dirname, './sauce_browsers.json'))
+const errorMessages = [
+ 'Test exceeded maximum duration',
+ 'Test exceeded maximum duration after 180 seconds'
+]
+let jobsDone = 0
+let jobsSucceeded = 0
+
+const waitingCallback = (error, body, id) => {
+ if (error) {
+ console.error(error)
+ process.exit(1)
+ }
+
+ if (typeof body !== 'undefined') {
+ if (!body.completed) {
+ setTimeout(() => {
+ jsUnitSaucelabs.getStatus(id, (error, body) => {
+ waitingCallback(error, body, id)
+ })
+ }, 2000)
+ } else {
+ const test = body['js tests'][0]
+ const platform = test.platform.join(', ')
+ let passed = false
+ let errorStr = false
+
+ if (test.result !== null) {
+ if (typeof test.result === 'string' && errorMessages.includes(test.result)) {
+ errorStr = test.result
+ } else {
+ passed = test.result.total === test.result.passed
+ }
+ }
+
+ console.log(`Tested ${testURL}`)
+ console.log(`Platform: ${platform}`)
+ console.log(`Passed: ${passed}`)
+ console.log(`URL: ${test.url}\n`)
+
+ if (errorStr) {
+ console.error(`${platform}: ${errorStr}`)
+ }
+
+ if (passed) {
+ jobsSucceeded++
+ }
+ jobsDone++
+
+ // Exit
+ if (jobsDone === browsersFile.length - 1) {
+ jsUnitSaucelabs.stop()
+ if (jobsDone > jobsSucceeded) {
+ const failedTests = jobsDone - jobsSucceeded
+ throw new Error(`${failedTests} test${failedTests > 1 ? 's' : ''} failed.`)
+ }
+
+ console.log('All tests passed')
+ process.exit(0)
+ }
+ }
+ }
+}
+
+jsUnitSaucelabs.on('tunnelCreated', () => {
+ browsersFile.forEach((tmpBrowser) => {
+ const browsersPlatform = typeof tmpBrowser.platform === 'undefined' ? tmpBrowser.platformName : tmpBrowser.platform
+ const browsersArray = [browsersPlatform, tmpBrowser.browserName, tmpBrowser.version]
+
+ jsUnitSaucelabs.start([browsersArray], testURL, 'qunit', (error, success) => {
+ if (typeof success !== 'undefined') {
+ const taskIds = success['js tests']
+
+ if (!taskIds || taskIds.length === 0) {
+ throw new Error('Error starting tests through Sauce Labs API')
+ }
+
+ taskIds.forEach((id) => {
+ jsUnitSaucelabs.getStatus(id, (error, body) => {
+ waitingCallback(error, body, id)
+ })
+ })
+ } else {
+ console.error(error)
+ }
+ })
+ })
+})
+
+jsUnitSaucelabs.initTunnel()
diff --git a/build/ship.sh b/build/ship.sh
old mode 100644
new mode 100755
index da5a03bcd..e3b256e91
--- a/build/ship.sh
+++ b/build/ship.sh
@@ -1,7 +1,4 @@
#!/usr/bin/env bash
-
-set -e
-
#
# Usage
# ---------------
@@ -21,35 +18,53 @@ end=$'\e[0m'
current_version=$(node -p "require('./package.json').version")
if [[ $# -lt 1 ]]; then
- printf "\n%s⚠️ Shipping aborted. You must specify a version.\n%s" "$red" "$end"
+ printf "\n%s⚠️ Shipping aborted. You must specify a version.\n%s" $red $end
exit 1
fi
# Pulling latest changes, just to be sure
-printf "\n%s=======================================================%s" "$magenta" "$end"
-printf "\n%sPulling latest changes...%s" "$magenta" "$end"
-printf "\n%s=======================================================\n\n%s" "$magenta" "$end"
-git pull origin main
+printf "\n%s=======================================================%s" $magenta $end
+printf "\n%sPulling latest changes...%s" $magenta $end
+printf "\n%s=======================================================\n\n%s" $magenta $end
+git pull origin v4-dev
# Update version number
-printf "\n%s=======================================================%s" "$magenta" "$end"
-printf "\n%sUpdating version number...%s" "$magenta" "$end"
-printf "\n%s=======================================================\n%s" "$magenta" "$end"
+printf "\n%s=======================================================%s" $magenta $end
+printf "\n%sUpdating version number...%s" $magenta $end
+printf "\n%s=======================================================\n%s" $magenta $end
npm run release-version "$current_version" "$1"
-# Build release
-printf "\n%s=======================================================%s" "$magenta" "$end"
-printf "\n%sBuilding release...%s" "$magenta" "$end"
-printf "\n%s=======================================================\n%s" "$magenta" "$end"
-npm run release
+# Compile latest CSS and JS
+printf "\n%s=======================================================%s" $magenta $end
+printf "\n%sCompile latest CSS and JS...%s" $magenta $end
+printf "\n%s=======================================================\n%s" $magenta $end
+npm run dist
+
+# Generate the SRI hashes
+printf "\n%s=======================================================%s" $magenta $end
+printf "\n%sGenerate the SRI hashes...%s" $magenta $end
+printf "\n%s=======================================================\n%s" $magenta $end
+npm run release-sri
+
+# Compress the dist files
+printf "\n%s=======================================================%s" $magenta $end
+printf "\n%sCompressing the dist files...%s" $magenta $end
+printf "\n%s=======================================================\n%s" $magenta $end
+npm run release-zip
+
+# Compile the docs
+printf "\n%s=======================================================%s" $magenta $end
+printf "\n%sCompile hosted documentation...%s" $magenta $end
+printf "\n%s=======================================================\n%s" $magenta $end
+npm run docs-github
# Copy the contents of the built docs site over to `bs-docs` repo
-printf "\n%s=======================================================%s" "$magenta" "$end"
-printf "\n%sCopy it over...%s" "$magenta" "$end"
-printf "\n%s=======================================================\n%s" "$magenta" "$end"
+printf "\n%s=======================================================%s" $magenta $end
+printf "\n%sCopy it over...%s" $magenta $end
+printf "\n%s=======================================================\n%s" $magenta $end
cp -rf _gh_pages/. ../bs-docs/
printf "\nDone!\n"
-printf "\n%s=======================================================%s" "$green" "$end"
-printf "\n%sSuccess, $1 is ready to review and publish.%s" "$green" "$end"
-printf "\n%s=======================================================\n\n%s" "$green" "$end"
+printf "\n%s=======================================================%s" $green $end
+printf "\n%sSuccess, $1 is ready to review and publish.%s" $green $end
+printf "\n%s=======================================================\n\n%s" $green $end
diff --git a/build/svgo.yml b/build/svgo.yml
deleted file mode 100644
index 67940d393..000000000
--- a/build/svgo.yml
+++ /dev/null
@@ -1,59 +0,0 @@
-# Usage:
-# install svgo globally: `npm i -g svgo`
-# svgo --config=build/svgo.yml --input=foo.svg
-
-# https://github.com/svg/svgo/blob/master/docs/how-it-works/en.md
-# replace default config
-
-multipass: true
-#full: true
-
-# https://github.com/svg/svgo/blob/master/lib/svgo/js2svg.js#L6 for more config options
-
-js2svg:
- pretty: true
- indent: 2
-
-plugins:
-# - addAttributesToSVGElement:
-# attributes:
-# - focusable: false
- - cleanupAttrs: true
- - cleanupEnableBackground: true
- - cleanupIDs: true
- - cleanupListOfValues: true
- - cleanupNumericValues: true
- - collapseGroups: true
- - convertColors: true
- - convertPathData: true
- - convertShapeToPath: true
- - convertStyleToAttrs: true
- - convertTransform: true
- - inlineStyles: true
- - mergePaths: true
- - minifyStyles: true
- - moveElemsAttrsToGroup: true
- - moveGroupAttrsToElems: true
- - removeAttrs:
- attrs:
- - "data-name"
- - removeComments: true
- - removeDesc: true
- - removeDoctype: true
- - removeEditorsNSData: true
- - removeEmptyAttrs: true
- - removeEmptyContainers: true
- - removeEmptyText: true
- - removeHiddenElems: true
- - removeMetadata: true
- - removeNonInheritableGroupAttrs: true
- - removeTitle: false
- - removeUnknownsAndDefaults:
- keepRoleAttr: true
- - removeUnusedNS: true
- - removeUselessDefs: true
- - removeUselessStrokeAndFill: true
- - removeViewBox: false
- - removeXMLNS: false
- - removeXMLProcInst: true
- - sortAttrs: true
diff --git a/build/vnu-jar.js b/build/vnu-jar.js
index c23b94d60..111e03409 100644
--- a/build/vnu-jar.js
+++ b/build/vnu-jar.js
@@ -2,9 +2,9 @@
/*!
* Script to run vnu-jar if Java is available.
- * Copyright 2017-2021 The Bootstrap Authors
- * Copyright 2017-2021 Twitter, Inc.
- * Licensed under MIT (https://github.com/twbs/bootstrap/blob/main/LICENSE)
+ * Copyright 2017-2018 The Bootstrap Authors
+ * Copyright 2017-2018 Twitter, Inc.
+ * Licensed under MIT (https://github.com/twbs/bootstrap/blob/master/LICENSE)
*/
'use strict'
@@ -18,7 +18,7 @@ childProcess.exec('java -version', (error, stdout, stderr) => {
return
}
- const is32bitJava = !/64-Bit/.test(stderr)
+ const is32bitJava = !stderr.match(/64-Bit/)
// vnu-jar accepts multiple ignores joined with a `|`.
// Also note that the ignores are regular expressions.
@@ -27,17 +27,21 @@ childProcess.exec('java -version', (error, stdout, stderr) => {
// Firefox's non-standard autocomplete behavior - see https://bugzilla.mozilla.org/show_bug.cgi?id=654072
'Attribute “autocomplete” is only allowed when the input type is.*',
'Attribute “autocomplete” not allowed on element “button” at this point.',
+ // We use holder.js with `data-src` and no `src` to avoid 404 errors;
+ // we could work around this, but I'm not sure it's worth it.
+ 'Element “img” is missing required attribute “src”.',
// Markup used in Components → Forms → Layout → Form grid → Horizontal form is currently invalid,
// but used this way due to lack of support for flexbox layout on