Dylan/excalidraw
1
0
Fork 0
Code Issues Pull Requests Actions Packages Projects Releases Wiki Activity

Docs for font picker

Browse Source
This commit is contained in:
Marcel Mraz 2024-07-17 17:51:04 +02:00
parent 15b7d141c1
commit 43d6a7e286
2 changed files with 25 additions and 5 deletions
Show Stats Download Patch File Download Diff File Expand all files Collapse all files

10
dev-docs/docs/@excalidraw/excalidraw/api/constants.mdx
View File

@ -8,15 +8,15 @@
import { FONT_FAMILY } from "@excalidraw/excalidraw"; import { FONT_FAMILY } from "@excalidraw/excalidraw";
``` ```
`FONT_FAMILY` contains all the font families used in `Excalidraw` as explained below `FONT_FAMILY` contains all the font families used in `Excalidraw`. The default families are the following:
| Font Family | Description | | Font Family | Description |
| ----------- | ---------------------- | | ----------- | ---------------------- |
| `Virgil` | The `handwritten` font | | `Excalifont` | The `Hand-drawn` font |
| `Helvetica` | The `Normal` Font | | `Nunito` | The `Normal` Font |
| `Cascadia` | The `Code` Font | | `Comic Shanns` | The `Code` Font |
Defaults to `FONT_FAMILY.Virgil` unless passed in `initialData.appState.currentItemFontFamily`. Pre-selected family is `FONT_FAMILY.Excalifont`, unless it's overriden with `initialData.appState.currentItemFontFamily`.
### THEME ### THEME

20
dev-docs/docs/@excalidraw/excalidraw/installation.mdx
View File

@ -34,6 +34,26 @@ Copy these folders to your static assets directory, and add a `window.EXCALIDRAW
window.EXCALIDRAW_ASSET_PATH = "/"; window.EXCALIDRAW_ASSET_PATH = "/";
``` ```
or, if you serve your assets from the root of your CDN, you would do:
```js
// Vanilla
<head>
<script>
window.EXCALIDRAW_ASSET_PATH = "https://my.cdn.com/assets/";
</script>
</head>
```
or, if you prefer the path to be dynamicly set based on the `location.origin`, you could do the following:
```jsx
// Next.js
<Script id="load-env-variables" strategy="beforeInteractive" >
{ `window["EXCALIDRAW_ASSET_PATH"] = location.origin;` } // or use just "/"!
</Script>
```
### Dimensions of Excalidraw ### Dimensions of Excalidraw
Excalidraw takes _100%_ of `width` and `height` of the containing block so make sure the container in which you render Excalidraw has non zero dimensions. Excalidraw takes _100%_ of `width` and `height` of the containing block so make sure the container in which you render Excalidraw has non zero dimensions.