import React from 'react'
import styled from 'styled-components'
import FeatureCard from './FeatureCard'
import { FeatureLink } from '../links'
import { Flex } from 'rebass'
import rectangles from '../../images/background-rectangles.svg'
import terminalIcon from '../../images/terminal-icon.svg'
import networkIcon from '../../images/network-icon.svg'
import npmIcon from '../../images/npm-icon.png'
import managerIcon from '../../images/manager-icon.svg'
const ContainerInner = styled(Flex)`
background: linear-gradient(84deg, #fb881799, #ff4b0199, #c1212799, #e02aff99);
`
const Container = styled.div`
background: top / cover no-repeat url(${rectangles});
`
const ContentWrapper = styled(Flex)`
max-width: 640px;
`
const featureTexts = {
textOne: 'Download, install, and configure.',
textTwo: 'All available npm commands.',
textThree: 'How npm things work.',
textFour: 'Publish your own public or private packages to the registry with a free or paid account on npmjs.com from npm, Inc.'
}
const featureTitles = {
titleOne: 'Getting Started',
titleTwo: 'Command Reference',
titleThree: 'Using npm',
titleFour: 'Publishing'
}
const aStyle = {
color: '#231f20',
textDecoration: 'none'
}
const productsLink = `https://www.npmjs.com/products`
const Features = () => {
return (
)
}
export default Features