Skip to content
Snippets Groups Projects
Commit a03cc3e6 authored by Tojo Andrianomentsoaniaina's avatar Tojo Andrianomentsoaniaina Committed by Julien MARGAIL
Browse files

vignette

parent 3805c13b
No related branches found
No related tags found
No related merge requests found
...@@ -110,6 +110,11 @@ interface Istats { ...@@ -110,6 +110,11 @@ interface Istats {
descriptionColor?: string descriptionColor?: string
} }
export function Stats(props: Istats): JSX.Element export function Stats(props: Istats): JSX.Element
interface Idata {
layout?: "row" | "col" | "grid"
size?: "xs" | "base" | "xl"
}
export function Data(props: Idata): JSX.Element
interface DataImage { interface DataImage {
src: string src: string
......
...@@ -48,6 +48,9 @@ export { default as Header } from "./src/components/Header" ...@@ -48,6 +48,9 @@ export { default as Header } from "./src/components/Header"
// Section components // Section components
export { default as Section } from "./src/components/Section" export { default as Section } from "./src/components/Section"
// Data components
export { default as Data } from "./src/components/Data"
// Section components // Section components
export { default as Sections } from "./src/components/Sections" export { default as Sections } from "./src/components/Sections"
......
import React, { useState, useEffect } from "react"
import CardList from "./core/CardList"
interface Idata {
layout?: "row" | "col" | "grid"
size?: "xs" | "base" | "xl"
}
const Data = (props: Idata) => {
const { layout = "row", size = "xs" } = props
const [data, setData] = useState<any[]>([])
useEffect(() => {
setData([
{
name: "Action",
description: "Action description for the Button",
size: "xs",
},
{
name: "Action",
description: "Action description for the Button",
size: "xs",
},
{
name: "Action",
description: "Action description for the Button",
size: "xs",
},
])
// fetch(`${MAPS_URL}&start=0&limit=${limit}`)
// .then((res) => {
// if (!res.ok) {
// throw new Error(res.statusText)
// }
// return res.json()
// })
// .then((response) => {
// const results = response.results
// if (results.length) {
// setData(results)
// }
// })
// .catch((e) => {
// console.log(e)
// })
}, [])
if (!data.length) return null
const dataCards = data.map((data: any) => {
return {
name: data.name,
description: data.description,
// image: `/geoportal/${data.thumbnail}`,
size: size,
// url: `/geoportal/#/context/Admin/${data.id}`,
}
})
return (
<div>
<CardList cards={dataCards} layout={layout} />
</div>
)
}
export default Data
import React, { ReactElement } from "react"
import { Content, Link, Data } from "@onegeo/gatsby-theme-onegeo"
function news(): ReactElement {
return (
<Content>
<div className="prose">
<Link to="/doc">Retour</Link>
<h1>Data</h1>
<h2>Props</h2>
<div className="mockup-code">
<pre>
<code>
{`
interface Idata {
layout?: "row" | "col" | "grid"
size?: "xs" | "base" | "xl"
}
`}
</code>
</pre>
</div>
<h2>Example</h2>
</div>
<div className=" max-w-[500px]">
<Data layout = "row" size = "xs"/>
</div>
</Content>
)
}
export default news
...@@ -34,6 +34,8 @@ function index(): ReactElement { ...@@ -34,6 +34,8 @@ function index(): ReactElement {
<br></br> <br></br>
<Link to="/doc/sections">Sections</Link> <Link to="/doc/sections">Sections</Link>
<br></br> <br></br>
<Link to="/doc/data">Data</Link>
<br></br>
<Link to="/doc/maps">Maps</Link> <Link to="/doc/maps">Maps</Link>
</div> </div>
</Content> </Content>
......
0% Loading or .
You are about to add 0 people to the discussion. Proceed with caution.
Finish editing this message first!
Please register or to comment