docs: minor formatting

Author: posva

packages/docs/.vitepress/components/VueSchoolLink.vue

@@ -10,14 +10,11 @@
     </a>
   </div>
 </template>
-<script>
-export default {
-  props: {
-    href: { type: String, required: true },
-    title: { type: String, required: true },
-  },
-}
+
+<script setup lang="ts">
+defineProps<{ href: string; title: string }>()
 </script>
+
 <style scoped>
 .vueschool {
   margin-top: 20px;
@@ -55,4 +52,4 @@ export default {
   border-bottom: 5px solid transparent;
   border-left: 8px solid #fff;
 }
-</style>
+</style>

packages/docs/.vitepress/theme/index.js

@@ -3,7 +3,7 @@ import VueSchoolLink from '../components/VueSchoolLink.vue'
 import { Layout } from './Layout'
 import './custom.css'
 import './code-theme.css'
-// import { createPinia } from '../../../pinia'
+// import { createPinia } from 'pinia'
 
 /** @type {import('vitepress').Theme} */
 const config = {
@@ -12,6 +12,7 @@ const config = {
   Layout,
 
   enhanceApp({ app }) {
+    // app.use(createPinia())
     app.component('VueSchoolLink', VueSchoolLink)
   },
 }

packages/docs/core-concepts/actions.md

@@ -1,6 +1,9 @@
 # Actions
 
-<VueSchoolLink href="https://vueschool.io/lessons/synchronous-and-asynchronous-actions-in-pinia"/>
+<VueSchoolLink
+  href="https://vueschool.io/lessons/synchronous-and-asynchronous-actions-in-pinia"
+  title="Learn all about actions in Pinia"
+/>
 
 Actions are the equivalent of [methods](https://v3.vuejs.org/guide/data-methods.html#methods) in components. They can be defined with the `actions` property in `defineStore()` and **they are perfect to define business logic**:
 

packages/docs/core-concepts/getters.md

@@ -1,6 +1,9 @@
 # Getters
 
-<VueSchoolLink href="https://vueschool.io/lessons/getters-in-pinia"/>
+<VueSchoolLink
+  href="https://vueschool.io/lessons/getters-in-pinia"
+  title="Learn all about getters in Pinia"
+/>
 
 Getters are exactly the equivalent of [computed values](https://v3.vuejs.org/guide/reactivity-computed-watchers.html#computed-values) for the state of a Store. They can be defined with the `getters` property in `defineStore()`. They receive the `state` as the first parameter **to encourage** the usage of arrow function:
 

packages/docs/core-concepts/index.md

@@ -1,6 +1,9 @@
 # Defining a Store
 
-<VueSchoolLink href="https://vueschool.io/lessons/define-your-first-pinia-store"/>
+<VueSchoolLink
+  href="https://vueschool.io/lessons/define-your-first-pinia-store"
+  title="Learn how to define and use stores in Pinia"
+/>
 
 Before diving into core concepts, we need to know that a store is defined using `defineStore()` and that it requires a **unique** name, passed as the first argument:
 

packages/docs/core-concepts/state.md

@@ -1,6 +1,9 @@
 # State
 
-<VueSchoolLink href="https://vueschool.io/lessons/access-state-from-a-pinia-store"/>
+<VueSchoolLink
+  href="https://vueschool.io/lessons/access-state-from-a-pinia-store"
+  title="Learn all about state in Pinia"
+/>
 
 The state is, most of the time, the central part of your store. People often start by defining the state that represents their app. In Pinia the state is defined as a function that returns the initial state. This allows Pinia to work in both Server and Client Side.
 

packages/docs/introduction.md

@@ -1,6 +1,9 @@
 # Introduction
 
-<VueSchoolLink href="https://vueschool.io/lessons/introduction-to-pinia"/>
+<VueSchoolLink
+  href="https://vueschool.io/lessons/introduction-to-pinia"
+  title="Get started with Pinia"
+/>
 
 Pinia [started](https://github.com/vuejs/pinia/commit/06aeef54e2cad66696063c62829dac74e15fd19e) as an experiment to redesign what a Store for Vue could look like with the [Composition API](https://github.com/vuejs/composition-api) around November 2019. Since then, the initial principles are still the same, but Pinia works for both Vue 2 and Vue 3 **and doesn't require you to use the composition API**. The API is the same for both except for _installation_ and _SSR_, and these docs are targeted to Vue 3 **with notes about Vue 2** whenever necessary so it can be read by Vue 2 and Vue 3 users!