updates doc clod
This commit is contained in:
parent
362f0933d9
commit
fc11e2fab1
2 changed files with 31 additions and 29 deletions
|
|
@ -6,9 +6,11 @@ import * as DocumentCloudStories from './DocumentCloud.stories.svelte';
|
|||
|
||||
# DocumentCloud
|
||||
|
||||
The `DocumentCloud` component embeds a document hosted by [DocumentCloud](https://documentcloud.org)
|
||||
The `DocumentCloud` component embeds a document hosted by [DocumentCloud](https://documentcloud.org).
|
||||
|
||||
The document must have its access level set to public before it can be embedded. The `slug` argument can be found after the final slash in the document's URL. For instance, the document included in the example is found at [documentcloud.org/documents/3259984-Trump-Intelligence-Allegations](https://www.documentcloud.org/documents/3259984-Trump-Intelligence-Allegations). The slug is "3259984-Trump-Intelligence-Allegations".
|
||||
The document must have its access level set to **public** before it can be embedded. The `slug` can be found after the final slash in the document's URL.
|
||||
|
||||
For instance, the document included in the example is found at [documentcloud.org/documents/3259984-Trump-Intelligence-Allegations](https://www.documentcloud.org/documents/3259984-Trump-Intelligence-Allegations). The `slug` is `3259984-Trump-Intelligence-Allegations`.
|
||||
|
||||
```svelte
|
||||
<script>
|
||||
|
|
@ -18,7 +20,6 @@ The document must have its access level set to public before it can be embedded.
|
|||
<DocumentCloud
|
||||
slug="3259984-Trump-Intelligence-Allegations"
|
||||
altText="These Reports Allege Trump Has Deep Ties To Russia"
|
||||
width="normal"
|
||||
/>
|
||||
```
|
||||
|
||||
|
|
|
|||
|
|
@ -1,33 +1,34 @@
|
|||
<!-- @component `DocumentCloud` [Read the docs.](https://reuters-graphics.github.io/graphics-components/?path=/docs/components-multimedia-documentcloud--docs) -->
|
||||
<script lang="ts">
|
||||
import type { ContainerWidth } from '../@types/global';
|
||||
/** ✏️ DOCUMENT your chart's props using TypeScript and JSDoc comments like below! */
|
||||
|
||||
/**
|
||||
* Width of the container, one of: normal, wide, wider, widest or fluid
|
||||
*/
|
||||
export let width: ContainerWidth = 'normal';
|
||||
|
||||
/**
|
||||
* The unique identifier for the document.
|
||||
* @required
|
||||
*/
|
||||
export let slug: string;
|
||||
|
||||
/**
|
||||
* Alt text for the document.
|
||||
* @required
|
||||
*/
|
||||
export let altText: string;
|
||||
|
||||
/** Add an ID to target with SCSS. */
|
||||
export let id: string = '';
|
||||
|
||||
/** Add a class to target with SCSS. */
|
||||
let cls: string = '';
|
||||
export { cls as class };
|
||||
|
||||
import Block from '../Block/Block.svelte';
|
||||
|
||||
interface Props {
|
||||
/**
|
||||
* The unique identifier for the document.
|
||||
*/
|
||||
slug: string;
|
||||
/**
|
||||
* Alt text for the document.
|
||||
*/
|
||||
altText: string;
|
||||
/**
|
||||
* Width of the container, one of: normal, wide, wider, widest or fluid
|
||||
*/
|
||||
width?: ContainerWidth;
|
||||
/** Add an ID to target with SCSS. */
|
||||
id?: string;
|
||||
/** Add a class to target with SCSS. */
|
||||
class?: string; // Add a class to target with SCSS.
|
||||
}
|
||||
|
||||
let {
|
||||
slug,
|
||||
altText,
|
||||
width = 'normal',
|
||||
id = '',
|
||||
class: cls = '',
|
||||
}: Props = $props();
|
||||
</script>
|
||||
|
||||
<Block {width} {id} class="photo fmy-6 {cls}">
|
||||
|
|
|
|||
Loading…
Reference in a new issue