Skip to content
This repository was archived by the owner on Mar 4, 2020. It is now read-only.

Commit ef38731

Browse files
VyshnaviDasarialinais
VyshnaviDasari
authored and
alinais
committed
feat(Icons): Added five svg Microsoft Teams icons to theme icons (#474)
* Added five icons to icons file * Arranged icons in alphabetical order * Added outlines for icons
1 parent 7ada6ac commit ef38731

File tree

6 files changed

+182
-0
lines changed

6 files changed

+182
-0
lines changed

‎src/themes/teams/components/Icon/svg/icons/add.tsx

Lines changed: 34 additions & 0 deletions
Original file line numberDiff line numberDiff line change
@@ -0,0 +1,34 @@
1+
import * as React from 'react'
2+
import { TeamsSvgIconSpec } from '../types'
3+
4+
export default {
5+
icon: ({ classes }) => (
6+
<svg viewBox="0 0 32 32" role="presentation" focusable="false" className={classes.svg}>
7+
<path
8+
className={classes.outlinePart}
9+
d="M23.3516,16.1172C23.4502,16.2168,23.5,16.334,23.5,16.4688c0,0.1357-0.0498,0.2529-0.1484,0.3516
10+
C23.252,16.9199,23.1348,16.9688,23,16.9688h-6v6c0,0.1357-0.0498,0.2529-0.1484,0.3516c-0.0996,0.0996-0.2168,0.1484-0.3516,0.1484
11+
c-0.1357,0-0.2529-0.0488-0.3516-0.1484C16.0488,23.2217,16,23.1045,16,22.9688v-6h-6c-0.1357,0-0.2529-0.0488-0.3516-0.1484
12+
C9.5493,16.7217,9.5,16.6045,9.5,16.4688c0-0.1348,0.0493-0.252,0.1484-0.3516C9.7471,16.0186,9.8643,15.9688,10,15.9688h6v-6
13+
c0-0.1353,0.0488-0.2524,0.1484-0.3516c0.0986-0.0986,0.2158-0.1484,0.3516-0.1484c0.1348,0,0.252,0.0498,0.3516,0.1484
14+
C16.9502,9.7163,17,9.8335,17,9.9688v6h6C23.1348,15.9688,23.252,16.0186,23.3516,16.1172z"
15+
/>
16+
<path
17+
className={classes.filledPart}
18+
d="M23.5,15.9688c0,0.1357-0.0264,0.2646-0.0781,0.3867c-0.0527,0.123-0.124,0.2295-0.2148,0.3203
19+
c-0.0918,0.0918-0.1982,0.1631-0.3203,0.2148c-0.123,0.0527-0.252,0.0781-0.3867,0.0781H17v5.5
20+
c0,0.1357-0.0264,0.2646-0.0781,0.3867c-0.0527,0.123-0.124,0.2295-0.2148,0.3203c-0.0918,0.0918-0.1982,0.1631-0.3203,0.2148
21+
c-0.123,0.0527-0.252,0.0781-0.3867,0.0781c-0.1357,0-0.2646-0.0254-0.3867-0.0781c-0.1226-0.0518-0.2295-0.123-0.3203-0.2148
22+
c-0.0913-0.0908-0.1631-0.1973-0.2148-0.3203C15.0259,22.7334,15,22.6045,15,22.4688v-5.5H9.5
23+
c-0.1357,0-0.2646-0.0254-0.3867-0.0781c-0.1226-0.0518-0.2295-0.123-0.3203-0.2148c-0.0913-0.0908-0.1631-0.1973-0.2148-0.3203
24+
C8.5259,16.2334,8.5,16.1045,8.5,15.9688c0-0.1353,0.0259-0.2642,0.0781-0.3867c0.0518-0.1221,0.1235-0.229,0.2148-0.3203
25+
c0.0908-0.0908,0.1978-0.1626,0.3203-0.2148c0.1221-0.0518,0.251-0.0781,0.3867-0.0781H15v-5.5
26+
c0-0.1353,0.0259-0.2642,0.0781-0.3867c0.0518-0.1221,0.1235-0.229,0.2148-0.3203c0.0908-0.0908,0.1978-0.1626,0.3203-0.2148
27+
C15.7354,8.4951,15.8643,8.4688,16,8.4688c0.1348,0,0.2637,0.0264,0.3867,0.0781c0.1221,0.0522,0.2285,0.124,0.3203,0.2148
28+
C16.7979,8.853,16.8691,8.96,16.9219,9.082C16.9736,9.2046,17,9.3335,17,9.4688v5.5h5.5c0.1348,0,0.2637,0.0264,0.3867,0.0781
29+
c0.1221,0.0522,0.2285,0.124,0.3203,0.2148c0.0908,0.0913,0.1621,0.1982,0.2148,0.3203C23.4736,15.7046,23.5,15.8335,23.5,15.9688z"
30+
/>
31+
</svg>
32+
),
33+
styles: {},
34+
} as TeamsSvgIconSpec

‎src/themes/teams/components/Icon/svg/icons/bookmark.tsx

Lines changed: 24 additions & 0 deletions
Original file line numberDiff line numberDiff line change
@@ -0,0 +1,24 @@
1+
import * as React from 'react'
2+
import { TeamsSvgIconSpec } from '../types'
3+
4+
export default {
5+
icon: ({ classes }) => (
6+
<svg viewBox="0 0 32 32" role="presentation" className={classes.svg}>
7+
<g className={classes.outlinePart}>
8+
<path
9+
d="M12,23.3c-0.1,0-0.3,0-0.4-0.1c-0.4-0.2-0.6-0.5-0.6-0.9V9.9c0-0.7,0.5-1.3,1.2-1.5c2.4-0.6,5.2-0.6,7.7,0
10+
C20.5,8.6,21,9.2,21,9.9v12.4c0,0.4-0.2,0.8-0.6,0.9c-0.4,0.2-0.8,0.1-1.1-0.2L16,19.7L12.7,23C12.5,23.2,12.3,23.3,12,23.3z
11+
M16,18.7c0.3,0,0.5,0.1,0.7,0.3l3.3,3.3V9.9c0-0.2-0.2-0.4-0.4-0.5c-2.3-0.5-4.9-0.5-7.2,0C12.2,9.4,12,9.6,12,9.9v12.4l3.3-3.3
12+
C15.5,18.8,15.7,18.7,16,18.7z"
13+
/>
14+
</g>
15+
</svg>
16+
),
17+
styles: {
18+
svg: ({ variables }) => {
19+
return {
20+
fill: variables.color,
21+
}
22+
},
23+
},
24+
} as TeamsSvgIconSpec

‎src/themes/teams/components/Icon/svg/icons/bullets.tsx

Lines changed: 35 additions & 0 deletions
Original file line numberDiff line numberDiff line change
@@ -0,0 +1,35 @@
1+
import * as React from 'react'
2+
import { TeamsSvgIconSpec } from '../types'
3+
4+
export default {
5+
icon: ({ classes }) => (
6+
<svg viewBox="0 0 32 32" role="presentation" className={classes.svg}>
7+
<g className={classes.outlinePart}>
8+
<path d="M13.4999,11h9c0.2761,0,0.5-0.2236,0.5-0.5s-0.2239-0.5-0.5-0.5h-9c-0.2761,0-0.5,0.2236-0.5,0.5S13.2238,11,13.4999,11z" />
9+
<path d="M22.4999,15h-9c-0.2761,0-0.5,0.2236-0.5,0.5s0.2239,0.5,0.5,0.5h9c0.2761,0,0.5-0.2236,0.5-0.5S22.776,15,22.4999,15z" />
10+
<path d="M22.4999,20h-9c-0.2761,0-0.5,0.2236-0.5,0.5s0.2239,0.5,0.5,0.5h9c0.2761,0,0.5-0.2236,0.5-0.5S22.776,20,22.4999,20z" />
11+
<circle cx="10.5" cy="10.5" r="1" />
12+
<circle cx="10.5" cy="20.5" r="1" />
13+
<circle cx="10.5" cy="15.5" r="1" />
14+
</g>
15+
<g className={classes.filledPart}>
16+
<path
17+
d="M13.4999,11.25h9c0.4143,0,0.75-0.3359,0.75-0.75s-0.3357-0.75-0.75-0.75h-9c-0.4143,0-0.75,0.3359-0.75,0.75
18+
S13.0856,11.25,13.4999,11.25z"
19+
/>
20+
<path
21+
d="M22.4999,14.75h-9c-0.4143,0-0.75,0.3359-0.75,0.75s0.3357,0.75,0.75,0.75h9c0.4143,0,0.75-0.3359,0.75-0.75
22+
S22.9142,14.75,22.4999,14.75z"
23+
/>
24+
<path
25+
d="M22.4999,19.75h-9c-0.4143,0-0.75,0.3359-0.75,0.75s0.3357,0.75,0.75,0.75h9c0.4143,0,0.75-0.3359,0.75-0.75
26+
S22.9142,19.75,22.4999,19.75z"
27+
/>
28+
<circle cx="10.5" cy="10.5" r="1" />
29+
<circle cx="10.5" cy="15.5" r="1" />
30+
<circle cx="10.5" cy="20.5" r="1" />
31+
</g>
32+
</svg>
33+
),
34+
styles: {},
35+
} as TeamsSvgIconSpec

‎src/themes/teams/components/Icon/svg/icons/gallery.tsx

Lines changed: 66 additions & 0 deletions
Original file line numberDiff line numberDiff line change
@@ -0,0 +1,66 @@
1+
import * as React from 'react'
2+
import { TeamsSvgIconSpec } from '../types'
3+
4+
export default {
5+
icon: ({ classes }) => (
6+
<svg
7+
viewBox="0 0 32 32"
8+
role="img"
9+
className={classes.svg}
10+
xmlns="http://www.w3.org/2000/svg"
11+
aria-labelledby="icons-gallery"
12+
>
13+
<g role="presentation">
14+
<g className={classes.outlinePart}>
15+
<path
16+
d="M16,9.5v5c0,0.1357,0.0498,0.2529,0.1484,0.3516C16.2471,14.9507,16.3643,15,16.5,15h5
17+
c0.1357,0,0.2529-0.0493,0.3516-0.1484C21.9502,14.7529,22,14.6357,22,14.5v-4c0-0.2031-0.04-0.3945-0.1211-0.5742
18+
s-0.1904-0.3384-0.3281-0.4766c-0.1377-0.1377-0.2969-0.2471-0.4766-0.3281C20.8945,9.0405,20.7031,9,20.5,9h-4
19+
c-0.1357,0-0.2529,0.0498-0.3516,0.1484C16.0498,9.2476,16,9.3647,16,9.5z M17,10h3.5c0.1357,0,0.2529,0.0498,0.3516,0.1484
20+
C20.9502,10.2476,21,10.3647,21,10.5V14h-4V10z"
21+
/>
22+
<path
23+
d="M9.4492,9.4492C9.3115,9.5874,9.2021,9.7461,9.1211,9.9258S9,10.2969,9,10.5v4c0,0.1357,0.0498,0.2529,0.1484,0.3516
24+
C9.2471,14.9507,9.3643,15,9.5,15h5c0.1357,0,0.2529-0.0493,0.3516-0.1484C14.9502,14.7529,15,14.6357,15,14.5v-5
25+
c0-0.1353-0.0498-0.2524-0.1484-0.3516C14.7529,9.0498,14.6357,9,14.5,9h-4c-0.2031,0-0.3945,0.0405-0.5742,0.1211
26+
C9.7461,9.2021,9.5869,9.3115,9.4492,9.4492z M10,10.5c0-0.1353,0.0498-0.2524,0.1484-0.3516C10.2471,10.0498,10.3643,10,10.5,10H14
27+
v4h-4V10.5z"
28+
/>
29+
<path
30+
d="M16.5,22h4c0.2031,0,0.3945-0.04,0.5742-0.1211c0.1797-0.0801,0.3389-0.1895,0.4766-0.3281
31+
c0.1377-0.1377,0.2471-0.2969,0.3281-0.4766S22,20.7031,22,20.5v-4c0-0.1353-0.0498-0.2524-0.1484-0.3516
32+
C21.7529,16.0498,21.6357,16,21.5,16h-5c-0.1357,0-0.2529,0.0498-0.3516,0.1484C16.0498,16.2476,16,16.3647,16,16.5v5
33+
c0,0.1357,0.0498,0.2529,0.1484,0.3516C16.2471,21.9512,16.3643,22,16.5,22z M17,17h4v3.5c0,0.1357-0.0498,0.2529-0.1484,0.3516
34+
C20.7529,20.9512,20.6357,21,20.5,21H17V17z"
35+
/>
36+
<path
37+
d="M9.4492,21.5508c0.1377,0.1387,0.2969,0.248,0.4766,0.3281C10.1055,21.96,10.2969,22,10.5,22h4
38+
c0.1357,0,0.2529-0.0488,0.3516-0.1484C14.9502,21.7529,15,21.6357,15,21.5v-5c0-0.1353-0.0498-0.2524-0.1484-0.3516
39+
C14.7529,16.0498,14.6357,16,14.5,16h-5c-0.1357,0-0.2529,0.0498-0.3516,0.1484C9.0498,16.2476,9,16.3647,9,16.5v4
40+
c0,0.2031,0.04,0.3945,0.1211,0.5742S9.3115,21.4131,9.4492,21.5508z M10,17h4v4h-3.5c-0.1357,0-0.2529-0.0488-0.3516-0.1484
41+
C10.0498,20.7529,10,20.6357,10,20.5V17z"
42+
/>
43+
</g>
44+
<g className={classes.filledPart}>
45+
<path
46+
d="M22,15v-4.5c0-0.2031-0.04-0.3955-0.1211-0.5781c-0.0811-0.1821-0.1885-0.3408-0.3242-0.4766
47+
C21.419,9.31,21.2608,9.2021,21.0781,9.1211C20.8955,9.0405,20.7031,9,20.5,9H16v6H22z"
48+
/>
49+
<path
50+
d="M9.4453,21.5547c0.1357,0.1357,0.2939,0.2441,0.4766,0.3242C10.1045,21.96,10.2969,22,10.5,22H15v-6H9v4.5
51+
c0,0.2031,0.04,0.3965,0.1211,0.5781C9.2021,21.2607,9.3096,21.4199,9.4453,21.5547z"
52+
/>
53+
<path
54+
d="M9.4453,9.4453C9.3096,9.581,9.2021,9.7397,9.1211,9.9219C9.04,10.1045,9,10.2969,9,10.5V15h6V9h-4.5
55+
c-0.2031,0-0.3955,0.0405-0.5781,0.1211C9.7393,9.2021,9.5811,9.3101,9.4453,9.4453z"
56+
/>
57+
<path
58+
d="M21.0781,21.8789c0.1826-0.0801,0.3408-0.1885,0.4766-0.3242c0.1357-0.1348,0.2432-0.2939,0.3242-0.4766
59+
C21.96,20.8965,22,20.7031,22,20.5V16h-6v6h4.5C20.7031,22,20.8955,21.96,21.0781,21.8789z"
60+
/>
61+
</g>
62+
</g>
63+
</svg>
64+
),
65+
styles: {},
66+
} as TeamsSvgIconSpec

‎src/themes/teams/components/Icon/svg/icons/index.ts

Lines changed: 10 additions & 0 deletions
Original file line numberDiff line numberDiff line change
@@ -1,5 +1,8 @@
11
import { TeamsSvgIconSpec } from '../types'
22

3+
import add from './add'
4+
import bookmark from './bookmark'
5+
import bullets from './bullets'
36
import call from './call'
47
import callEnd from './callEnd'
58
import callVideo from './callIncomingVideo'
@@ -8,6 +11,8 @@ import callStartPresenting from './callControlPresentNew'
811
import callStopPresenting from './callControlStopPresentingNew'
912
import callMicrophone from './callMicrophone'
1013
import callMicrophoneOff from './callMicrophoneOff'
14+
import gallery from './gallery'
15+
import menu from './menu'
1116
import more from './more'
1217
import teamCreate from './teamCreate'
1318
import umbrella from './umbrella'
@@ -19,6 +24,9 @@ import fontSize from './fontSize'
1924
import highlight from './highlight'
2025

2126
export default {
27+
add,
28+
bookmark,
29+
bullets,
2230
call,
2331
'call-end': callEnd,
2432
'call-video': callVideo,
@@ -27,6 +35,8 @@ export default {
2735
'call-stop-presenting': callStopPresenting,
2836
'call-microphone': callMicrophone,
2937
'call-microphone-off': callMicrophoneOff,
38+
gallery,
39+
menu,
3040
more,
3141
'team-create': teamCreate,
3242
umbrella,

‎src/themes/teams/components/Icon/svg/icons/menu.tsx

Lines changed: 13 additions & 0 deletions
Original file line numberDiff line numberDiff line change
@@ -0,0 +1,13 @@
1+
import * as React from 'react'
2+
import { TeamsSvgIconSpec } from '../types'
3+
4+
export default {
5+
icon: ({ classes }) => (
6+
<svg className={classes.svg} viewBox="0 0 32 32" role="presentation">
7+
<g className={classes.filledPart}>
8+
<path d="M9,11h13c0.6,0,1-0.4,1-1s-0.4-1-1-1H9c-0.6,0-1,0.4-1,1S8.4,11,9,11zM22,19H9c-0.6,0-1,0.4-1,1s0.4,1,1,1h13c0.6,0,1-0.4,1-1S22.6,19,22,19zM22,14H9c-0.6,0-1,0.4-1,1s0.4,1,1,1h13c0.6,0,1-0.4,1-1S22.6,14,22,14z" />
9+
</g>
10+
</svg>
11+
),
12+
styles: {},
13+
} as TeamsSvgIconSpec

0 commit comments

Comments
 (0)