govil-strip-menu-icons

A strip of boxes that includes a big icon centered.
Implemented with Router & Link.

How to use

Clone this repo to your local computer, then run:

- npm install && npm run build

You can now import govil-strip-menu-icons as a normal package installed from npm like so:

``
import StripMenuIcons from 'govil-strip-menu-icons';
...
`

You can also import the type definitions if you're using TypeScript like so:

`
import StripMenuIcons, { ISItems, ISItem } from 'govil-strip-menu-icons';
...
`

Available props

`
interface ISItems {
items: Array
}

interface ISItem {
link: string; // router link
icon: string; // image src url
title: string; //on Hover ect
}

`

To customize this component, pass ComponentModel to the items prop.

`
// your-component.tsx
import StripMenuIcons, { ISItems } from 'govil-strip-menu-icons';

const StripMenuIconsDemo: ISItems = {
items: [{
icon: 'https://www.gov.il/BlobFolder/../a.png',
link: '/a',
title: 'title a'
},{
icon: 'https://www.gov.il/BlobFolder/../b.png',
link: '/b',
title: 'title b'
},{
icon: 'https://www.gov.il/BlobFolder/../c.png',
link: '/c',
title: 'title c'
},{
icon: 'https://www.gov.il/BlobFolder/../d.png',
link: '/d',
title: 'title d'
},{
icon: 'https://www.gov.il/BlobFolder/../e.png',
link: '/e',
title: 'title e'
}]
}

...


//or
...
``

This component was built for the benefit of the citizens of Israel and the OpenSource community on behalf of the Israeli government and freely published in npm