-
Notifications
You must be signed in to change notification settings - Fork 40
Commit
dev-->master
- Loading branch information
There are no files selected for viewing
Large diffs are not rendered by default.
Large diffs are not rendered by default.
Large diffs are not rendered by default.
Large diffs are not rendered by default.
Large diffs are not rendered by default.
Large diffs are not rendered by default.
Large diffs are not rendered by default.
Large diffs are not rendered by default.
Large diffs are not rendered by default.
Large diffs are not rendered by default.
Large diffs are not rendered by default.
Large diffs are not rendered by default.
Large diffs are not rendered by default.
Original file line number | Diff line number | Diff line change |
---|---|---|
@@ -0,0 +1,15 @@ | ||
--- | ||
title: Download CSV Link | ||
componentName: DownloadCsvLink | ||
patternCategory: Layouts | ||
--- | ||
|
||
``` | ||
<DownloadCsvLink to="/explore/#production" >Download production data</DownloadCsvLink> | ||
``` | ||
|
||
## How to use | ||
The Download CSV Link component includes a custom icon and produces a link style for downloading `csv` versions of our data files. | ||
|
||
In markdown files, use the `<csv-link>` variant. | ||
|
Original file line number | Diff line number | Diff line change |
---|---|---|
@@ -0,0 +1,25 @@ | ||
import React from 'react'; | ||
import PropTypes from 'prop-types'; | ||
import Link from '../../../utils/temp-link'; | ||
|
||
import styles from "./DownloadCsvLink.module.scss" | ||
|
||
import DownloadCsvIcon from '-!svg-react-loader!../../../../img/svg/icon-download-csv.svg'; | ||
|
||
const DownloadCsvLink = (props) => ( | ||
<Link to={props.to} className={styles.root}> | ||
<DownloadCsvIcon /> | ||
<span> | ||
{props.children === undefined ? | ||
'Download' : | ||
props.children} | ||
</span> | ||
</Link> | ||
); | ||
|
||
DownloadCsvLink.propTypes = { | ||
/** The url for the link */ | ||
to: PropTypes.string, | ||
} | ||
|
||
export default DownloadCsvLink; |
Original file line number | Diff line number | Diff line change |
---|---|---|
@@ -0,0 +1,12 @@ | ||
@value colors: "../../../../css-global/colors.scss"; | ||
@value blue as _blue from colors; | ||
|
||
.root svg{ | ||
fill: currentColor; | ||
vertical-align: middle; | ||
margin-right: 8px; | ||
} | ||
|
||
.root span{ | ||
vertical-align: baseline; | ||
} |
Original file line number | Diff line number | Diff line change |
---|---|---|
@@ -0,0 +1 @@ | ||
export default from './DownloadCsvLink'; |
Original file line number | Diff line number | Diff line change |
---|---|---|
@@ -0,0 +1,15 @@ | ||
--- | ||
title: Download Excel Link | ||
componentName: DownloadExcelLink | ||
patternCategory: Layouts | ||
--- | ||
|
||
``` | ||
<DownloadExcelLink to="/explore/#production" >Download production data</DownloadExcelLink> | ||
``` | ||
|
||
## How to use | ||
The Download Excel Link component includes a custom icon and produces a link style for downloading `xlsx` versions of our data files. | ||
|
||
In markdown files, use the `<excel-link>` variant. | ||
|
Original file line number | Diff line number | Diff line change |
---|---|---|
@@ -0,0 +1,25 @@ | ||
import React from 'react'; | ||
import PropTypes from 'prop-types'; | ||
import Link from '../../../utils/temp-link'; | ||
|
||
import styles from "./DownloadExcelLink.module.scss" | ||
|
||
import DownloadExcelIcon from '-!svg-react-loader!../../../../img/svg/icon-download-xls.svg'; | ||
|
||
const DownloadExcelLink = (props) => ( | ||
<Link to={props.to} className={styles.root}> | ||
<DownloadExcelIcon /> | ||
<span> | ||
{props.children === undefined ? | ||
'Download' : | ||
props.children} | ||
</span> | ||
</Link> | ||
); | ||
|
||
DownloadExcelLink.propTypes = { | ||
/** The url for the link */ | ||
to: PropTypes.string, | ||
} | ||
|
||
export default DownloadExcelLink; |
Original file line number | Diff line number | Diff line change |
---|---|---|
@@ -0,0 +1,12 @@ | ||
@value colors: "../../../../css-global/colors.scss"; | ||
@value blue as _blue from colors; | ||
|
||
.root svg{ | ||
fill: currentColor; | ||
vertical-align: middle; | ||
margin-right: 8px; | ||
} | ||
|
||
.root span{ | ||
vertical-align: baseline; | ||
} |
Original file line number | Diff line number | Diff line change |
---|---|---|
@@ -0,0 +1 @@ | ||
export default from './DownloadExcelLink'; |