Skip to content

Commit 31c06b5

Browse files
Hiwsjacobmllr95
Hiws
and
jacobmllr95
authored
feat(b-skeleton): add skeleton components (closes #5413) (#5575)
* init * Update * Apply basic border-radius to type `text` * update skeleton-image.js * update component references * Add icon loader * Add BSkeletonIcon to package.json * Update _variables.scss * Update styles.scss * Update _skeleton.scss * Update README.md * Update skeleton.js * Update skeleton-icon.js * Update skeleton-image.js * Update skeleton-table.js * Update skeleton-wrapper.js * Adjust BundleWatch limits * Rename `<b-skeleton-image>` to `<b-skeleton-img>` and improve docs * Update README.md * Update .bundlewatch.config.json * Update build.yml * update skeleton-table.js * update package.json * update _skeleton.scss * Add tests * update skeleton-wrapper.spec.js * update _variables.scss * update readme.md * update package.json * Un-mark all other components as "New" * Update _variables.scss * Update README.md * Update package.json * Update README.md * Update README.md * Update README.md Co-authored-by: Jacob Müller <jacob.mueller.elz@gmail.com>
1 parent 43806dc commit 31c06b5

29 files changed

+1343
-8
lines changed

‎docs/assets/scss/styles.scss

Lines changed: 1 addition & 1 deletion
Original file line numberDiff line numberDiff line change
@@ -36,7 +36,7 @@
3636
-webkit-font-smoothing: antialiased;
3737
-moz-osx-font-smoothing: grayscale;
3838

39-
&:after {
39+
&::after {
4040
content: "#";
4141
}
4242
}

‎src/_variables.scss

Lines changed: 8 additions & 0 deletions
Original file line numberDiff line numberDiff line change
@@ -152,3 +152,11 @@ $bv-enable-popover-variants: true !default;
152152
$b-popover-bg-level: $alert-bg-level !default;
153153
$b-popover-border-level: $alert-border-level !default;
154154
$b-popover-color-level: $alert-color-level !default;
155+
156+
// --- Skeleton ---
157+
158+
$b-skeleton-background-color: rgba(0, 0, 0, 0.12) !default;
159+
$b-skeleton-loading-cursor: wait !default;
160+
$b-skeleton-animation-duration: 1.75s !default;
161+
$b-skeleton-text-spacing: map-get($spacers, 1) !default;
162+
$b-skeleton-btn-width: 75px !default;

‎src/components/aspect/package.json

Lines changed: 0 additions & 1 deletion
Original file line numberDiff line numberDiff line change
@@ -3,7 +3,6 @@
33
"version": "1.0.0",
44
"meta": {
55
"title": "Aspect",
6-
"new": true,
76
"version": "2.9.0",
87
"description": "The `<b-aspect>` component can be used to maintain a minimum responsive aspect ratio for content.",
98
"components": [

‎src/components/avatar/package.json

Lines changed: 0 additions & 1 deletion
Original file line numberDiff line numberDiff line change
@@ -3,7 +3,6 @@
33
"version": "1.0.0",
44
"meta": {
55
"title": "Avatar",
6-
"new": true,
76
"version": "2.8.0",
87
"description": "Avatars are typically used to display a user profile as a picture, an icon, or short text.",
98
"components": [

‎src/components/form-rating/package.json

Lines changed: 0 additions & 1 deletion
Original file line numberDiff line numberDiff line change
@@ -4,7 +4,6 @@
44
"meta": {
55
"title": "Form Rating",
66
"version": "2.12.0",
7-
"new": true,
87
"description": "BootstrapVue custom star rating form control for ratings entry or aggregated display",
98
"components": [
109
{

‎src/components/index.d.ts

Lines changed: 1 addition & 0 deletions
Original file line numberDiff line numberDiff line change
@@ -47,6 +47,7 @@ export * from './pagination-nav'
4747
export * from './popover'
4848
export * from './progress'
4949
export * from './sidebar'
50+
export * from './skeleton'
5051
export * from './spinner'
5152
export * from './table'
5253
export * from './tabs'

‎src/components/index.js

Lines changed: 2 additions & 0 deletions
Original file line numberDiff line numberDiff line change
@@ -44,6 +44,7 @@ import { PaginationNavPlugin } from './pagination-nav'
4444
import { PopoverPlugin } from './popover'
4545
import { ProgressPlugin } from './progress'
4646
import { SidebarPlugin } from './sidebar'
47+
import { SkeletonPlugin } from './skeleton'
4748
import { SpinnerPlugin } from './spinner'
4849
// Table plugin includes TableLitePlugin and TableSimplePlugin
4950
import { TablePlugin } from './table'
@@ -98,6 +99,7 @@ export const componentsPlugin = /*#__PURE__*/ pluginFactory({
9899
PopoverPlugin,
99100
ProgressPlugin,
100101
SidebarPlugin,
102+
SkeletonPlugin,
101103
SpinnerPlugin,
102104
TablePlugin,
103105
TabsPlugin,

‎src/components/index.scss

Lines changed: 1 addition & 0 deletions
Original file line numberDiff line numberDiff line change
@@ -16,6 +16,7 @@
1616
@import "pagination/index";
1717
@import "pagination-nav/index";
1818
@import "popover/index";
19+
@import "skeleton/index";
1920
@import "sidebar/index";
2021
@import "table/index";
2122
@import "time/index";

‎src/components/sidebar/README.md

Lines changed: 3 additions & 3 deletions
Original file line numberDiff line numberDiff line change
@@ -328,9 +328,9 @@ elements outside of the sidebar.
328328

329329
### `v-b-toggle` directive
330330

331-
Using the [`v-b-toggle` directive](/docs/directive/toggle) is the preferred method for _opening_ the
332-
sidebar, as it automatically handles applying the `aria-controls` and `aria-expanded` accessibility
333-
attributes on the trigger element.
331+
Using the [`v-b-toggle` directive](/docs/directives/toggle) is the preferred method for _opening_
332+
the sidebar, as it automatically handles applying the `aria-controls` and `aria-expanded`
333+
accessibility attributes on the trigger element.
334334

335335
The majority of examples on this page use the `v-b-toggle` directive.
336336

‎src/components/sidebar/package.json

Lines changed: 0 additions & 1 deletion
Original file line numberDiff line numberDiff line change
@@ -3,7 +3,6 @@
33
"version": "1.0.0",
44
"meta": {
55
"title": "Sidebar",
6-
"new": true,
76
"version": "2.10.0",
87
"description": "The `<b-sidebar>` component creates a fixed viewport, left or right, sliding popout drawer.",
98
"plugins": [

0 commit comments

Comments
 (0)