diff --git a/docs/pages/installation.vue b/docs/pages/installation.vue
index 17e8491fe..d2ee658bf 100644
--- a/docs/pages/installation.vue
+++ b/docs/pages/installation.vue
@@ -11,11 +11,16 @@
+
- import KThemePlugin from 'kolibri-design-system/lib/KThemePlugin'; import trackInputModality
- from 'kolibri-design-system/lib/styles/trackInputModality'; import trackMediaType from
- 'kolibri-design-system/lib/styles/trackMediaType'; Vue.use(KThemePlugin);
- trackInputModality(); trackMediaType();
+ import KThemePlugin from 'kolibri-design-system/lib/KThemePlugin';
+ import trackInputModality from 'kolibri-design-system/lib/styles/trackInputModality';
+ import trackMediaType from 'kolibri-design-system/lib/styles/trackMediaType';
+
+ Vue.use(KThemePlugin);
+
+ trackInputModality();
+ trackMediaType();
diff --git a/docs/pages/kcard.vue b/docs/pages/kcard.vue
index 7a4f234ae..876a09e12 100644
--- a/docs/pages/kcard.vue
+++ b/docs/pages/kcard.vue
@@ -402,8 +402,15 @@
+
- export default { methods() { onClick() { console.log('Card clicked'); } }, };
+ export default {
+ methods() {
+ onClick() {
+ console.log('Card clicked');
+ }
+ },
+ };
diff --git a/docs/pages/ktabslist.vue b/docs/pages/ktabslist.vue
index 62e04a701..4dd3b87f4 100644
--- a/docs/pages/ktabslist.vue
+++ b/docs/pages/ktabslist.vue
@@ -72,8 +72,16 @@
- data() { return { activeTabId: 'tabLessons', tabs: [ { id: 'tabLessons', label: 'Lessons' },
- { id: 'tabLearners', label: 'Learners' }, { id: 'tabGroups', label: 'Groups' }, ], }; },
+ data() {
+ return {
+ activeTabId: 'tabLessons',
+ tabs: [
+ { id: 'tabLessons', label: 'Lessons' },
+ { id: 'tabLearners', label: 'Learners' },
+ { id: 'tabGroups', label: 'Groups' },
+ ],
+ };
+ },
@@ -96,9 +104,15 @@
- data() { return { tabs: [ { id: 'tabLessons', label: 'Lessons', to: { path: '/lessons' } },
- { id: 'tabLearners', label: 'Learners', to: { path: '/learners' } }, { id: 'tabGroups',
- label: 'Groups', to: { path: '/groups' } }, ], }; },
+ data() {
+ return {
+ tabs: [
+ { id: 'tabLessons', label: 'Lessons', to: { path: '/lessons' } },
+ { id: 'tabLearners', label: 'Learners', to: { path: '/learners' } },
+ { id: 'tabGroups', label: 'Groups', to: { path: '/groups' } },
+ ],
+ };
+ },
@@ -343,7 +357,11 @@
- icons: { tabLessons: 'lesson', tabLearners: 'person', tabGroups: 'people', },
+ icons: {
+ tabLessons: 'lesson',
+ tabLearners: 'person',
+ tabGroups: 'people',
+ },
diff --git a/docs/pages/layout/index.vue b/docs/pages/layout/index.vue
index b889c8309..046ea04e1 100644
--- a/docs/pages/layout/index.vue
+++ b/docs/pages/layout/index.vue
@@ -121,7 +121,7 @@
Responsive layouts in the design system are built using reactive JavaScript state in Vue
components rather than CSS media queries. This is done using
when reactive window's size information
- is needed or when reactive component's
+ is needed or when reactive component's
size information is needed.
diff --git a/package.json b/package.json
index a5a5b7493..2d2865da9 100644
--- a/package.json
+++ b/package.json
@@ -1,6 +1,6 @@
{
"name": "kolibri-design-system",
- "version": "5.0.0-rc10",
+ "version": "5.0.0-rc11",
"private": false,
"description": "The Kolibri Design System defines common design patterns and code for use in Kolibri applications",
"repository": {