Skip to content

Commit 006b3f1

Browse files
Merge pull request #4 from GSA/icons
added SAM icons library
2 parents 0ee8c22 + 69aebd1 commit 006b3f1

23 files changed

Lines changed: 632 additions & 84 deletions

package-lock.json

Lines changed: 22 additions & 82 deletions
Some generated files are not rendered by default. Learn more about customizing how changed files appear on GitHub.

src/components/icons/README.md

Lines changed: 3 additions & 0 deletions
Original file line numberDiff line numberDiff line change
@@ -0,0 +1,3 @@
1+
## Icons Library
2+
3+
This is the SAM.Gov Icons Library
Lines changed: 7 additions & 0 deletions
Original file line numberDiff line numberDiff line change
@@ -0,0 +1,7 @@
1+
label: SAM Icons Library
2+
status: wip
3+
4+
variants:
5+
- name: default
6+
label: SAM Icons Library
7+
status: null

src/components/icons/icons.njk

Lines changed: 71 additions & 0 deletions
Original file line numberDiff line numberDiff line change
@@ -0,0 +1,71 @@
1+
<h1>SAM Icon Library</h1>
2+
<div class="sam-icons">
3+
<div class="grid-row flex-row">
4+
<ul class="usa-list usa-list--unstyled grid-row flex-wrap">
5+
<li class="display-block padding-2 text-center">
6+
<i class="sam icon-bell icon-2x"></i>
7+
<p class="font-sans-3xs margin-x-auto">Bell</p>
8+
</li>
9+
<li class="display-block padding-2 text-center">
10+
<i class="sam icon-book icon-2x"></i>
11+
<p class="font-sans-3xs">Book</p>
12+
</li>
13+
<li class="display-block padding-2 text-center">
14+
<i class="sam icon-calendar icon-2x"></i>
15+
<p class="font-sans-3xs">Calendar</p>
16+
</li>
17+
<li class="display-block padding-2 text-center">
18+
<i class="sam icon-download icon-2x"></i>
19+
<p class="font-sans-3xs">Download</p>
20+
</li>
21+
<li class="display-block padding-2 text-center">
22+
<i class="sam icon-envelope icon-2x"></i>
23+
<p class="font-sans-3xs">Envelope</p>
24+
</li>
25+
<li class="display-block padding-2 text-center">
26+
<i class="sam icon-file-chart-line icon-2x"></i>
27+
<p class="font-sans-3xs">Report Data</p>
28+
</li>
29+
<li class="display-block padding-2 text-center">
30+
<i class="sam icon-filter icon-2x"></i>
31+
<p class="font-sans-3xs">Filter</p>
32+
</li>
33+
<li class="display-block padding-2 text-center">
34+
<i class="sam icon-home icon-2x"></i>
35+
<p class="font-sans-3xs">Home</p>
36+
</li>
37+
<li class="display-block padding-2 text-center">
38+
<i class="sam icon-invoice icon-2x"></i>
39+
<p class="font-sans-3xs">Invoice</p>
40+
</li>
41+
<li class="display-block padding-2 text-center">
42+
<i class="sam icon-link icon-2x"></i>
43+
<p class="font-sans-3xs">Link</p>
44+
</li>
45+
<li class="display-block padding-2 text-center">
46+
<i class="sam icon-new-note icon-2x"></i>
47+
<p class="font-sans-3xs">New Note Data</p>
48+
</li>
49+
<li class="display-block padding-2 text-center">
50+
<i class="sam icon-print icon-2x"></i>
51+
<p class="font-sans-3xs">Printer</p>
52+
</li>
53+
<li class="display-block padding-2 text-center">
54+
<i class="sam icon-ruler-pencil icon-2x"></i>
55+
<p class="font-sans-3xs">Tools</p>
56+
</li>
57+
<li class="display-block padding-2 text-center">
58+
<i class="sam icon-share icon-2x"></i>
59+
<p class="font-sans-3xs">Share</p>
60+
</li>
61+
<li class="display-block padding-2 text-center">
62+
<i class="sam icon-trash icon-2x"></i>
63+
<p class="font-sans-3xs">Trash</p>
64+
</li>
65+
<li class="display-block padding-2 text-center">
66+
<i class="sam icon-user icon-2x"></i>
67+
<p class="font-sans-3xs">User</p>
68+
</li>
69+
</ul>
70+
</div>
71+
</div>

src/js/components/icons.js

