summaryrefslogtreecommitdiff
path: root/docs/guide/components/page-title/index.md
diff options
context:
space:
mode:
authorDerick Montague <derick.montague@ibm.com>2020-12-10 03:37:11 +0300
committerDerick Montague <derick.montague@ibm.com>2020-12-16 02:12:41 +0300
commitf6df801b384118b946bb3b7b3248832ec70cfd0a (patch)
tree0866ee9fcb2dce300631bdf82a041bfb3a54068a /docs/guide/components/page-title/index.md
parent34efde291781c01c78e4363d919cdf4d5c90ae43 (diff)
downloadwebui-vue-f6df801b384118b946bb3b7b3248832ec70cfd0a.tar.xz
Update component documentation
The component structure was not consistent. We determined how we wanted to save image examples within the component directory, but not all of the components were updated. The result was that some images were not displaying on the component pages. This patchset resolves that issue, along with removing the page component since it is not an actual component within the application. - Add directory for each component, move example images to the directory, and update the image path - Create a page-title and page-section directory and index.md for each - Move content for page-title and page-section from the page.md file into the index.md within the respective component directory - Delete the page.md from the component directory as it is not a component - Update links to page.md in the page-anatomy.md file. Signed-off-by: Derick Montague <derick.montague@ibm.com> Change-Id: I1e554adf71abb4c84f423a30d3c3b598f678ade0
Diffstat (limited to 'docs/guide/components/page-title/index.md')
-rw-r--r--docs/guide/components/page-title/index.md23
1 files changed, 23 insertions, 0 deletions
diff --git a/docs/guide/components/page-title/index.md b/docs/guide/components/page-title/index.md
new file mode 100644
index 00000000..b51ab640
--- /dev/null
+++ b/docs/guide/components/page-title/index.md
@@ -0,0 +1,23 @@
+# Page title
+The `<page-title>` component will automatically render the page title that corresponds with the title property set in the route record's meta field in `src/router/routes.js`.
+
+```js
+// src/router/routes.js
+ {
+ path: '',
+ name: 'login',
+ component: Login,
+ meta: {
+ title: i18n.t('appPageTitle.login'),
+ },
+ },
+```
+
+Optional page descriptions can be included by using the description prop `:description` prop and passing in the i18n localized text string. Translations are found in the `src/locales` folder.
+
+``` vue
+// Example: `src/views/AccessControl/Ldap/Ldap.vue`
+ <page-title :description="$t('pageLdap.pageDescription')" />
+```
+
+[View the page title component source code](https://github.com/openbmc/webui-vue/blob/master/src/components/Global/PageTitle.vue).