pkp/pkp-lib#9527 Documentation WIP

src/composables/useApiUrl.mdx

@@ -0,0 +1,15 @@
+import {Meta} from '@storybook/blocks';
+
+<Meta title="Composables/useApiUrl" />
+
+# useApiUrl
+
+Simple composable to generate API URL. It correctly generates API URL based on currect context (Journal) selected. It does not cover adding query params, as query params are passed separately when making the request with [useFetch](?path=/docs/composables-usefetch--docs).
+
+```javascript
+import {useApiUrl} from '@/composables/useApiUrl';
+
+const {apiUrl: submissionApiUrl} = useApiUrl(
+	`submissions/${props.submissionId}`,
+);
+```

src/docs/guide/APIInteractions.mdx

@@ -8,4 +8,10 @@ To interact with the API there are handy composables to simplify the process.
 
 ## Compose URL
 
-First its necessary to generate correct API URL. For that use
+Once you know which API endpoint you want to interact with, its necessary to create correct API URL based on current context. Use [useApiUrl](?path=/docs/composables-useapiurl--docs) composable to achieve that.
+
+## Making HTTP requests
+
+To make HTTP request to the API, best is use dedicated [useFetch](?path=/docs/composables-usefetch--docs) or [useFetchPaginated](?path=/docs/composables-usefetchpaginated--docs) composables. Refer to their documentation for examples.
+
+For more custom use-cases its possible to use directly underlying [ofetch](https://github.com/unjs/ofetch) package.

tailwind.config.js

@@ -38,7 +38,7 @@ export default {
 			...colors,
 			dark: '#222222',
 			'dark-accent': '#01354F',
-			light: '#777777',
+			light: '#505050',
 			lightest: '#FFFFFF',
 		},
 		borderColor: {