Skip to content

Commit a565e47

Browse files
mrholekmrholek
committed
docs: update content
1 parent 59217ba commit a565e47

File tree

9 files changed

+25
-25
lines changed

9 files changed

+25
-25
lines changed

‎docs/assets/js/application.js

Lines changed: 1 addition & 1 deletion
Original file line numberDiff line numberDiff line change
@@ -63,7 +63,7 @@
6363

6464
function alert(message, type) {
6565
var wrapper = document.createElement('div')
66-
wrapper.innerHTML = '<div class="alert alert-' + type + ' alert-dismissible" role="alert">' + message + '<button type="button" class="btn-close" data-bs-dismiss="alert" aria-label="Close"></button></div>'
66+
wrapper.innerHTML = '<div class="alert alert-' + type + ' alert-dismissible" role="alert">' + message + '<button type="button" class="btn-close" data-coreui-dismiss="alert" aria-label="Close"></button></div>'
6767

6868
alertPlaceholder.append(wrapper)
6969
}

‎docs/content/4.1/components/alerts.md

Lines changed: 2 additions & 2 deletions
Original file line numberDiff line numberDiff line change
@@ -42,7 +42,7 @@ var alertTrigger = document.getElementById('liveAlertBtn')
4242

4343
function alert(message, type) {
4444
var wrapper = document.createElement('div')
45-
wrapper.innerHTML = '<div class="alert alert-' + type + ' alert-dismissible" role="alert">' + message + '<button type="button" class="btn-close" data-bs-dismiss="alert" aria-label="Close"></button></div>'
45+
wrapper.innerHTML = '<div class="alert alert-' + type + ' alert-dismissible" role="alert">' + message + '<button type="button" class="btn-close" data-coreui-dismiss="alert" aria-label="Close"></button></div>'
4646

4747
alertPlaceholder.append(wrapper)
4848
}
@@ -172,7 +172,7 @@ var alerts = [].slice.call(alertList).map(function (element) {
172172
```
173173

174174
{{< callout info >}}
175-
For the sole purpose of dismissing an alert, it isn't necessary to initialize the component manually via the JS API. By making use of `data-bs-dismiss="alert"`, the component will be initialized automatically and properly dismissed.
175+
For the sole purpose of dismissing an alert, it isn't necessary to initialize the component manually via the JS API. By making use of `data-coreui-dismiss="alert"`, the component will be initialized automatically and properly dismissed.
176176

177177
See the [triggers](#triggers) section for more details.
178178
{{< /callout >}}

‎docs/content/4.1/components/collapse.md

Lines changed: 1 addition & 1 deletion
Original file line numberDiff line numberDiff line change
@@ -54,7 +54,7 @@ Please note that while the example below has a `min-height` set to avoid excessi
5454

5555
{{< example >}}
5656
<p>
57-
<button class="btn btn-primary" type="button" data-bs-toggle="collapse" data-bs-target="#collapseWidthExample" aria-expanded="false" aria-controls="collapseWidthExample">
57+
<button class="btn btn-primary" type="button" data-coreui-toggle="collapse" data-coreui-target="#collapseWidthExample" aria-expanded="false" aria-controls="collapseWidthExample">
5858
Toggle width collapse
5959
</button>
6060
</p>

‎docs/content/4.1/content/reboot.md

Lines changed: 1 addition & 1 deletion
Original file line numberDiff line numberDiff line change
@@ -77,7 +77,7 @@ In practice, those variables are then applied in Reboot like so:
7777
Which allows you to make real-time customizations however you like:
7878

7979
```html
80-
<body style="--bs-body-color: #333;">
80+
<body style="--cui-body-color: #333;">
8181
<!-- ... -->
8282
</body>
8383
```

‎docs/content/4.1/layout/css-grid.md

Lines changed: 1 addition & 1 deletion
Original file line numberDiff line numberDiff line change
@@ -9,7 +9,7 @@ toc: true
99
Bootstrap's default grid system represents the culmination of over a decade of CSS layout techniques, tried and tested by millions of people. But, it was also created without many of the modern CSS features and techniques we're seeing in browsers like the new CSS Grid.
1010

1111
{{< callout warning >}}
12-
**Heads up—our CSS Grid system is experimental and opt-in as of v5.1.0!** We included it in our documentation's CSS to demonstrate it for you, but it's disabled by default. Keep reading to learn how to enable it in your projects.
12+
**Heads up—our CSS Grid system is experimental and opt-in as of v4.1.0!** We included it in our documentation's CSS to demonstrate it for you, but it's disabled by default. Keep reading to learn how to enable it in your projects.
1313
{{< /callout >}}
1414

1515
## How it works

‎docs/content/4.1/utilities/api.md

Lines changed: 6 additions & 6 deletions
Original file line numberDiff line numberDiff line change
@@ -156,10 +156,10 @@ $utilities: (
156156
Output:
157157

158158
```css
159-
.text-opacity-25 { --bs-text-opacity: .25; }
160-
.text-opacity-50 { --bs-text-opacity: .5; }
161-
.text-opacity-75 { --bs-text-opacity: .75; }
162-
.text-opacity-100 { --bs-text-opacity: 1; }
159+
.text-opacity-25 { --cui-text-opacity: .25; }
160+
.text-opacity-50 { --cui-text-opacity: .5; }
161+
.text-opacity-75 { --cui-text-opacity: .75; }
162+
.text-opacity-100 { --cui-text-opacity: 1; }
163163
```
164164

165165
### Local CSS variables
@@ -188,8 +188,8 @@ Output:
188188

189189
```css
190190
.bg-primary {
191-
--bs-bg-opacity: 1;
192-
background-color: rgba(var(--bs-primary-rgb), var(--bs-bg-opacity)) !important;
191+
--cui-bg-opacity: 1;
192+
background-color: rgba(var(--cui-primary-rgb), var(--cui-bg-opacity)) !important;
193193
}
194194
```
195195

‎docs/content/4.1/utilities/background.md

Lines changed: 5 additions & 5 deletions
Original file line numberDiff line numberDiff line change
@@ -47,20 +47,20 @@ Consider our default `.bg-success` utility.
4747

4848
```css
4949
.bg-success {
50-
--bs-bg-opacity: 1;
51-
background-color: rgba(var(--bs-success-rgb), var(--bs-bg-opacity)) !important;
50+
--cui-bg-opacity: 1;
51+
background-color: rgba(var(--cui-success-rgb), var(--cui-bg-opacity)) !important;
5252
}
5353
```
5454

55-
We use an RGB version of our `--bs-success` (with the value of `25, 135, 84`) CSS variable and attached a second CSS variable, `--bs-bg-opacity`, for the alpha transparency (with a default value `1` thanks to a local CSS variable). That means anytime you use `.bg-success` now, your computed `color` value is `rgba(25, 135, 84, 1)`. The local CSS variable inside each `.bg-*` class avoids inheritance issues so nested instances of the utilities don't automatically have a modified alpha transparency.
55+
We use an RGB version of our `--cui-success` (with the value of `25, 135, 84`) CSS variable and attached a second CSS variable, `--cui-bg-opacity`, for the alpha transparency (with a default value `1` thanks to a local CSS variable). That means anytime you use `.bg-success` now, your computed `color` value is `rgba(25, 135, 84, 1)`. The local CSS variable inside each `.bg-*` class avoids inheritance issues so nested instances of the utilities don't automatically have a modified alpha transparency.
5656

5757
### Example
5858

59-
To change that opacity, override `--bs-bg-opacity` via custom styles or inline styles.
59+
To change that opacity, override `--cui-bg-opacity` via custom styles or inline styles.
6060

6161
{{< example >}}
6262
<div class="bg-success p-2 text-white">This is default success background</div>
63-
<div class="bg-success p-2" style="--bs-bg-opacity: .5;">This is 50% opacity success background</div>
63+
<div class="bg-success p-2" style="--cui-bg-opacity: .5;">This is 50% opacity success background</div>
6464
{{< /example >}}
6565

6666
Or, choose from any of the `.bg-opacity` utilities:

‎docs/content/4.1/utilities/colors.md

Lines changed: 5 additions & 5 deletions
Original file line numberDiff line numberDiff line change
@@ -43,20 +43,20 @@ Consider our default `.text-primary` utility.
4343

4444
```css
4545
.text-primary {
46-
--bs-text-opacity: 1;
47-
color: rgba(var(--bs-primary-rgb), var(--bs-text-opacity)) !important;
46+
--cui-text-opacity: 1;
47+
color: rgba(var(--cui-primary-rgb), var(--cui-text-opacity)) !important;
4848
}
4949
```
5050

51-
We use an RGB version of our `--bs-primary` (with the value of `13, 110, 253`) CSS variable and attached a second CSS variable, `--bs-text-opacity`, for the alpha transparency (with a default value `1` thanks to a local CSS variable). That means anytime you use `.text-primary` now, your computed `color` value is `rgba(13, 110, 253, 1)`. The local CSS variable inside each `.text-*` class avoids inheritance issues so nested instances of the utilities don't automatically have a modified alpha transparency.
51+
We use an RGB version of our `--cui-primary` (with the value of `13, 110, 253`) CSS variable and attached a second CSS variable, `--cui-text-opacity`, for the alpha transparency (with a default value `1` thanks to a local CSS variable). That means anytime you use `.text-primary` now, your computed `color` value is `rgba(13, 110, 253, 1)`. The local CSS variable inside each `.text-*` class avoids inheritance issues so nested instances of the utilities don't automatically have a modified alpha transparency.
5252

5353
### Example
5454

55-
To change that opacity, override `--bs-text-opacity` via custom styles or inline styles.
55+
To change that opacity, override `--cui-text-opacity` via custom styles or inline styles.
5656

5757
{{< example >}}
5858
<div class="text-primary">This is default primary text</div>
59-
<div class="text-primary" style="--bs-text-opacity: .5;">This is 50% opacity primary text</div>
59+
<div class="text-primary" style="--cui-text-opacity: .5;">This is 50% opacity primary text</div>
6060
{{< /example >}}
6161

6262
Or, choose from any of the `.text-opacity` utilities:

‎docs/layouts/shortcodes/js-dismiss.html

Lines changed: 3 additions & 3 deletions
Original file line numberDiff line numberDiff line change
@@ -5,11 +5,11 @@
55
Dismissal can be achieved with the `data` attribute on a button **within the {{ $name }}** as demonstrated below:
66

77
```html
8-
<button type="button" class="btn-close" data-bs-dismiss="{{ $name }}" aria-label="Close"></button>
8+
<button type="button" class="btn-close" data-coreui-dismiss="{{ $name }}" aria-label="Close"></button>
99
```
1010

11-
or on a button **outside the {{ $name }}** using the `data-bs-target` as demonstrated below:
11+
or on a button **outside the {{ $name }}** using the `data-coreui-target` as demonstrated below:
1212

1313
```html
14-
<button type="button" class="btn-close" data-bs-dismiss="{{ $name }}" data-bs-target="#my-{{ $name }}" aria-label="Close"></button>
14+
<button type="button" class="btn-close" data-coreui-dismiss="{{ $name }}" data-coreui-target="#my-{{ $name }}" aria-label="Close"></button>
1515
```

0 commit comments

Comments
 (0)