Lines changed: 35 additions & 1 deletion
Original file line numberDiff line numberDiff line change
@@ -8,6 +8,23 @@ import {
88
} from "@fortawesome/free-solid-svg-icons";
99
import { samBars } from "./../icons/bars";
1010
import { samArrowLeft } from "./../icons/arrowLeft";
11+
import { samBell } from "./../icons/bell";
12+
import { samCalendar } from "./../icons/calendar";
13+
import { samTrash } from "./../icons/trash";
14+
import { samFilter } from "./../icons/filter";
15+
import { samBook } from "./../icons/book";
16+
import { samHome } from "./../icons/home";
17+
import { samEnvelope } from "./../icons/envelope";
18+
import { samNewNote } from "./../icons/newNote";
19+
import { samFileChartLine } from "./../icons/fileChartLine";
20+
import { samShare } from "./../icons/share";
21+
import { samRulerPencil } from "./../icons/rulerPencil";
22+
import { samPrint } from "./../icons/print";
23+
import { samUser } from "./../icons/user";
24+
import { samLink } from "./../icons/link";
25+
import { samDownload } from "./../icons/download";
26+
import { samInvoice } from "./../icons/invoice";
27+
import { samPaperPlane } from "./../icons/paperPlane";
1128

1229
config.familyPrefix = "icon";
1330

@@ -18,7 +35,24 @@ const icons = [
1835
faTh,
1936
faSignOutAlt,
2037
samBars,
21-
samArrowLeft
38+
samArrowLeft,
39+
samBell,
40+
samBook,
41+
samCalendar,
42+
samDownload,
43+
samEnvelope,
44+
samFileChartLine,
45+
samFilter,
46+
samHome,
47+
samInvoice,
48+
samLink,
49+
samNewNote,
50+
samPaperPlane,
51+
samPrint,
52+
samRulerPencil,
53+
samShare,
54+
samTrash,
55+
samUser
2256
];
2357

2458
library.add(...icons);

src/js/icons/bell.js

Lines changed: 29 additions & 0 deletions
Original file line numberDiff line numberDiff line change
@@ -0,0 +1,29 @@
1+
'use strict';
2+
Object.defineProperty(exports, '__esModule', { value: true });
3+
var prefix = 'sam';
4+
var iconName = 'bell';
5+
var width = 512;
6+
var height = 512;
7+
var ligatures = [];
8+
var unicode = '';
9+
var svgPathData = 'M440.06,428.6l-34.35-68.76V185.38C405.71,83,322.79,0,220.5,0S35.29,83,35.29,185.38V359.85L.94,428.6a8.83,8.83,0,0,0,7.89,12.78H141.62a79.36,79.36,0,0,0,157.75,0H432.17A8.83,8.83,0,0,0,440.06,428.6ZM52.93,185.38c0-92.63,75-167.72,167.57-167.72S388.07,92.75,388.07,185.38V353.1H52.93Zm167.57,309a61.77,61.77,0,0,1-61.11-53H281.61A61.77,61.77,0,0,1,220.5,494.34Zm70.56-70.62H23.1l26.46-53H391.44l26.46,53Z';
10+
11+
exports.definition = {
12+
prefix: prefix,
13+
iconName: iconName,
14+
icon: [
15+
width,
16+
height,
17+
ligatures,
18+
unicode,
19+
svgPathData
20+
]};
21+
22+
exports.samBell = exports.definition;
23+
exports.prefix = prefix;
24+
exports.iconName = iconName;
25+
exports.width = width;
26+
exports.height = height;
27+
exports.ligatures = ligatures;
28+
exports.unicode = unicode;
29+
exports.svgPathData = svgPathData;

src/js/icons/book.js

