feat: add azure devops icon (#718)

Author: jsladerman

src/components/ContentCard.tsx

@@ -0,0 +1,18 @@
+import createIcon from './createIcon'
+export default createIcon(({ size, color, fullColor }) => {
+  return (
+    <svg
+      xmlns="http://www.w3.org/2000/svg"
+      width={size}
+      height={size}
+      viewBox="0 0 365 365"
+    >
+      <g
+        fill={fullColor ? '#0078D7' : color}
+        fillRule="evenodd"
+      >
+        <path d="M273.32 82.016 35.859 125.735v116.408L0 237.278V133.574l35.858-47.19 124.868-48.986L160.26 0zm0 0v193.776l-237.463-32.1 100.325 117.462v-43.595l137.137 43.595 90.033-74.456V65.16z"></path>
+      </g>
+    </svg>
+  )
+})

src/components/icons/AzureDevopsLogoIcon.tsx

@@ -11,6 +11,7 @@ export { default as ArrowRightIcon } from './components/icons/ArrowRightIcon'
 export { default as ArrowRightLeftIcon } from './components/icons/ArrowRightLeftIcon'
 export { default as ArrowTopRightIcon } from './components/icons/ArrowTopRightIcon'
 export { default as AwsLogoIcon } from './components/icons/AwsLogoIcon'
+export { default as AzureDevopsLogoIcon } from './components/icons/AzureDevopsLogoIcon'
 export { default as AzureLogoIcon } from './components/icons/AzureLogoIcon'
 export { default as BellIcon } from './components/icons/BellIcon'
 export { default as BitBucketIcon } from './components/icons/BitBucketIcon'

src/icons.ts

@@ -46,7 +46,6 @@ export { default as Code } from './components/Code'
 export { default as CodeEditor } from './components/CodeEditor'
 export { default as Codeline } from './components/Codeline'
 export { ComboBox } from './components/ComboBox'
-export { default as ContentCard } from './components/ContentCard'
 export { default as Date } from './components/Date'
 export { default as Divider } from './components/Divider'
 export { default as EmptyState } from './components/EmptyState'

src/index.ts

@@ -3,9 +3,9 @@ import { useState } from 'react'
 
 import ErrorIcon from '../components/icons/ErrorIcon'
 
-import ContentCard from '../components/ContentCard'
 import Tab from '../components/Tab'
 import SubTab from '../components/SubTab'
+import Card from '../components/Card'
 
 export default {
   title: 'Tab',
@@ -182,18 +182,25 @@ function SubTabTemplate(args: any) {
       gap="large"
     >
       <SubTabs {...args} />
-      <ContentCard>
+      <Card style={contentCardStyle}>
         <SubTabs {...args} />
-      </ContentCard>
-      <ContentCard fillLevel={2}>
+      </Card>
+      <Card style={contentCardStyle}>
         <SubTabs {...args} />
-      </ContentCard>
-      <ContentCard fillLevel={3}>
+      </Card>
+      <Card style={contentCardStyle}>
         <SubTabs {...args} />
-      </ContentCard>
+      </Card>
     </Flex>
   )
 }
+const contentCardStyle = {
+  padding: 32,
+  display: 'flex',
+  flexDirection: 'column',
+  alignItems: 'center',
+  justifyContent: 'center',
+}
 
 export const Subtab = SubTabTemplate.bind({})