Lines changed: 29 additions & 0 deletions
Original file line numberDiff line numberDiff line change
@@ -0,0 +1,29 @@
1+
'use strict';
2+
Object.defineProperty(exports, '__esModule', { value: true });
3+
var prefix = 'sam';
4+
var iconName = 'book';
5+
var width = 448;
6+
var height = 512;
7+
var ligatures = [];
8+
var unicode = '';
9+
var svgPathData = 'M464.24,0H43.82A43.78,43.78,0,0,0,0,43.75V441.13c0,.29,0,.57,0,.86s0,.28,0,.42c0,1.19,0,2.4,0,3.62v.27H0c0,.05,0,.11,0,.16a10.11,10.11,0,0,0,.31,2.31A70.05,70.05,0,0,0,70.07,512H464.24a8.76,8.76,0,0,0,8.76-8.75V8.75A8.76,8.76,0,0,0,464.24,0ZM105.11,17.5H192.7V144.61l-36.88-38.15a8.76,8.76,0,0,0-12.53-.07L105.11,145ZM455.48,431.75H359.13a8.75,8.75,0,1,0,0,17.5h96.35V494.5H70.07a52.52,52.52,0,0,1-52.53-51.65v-.64q0-2.54.2-4.94A52.53,52.53,0,0,1,48.86,394a75.58,75.58,0,0,1,16.26-3.17l195.26,0h195.1Zm0-59.77H70.07a69.86,69.86,0,0,0-28.18,5.91,61.71,61.71,0,0,0-24.35,14.91V43.75A26.27,26.27,0,0,1,43.82,17.5H87.59V166.27a8.76,8.76,0,0,0,15,6.15l46.87-47.36,45.71,47.29a8.76,8.76,0,0,0,15.06-6.08V17.5H455.48Z';
10+
11+
exports.definition = {
12+
prefix: prefix,
13+
iconName: iconName,
14+
icon: [
15+
width,
16+
height,
17+
ligatures,
18+
unicode,
19+
svgPathData
20+
]};
21+
22+
exports.samBook = exports.definition;
23+
exports.prefix = prefix;
24+
exports.iconName = iconName;
25+
exports.width = width;
26+
exports.height = height;
27+
exports.ligatures = ligatures;
28+
exports.unicode = unicode;
29+
exports.svgPathData = svgPathData;

src/js/icons/calendar.js

Lines changed: 29 additions & 0 deletions
Original file line numberDiff line numberDiff line change
@@ -0,0 +1,29 @@
1+
'use strict';
2+
Object.defineProperty(exports, '__esModule', { value: true });
3+
var prefix = 'sam';
4+
var iconName = 'calendar';
5+
var width = 448;
6+
var height = 512;
7+
var ligatures = [];
8+
var unicode = '';
9+
var svgPathData = 'M248.5,391.53a22.59,22.59,0,1,0-22.59-22.59A22.59,22.59,0,0,0,248.5,391.53Zm0,15.06a37.65,37.65,0,1,1,37.65-37.65A37.65,37.65,0,0,1,248.5,406.59ZM128,391.53a22.59,22.59,0,1,0-22.59-22.59A22.59,22.59,0,0,0,128,391.53Zm0,15.06a37.65,37.65,0,1,1,37.65-37.65A37.65,37.65,0,0,1,128,406.59ZM369,301.18a22.59,22.59,0,1,0-22.59-22.59A22.59,22.59,0,0,0,369,301.18Zm0,15.06a37.65,37.65,0,1,1,37.65-37.65A37.65,37.65,0,0,1,369,316.24ZM248.5,301.18a22.59,22.59,0,1,0-22.59-22.59A22.59,22.59,0,0,0,248.5,301.18Zm0,15.06a37.65,37.65,0,1,1,37.65-37.65A37.65,37.65,0,0,1,248.5,316.24ZM128,301.18a22.59,22.59,0,1,0-22.59-22.59A22.59,22.59,0,0,0,128,301.18Zm0,15.06a37.65,37.65,0,1,1,37.65-37.65A37.65,37.65,0,0,1,128,316.24ZM481.94,165.65H15.06V489.41a7.53,7.53,0,0,0,7.53,7.53H474.41a7.53,7.53,0,0,0,7.53-7.53ZM376.52,30.12h97.89A22.59,22.59,0,0,1,497,52.71V489.41A22.59,22.59,0,0,1,474.41,512H22.59A22.59,22.59,0,0,1,0,489.41V52.71A22.59,22.59,0,0,1,22.59,30.12h97.89V7.53a7.53,7.53,0,0,1,15.06,0V30.12H361.45V7.53a7.53,7.53,0,0,1,15.06,0ZM361.45,45.18H135.55V67.76a7.53,7.53,0,0,1-15.06,0V45.18H22.59a7.53,7.53,0,0,0-7.53,7.53v97.88H481.94V52.71a7.53,7.53,0,0,0-7.53-7.53H376.52V67.76a7.53,7.53,0,0,1-15.06,0Z';
10+
11+
exports.definition = {
12+
prefix: prefix,
13+
iconName: iconName,
14+
icon: [
15+
width,
16+
height,
17+
ligatures,
18+
unicode,
19+
svgPathData
20+
]};
21+
22+
exports.samCalendar = exports.definition;
23+
exports.prefix = prefix;
24+
exports.iconName = iconName;
25+
exports.width = width;
26+
exports.height = height;
27+
exports.ligatures = ligatures;
28+
exports.unicode = unicode;
29+
exports.svgPathData = svgPathData;

src/js/icons/download.js

Lines changed: 29 additions & 0 deletions
Original file line numberDiff line numberDiff line change
@@ -0,0 +1,29 @@
1+
'use strict';
2+
Object.defineProperty(exports, '__esModule', { value: true });
3+
var prefix = 'sam';
4+
var iconName = 'download';
5+
var width = 448;
6+
var height = 512;
7+
var ligatures = [];
8+
var unicode = '';
9+
var svgPathData = 'M398.88,300.39,260.11,439.16c-.06.06-.14.1-.2.16a8.2,8.2,0,0,1-1,.85,8,8,0,0,1-.71.39c-.23.12-.45.27-.7.37a8.07,8.07,0,0,1-.88.27c-.22.06-.42.15-.65.19a8.22,8.22,0,0,1-1.6.16h0a8.21,8.21,0,0,1-1.6-.16c-.24,0-.45-.14-.68-.2a4.76,4.76,0,0,1-1.6-.66c-.22-.12-.44-.21-.65-.35a8.21,8.21,0,0,1-1.19-1l-.05,0h0L109.76,300.39a8.18,8.18,0,0,1,11.56-11.56L246.15,413.64V8.18a8.18,8.18,0,0,1,16.35,0V413.64L387.32,288.83a8.18,8.18,0,0,1,11.56,11.56Zm91.76,195.25H16.35V405.7A8.18,8.18,0,0,0,0,405.7v98.12A8.18,8.18,0,0,0,8.18,512H498.82a8.18,8.18,0,0,0,8.18-8.18V405.7a8.18,8.18,0,0,0-16.35,0Z';
10+
11+
exports.definition = {
12+
prefix: prefix,
13+
iconName: iconName,
14+
icon: [
15+
width,
16+
height,
17+
ligatures,
18+
unicode,
19+
svgPathData
20+
]};
21+
22+
exports.samDownload = exports.definition;
23+
exports.prefix = prefix;
24+
exports.iconName = iconName;
25+
exports.width = width;
26+
exports.height = height;
27+
exports.ligatures = ligatures;
28+
exports.unicode = unicode;
29+
exports.svgPathData = svgPathData;

src/js/icons/envelope.js

Lines changed: 29 additions & 0 deletions
Original file line numberDiff line numberDiff line change
@@ -0,0 +1,29 @@
1+
'use strict';
2+
Object.defineProperty(exports, '__esModule', { value: true });
3+
var prefix = 'sam';
4+
var iconName = 'envelope';
5+
var width = 732;
6+
var height = 512;
7+
var ligatures = [];
8+
var unicode = '';
9+
var svgPathData = 'M706.26,0H30.74A30.78,30.78,0,0,0,0,30.75v450.5A30.78,30.78,0,0,0,30.74,512H706.26A30.78,30.78,0,0,0,737,481.25V30.75A30.78,30.78,0,0,0,706.26,0Zm14.29,481.25a14.31,14.31,0,0,1-14.29,14.3H30.74a14.31,14.31,0,0,1-14.29-14.3V30.75a14.31,14.31,0,0,1,14.29-14.3H706.26a14.31,14.31,0,0,1,14.29,14.3ZM690.12,48.08a8.23,8.23,0,0,1-1.18,11.57L385,307.43a8.25,8.25,0,0,1-5.2,1.85,8.16,8.16,0,0,1-5-1.67L48.29,59.83a8.23,8.23,0,0,1,5-14.78,8.15,8.15,0,0,1,5,1.67L377.72,289.14l1.9,1.44,1.85-1.51L678.55,46.9a8.22,8.22,0,0,1,11.57,1.18Zm-136.67,64.1h.39Z';
10+
11+
exports.definition = {
12+
prefix: prefix,
13+
iconName: iconName,
14+
icon: [
15+
width,
16+
height,
17+
ligatures,
18+
unicode,
19+
svgPathData
20+
]};
21+
22+
exports.samEnvelope = exports.definition;
23+
exports.prefix = prefix;
24+
exports.iconName = iconName;
25+
exports.width = width;
26+
exports.height = height;
27+
exports.ligatures = ligatures;
28+
exports.unicode = unicode;
29+
exports.svgPathData = svgPathData;

0 commit comments

Comments
 (0)