MightyPork
/
datatable.directory
1
0
Fork 1
Code Issues 25 Pull Requests Releases Wiki Activity

UX improvements in table editor

Browse Source
pull/35/head
Ondřej Hruška 6 years ago
parent c642774316
commit 1e183f5059
Signed by: MightyPork
GPG Key ID: 2C5FD5035250423D
24 changed files with 652 additions and 403 deletions
Show all changes Ignore whitespace when comparing lines Ignore changes in amount of whitespace Ignore changes in whitespace at EOL
Show Stats Download Patch File Download Diff File
  1. 38
      app/Http/Controllers/TableEditController.php
  2. 27
      app/Tables/Changeset.php
  3. 5
      app/helpers.php
  4. 241
      public/fonts/fa-dtbl-1-preview.html
  5. 81
      public/fonts/fa-dtbl-1.css
  6. BIN
      public/fonts/fa-dtbl-1.eot
  7. 234
      public/fonts/fa-dtbl-1.svg
  8. BIN
      public/fonts/fa-dtbl-1.ttf
  9. BIN
      public/fonts/fa-dtbl-1.woff
  10. BIN
      public/fonts/fa-dtbl-1.woff2
  11. 18
      resources/assets/fa-config/wanted.ini
  12. 2
      resources/assets/js/components/ColumnEditor.vue
  13. 152
      resources/assets/js/components/RowsEditor.vue
  14. 1
      resources/assets/js/udash.js
  15. 6
      resources/assets/js/vue-init.js
  16. 13
      resources/assets/sass/_fa-utils.scss
  17. 7
      resources/assets/sass/bootstrap-customizations/_nav.scss
  18. 2
      resources/views/table/conf.blade.php
  19. 27
      resources/views/table/propose/add-rows-csv.blade.php
  20. 51
      resources/views/table/propose/add-rows.blade.php
  21. 5
      resources/views/table/propose/edit-rows.blade.php
  22. 18
      resources/views/table/propose/layout-row-pagination.blade.php
  23. 41
      resources/views/table/propose/layout.blade.php
  24. 10
      resources/views/table/propose/review.blade.php

38
app/Http/Controllers/TableEditController.php
Unescape View File

@ -123,20 +123,36 @@ class TableEditController extends Controller
$input = objBag($request->all(), false); $input = objBag($request->all(), false);
try { $resp = null;
$code = 200; $code = 200;
try {
switch ($input->action) { switch ($input->action) {
case 'row.update': case 'row.update':
$data = (object)$input->data; $data = (object)$input->data;
$resp = $changeset->rowUpdate($data); $resp = $changeset->rowUpdate($data);
break; break;
case 'row.update-many':
$newVals = $input->data;
$updated = [];
foreach ($newVals as $rowUpdate) {
$r = $changeset->rowUpdate($rowUpdate);
$updated[$r->_id] = $r;
}
$resp = $updated;
break;
case 'row.remove': case 'row.remove':
$isNew = $changeset->isNewRow($input->id); $isNew = $changeset->isNewRow($input->id);
$changeset->rowRemove($input->id); $changeset->rowRemove($input->id);
$resp = $isNew ? null : $changeset->fetchAndTransformRow($input->id); $resp = $isNew ? null : $changeset->fetchAndTransformRow($input->id);
break; break;
case 'rows.remove-empty-new':
$changeset->removeEmptyNewRows();
break;
case 'row.restore': case 'row.restore':
$changeset->rowRestore($input->id); $changeset->rowRestore($input->id);
$resp = $changeset->fetchAndTransformRow($input->id); $resp = $changeset->fetchAndTransformRow($input->id);
@ -144,13 +160,6 @@ class TableEditController extends Controller
case 'rows.add': case 'rows.add':
$changeset->addBlankRows($input->count); $changeset->addBlankRows($input->count);
// rows.add is sent via a form
if ($input->has('redirect')) {
return redirect($input->redirect);
} else {
$resp = null;
}
break; break;
case 'rows.add-csv': case 'rows.add-csv':
@ -159,13 +168,6 @@ class TableEditController extends Controller
} catch (\Exception $e) { } catch (\Exception $e) {
return $this->backWithErrors(['data' => $e->getMessage()]); return $this->backWithErrors(['data' => $e->getMessage()]);
} }
// rows.add-csv is sent via a form
if ($input->has('redirect')) {
return redirect($input->redirect);
} else {
$resp = null;
}
break; break;
case 'col.update': case 'col.update':
@ -190,7 +192,6 @@ class TableEditController extends Controller
case 'col.sort': case 'col.sort':
$changeset->setColOrder($input->order); $changeset->setColOrder($input->order);
$resp = null;
break; break;
default: default:
@ -204,6 +205,11 @@ class TableEditController extends Controller
$this->storeChangeset($changeset); $this->storeChangeset($changeset);
// Redirect requested via form
if ($code == 200 && $input->has('redirect')) {
return redirect($input->redirect);
}
return $this->jsonResponse($resp, $code); return $this->jsonResponse($resp, $code);
} }
} }

27
app/Tables/Changeset.php
Unescape View File

@ -191,6 +191,13 @@ class Changeset
if ($this->isNewRow($row->_id)) { if ($this->isNewRow($row->_id)) {
if ($decorate) { if ($decorate) {
$row->_new = true; $row->_new = true;
$row->_orig = array_diff((array)$row, []);
// remove junk
unset($row->_orig['_id']);
unset($row->_orig['_new']);
unset($row->_orig['_remove']);
unset($row->_orig['_changed']);
unset($row->_orig['_orig']);
} }
return $row; return $row;
} }
@ -359,7 +366,9 @@ class Changeset
public function fetchRow(int $id) public function fetchRow(int $id)
{ {
if ($this->isNewRow($id)) { if ($this->isNewRow($id)) {
return (object)$this->newRows[$id]; $nr = (object)$this->newRows[$id];
$nr->_new = true;
return $nr;
} }
$r = $this->revision->rowsData($this->fetchColumns(), true, false) $r = $this->revision->rowsData($this->fetchColumns(), true, false)
@ -557,7 +566,8 @@ class Changeset
$rows = self::csvToRowsArray($columns, $csvArray, false) $rows = self::csvToRowsArray($columns, $csvArray, false)
->keyBy('_id'); ->keyBy('_id');
$this->newRows = array_merge($this->newRows, $rows->all()); // using '+' to avoid renumbering
$this->newRows = $this->newRows + $rows->toArray();
} }
public function addBlankCol() public function addBlankCol()
@ -587,4 +597,17 @@ class Changeset
$this->columnOrder = array_merge($order, $missing); $this->columnOrder = array_merge($order, $missing);
} }
public function removeEmptyNewRows()
{
$cols = $this->fetchColumns();
$emptyTpl = collect($cols)->keyBy('id')->map(function(Column $c) {
return $c->cast(null);
})->all();
$this->newRows = array_filter($this->newRows, function ($r) use ($emptyTpl) {
$emptyTpl['_id'] = $r['_id'];
return $emptyTpl != $r;
});
}
} }

5
app/helpers.php
Unescape View File

@ -126,6 +126,11 @@ function collection_paginate($items, $per_page, $mapFn = null)
$page = Request::get('page', 1); $page = Request::get('page', 1);
$pageItems = $items->forPage($page, $per_page)->values(); $pageItems = $items->forPage($page, $per_page)->values();
if (count($pageItems) == 0 && $page > 1) {
$page = 1;
Request::replace(['page' => $page]);
$pageItems = $items->forPage($page, $per_page)->values();
}
return new Illuminate\Pagination\LengthAwarePaginator( return new Illuminate\Pagination\LengthAwarePaginator(
$mapFn ? $pageItems->map($mapFn) : $pageItems, $mapFn ? $pageItems->map($mapFn) : $pageItems,

241
public/fonts/fa-dtbl-1-preview.html
Unescape View File

@ -162,6 +162,7 @@
[data-icon]:before, [data-icon]:before,
.fa-address-card-o:before, .fa-address-card-o:before,
.fa-arrow-left:before,
.fa-bars:before, .fa-bars:before,
.fa-calendar:before, .fa-calendar:before,
.fa-chevron-down:before, .fa-chevron-down:before,
@ -172,13 +173,13 @@
.fa-exclamation-triangle:before, .fa-exclamation-triangle:before,
.fa-eye:before, .fa-eye:before,
.fa-facebook-square:before, .fa-facebook-square:before,
.fa-file-excel-o:before,
.fa-floppy-o:before, .fa-floppy-o:before,
.fa-github:before, .fa-github:before,
.fa-globe:before, .fa-globe:before,
.fa-google:before, .fa-google:before,
.fa-history:before, .fa-history:before,
.fa-home:before, .fa-home:before,
.fa-hourglass:before,
.fa-inbox:before, .fa-inbox:before,
.fa-key-modern:before, .fa-key-modern:before,
.fa-link:before, .fa-link:before,
@ -186,14 +187,15 @@
.fa-pencil:before, .fa-pencil:before,
.fa-plus:before, .fa-plus:before,
.fa-question-circle:before, .fa-question-circle:before,
.fa-reply:before,
.fa-sign-in:before, .fa-sign-in:before,
.fa-sign-out:before, .fa-sign-out:before,
.fa-spinner:before,
.fa-star:before, .fa-star:before,
.fa-star-o:before, .fa-star-o:before,
.fa-sun-o:before, .fa-sun-o:before,
.fa-table:before, .fa-table:before,
.fa-th-list:before, .fa-th-list:before,
.fa-times:before,
.fa-trash-o:before, .fa-trash-o:before,
.fa-undo:before, .fa-undo:before,
.fa-user:before, .fa-user:before,
@ -216,45 +218,47 @@
} }
.fa-address-card-o:before { content: "\f100"; } .fa-address-card-o:before { content: "\f100"; }
.fa-bars:before { content: "\f101"; } .fa-arrow-left:before { content: "\f101"; }
.fa-calendar:before { content: "\f102"; } .fa-bars:before { content: "\f102"; }
.fa-chevron-down:before { content: "\f103"; } .fa-calendar:before { content: "\f103"; }
.fa-chevron-up:before { content: "\f104"; } .fa-chevron-down:before { content: "\f104"; }
.fa-code-fork:before { content: "\f105"; } .fa-chevron-up:before { content: "\f105"; }
.fa-comment:before { content: "\f106"; } .fa-code-fork:before { content: "\f106"; }
.fa-download:before { content: "\f107"; } .fa-comment:before { content: "\f107"; }
.fa-exclamation-triangle:before { content: "\f108"; } .fa-download:before { content: "\f108"; }
.fa-eye:before { content: "\f109"; } .fa-exclamation-triangle:before { content: "\f109"; }
.fa-facebook-square:before { content: "\f10a"; } .fa-eye:before { content: "\f10a"; }
.fa-floppy-o:before { content: "\f10b"; } .fa-facebook-square:before { content: "\f10b"; }
.fa-github:before { content: "\f10c"; } .fa-file-excel-o:before { content: "\f10c"; }
.fa-globe:before { content: "\f10d"; } .fa-floppy-o:before { content: "\f10d"; }
.fa-google:before { content: "\f10e"; } .fa-github:before { content: "\f10e"; }
.fa-history:before { content: "\f10f"; } .fa-globe:before { content: "\f10f"; }
.fa-home:before { content: "\f110"; } .fa-google:before { content: "\f110"; }
.fa-hourglass:before { content: "\f111"; } .fa-history:before { content: "\f111"; }
.fa-inbox:before { content: "\f112"; } .fa-home:before { content: "\f112"; }
.fa-key-modern:before { content: "\f113"; } .fa-inbox:before { content: "\f113"; }
.fa-link:before { content: "\f114"; } .fa-key-modern:before { content: "\f114"; }
.fa-moon-o:before { content: "\f115"; } .fa-link:before { content: "\f115"; }
.fa-pencil:before { content: "\f116"; } .fa-moon-o:before { content: "\f116"; }
.fa-plus:before { content: "\f117"; } .fa-pencil:before { content: "\f117"; }
.fa-question-circle:before { content: "\f118"; } .fa-plus:before { content: "\f118"; }
.fa-sign-in:before { content: "\f119"; } .fa-question-circle:before { content: "\f119"; }
.fa-sign-out:before { content: "\f11a"; } .fa-reply:before { content: "\f11a"; }
.fa-star:before { content: "\f11b"; } .fa-sign-in:before { content: "\f11b"; }
.fa-star-o:before { content: "\f11c"; } .fa-sign-out:before { content: "\f11c"; }
.fa-sun-o:before { content: "\f11d"; } .fa-spinner:before { content: "\f11d"; }
.fa-table:before { content: "\f11e"; } .fa-star:before { content: "\f11e"; }
.fa-th-list:before { content: "\f11f"; } .fa-star-o:before { content: "\f11f"; }
.fa-times:before { content: "\f120"; } .fa-sun-o:before { content: "\f120"; }
.fa-trash-o:before { content: "\f121"; } .fa-table:before { content: "\f121"; }
.fa-undo:before { content: "\f122"; } .fa-th-list:before { content: "\f122"; }
.fa-user:before { content: "\f123"; } .fa-trash-o:before { content: "\f123"; }
.fa-user-circle-o:before { content: "\f124"; } .fa-undo:before { content: "\f124"; }
.fa-user-plus:before { content: "\f125"; } .fa-user:before { content: "\f125"; }
.fa-users:before { content: "\f126"; } .fa-user-circle-o:before { content: "\f126"; }
.fa-wrench:before { content: "\f127"; } .fa-user-plus:before { content: "\f127"; }
.fa-users:before { content: "\f128"; }
.fa-wrench:before { content: "\f129"; }
</style> </style>
<!--[if lte IE 8]><script src="http://html5shiv.googlecode.com/svn/trunk/html5.js"></script><![endif]--> <!--[if lte IE 8]><script src="http://html5shiv.googlecode.com/svn/trunk/html5.js"></script><![endif]-->
@ -270,7 +274,7 @@
<body class="characters-off"> <body class="characters-off">
<div id="page" class="container"> <div id="page" class="container">
<header> <header>
<h1>fa-dtbl-1 contains 40 glyphs:</h1> <h1>fa-dtbl-1 contains 42 glyphs:</h1>
<a onclick="toggleCharacters(); return false;" href="#">Toggle Preview Characters</a> <a onclick="toggleCharacters(); return false;" href="#">Toggle Preview Characters</a>
</header> </header>
@ -289,6 +293,19 @@
</div> </div>
</div> </div>
<div class="glyph">
<div class="preview-glyphs">
<span class="step size-12"><span class="letters">Pp</span><i id="fa-arrow-left" class="fa-arrow-left"></i></span><span class="step size-14"><span class="letters">Pp</span><i id="fa-arrow-left" class="fa-arrow-left"></i></span><span class="step size-16"><span class="letters">Pp</span><i id="fa-arrow-left" class="fa-arrow-left"></i></span><span class="step size-18"><span class="letters">Pp</span><i id="fa-arrow-left" class="fa-arrow-left"></i></span><span class="step size-21"><span class="letters">Pp</span><i id="fa-arrow-left" class="fa-arrow-left"></i></span><span class="step size-24"><span class="letters">Pp</span><i id="fa-arrow-left" class="fa-arrow-left"></i></span><span class="step size-36"><span class="letters">Pp</span><i id="fa-arrow-left" class="fa-arrow-left"></i></span><span class="step size-48"><span class="letters">Pp</span><i id="fa-arrow-left" class="fa-arrow-left"></i></span><span class="step size-60"><span class="letters">Pp</span><i id="fa-arrow-left" class="fa-arrow-left"></i></span><span class="step size-72"><span class="letters">Pp</span><i id="fa-arrow-left" class="fa-arrow-left"></i></span>
</div>
<div class="preview-scale">
<span class="step">12</span><span class="step">14</span><span class="step">16</span><span class="step">18</span><span class="step">21</span><span class="step">24</span><span class="step">36</span><span class="step">48</span><span class="step">60</span><span class="step">72</span>
</div>
<div class="usage">
<input class="class" type="text" readonly="readonly" onClick="this.select();" value=".fa-arrow-left" />
<input class="point" type="text" readonly="readonly" onClick="this.select();" value="&amp;#xf101;" />
</div>
</div>
<div class="glyph"> <div class="glyph">
<div class="preview-glyphs"> <div class="preview-glyphs">
<span class="step size-12"><span class="letters">Pp</span><i id="fa-bars" class="fa-bars"></i></span><span class="step size-14"><span class="letters">Pp</span><i id="fa-bars" class="fa-bars"></i></span><span class="step size-16"><span class="letters">Pp</span><i id="fa-bars" class="fa-bars"></i></span><span class="step size-18"><span class="letters">Pp</span><i id="fa-bars" class="fa-bars"></i></span><span class="step size-21"><span class="letters">Pp</span><i id="fa-bars" class="fa-bars"></i></span><span class="step size-24"><span class="letters">Pp</span><i id="fa-bars" class="fa-bars"></i></span><span class="step size-36"><span class="letters">Pp</span><i id="fa-bars" class="fa-bars"></i></span><span class="step size-48"><span class="letters">Pp</span><i id="fa-bars" class="fa-bars"></i></span><span class="step size-60"><span class="letters">Pp</span><i id="fa-bars" class="fa-bars"></i></span><span class="step size-72"><span class="letters">Pp</span><i id="fa-bars" class="fa-bars"></i></span> <span class="step size-12"><span class="letters">Pp</span><i id="fa-bars" class="fa-bars"></i></span><span class="step size-14"><span class="letters">Pp</span><i id="fa-bars" class="fa-bars"></i></span><span class="step size-16"><span class="letters">Pp</span><i id="fa-bars" class="fa-bars"></i></span><span class="step size-18"><span class="letters">Pp</span><i id="fa-bars" class="fa-bars"></i></span><span class="step size-21"><span class="letters">Pp</span><i id="fa-bars" class="fa-bars"></i></span><span class="step size-24"><span class="letters">Pp</span><i id="fa-bars" class="fa-bars"></i></span><span class="step size-36"><span class="letters">Pp</span><i id="fa-bars" class="fa-bars"></i></span><span class="step size-48"><span class="letters">Pp</span><i id="fa-bars" class="fa-bars"></i></span><span class="step size-60"><span class="letters">Pp</span><i id="fa-bars" class="fa-bars"></i></span><span class="step size-72"><span class="letters">Pp</span><i id="fa-bars" class="fa-bars"></i></span>
@ -298,7 +315,7 @@
</div> </div>
<div class="usage"> <div class="usage">
<input class="class" type="text" readonly="readonly" onClick="this.select();" value=".fa-bars" /> <input class="class" type="text" readonly="readonly" onClick="this.select();" value=".fa-bars" />
<input class="point" type="text" readonly="readonly" onClick="this.select();" value="&amp;#xf101;" /> <input class="point" type="text" readonly="readonly" onClick="this.select();" value="&amp;#xf102;" />
</div> </div>
</div> </div>
@ -311,7 +328,7 @@
</div> </div>
<div class="usage"> <div class="usage">
<input class="class" type="text" readonly="readonly" onClick="this.select();" value=".fa-calendar" /> <input class="class" type="text" readonly="readonly" onClick="this.select();" value=".fa-calendar" />
<input class="point" type="text" readonly="readonly" onClick="this.select();" value="&amp;#xf102;" /> <input class="point" type="text" readonly="readonly" onClick="this.select();" value="&amp;#xf103;" />
</div> </div>
</div> </div>
@ -324,7 +341,7 @@
</div> </div>
<div class="usage"> <div class="usage">
<input class="class" type="text" readonly="readonly" onClick="this.select();" value=".fa-chevron-down" /> <input class="class" type="text" readonly="readonly" onClick="this.select();" value=".fa-chevron-down" />
<input class="point" type="text" readonly="readonly" onClick="this.select();" value="&amp;#xf103;" /> <input class="point" type="text" readonly="readonly" onClick="this.select();" value="&amp;#xf104;" />
</div> </div>
</div> </div>
@ -337,7 +354,7 @@
</div> </div>
<div class="usage"> <div class="usage">
<input class="class" type="text" readonly="readonly" onClick="this.select();" value=".fa-chevron-up" /> <input class="class" type="text" readonly="readonly" onClick="this.select();" value=".fa-chevron-up" />
<input class="point" type="text" readonly="readonly" onClick="this.select();" value="&amp;#xf104;" /> <input class="point" type="text" readonly="readonly" onClick="this.select();" value="&amp;#xf105;" />
</div> </div>
</div> </div>
@ -350,7 +367,7 @@
</div> </div>
<div class="usage"> <div class="usage">
<input class="class" type="text" readonly="readonly" onClick="this.select();" value=".fa-code-fork" /> <input class="class" type="text" readonly="readonly" onClick="this.select();" value=".fa-code-fork" />
<input class="point" type="text" readonly="readonly" onClick="this.select();" value="&amp;#xf105;" /> <input class="point" type="text" readonly="readonly" onClick="this.select();" value="&amp;#xf106;" />
</div> </div>
</div> </div>
@ -363,7 +380,7 @@
</div> </div>
<div class="usage"> <div class="usage">
<input class="class" type="text" readonly="readonly" onClick="this.select();" value=".fa-comment" /> <input class="class" type="text" readonly="readonly" onClick="this.select();" value=".fa-comment" />
<input class="point" type="text" readonly="readonly" onClick="this.select();" value="&amp;#xf106;" /> <input class="point" type="text" readonly="readonly" onClick="this.select();" value="&amp;#xf107;" />
</div> </div>
</div> </div>
@ -376,7 +393,7 @@
</div> </div>
<div class="usage"> <div class="usage">
<input class="class" type="text" readonly="readonly" onClick="this.select();" value=".fa-download" /> <input class="class" type="text" readonly="readonly" onClick="this.select();" value=".fa-download" />
<input class="point" type="text" readonly="readonly" onClick="this.select();" value="&amp;#xf107;" /> <input class="point" type="text" readonly="readonly" onClick="this.select();" value="&amp;#xf108;" />
</div> </div>
</div> </div>
@ -390,7 +407,7 @@
<div class="usage"> <div class="usage">
<input class="class" type="text" readonly="readonly" onClick="this.select();" value=".fa-exclamation-triangle" /> <input class="class" type="text" readonly="readonly" onClick="this.select();" value=".fa-exclamation-triangle" />
<input class="class" type="text" readonly="readonly" onClick="this.select();" value=".fa-warning" /> <input class="class" type="text" readonly="readonly" onClick="this.select();" value=".fa-warning" />
<input class="point" type="text" readonly="readonly" onClick="this.select();" value="&amp;#xf108;" /> <input class="point" type="text" readonly="readonly" onClick="this.select();" value="&amp;#xf109;" />
</div> </div>
</div> </div>
@ -403,7 +420,7 @@
</div> </div>
<div class="usage"> <div class="usage">
<input class="class" type="text" readonly="readonly" onClick="this.select();" value=".fa-eye" /> <input class="class" type="text" readonly="readonly" onClick="this.select();" value=".fa-eye" />
<input class="point" type="text" readonly="readonly" onClick="this.select();" value="&amp;#xf109;" /> <input class="point" type="text" readonly="readonly" onClick="this.select();" value="&amp;#xf10a;" />
</div> </div>
</div> </div>
@ -416,7 +433,20 @@
</div> </div>
<div class="usage"> <div class="usage">
<input class="class" type="text" readonly="readonly" onClick="this.select();" value=".fa-facebook-square" /> <input class="class" type="text" readonly="readonly" onClick="this.select();" value=".fa-facebook-square" />
<input class="point" type="text" readonly="readonly" onClick="this.select();" value="&amp;#xf10a;" /> <input class="point" type="text" readonly="readonly" onClick="this.select();" value="&amp;#xf10b;" />
</div>
</div>
<div class="glyph">
<div class="preview-glyphs">
<span class="step size-12"><span class="letters">Pp</span><i id="fa-file-excel-o" class="fa-file-excel-o"></i></span><span class="step size-14"><span class="letters">Pp</span><i id="fa-file-excel-o" class="fa-file-excel-o"></i></span><span class="step size-16"><span class="letters">Pp</span><i id="fa-file-excel-o" class="fa-file-excel-o"></i></span><span class="step size-18"><span class="letters">Pp</span><i id="fa-file-excel-o" class="fa-file-excel-o"></i></span><span class="step size-21"><span class="letters">Pp</span><i id="fa-file-excel-o" class="fa-file-excel-o"></i></span><span class="step size-24"><span class="letters">Pp</span><i id="fa-file-excel-o" class="fa-file-excel-o"></i></span><span class="step size-36"><span class="letters">Pp</span><i id="fa-file-excel-o" class="fa-file-excel-o"></i></span><span class="step size-48"><span class="letters">Pp</span><i id="fa-file-excel-o" class="fa-file-excel-o"></i></span><span class="step size-60"><span class="letters">Pp</span><i id="fa-file-excel-o" class="fa-file-excel-o"></i></span><span class="step size-72"><span class="letters">Pp</span><i id="fa-file-excel-o" class="fa-file-excel-o"></i></span>
</div>
<div class="preview-scale">
<span class="step">12</span><span class="step">14</span><span class="step">16</span><span class="step">18</span><span class="step">21</span><span class="step">24</span><span class="step">36</span><span class="step">48</span><span class="step">60</span><span class="step">72</span>
</div>
<div class="usage">
<input class="class" type="text" readonly="readonly" onClick="this.select();" value=".fa-file-excel-o" />
<input class="point" type="text" readonly="readonly" onClick="this.select();" value="&amp;#xf10c;" />
</div> </div>
</div> </div>
@ -430,7 +460,7 @@
<div class="usage"> <div class="usage">
<input class="class" type="text" readonly="readonly" onClick="this.select();" value=".fa-floppy-o" /> <input class="class" type="text" readonly="readonly" onClick="this.select();" value=".fa-floppy-o" />
<input class="class" type="text" readonly="readonly" onClick="this.select();" value=".fa-save" /> <input class="class" type="text" readonly="readonly" onClick="this.select();" value=".fa-save" />
<input class="point" type="text" readonly="readonly" onClick="this.select();" value="&amp;#xf10b;" /> <input class="point" type="text" readonly="readonly" onClick="this.select();" value="&amp;#xf10d;" />
</div> </div>
</div> </div>
@ -443,7 +473,7 @@
</div> </div>
<div class="usage"> <div class="usage">
<input class="class" type="text" readonly="readonly" onClick="this.select();" value=".fa-github" /> <input class="class" type="text" readonly="readonly" onClick="this.select();" value=".fa-github" />
<input class="point" type="text" readonly="readonly" onClick="this.select();" value="&amp;#xf10c;" /> <input class="point" type="text" readonly="readonly" onClick="this.select();" value="&amp;#xf10e;" />
</div> </div>
</div> </div>
@ -456,7 +486,7 @@
</div> </div>
<div class="usage"> <div class="usage">
<input class="class" type="text" readonly="readonly" onClick="this.select();" value=".fa-globe" /> <input class="class" type="text" readonly="readonly" onClick="this.select();" value=".fa-globe" />
<input class="point" type="text" readonly="readonly" onClick="this.select();" value="&amp;#xf10d;" /> <input class="point" type="text" readonly="readonly" onClick="this.select();" value="&amp;#xf10f;" />
</div> </div>
</div> </div>
@ -469,7 +499,7 @@
</div> </div>
<div class="usage"> <div class="usage">
<input class="class" type="text" readonly="readonly" onClick="this.select();" value=".fa-google" /> <input class="class" type="text" readonly="readonly" onClick="this.select();" value=".fa-google" />
<input class="point" type="text" readonly="readonly" onClick="this.select();" value="&amp;#xf10e;" /> <input class="point" type="text" readonly="readonly" onClick="this.select();" value="&amp;#xf110;" />
</div> </div>
</div> </div>
@ -482,7 +512,7 @@
</div> </div>
<div class="usage"> <div class="usage">
<input class="class" type="text" readonly="readonly" onClick="this.select();" value=".fa-history" /> <input class="class" type="text" readonly="readonly" onClick="this.select();" value=".fa-history" />
<input class="point" type="text" readonly="readonly" onClick="this.select();" value="&amp;#xf10f;" /> <input class="point" type="text" readonly="readonly" onClick="this.select();" value="&amp;#xf111;" />
</div> </div>
</div> </div>
@ -495,20 +525,7 @@
</div> </div>
<div class="usage"> <div class="usage">
<input class="class" type="text" readonly="readonly" onClick="this.select();" value=".fa-home" /> <input class="class" type="text" readonly="readonly" onClick="this.select();" value=".fa-home" />
<input class="point" type="text" readonly="readonly" onClick="this.select();" value="&amp;#xf110;" /> <input class="point" type="text" readonly="readonly" onClick="this.select();" value="&amp;#xf112;" />
</div>
</div>
<div class="glyph">
<div class="preview-glyphs">
<span class="step size-12"><span class="letters">Pp</span><i id="fa-hourglass" class="fa-hourglass"></i></span><span class="step size-14"><span class="letters">Pp</span><i id="fa-hourglass" class="fa-hourglass"></i></span><span class="step size-16"><span class="letters">Pp</span><i id="fa-hourglass" class="fa-hourglass"></i></span><span class="step size-18"><span class="letters">Pp</span><i id="fa-hourglass" class="fa-hourglass"></i></span><span class="step size-21"><span class="letters">Pp</span><i id="fa-hourglass" class="fa-hourglass"></i></span><span class="step size-24"><span class="letters">Pp</span><i id="fa-hourglass" class="fa-hourglass"></i></span><span class="step size-36"><span class="letters">Pp</span><i id="fa-hourglass" class="fa-hourglass"></i></span><span class="step size-48"><span class="letters">Pp</span><i id="fa-hourglass" class="fa-hourglass"></i></span><span class="step size-60"><span class="letters">Pp</span><i id="fa-hourglass" class="fa-hourglass"></i></span><span class="step size-72"><span class="letters">Pp</span><i id="fa-hourglass" class="fa-hourglass"></i></span>
</div>
<div class="preview-scale">
<span class="step">12</span><span class="step">14</span><span class="step">16</span><span class="step">18</span><span class="step">21</span><span class="step">24</span><span class="step">36</span><span class="step">48</span><span class="step">60</span><span class="step">72</span>
</div>
<div class="usage">
<input class="class" type="text" readonly="readonly" onClick="this.select();" value=".fa-hourglass" />
<input class="point" type="text" readonly="readonly" onClick="this.select();" value="&amp;#xf111;" />
</div> </div>
</div> </div>
@ -521,7 +538,7 @@
</div> </div>
<div class="usage"> <div class="usage">
<input class="class" type="text" readonly="readonly" onClick="this.select();" value=".fa-inbox" /> <input class="class" type="text" readonly="readonly" onClick="this.select();" value=".fa-inbox" />
<input class="point" type="text" readonly="readonly" onClick="this.select();" value="&amp;#xf112;" /> <input class="point" type="text" readonly="readonly" onClick="this.select();" value="&amp;#xf113;" />
</div> </div>
</div> </div>
@ -534,7 +551,7 @@
</div> </div>
<div class="usage"> <div class="usage">
<input class="class" type="text" readonly="readonly" onClick="this.select();" value=".fa-key-modern" /> <input class="class" type="text" readonly="readonly" onClick="this.select();" value=".fa-key-modern" />
<input class="point" type="text" readonly="readonly" onClick="this.select();" value="&amp;#xf113;" /> <input class="point" type="text" readonly="readonly" onClick="this.select();" value="&amp;#xf114;" />
</div> </div>
</div> </div>
@ -547,7 +564,7 @@
</div> </div>
<div class="usage"> <div class="usage">
<input class="class" type="text" readonly="readonly" onClick="this.select();" value=".fa-link" /> <input class="class" type="text" readonly="readonly" onClick="this.select();" value=".fa-link" />
<input class="point" type="text" readonly="readonly" onClick="this.select();" value="&amp;#xf114;" /> <input class="point" type="text" readonly="readonly" onClick="this.select();" value="&amp;#xf115;" />
</div> </div>
</div> </div>
@ -560,7 +577,7 @@
</div> </div>
<div class="usage"> <div class="usage">
<input class="class" type="text" readonly="readonly" onClick="this.select();" value=".fa-moon-o" /> <input class="class" type="text" readonly="readonly" onClick="this.select();" value=".fa-moon-o" />
<input class="point" type="text" readonly="readonly" onClick="this.select();" value="&amp;#xf115;" /> <input class="point" type="text" readonly="readonly" onClick="this.select();" value="&amp;#xf116;" />
</div> </div>
</div> </div>
@ -573,7 +590,7 @@
</div> </div>
<div class="usage"> <div class="usage">
<input class="class" type="text" readonly="readonly" onClick="this.select();" value=".fa-pencil" /> <input class="class" type="text" readonly="readonly" onClick="this.select();" value=".fa-pencil" />
<input class="point" type="text" readonly="readonly" onClick="this.select();" value="&amp;#xf116;" /> <input class="point" type="text" readonly="readonly" onClick="this.select();" value="&amp;#xf117;" />
</div> </div>
</div> </div>
@ -586,7 +603,7 @@
</div> </div>
<div class="usage"> <div class="usage">
<input class="class" type="text" readonly="readonly" onClick="this.select();" value=".fa-plus" /> <input class="class" type="text" readonly="readonly" onClick="this.select();" value=".fa-plus" />
<input class="point" type="text" readonly="readonly" onClick="this.select();" value="&amp;#xf117;" /> <input class="point" type="text" readonly="readonly" onClick="this.select();" value="&amp;#xf118;" />
</div> </div>
</div> </div>
@ -599,7 +616,20 @@
</div> </div>
<div class="usage"> <div class="usage">
<input class="class" type="text" readonly="readonly" onClick="this.select();" value=".fa-question-circle" /> <input class="class" type="text" readonly="readonly" onClick="this.select();" value=".fa-question-circle" />
<input class="point" type="text" readonly="readonly" onClick="this.select();" value="&amp;#xf118;" /> <input class="point" type="text" readonly="readonly" onClick="this.select();" value="&amp;#xf119;" />
</div>
</div>
<div class="glyph">
<div class="preview-glyphs">
<span class="step size-12"><span class="letters">Pp</span><i id="fa-reply" class="fa-reply"></i></span><span class="step size-14"><span class="letters">Pp</span><i id="fa-reply" class="fa-reply"></i></span><span class="step size-16"><span class="letters">Pp</span><i id="fa-reply" class="fa-reply"></i></span><span class="step size-18"><span class="letters">Pp</span><i id="fa-reply" class="fa-reply"></i></span><span class="step size-21"><span class="letters">Pp</span><i id="fa-reply" class="fa-reply"></i></span><span class="step size-24"><span class="letters">Pp</span><i id="fa-reply" class="fa-reply"></i></span><span class="step size-36"><span class="letters">Pp</span><i id="fa-reply" class="fa-reply"></i></span><span class="step size-48"><span class="letters">Pp</span><i id="fa-reply" class="fa-reply"></i></span><span class="step size-60"><span class="letters">Pp</span><i id="fa-reply" class="fa-reply"></i></span><span class="step size-72"><span class="letters">Pp</span><i id="fa-reply" class="fa-reply"></i></span>
</div>
<div class="preview-scale">
<span class="step">12</span><span class="step">14</span><span class="step">16</span><span class="step">18</span><span class="step">21</span><span class="step">24</span><span class="step">36</span><span class="step">48</span><span class="step">60</span><span class="step">72</span>
</div>
<div class="usage">
<input class="class" type="text" readonly="readonly" onClick="this.select();" value=".fa-reply" />
<input class="point" type="text" readonly="readonly" onClick="this.select();" value="&amp;#xf11a;" />
</div> </div>
</div> </div>
@ -612,7 +642,7 @@
</div> </div>
<div class="usage"> <div class="usage">
<input class="class" type="text" readonly="readonly" onClick="this.select();" value=".fa-sign-in" /> <input class="class" type="text" readonly="readonly" onClick="this.select();" value=".fa-sign-in" />
<input class="point" type="text" readonly="readonly" onClick="this.select();" value="&amp;#xf119;" /> <input class="point" type="text" readonly="readonly" onClick="this.select();" value="&amp;#xf11b;" />
</div> </div>
</div> </div>
@ -625,86 +655,85 @@
</div> </div>
<div class="usage"> <div class="usage">
<input class="class" type="text" readonly="readonly" onClick="this.select();" value=".fa-sign-out" /> <input class="class" type="text" readonly="readonly" onClick="this.select();" value=".fa-sign-out" />
<input class="point" type="text" readonly="readonly" onClick="this.select();" value="&amp;#xf11a;" /> <input class="point" type="text" readonly="readonly" onClick="this.select();" value="&amp;#xf11c;" />
</div> </div>
</div> </div>
<div class="glyph"> <div class="glyph">
<div class="preview-glyphs"> <div class="preview-glyphs">
<span class="step size-12"><span class="letters">Pp</span><i id="fa-star" class="fa-star"></i></span><span class="step size-14"><span class="letters">Pp</span><i id="fa-star" class="fa-star"></i></span><span class="step size-16"><span class="letters">Pp</span><i id="fa-star" class="fa-star"></i></span><span class="step size-18"><span class="letters">Pp</span><i id="fa-star" class="fa-star"></i></span><span class="step size-21"><span class="letters">Pp</span><i id="fa-star" class="fa-star"></i></span><span class="step size-24"><span class="letters">Pp</span><i id="fa-star" class="fa-star"></i></span><span class="step size-36"><span class="letters">Pp</span><i id="fa-star" class="fa-star"></i></span><span class="step size-48"><span class="letters">Pp</span><i id="fa-star" class="fa-star"></i></span><span class="step size-60"><span class="letters">Pp</span><i id="fa-star" class="fa-star"></i></span><span class="step size-72"><span class="letters">Pp</span><i id="fa-star" class="fa-star"></i></span> <span class="step size-12"><span class="letters">Pp</span><i id="fa-spinner" class="fa-spinner"></i></span><span class="step size-14"><span class="letters">Pp</span><i id="fa-spinner" class="fa-spinner"></i></span><span class="step size-16"><span class="letters">Pp</span><i id="fa-spinner" class="fa-spinner"></i></span><span class="step size-18"><span class="letters">Pp</span><i id="fa-spinner" class="fa-spinner"></i></span><span class="step size-21"><span class="letters">Pp</span><i id="fa-spinner" class="fa-spinner"></i></span><span class="step size-24"><span class="letters">Pp</span><i id="fa-spinner" class="fa-spinner"></i></span><span class="step size-36"><span class="letters">Pp</span><i id="fa-spinner" class="fa-spinner"></i></span><span class="step size-48"><span class="letters">Pp</span><i id="fa-spinner" class="fa-spinner"></i></span><span class="step size-60"><span class="letters">Pp</span><i id="fa-spinner" class="fa-spinner"></i></span><span class="step size-72"><span class="letters">Pp</span><i id="fa-spinner" class="fa-spinner"></i></span>
</div> </div>
<div class="preview-scale"> <div class="preview-scale">
<span class="step">12</span><span class="step">14</span><span class="step">16</span><span class="step">18</span><span class="step">21</span><span class="step">24</span><span class="step">36</span><span class="step">48</span><span class="step">60</span><span class="step">72</span> <span class="step">12</span><span class="step">14</span><span class="step">16</span><span class="step">18</span><span class="step">21</span><span class="step">24</span><span class="step">36</span><span class="step">48</span><span class="step">60</span><span class="step">72</span>
</div> </div>
<div class="usage"> <div class="usage">
<input class="class" type="text" readonly="readonly" onClick="this.select();" value=".fa-star" /> <input class="class" type="text" readonly="readonly" onClick="this.select();" value=".fa-spinner" />
<input class="point" type="text" readonly="readonly" onClick="this.select();" value="&amp;#xf11b;" /> <input class="point" type="text" readonly="readonly" onClick="this.select();" value="&amp;#xf11d;" />
</div> </div>
</div> </div>
<div class="glyph"> <div class="glyph">
<div class="preview-glyphs"> <div class="preview-glyphs">
<span class="step size-12"><span class="letters">Pp</span><i id="fa-star-o" class="fa-star-o"></i></span><span class="step size-14"><span class="letters">Pp</span><i id="fa-star-o" class="fa-star-o"></i></span><span class="step size-16"><span class="letters">Pp</span><i id="fa-star-o" class="fa-star-o"></i></span><span class="step size-18"><span class="letters">Pp</span><i id="fa-star-o" class="fa-star-o"></i></span><span class="step size-21"><span class="letters">Pp</span><i id="fa-star-o" class="fa-star-o"></i></span><span class="step size-24"><span class="letters">Pp</span><i id="fa-star-o" class="fa-star-o"></i></span><span class="step size-36"><span class="letters">Pp</span><i id="fa-star-o" class="fa-star-o"></i></span><span class="step size-48"><span class="letters">Pp</span><i id="fa-star-o" class="fa-star-o"></i></span><span class="step size-60"><span class="letters">Pp</span><i id="fa-star-o" class="fa-star-o"></i></span><span class="step size-72"><span class="letters">Pp</span><i id="fa-star-o" class="fa-star-o"></i></span> <span class="step size-12"><span class="letters">Pp</span><i id="fa-star" class="fa-star"></i></span><span class="step size-14"><span class="letters">Pp</span><i id="fa-star" class="fa-star"></i></span><span class="step size-16"><span class="letters">Pp</span><i id="fa-star" class="fa-star"></i></span><span class="step size-18"><span class="letters">Pp</span><i id="fa-star" class="fa-star"></i></span><span class="step size-21"><span class="letters">Pp</span><i id="fa-star" class="fa-star"></i></span><span class="step size-24"><span class="letters">Pp</span><i id="fa-star" class="fa-star"></i></span><span class="step size-36"><span class="letters">Pp</span><i id="fa-star" class="fa-star"></i></span><span class="step size-48"><span class="letters">Pp</span><i id="fa-star" class="fa-star"></i></span><span class="step size-60"><span class="letters">Pp</span><i id="fa-star" class="fa-star"></i></span><span class="step size-72"><span class="letters">Pp</span><i id="fa-star" class="fa-star"></i></span>
</div> </div>
<div class="preview-scale"> <div class="preview-scale">
<span class="step">12</span><span class="step">14</span><span class="step">16</span><span class="step">18</span><span class="step">21</span><span class="step">24</span><span class="step">36</span><span class="step">48</span><span class="step">60</span><span class="step">72</span> <span class="step">12</span><span class="step">14</span><span class="step">16</span><span class="step">18</span><span class="step">21</span><span class="step">24</span><span class="step">36</span><span class="step">48</span><span class="step">60</span><span class="step">72</span>
</div> </div>
<div class="usage"> <div class="usage">
<input class="class" type="text" readonly="readonly" onClick="this.select();" value=".fa-star-o" /> <input class="class" type="text" readonly="readonly" onClick="this.select();" value=".fa-star" />
<input class="point" type="text" readonly="readonly" onClick="this.select();" value="&amp;#xf11c;" /> <input class="point" type="text" readonly="readonly" onClick="this.select();" value="&amp;#xf11e;" />
</div> </div>
</div> </div>
<div class="glyph"> <div class="glyph">
<div class="preview-glyphs"> <div class="preview-glyphs">
<span class="step size-12"><span class="letters">Pp</span><i id="fa-sun-o" class="fa-sun-o"></i></span><span class="step size-14"><span class="letters">Pp</span><i id="fa-sun-o" class="fa-sun-o"></i></span><span class="step size-16"><span class="letters">Pp</span><i id="fa-sun-o" class="fa-sun-o"></i></span><span class="step size-18"><span class="letters">Pp</span><i id="fa-sun-o" class="fa-sun-o"></i></span><span class="step size-21"><span class="letters">Pp</span><i id="fa-sun-o" class="fa-sun-o"></i></span><span class="step size-24"><span class="letters">Pp</span><i id="fa-sun-o" class="fa-sun-o"></i></span><span class="step size-36"><span class="letters">Pp</span><i id="fa-sun-o" class="fa-sun-o"></i></span><span class="step size-48"><span class="letters">Pp</span><i id="fa-sun-o" class="fa-sun-o"></i></span><span class="step size-60"><span class="letters">Pp</span><i id="fa-sun-o" class="fa-sun-o"></i></span><span class="step size-72"><span class="letters">Pp</span><i id="fa-sun-o" class="fa-sun-o"></i></span> <span class="step size-12"><span class="letters">Pp</span><i id="fa-star-o" class="fa-star-o"></i></span><span class="step size-14"><span class="letters">Pp</span><i id="fa-star-o" class="fa-star-o"></i></span><span class="step size-16"><span class="letters">Pp</span><i id="fa-star-o" class="fa-star-o"></i></span><span class="step size-18"><span class="letters">Pp</span><i id="fa-star-o" class="fa-star-o"></i></span><span class="step size-21"><span class="letters">Pp</span><i id="fa-star-o" class="fa-star-o"></i></span><span class="step size-24"><span class="letters">Pp</span><i id="fa-star-o" class="fa-star-o"></i></span><span class="step size-36"><span class="letters">Pp</span><i id="fa-star-o" class="fa-star-o"></i></span><span class="step size-48"><span class="letters">Pp</span><i id="fa-star-o" class="fa-star-o"></i></span><span class="step size-60"><span class="letters">Pp</span><i id="fa-star-o" class="fa-star-o"></i></span><span class="step size-72"><span class="letters">Pp</span><i id="fa-star-o" class="fa-star-o"></i></span>
</div> </div>
<div class="preview-scale"> <div class="preview-scale">
<span class="step">12</span><span class="step">14</span><span class="step">16</span><span class="step">18</span><span class="step">21</span><span class="step">24</span><span class="step">36</span><span class="step">48</span><span class="step">60</span><span class="step">72</span> <span class="step">12</span><span class="step">14</span><span class="step">16</span><span class="step">18</span><span class="step">21</span><span class="step">24</span><span class="step">36</span><span class="step">48</span><span class="step">60</span><span class="step">72</span>
</div> </div>
<div class="usage"> <div class="usage">
<input class="class" type="text" readonly="readonly" onClick="this.select();" value=".fa-sun-o" /> <input class="class" type="text" readonly="readonly" onClick="this.select();" value=".fa-star-o" />
<input class="point" type="text" readonly="readonly" onClick="this.select();" value="&amp;#xf11d;" /> <input class="point" type="text" readonly="readonly" onClick="this.select();" value="&amp;#xf11f;" />
</div> </div>
</div> </div>
<div class="glyph"> <div class="glyph">
<div class="preview-glyphs"> <div class="preview-glyphs">
<span class="step size-12"><span class="letters">Pp</span><i id="fa-table" class="fa-table"></i></span><span class="step size-14"><span class="letters">Pp</span><i id="fa-table" class="fa-table"></i></span><span class="step size-16"><span class="letters">Pp</span><i id="fa-table" class="fa-table"></i></span><span class="step size-18"><span class="letters">Pp</span><i id="fa-table" class="fa-table"></i></span><span class="step size-21"><span class="letters">Pp</span><i id="fa-table" class="fa-table"></i></span><span class="step size-24"><span class="letters">Pp</span><i id="fa-table" class="fa-table"></i></span><span class="step size-36"><span class="letters">Pp</span><i id="fa-table" class="fa-table"></i></span><span class="step size-48"><span class="letters">Pp</span><i id="fa-table" class="fa-table"></i></span><span class="step size-60"><span class="letters">Pp</span><i id="fa-table" class="fa-table"></i></span><span class="step size-72"><span class="letters">Pp</span><i id="fa-table" class="fa-table"></i></span> <span class="step size-12"><span class="letters">Pp</span><i id="fa-sun-o" class="fa-sun-o"></i></span><span class="step size-14"><span class="letters">Pp</span><i id="fa-sun-o" class="fa-sun-o"></i></span><span class="step size-16"><span class="letters">Pp</span><i id="fa-sun-o" class="fa-sun-o"></i></span><span class="step size-18"><span class="letters">Pp</span><i id="fa-sun-o" class="fa-sun-o"></i></span><span class="step size-21"><span class="letters">Pp</span><i id="fa-sun-o" class="fa-sun-o"></i></span><span class="step size-24"><span class="letters">Pp</span><i id="fa-sun-o" class="fa-sun-o"></i></span><span class="step size-36"><span class="letters">Pp</span><i id="fa-sun-o" class="fa-sun-o"></i></span><span class="step size-48"><span class="letters">Pp</span><i id="fa-sun-o" class="fa-sun-o"></i></span><span class="step size-60"><span class="letters">Pp</span><i id="fa-sun-o" class="fa-sun-o"></i></span><span class="step size-72"><span class="letters">Pp</span><i id="fa-sun-o" class="fa-sun-o"></i></span>
</div> </div>
<div class="preview-scale"> <div class="preview-scale">
<span class="step">12</span><span class="step">14</span><span class="step">16</span><span class="step">18</span><span class="step">21</span><span class="step">24</span><span class="step">36</span><span class="step">48</span><span class="step">60</span><span class="step">72</span> <span class="step">12</span><span class="step">14</span><span class="step">16</span><span class="step">18</span><span class="step">21</span><span class="step">24</span><span class="step">36</span><span class="step">48</span><span class="step">60</span><span class="step">72</span>
</div> </div>
<div class="usage"> <div class="usage">
<input class="class" type="text" readonly="readonly" onClick="this.select();" value=".fa-table" /> <input class="class" type="text" readonly="readonly" onClick="this.select();" value=".fa-sun-o" />
<input class="point" type="text" readonly="readonly" onClick="this.select();" value="&amp;#xf11e;" /> <input class="point" type="text" readonly="readonly" onClick="this.select();" value="&amp;#xf120;" />
</div> </div>
</div> </div>
<div class="glyph"> <div class="glyph">
<div class="preview-glyphs"> <div class="preview-glyphs">
<span class="step size-12"><span class="letters">Pp</span><i id="fa-th-list" class="fa-th-list"></i></span><span class="step size-14"><span class="letters">Pp</span><i id="fa-th-list" class="fa-th-list"></i></span><span class="step size-16"><span class="letters">Pp</span><i id="fa-th-list" class="fa-th-list"></i></span><span class="step size-18"><span class="letters">Pp</span><i id="fa-th-list" class="fa-th-list"></i></span><span class="step size-21"><span class="letters">Pp</span><i id="fa-th-list" class="fa-th-list"></i></span><span class="step size-24"><span class="letters">Pp</span><i id="fa-th-list" class="fa-th-list"></i></span><span class="step size-36"><span class="letters">Pp</span><i id="fa-th-list" class="fa-th-list"></i></span><span class="step size-48"><span class="letters">Pp</span><i id="fa-th-list" class="fa-th-list"></i></span><span class="step size-60"><span class="letters">Pp</span><i id="fa-th-list" class="fa-th-list"></i></span><span class="step size-72"><span class="letters">Pp</span><i id="fa-th-list" class="fa-th-list"></i></span> <span class="step size-12"><span class="letters">Pp</span><i id="fa-table" class="fa-table"></i></span><span class="step size-14"><span class="letters">Pp</span><i id="fa-table" class="fa-table"></i></span><span class="step size-16"><span class="letters">Pp</span><i id="fa-table" class="fa-table"></i></span><span class="step size-18"><span class="letters">Pp</span><i id="fa-table" class="fa-table"></i></span><span class="step size-21"><span class="letters">Pp</span><i id="fa-table" class="fa-table"></i></span><span class="step size-24"><span class="letters">Pp</span><i id="fa-table" class="fa-table"></i></span><span class="step size-36"><span class="letters">Pp</span><i id="fa-table" class="fa-table"></i></span><span class="step size-48"><span class="letters">Pp</span><i id="fa-table" class="fa-table"></i></span><span class="step size-60"><span class="letters">Pp</span><i id="fa-table" class="fa-table"></i></span><span class="step size-72"><span class="letters">Pp</span><i id="fa-table" class="fa-table"></i></span>
</div> </div>
<div class="preview-scale"> <div class="preview-scale">
<span class="step">12</span><span class="step">14</span><span class="step">16</span><span class="step">18</span><span class="step">21</span><span class="step">24</span><span class="step">36</span><span class="step">48</span><span class="step">60</span><span class="step">72</span> <span class="step">12</span><span class="step">14</span><span class="step">16</span><span class="step">18</span><span class="step">21</span><span class="step">24</span><span class="step">36</span><span class="step">48</span><span class="step">60</span><span class="step">72</span>
</div> </div>
<div class="usage"> <div class="usage">
<input class="class" type="text" readonly="readonly" onClick="this.select();" value=".fa-th-list" /> <input class="class" type="text" readonly="readonly" onClick="this.select();" value=".fa-table" />
<input class="point" type="text" readonly="readonly" onClick="this.select();" value="&amp;#xf11f;" /> <input class="point" type="text" readonly="readonly" onClick="this.select();" value="&amp;#xf121;" />
</div> </div>
</div> </div>
<div class="glyph"> <div class="glyph">
<div class="preview-glyphs"> <div class="preview-glyphs">
<span class="step size-12"><span class="letters">Pp</span><i id="fa-times" class="fa-times"></i></span><span class="step size-14"><span class="letters">Pp</span><i id="fa-times" class="fa-times"></i></span><span class="step size-16"><span class="letters">Pp</span><i id="fa-times" class="fa-times"></i></span><span class="step size-18"><span class="letters">Pp</span><i id="fa-times" class="fa-times"></i></span><span class="step size-21"><span class="letters">Pp</span><i id="fa-times" class="fa-times"></i></span><span class="step size-24"><span class="letters">Pp</span><i id="fa-times" class="fa-times"></i></span><span class="step size-36"><span class="letters">Pp</span><i id="fa-times" class="fa-times"></i></span><span class="step size-48"><span class="letters">Pp</span><i id="fa-times" class="fa-times"></i></span><span class="step size-60"><span class="letters">Pp</span><i id="fa-times" class="fa-times"></i></span><span class="step size-72"><span class="letters">Pp</span><i id="fa-times" class="fa-times"></i></span> <span class="step size-12"><span class="letters">Pp</span><i id="fa-th-list" class="fa-th-list"></i></span><span class="step size-14"><span class="letters">Pp</span><i id="fa-th-list" class="fa-th-list"></i></span><span class="step size-16"><span class="letters">Pp</span><i id="fa-th-list" class="fa-th-list"></i></span><span class="step size-18"><span class="letters">Pp</span><i id="fa-th-list" class="fa-th-list"></i></span><span class="step size-21"><span class="letters">Pp</span><i id="fa-th-list" class="fa-th-list"></i></span><span class="step size-24"><span class="letters">Pp</span><i id="fa-th-list" class="fa-th-list"></i></span><span class="step size-36"><span class="letters">Pp</span><i id="fa-th-list" class="fa-th-list"></i></span><span class="step size-48"><span class="letters">Pp</span><i id="fa-th-list" class="fa-th-list"></i></span><span class="step size-60"><span class="letters">Pp</span><i id="fa-th-list" class="fa-th-list"></i></span><span class="step size-72"><span class="letters">Pp</span><i id="fa-th-list" class="fa-th-list"></i></span>
</div> </div>
<div class="preview-scale"> <div class="preview-scale">
<span class="step">12</span><span class="step">14</span><span class="step">16</span><span class="step">18</span><span class="step">21</span><span class="step">24</span><span class="step">36</span><span class="step">48</span><span class="step">60</span><span class="step">72</span> <span class="step">12</span><span class="step">14</span><span class="step">16</span><span class="step">18</span><span class="step">21</span><span class="step">24</span><span class="step">36</span><span class="step">48</span><span class="step">60</span><span class="step">72</span>
</div> </div>
<div class="usage"> <div class="usage">
<input class="class" type="text" readonly="readonly" onClick="this.select();" value=".fa-times" /> <input class="class" type="text" readonly="readonly" onClick="this.select();" value=".fa-th-list" />
<input class="class" type="text" readonly="readonly" onClick="this.select();" value=".fa-close" /> <input class="point" type="text" readonly="readonly" onClick="this.select();" value="&amp;#xf122;" />
<input class="point" type="text" readonly="readonly" onClick="this.select();" value="&amp;#xf120;" />
</div> </div>
</div> </div>
@ -717,7 +746,7 @@
</div> </div>
<div class="usage"> <div class="usage">
<input class="class" type="text" readonly="readonly" onClick="this.select();" value=".fa-trash-o" /> <input class="class" type="text" readonly="readonly" onClick="this.select();" value=".fa-trash-o" />
<input class="point" type="text" readonly="readonly" onClick="this.select();" value="&amp;#xf121;" /> <input class="point" type="text" readonly="readonly" onClick="this.select();" value="&amp;#xf123;" />
</div> </div>
</div> </div>
@ -730,7 +759,7 @@
</div> </div>
<div class="usage"> <div class="usage">
<input class="class" type="text" readonly="readonly" onClick="this.select();" value=".fa-undo" /> <input class="class" type="text" readonly="readonly" onClick="this.select();" value=".fa-undo" />
<input class="point" type="text" readonly="readonly" onClick="this.select();" value="&amp;#xf122;" /> <input class="point" type="text" readonly="readonly" onClick="this.select();" value="&amp;#xf124;" />
</div> </div>
</div> </div>
@ -743,7 +772,7 @@
</div> </div>
<div class="usage"> <div class="usage">
<input class="class" type="text" readonly="readonly" onClick="this.select();" value=".fa-user" /> <input class="class" type="text" readonly="readonly" onClick="this.select();" value=".fa-user" />
<input class="point" type="text" readonly="readonly" onClick="this.select();" value="&amp;#xf123;" /> <input class="point" type="text" readonly="readonly" onClick="this.select();" value="&amp;#xf125;" />
</div> </div>
</div> </div>
@ -756,7 +785,7 @@
</div> </div>
<div class="usage"> <div class="usage">
<input class="class" type="text" readonly="readonly" onClick="this.select();" value=".fa-user-circle-o" /> <input class="class" type="text" readonly="readonly" onClick="this.select();" value=".fa-user-circle-o" />
<input class="point" type="text" readonly="readonly" onClick="this.select();" value="&amp;#xf124;" /> <input class="point" type="text" readonly="readonly" onClick="this.select();" value="&amp;#xf126;" />
</div> </div>
</div> </div>
@ -769,7 +798,7 @@
</div> </div>
<div class="usage"> <div class="usage">
<input class="class" type="text" readonly="readonly" onClick="this.select();" value=".fa-user-plus" /> <input class="class" type="text" readonly="readonly" onClick="this.select();" value=".fa-user-plus" />
<input class="point" type="text" readonly="readonly" onClick="this.select();" value="&amp;#xf125;" /> <input class="point" type="text" readonly="readonly" onClick="this.select();" value="&amp;#xf127;" />
</div> </div>
</div> </div>
@ -782,7 +811,7 @@
</div> </div>
<div class="usage"> <div class="usage">
<input class="class" type="text" readonly="readonly" onClick="this.select();" value=".fa-users" /> <input class="class" type="text" readonly="readonly" onClick="this.select();" value=".fa-users" />
<input class="point" type="text" readonly="readonly" onClick="this.select();" value="&amp;#xf126;" /> <input class="point" type="text" readonly="readonly" onClick="this.select();" value="&amp;#xf128;" />
</div> </div>
</div> </div>
@ -795,7 +824,7 @@
</div> </div>
<div class="usage"> <div class="usage">
<input class="class" type="text" readonly="readonly" onClick="this.select();" value=".fa-wrench" /> <input class="class" type="text" readonly="readonly" onClick="this.select();" value=".fa-wrench" />
<input class="point" type="text" readonly="readonly" onClick="this.select();" value="&amp;#xf127;" /> <input class="point" type="text" readonly="readonly" onClick="this.select();" value="&amp;#xf129;" />
</div> </div>
</div> </div>

81
public/fonts/fa-dtbl-1.css vendored
Unescape View File

@ -7,7 +7,6 @@
src: url('./fa-dtbl-1.eot?v=1.1.0'); src: url('./fa-dtbl-1.eot?v=1.1.0');
src: url('./fa-dtbl-1.eot?#iefix&v=1.1.0') format('embedded-opentype'), src: url('./fa-dtbl-1.eot?#iefix&v=1.1.0') format('embedded-opentype'),
url('./fa-dtbl-1.woff2?v=1.1.0') format('woff2'), url('./fa-dtbl-1.woff2?v=1.1.0') format('woff2'),
url('./fa-dtbl-1.woff?v=1.1.0') format('woff'),
url('./fa-dtbl-1.ttf?v=1.1.0') format('truetype'), url('./fa-dtbl-1.ttf?v=1.1.0') format('truetype'),
url('./fa-dtbl-1.svg?v=1.1.0#fa-dtbl-1') format('svg'); url('./fa-dtbl-1.svg?v=1.1.0#fa-dtbl-1') format('svg');
font-weight: normal; font-weight: normal;
@ -40,42 +39,44 @@
} }
.fa-address-card-o::before, .fa-vcard-o::before { content: "\f100"; } .fa-address-card-o::before, .fa-vcard-o::before { content: "\f100"; }
.fa-bars::before { content: "\f101"; } .fa-arrow-left::before { content: "\f101"; }
.fa-calendar::before { content: "\f102"; } .fa-bars::before { content: "\f102"; }
.fa-chevron-down::before { content: "\f103"; } .fa-calendar::before { content: "\f103"; }
.fa-chevron-up::before { content: "\f104"; } .fa-chevron-down::before { content: "\f104"; }
.fa-code-fork::before { content: "\f105"; } .fa-chevron-up::before { content: "\f105"; }
.fa-comment::before { content: "\f106"; } .fa-code-fork::before { content: "\f106"; }
.fa-download::before { content: "\f107"; } .fa-comment::before { content: "\f107"; }
.fa-exclamation-triangle::before, .fa-warning::before { content: "\f108"; } .fa-download::before { content: "\f108"; }
.fa-eye::before { content: "\f109"; } .fa-exclamation-triangle::before, .fa-warning::before { content: "\f109"; }
.fa-facebook-square::before { content: "\f10a"; } .fa-eye::before { content: "\f10a"; }
.fa-floppy-o::before, .fa-save::before { content: "\f10b"; } .fa-facebook-square::before { content: "\f10b"; }
.fa-github::before { content: "\f10c"; } .fa-file-excel-o::before { content: "\f10c"; }
.fa-globe::before { content: "\f10d"; } .fa-floppy-o::before, .fa-save::before { content: "\f10d"; }
.fa-google::before { content: "\f10e"; } .fa-github::before { content: "\f10e"; }
.fa-history::before { content: "\f10f"; } .fa-globe::before { content: "\f10f"; }
.fa-home::before { content: "\f110"; } .fa-google::before { content: "\f110"; }
.fa-hourglass::before { content: "\f111"; } .fa-history::before { content: "\f111"; }
.fa-inbox::before { content: "\f112"; } .fa-home::before { content: "\f112"; }
.fa-key-modern::before { content: "\f113"; } .fa-inbox::before { content: "\f113"; }
.fa-link::before { content: "\f114"; } .fa-key-modern::before { content: "\f114"; }
.fa-moon-o::before { content: "\f115"; } .fa-link::before { content: "\f115"; }
.fa-pencil::before { content: "\f116"; } .fa-moon-o::before { content: "\f116"; }
.fa-plus::before { content: "\f117"; } .fa-pencil::before { content: "\f117"; }
.fa-question-circle::before { content: "\f118"; } .fa-plus::before { content: "\f118"; }
.fa-sign-in::before { content: "\f119"; } .fa-question-circle::before { content: "\f119"; }
.fa-sign-out::before { content: "\f11a"; } .fa-reply::before { content: "\f11a"; }
.fa-star::before { content: "\f11b"; } .fa-sign-in::before { content: "\f11b"; }
.fa-star-o::before { content: "\f11c"; } .fa-sign-out::before { content: "\f11c"; }
.fa-sun-o::before { content: "\f11d"; } .fa-spinner::before { content: "\f11d"; }
.fa-table::before { content: "\f11e"; } .fa-star::before { content: "\f11e"; }
.fa-th-list::before { content: "\f11f"; } .fa-star-o::before { content: "\f11f"; }
.fa-times::before, .fa-close::before { content: "\f120"; } .fa-sun-o::before { content: "\f120"; }
.fa-trash-o::before { content: "\f121"; } .fa-table::before { content: "\f121"; }
.fa-undo::before { content: "\f122"; } .fa-th-list::before { content: "\f122"; }
.fa-user::before { content: "\f123"; } .fa-trash-o::before { content: "\f123"; }
.fa-user-circle-o::before { content: "\f124"; } .fa-undo::before { content: "\f124"; }
.fa-user-plus::before { content: "\f125"; } .fa-user::before { content: "\f125"; }
.fa-users::before { content: "\f126"; } .fa-user-circle-o::before { content: "\f126"; }
.fa-wrench::before { content: "\f127"; } .fa-user-plus::before { content: "\f127"; }
.fa-users::before { content: "\f128"; }
.fa-wrench::before { content: "\f129"; }

BIN
public/fonts/fa-dtbl-1.eot
View File

Binary file not shown.

234
public/fonts/fa-dtbl-1.svg
Unescape View File

@ -1,12 +1,12 @@
<?xml version="1.0" standalone="no"?> <?xml version="1.0" standalone="no"?>
<!DOCTYPE svg PUBLIC "-//W3C//DTD SVG 1.1//EN" "http://www.w3.org/Graphics/SVG/1.1/DTD/svg11.dtd" > <!DOCTYPE svg PUBLIC "-//W3C//DTD SVG 1.1//EN" "http://www.w3.org/Graphics/SVG/1.1/DTD/svg11.dtd" >
<!-- <!--
2018-8-8: Created with FontForge (http://fontforge.org) 2018-8-10: Created with FontForge (http://fontforge.org)
--> -->
<svg xmlns="http://www.w3.org/2000/svg" xmlns:xlink="http://www.w3.org/1999/xlink" version="1.1"> <svg xmlns="http://www.w3.org/2000/svg" xmlns:xlink="http://www.w3.org/1999/xlink" version="1.1">
<metadata> <metadata>
Created by FontForge 20180321 at Wed Aug 8 11:13:46 2018 Created by FontForge 20170805 at Fri Aug 10 18:09:07 2018
By cpsd By ondra
The Fork Awesome font is licensed under the SIL OFL 1.1 (http://scripts.sil.org/OFL). Fork Awesome is a fork based of off Font Awesome 4.7.0 by Dave Gandy. More info on licenses at https://forkawesome.github.io The Fork Awesome font is licensed under the SIL OFL 1.1 (http://scripts.sil.org/OFL). Fork Awesome is a fork based of off Font Awesome 4.7.0 by Dave Gandy. More info on licenses at https://forkawesome.github.io
</metadata> </metadata>
<defs> <defs>
@ -22,149 +22,157 @@ The Fork Awesome font is licensed under the SIL OFL 1.1 (http://scripts.sil.org/
bbox="-0.14014 -256.168 2048 1536.01" bbox="-0.14014 -256.168 2048 1536.01"
underline-thickness="89.6" underline-thickness="89.6"
underline-position="-179.2" underline-position="-179.2"
unicode-range="U+0020-F127" unicode-range="U+0020-F129"
/> />
<missing-glyph /> <missing-glyph />
<glyph glyph-name="space" unicode=" " horiz-adv-x="200" <glyph glyph-name="space" unicode=" " horiz-adv-x="200"
/> />
<glyph glyph-name="comment" unicode="&#xf106;" horiz-adv-x="1792" <glyph glyph-name="address-card-o" unicode="&#xf100;" horiz-adv-x="2048"
d="M1792 640c0 -354 -401 -640 -896 -640c-49 0 -98 3 -145 8c-131 -116 -287 -198 -460 -242c-36 -10 -75 -17 -114 -22c-22 -2 -43 14 -48 38v1c-5 25 12 40 27 58c63 71 135 131 182 298c-206 117 -338 298 -338 501c0 353 401 640 896 640s896 -286 896 -640z" /> d="M1024 405c0 -87 -57 -149 -128 -149h-512c-71 0 -128 62 -128 149c0 155 38 327 196 327c49 -28 115 -76 188 -76s139 48 188 76c158 0 196 -172 196 -327zM867 925c0 -126 -102 -227 -227 -227s-227 101 -227 227c0 125 102 227 227 227s227 -102 227 -227zM1792 480
<glyph glyph-name="bars" unicode="&#xf101;" v-64c0 -18 -14 -32 -32 -32h-576c-18 0 -32 14 -32 32v64c0 18 14 32 32 32h576c18 0 32 -14 32 -32zM1792 732v-56c0 -20 -16 -36 -36 -36h-568c-20 0 -36 16 -36 36v56c0 20 16 36 36 36h568c20 0 36 -16 36 -36zM1792 992v-64c0 -18 -14 -32 -32 -32h-576
c-18 0 -32 14 -32 32v64c0 18 14 32 32 32h576c18 0 32 -14 32 -32zM1920 32v1216c0 17 -15 32 -32 32h-1728c-17 0 -32 -15 -32 -32v-1216c0 -17 15 -32 32 -32h352v96c0 18 14 32 32 32h64c18 0 32 -14 32 -32v-96h768v96c0 18 14 32 32 32h64c18 0 32 -14 32 -32v-96h352
c17 0 32 15 32 32zM2048 1248v-1216c0 -88 -72 -160 -160 -160h-1728c-88 0 -160 72 -160 160v1216c0 88 72 160 160 160h1728c88 0 160 -72 160 -160z" />
<glyph glyph-name="arrow-left" unicode="&#xf101;" horiz-adv-x="1472"
d="M1472 640v-128c0 -68 -45 -128 -117 -128h-704l293 -294c24 -23 38 -56 38 -90s-14 -67 -38 -90l-75 -76c-23 -23 -56 -37 -90 -37s-67 14 -91 37l-651 652c-23 23 -37 56 -37 90s14 67 37 91l651 650c24 24 57 38 91 38s66 -14 90 -38l75 -74c24 -24 38 -57 38 -91
s-14 -67 -38 -91l-293 -293h704c72 0 117 -60 117 -128z" />
<glyph glyph-name="bars" unicode="&#xf102;"
d="M1536 192v-128c0 -35 -29 -64 -64 -64h-1408c-35 0 -64 29 -64 64v128c0 35 29 64 64 64h1408c35 0 64 -29 64 -64zM1536 704v-128c0 -35 -29 -64 -64 -64h-1408c-35 0 -64 29 -64 64v128c0 35 29 64 64 64h1408c35 0 64 -29 64 -64zM1536 1216v-128 d="M1536 192v-128c0 -35 -29 -64 -64 -64h-1408c-35 0 -64 29 -64 64v128c0 35 29 64 64 64h1408c35 0 64 -29 64 -64zM1536 704v-128c0 -35 -29 -64 -64 -64h-1408c-35 0 -64 29 -64 64v128c0 35 29 64 64 64h1408c35 0 64 -29 64 -64zM1536 1216v-128
c0 -35 -29 -64 -64 -64h-1408c-35 0 -64 29 -64 64v128c0 35 29 64 64 64h1408c35 0 64 -29 64 -64z" /> c0 -35 -29 -64 -64 -64h-1408c-35 0 -64 29 -64 64v128c0 35 29 64 64 64h1408c35 0 64 -29 64 -64z" />
<glyph glyph-name="google" unicode="&#xf10e;" horiz-adv-x="1505" <glyph glyph-name="calendar" unicode="&#xf103;" horiz-adv-x="1664"
d="M768 750h725c7 -39 12 -77 12 -128c0 -438 -294 -750 -737 -750c-425 0 -768 343 -768 768s343 768 768 768c207 0 381 -76 515 -201l-209 -201c-57 55 -157 119 -306 119c-262 0 -476 -217 -476 -485s214 -485 476 -485c304 0 418 218 436 331h-436v264z" /> d="M128 -128h288v288h-288v-288zM480 -128h320v288h-320v-288zM128 224h288v320h-288v-320zM480 224h320v320h-320v-320zM128 608h288v288h-288v-288zM864 -128h320v288h-320v-288zM480 608h320v288h-320v-288zM1248 -128h288v288h-288v-288zM864 224h320v320h-320v-320z
<glyph glyph-name="question-circle" unicode="&#xf118;" M512 1088v288c0 17 -15 32 -32 32h-64c-17 0 -32 -15 -32 -32v-288c0 -17 15 -32 32 -32h64c17 0 32 15 32 32zM1248 224h288v320h-288v-320zM864 608h320v288h-320v-288zM1248 608h288v288h-288v-288zM1280 1088v288c0 17 -15 32 -32 32h-64c-17 0 -32 -15 -32 -32v-288
d="M896 160v192c0 18 -14 32 -32 32h-192c-18 0 -32 -14 -32 -32v-192c0 -18 14 -32 32 -32h192c18 0 32 14 32 32zM1152 832c0 183 -192 320 -364 320c-163 0 -285 -70 -371 -213c-9 -14 -5 -32 8 -42l132 -100c5 -4 12 -6 19 -6c9 0 19 4 25 12c47 60 67 78 86 92 c0 -17 15 -32 32 -32h64c17 0 32 15 32 32zM1664 1152v-1280c0 -70 -58 -128 -128 -128h-1408c-70 0 -128 58 -128 128v1280c0 70 58 128 128 128h128v96c0 88 72 160 160 160h64c88 0 160 -72 160 -160v-96h384v96c0 88 72 160 160 160h64c88 0 160 -72 160 -160v-96h128
c17 12 50 24 86 24c64 0 123 -41 123 -85c0 -52 -27 -78 -88 -106c-71 -32 -168 -115 -168 -212v-36c0 -18 14 -32 32 -32h192c18 0 32 14 32 32c0 23 29 72 76 99c76 43 180 101 180 253zM1536 640c0 -424 -344 -768 -768 -768s-768 344 -768 768s344 768 768 768 c70 0 128 -58 128 -128z" />
s768 -344 768 -768z" /> <glyph glyph-name="chevron-down" unicode="&#xf104;" horiz-adv-x="1612"
<glyph glyph-name="globe" unicode="&#xf10d;" d="M1593 728l-742 -741c-25 -25 -65 -25 -90 0l-742 741c-25 25 -25 66 0 91l166 165c25 25 65 25 90 0l531 -531l531 531c25 25 65 25 90 0l166 -165c25 -25 25 -66 0 -91z" />
<glyph glyph-name="chevron-up" unicode="&#xf105;" horiz-adv-x="1612"
d="M1593 205l-166 -165c-25 -25 -65 -25 -90 0l-531 531l-531 -531c-25 -25 -65 -25 -90 0l-166 165c-25 25 -25 66 0 91l742 741c25 25 65 25 90 0l742 -741c25 -25 25 -66 0 -91z" />
<glyph glyph-name="code-fork" unicode="&#xf106;" horiz-adv-x="1024"
d="M288 64c0 53 -43 96 -96 96s-96 -43 -96 -96s43 -96 96 -96s96 43 96 96zM288 1216c0 53 -43 96 -96 96s-96 -43 -96 -96s43 -96 96 -96s96 43 96 96zM928 1088c0 53 -43 96 -96 96s-96 -43 -96 -96s43 -96 96 -96s96 43 96 96zM1024 1088c0 -71 -39 -133 -96 -166
c-3 -361 -259 -441 -429 -495c-159 -50 -211 -74 -211 -171v-26c57 -33 96 -95 96 -166c0 -106 -86 -192 -192 -192s-192 86 -192 192c0 71 39 133 96 166v820c-57 33 -96 95 -96 166c0 106 86 192 192 192s192 -86 192 -192c0 -71 -39 -133 -96 -166v-497
c51 25 105 42 154 57c186 59 292 103 294 312c-57 33 -96 95 -96 166c0 106 86 192 192 192s192 -86 192 -192z" />
<glyph glyph-name="comment" unicode="&#xf107;" horiz-adv-x="1792"
d="M1792 640c0 -354 -401 -640 -896 -640c-49 0 -98 3 -145 8c-131 -116 -287 -198 -460 -242c-36 -10 -75 -17 -114 -22c-22 -2 -43 14 -48 38v1c-5 25 12 40 27 58c63 71 135 131 182 298c-206 117 -338 298 -338 501c0 353 401 640 896 640s896 -286 896 -640z" />
<glyph glyph-name="download" unicode="&#xf108;" horiz-adv-x="1664"
d="M1280 192c0 35 -29 64 -64 64s-64 -29 -64 -64s29 -64 64 -64s64 29 64 64zM1536 192c0 35 -29 64 -64 64s-64 -29 -64 -64s29 -64 64 -64s64 29 64 64zM1664 416v-320c0 -53 -43 -96 -96 -96h-1472c-53 0 -96 43 -96 96v320c0 53 43 96 96 96h465l135 -136
c37 -36 85 -56 136 -56s99 20 136 56l136 136h464c53 0 96 -43 96 -96zM1339 985c10 -24 5 -52 -14 -70l-448 -448c-12 -13 -29 -19 -45 -19s-33 6 -45 19l-448 448c-19 18 -24 46 -14 70c10 23 33 39 59 39h256v448c0 35 29 64 64 64h256c35 0 64 -29 64 -64v-448h256
c26 0 49 -16 59 -39z" />
<glyph glyph-name="exclamation-triangle" unicode="&#xf109;" horiz-adv-x="1792"
d="M1024 161v190c0 18 -14 33 -32 33h-192c-18 0 -32 -15 -32 -33v-190c0 -18 14 -33 32 -33h192c18 0 32 15 32 33zM1022 535l18 459c0 6 -3 14 -10 19c-6 5 -15 11 -24 11h-220c-9 0 -18 -6 -24 -11c-7 -5 -10 -15 -10 -21l17 -457c0 -13 15 -23 34 -23h185
c18 0 33 10 34 23zM1008 1469l768 -1408c22 -39 21 -87 -2 -126s-65 -63 -110 -63h-1536c-45 0 -87 24 -110 63s-24 87 -2 126l768 1408c22 41 65 67 112 67s90 -26 112 -67z" />
<glyph glyph-name="eye" unicode="&#xf10a;" horiz-adv-x="1792"
d="M1664 576c-95 147 -225 273 -381 353c40 -68 61 -146 61 -225c0 -247 -201 -448 -448 -448s-448 201 -448 448c0 79 21 157 61 225c-156 -80 -286 -206 -381 -353c171 -264 447 -448 768 -448s597 184 768 448zM944 960c0 26 -22 48 -48 48c-167 0 -304 -137 -304 -304
c0 -26 22 -48 48 -48s48 22 48 48c0 114 94 208 208 208c26 0 48 22 48 48zM1792 576c0 -25 -8 -48 -20 -69c-184 -303 -521 -507 -876 -507s-692 205 -876 507c-12 21 -20 44 -20 69s8 48 20 69c184 302 521 507 876 507s692 -205 876 -507c12 -21 20 -44 20 -69z" />
<glyph glyph-name="facebook-square" unicode="&#xf10b;"
d="M1248 1408c159 0 288 -129 288 -288v-960c0 -159 -129 -288 -288 -288h-188v595h199l30 232h-229v148c0 67 18 112 115 112l122 1v207c-21 3 -94 9 -178 9c-177 0 -299 -108 -299 -306v-171h-200v-232h200v-595h-532c-159 0 -288 129 -288 288v960c0 159 129 288 288 288
h960z" />
<glyph glyph-name="file-excel-o" unicode="&#xf10c;"
d="M1468 1156c37 -37 68 -111 68 -164v-1152c0 -53 -43 -96 -96 -96h-1344c-53 0 -96 43 -96 96v1600c0 53 43 96 96 96h896c53 0 127 -31 164 -68zM1024 1400v-376h376c-6 17 -15 34 -22 41l-313 313c-7 7 -24 16 -41 22zM1408 -128v1024h-416c-53 0 -96 43 -96 96v416
h-768v-1536h1280zM429 106h68l194 283l-189 272h-68v107h290v-107h-76l106 -159c8 -9 13 -16 17 -23c2 -3 4 -6 5 -10h2c0 -1 9 14 21 33l103 159h-74v107h279v-107h-67l-195 -282l192 -273h68v-106h-291v106h76l-107 161c-7 10 -13 16 -17 24c-2 3 -4 6 -5 10h-2
c-3 0 -9 -15 -21 -34l-103 -161h75v-106h-281v106z" />
<glyph glyph-name="floppy-o" unicode="&#xf10d;"
d="M384 0h768v384h-768v-384zM1280 0h128v896c0 19 -17 60 -30 73l-281 281c-14 14 -53 30 -73 30v-416c0 -53 -43 -96 -96 -96h-576c-53 0 -96 43 -96 96v416h-128v-1280h128v416c0 53 43 96 96 96h832c53 0 96 -43 96 -96v-416zM896 928v320c0 17 -15 32 -32 32h-192
c-17 0 -32 -15 -32 -32v-320c0 -17 15 -32 32 -32h192c17 0 32 15 32 32zM1536 896v-928c0 -53 -43 -96 -96 -96h-1344c-53 0 -96 43 -96 96v1344c0 53 43 96 96 96h928c53 0 126 -30 164 -68l280 -280c38 -38 68 -111 68 -164z" />
<glyph glyph-name="github" unicode="&#xf10e;"
d="M768 1408c424 0 768 -344 768 -768c0 -339 -220 -627 -525 -729c-39 -7 -53 17 -53 37c0 25 1 108 1 211c0 72 -24 118 -52 142c171 19 351 84 351 379c0 84 -30 152 -79 206c8 20 34 98 -8 204c-64 20 -211 -79 -211 -79c-61 17 -127 26 -192 26s-131 -9 -192 -26
c0 0 -147 99 -211 79c-42 -106 -16 -184 -8 -204c-49 -54 -79 -122 -79 -206c0 -294 179 -360 350 -379c-22 -20 -42 -54 -49 -103c-44 -20 -156 -54 -223 64c-42 73 -118 79 -118 79c-75 1 -5 -47 -5 -47c50 -23 85 -112 85 -112c45 -137 259 -91 259 -91
c0 -64 1 -124 1 -143c0 -20 -14 -44 -53 -37c-305 102 -525 390 -525 729c0 424 344 768 768 768zM291 305c-2 -4 -8 -5 -13 -2c-6 3 -9 8 -7 12c2 3 7 4 13 2c6 -3 9 -8 7 -12zM322 271c-4 -4 -11 -2 -16 3c-5 6 -6 13 -2 16c4 4 11 2 16 -3c5 -6 6 -13 2 -16zM352 226
c-4 -3 -12 0 -17 7s-5 15 0 18c5 4 13 1 17 -6c5 -7 5 -15 0 -19zM394 184c-4 -5 -13 -4 -20 3c-7 6 -9 15 -4 19c4 5 13 4 20 -3c6 -6 8 -15 4 -19zM451 159c-2 -6 -11 -9 -19 -6c-9 2 -15 9 -13 15s11 9 19 7c9 -3 15 -10 13 -16zM514 154c0 -6 -7 -11 -16 -11
c-10 -1 -17 4 -17 11c0 6 7 11 16 11c9 1 17 -4 17 -11zM572 164c1 -6 -5 -12 -14 -14s-17 2 -18 8c-1 7 5 13 14 15c9 1 17 -3 18 -9z" />
<glyph glyph-name="globe" unicode="&#xf10f;"
d="M768 1404c424 0 768 -344 768 -768s-344 -768 -768 -768s-768 344 -768 768s344 768 768 768zM737 1186v0c-18 0 -40 -7 -58 -7c-27 0 -61 12 -81 0s-18 -37 -27 -55s-28 -34 -28 -54s19 -36 28 -54s2 -47 27 -54s54 36 81 54s69 32 81 54s0 36 0 54s16 39 0 55 d="M768 1404c424 0 768 -344 768 -768s-344 -768 -768 -768s-768 344 -768 768s344 768 768 768zM737 1186v0c-18 0 -40 -7 -58 -7c-27 0 -61 12 -81 0s-18 -37 -27 -55s-28 -34 -28 -54s19 -36 28 -54s2 -47 27 -54s54 36 81 54s69 32 81 54s0 36 0 54s16 39 0 55
c-5 5 -14 7 -23 7zM491 1178h-6s-44 -8 -76 -13c-136 -92 -261 -300 -278 -464c23 -12 46 -22 60 -36c27 -27 83 -27 88 -56s-24 -62 -33 -80s-31 -31 -27 -54s36 -36 54 -54s37 -22 54 -54s20 -98 27 -135c9 -47 23 -85 44 -118c27 -19 72 -44 102 -58c10 28 10 93 16 122 c-5 5 -14 7 -23 7zM491 1178h-6s-44 -8 -76 -13c-136 -92 -261 -300 -278 -464c23 -12 46 -22 60 -36c27 -27 83 -27 88 -56s-24 -62 -33 -80s-31 -31 -27 -54s36 -36 54 -54s37 -22 54 -54s20 -98 27 -135c9 -47 23 -85 44 -118c27 -19 72 -44 102 -58c10 28 10 93 16 122
c7 37 13 109 27 135s19 19 28 28s18 15 28 28s17 34 26 52s30 31 26 53s-36 37 -54 55s-29 39 -55 54s-73 18 -101 25s-127 12 -129 13c-2 0 -1 -6 -7 2s-2 39 -2 57s11 34 24 66c13 18 5 10 25 24c10 9 43 -44 57 -44s-3 91 6 100c36 36 128 98 128 136s-37 36 -55 54 c7 37 13 109 27 135s19 19 28 28s18 15 28 28s17 34 26 52s30 31 26 53s-36 37 -54 55s-29 39 -55 54s-73 18 -101 25s-127 12 -129 13c-2 0 -1 -6 -7 2s-2 39 -2 57s11 34 24 66c13 18 5 10 25 24c10 9 43 -44 57 -44s-3 91 6 100c36 36 128 98 128 136s-37 36 -55 54
s-46 -30 -111 -30s76 103 85 112s23 17 27 27s0 18 0 27s12 22 8 25c-2 1 -4 1 -6 1zM1212 1096c-62 -8 -139 -10 -182 -26c-45 -17 -54 -36 -81 -54s-67 -28 -81 -54s0 -54 0 -81s-26 -68 0 -82s55 37 82 55s63 64 81 54s6 -7 0 -27s-51 -41 -52 -81s102 -73 68 -126 s-46 -30 -111 -30s76 103 85 112s23 17 27 27s0 18 0 27s12 22 8 25c-2 1 -4 1 -6 1zM1212 1096c-62 -8 -139 -10 -182 -26c-45 -17 -54 -36 -81 -54s-67 -28 -81 -54s0 -54 0 -81s-26 -68 0 -82s55 37 82 55s63 64 81 54s6 -7 0 -27s-51 -41 -52 -81s102 -73 68 -126
s-188 46 -232 17s-19 -54 -28 -81s-37 -52 -27 -81s52 -34 81 -54s81 -56 82 -58s20 -99 27 -135c14 -73 -27 -199 76 -231c31 14 78 41 106 60c13 34 24 72 35 94c22 44 71 123 80 161s0 37 0 55s7 30 0 54s-36 54 -54 81s-34 64 -54 81s-46 18 -54 27s-4 8 -4 13 s-188 46 -232 17s-19 -54 -28 -81s-37 -52 -27 -81s52 -34 81 -54s81 -56 82 -58s20 -99 27 -135c14 -73 -27 -199 76 -231c31 14 78 41 106 60c13 34 24 72 35 94c22 44 71 123 80 161s0 37 0 55s7 30 0 54s-36 54 -54 81s-34 64 -54 81s-46 18 -54 27s-4 8 -4 13
s-4 7 5 14s34 8 54 0s36 -36 54 -54s25 -51 54 -54s54 36 81 54c25 17 52 56 76 55c-12 131 -98 312 -193 404z" /> s-4 7 5 14s34 8 54 0s36 -36 54 -54s25 -51 54 -54s54 36 81 54c25 17 52 56 76 55c-12 131 -98 312 -193 404z" />
<glyph glyph-name="sign-in" unicode="&#xf119;" <glyph glyph-name="google" unicode="&#xf110;" horiz-adv-x="1505"
d="M1184 640c0 -17 -7 -33 -19 -45l-544 -544c-12 -12 -28 -19 -45 -19c-35 0 -64 29 -64 64v288h-448c-35 0 -64 29 -64 64v384c0 35 29 64 64 64h448v288c0 35 29 64 64 64c17 0 33 -7 45 -19l544 -544c12 -12 19 -28 19 -45zM1536 992v-704c0 -159 -129 -288 -288 -288 d="M768 750h725c7 -39 12 -77 12 -128c0 -438 -294 -750 -737 -750c-425 0 -768 343 -768 768s343 768 768 768c207 0 381 -76 515 -201l-209 -201c-57 55 -157 119 -306 119c-262 0 -476 -217 -476 -485s214 -485 476 -485c304 0 418 218 436 331h-436v264z" />
h-320c-17 0 -32 15 -32 32c0 28 -13 96 32 96h320c88 0 160 72 160 160v704c0 88 -72 160 -160 160h-288c-25 0 -64 -5 -64 32c0 28 -13 96 32 96h320c159 0 288 -129 288 -288z" /> <glyph glyph-name="history" unicode="&#xf111;"
<glyph glyph-name="inbox" unicode="&#xf112;" d="M1536 640c0 -423 -345 -768 -768 -768c-229 0 -445 101 -591 277c-10 13 -9 32 2 43l137 138c7 6 16 9 25 9c9 -1 18 -5 23 -12c98 -127 245 -199 404 -199c282 0 512 230 512 512s-230 512 -512 512c-131 0 -255 -50 -348 -137l137 -138c19 -18 24 -46 14 -69
d="M1023 576h316c-2 5 -3 11 -5 16l-212 496h-708l-212 -496c-2 -5 -3 -11 -5 -16h316l95 -192h320zM1536 546v-482c0 -35 -29 -64 -64 -64h-1408c-35 0 -64 29 -64 64v482c0 36 11 89 25 123l238 552c14 33 54 59 89 59h832c35 0 75 -26 89 -59l238 -552 c-10 -24 -33 -40 -59 -40h-448c-35 0 -64 29 -64 64v448c0 26 16 49 40 59c23 10 51 5 69 -14l130 -129c141 133 332 212 529 212c423 0 768 -345 768 -768zM896 928v-448c0 -18 -14 -32 -32 -32h-320c-18 0 -32 14 -32 32v64c0 18 14 32 32 32h224v352c0 18 14 32 32 32h64
c14 -34 25 -87 25 -123z" /> c18 0 32 -14 32 -32z" />
<glyph glyph-name="table" unicode="&#xf11e;" horiz-adv-x="1664" <glyph glyph-name="home" unicode="&#xf112;" horiz-adv-x="1612"
d="M512 160v192c0 18 -14 32 -32 32h-320c-18 0 -32 -14 -32 -32v-192c0 -18 14 -32 32 -32h320c18 0 32 14 32 32zM512 544v192c0 18 -14 32 -32 32h-320c-18 0 -32 -14 -32 -32v-192c0 -18 14 -32 32 -32h320c18 0 32 14 32 32zM1024 160v192c0 18 -14 32 -32 32h-320
c-18 0 -32 -14 -32 -32v-192c0 -18 14 -32 32 -32h320c18 0 32 14 32 32zM512 928v192c0 18 -14 32 -32 32h-320c-18 0 -32 -14 -32 -32v-192c0 -18 14 -32 32 -32h320c18 0 32 14 32 32zM1024 544v192c0 18 -14 32 -32 32h-320c-18 0 -32 -14 -32 -32v-192
c0 -18 14 -32 32 -32h320c18 0 32 14 32 32zM1536 160v192c0 18 -14 32 -32 32h-320c-18 0 -32 -14 -32 -32v-192c0 -18 14 -32 32 -32h320c18 0 32 14 32 32zM1024 928v192c0 18 -14 32 -32 32h-320c-18 0 -32 -14 -32 -32v-192c0 -18 14 -32 32 -32h320c18 0 32 14 32 32z
M1536 544v192c0 18 -14 32 -32 32h-320c-18 0 -32 -14 -32 -32v-192c0 -18 14 -32 32 -32h320c18 0 32 14 32 32zM1536 928v192c0 18 -14 32 -32 32h-320c-18 0 -32 -14 -32 -32v-192c0 -18 14 -32 32 -32h320c18 0 32 14 32 32zM1664 1248v-1088c0 -88 -72 -160 -160 -160
h-1344c-88 0 -160 72 -160 160v1088c0 88 72 160 160 160h1344c88 0 160 -72 160 -160z" />
<glyph glyph-name="download" unicode="&#xf107;" horiz-adv-x="1664"
d="M1280 192c0 35 -29 64 -64 64s-64 -29 -64 -64s29 -64 64 -64s64 29 64 64zM1536 192c0 35 -29 64 -64 64s-64 -29 -64 -64s29 -64 64 -64s64 29 64 64zM1664 416v-320c0 -53 -43 -96 -96 -96h-1472c-53 0 -96 43 -96 96v320c0 53 43 96 96 96h465l135 -136
c37 -36 85 -56 136 -56s99 20 136 56l136 136h464c53 0 96 -43 96 -96zM1339 985c10 -24 5 -52 -14 -70l-448 -448c-12 -13 -29 -19 -45 -19s-33 6 -45 19l-448 448c-19 18 -24 46 -14 70c10 23 33 39 59 39h256v448c0 35 29 64 64 64h256c35 0 64 -29 64 -64v-448h256
c26 0 49 -16 59 -39z" />
<glyph glyph-name="home" unicode="&#xf110;" horiz-adv-x="1612"
d="M1382 544v-480c0 -35 -29 -64 -64 -64h-384v384h-256v-384h-384c-35 0 -64 29 -64 64v480c0 2 1 4 1 6l575 474l575 -474c1 -2 1 -4 1 -6zM1605 613l-62 -74c-5 -6 -13 -10 -21 -11h-3c-8 0 -15 2 -21 7l-692 577l-692 -577c-7 -5 -15 -8 -24 -7c-8 1 -16 5 -21 11 d="M1382 544v-480c0 -35 -29 -64 -64 -64h-384v384h-256v-384h-384c-35 0 -64 29 -64 64v480c0 2 1 4 1 6l575 474l575 -474c1 -2 1 -4 1 -6zM1605 613l-62 -74c-5 -6 -13 -10 -21 -11h-3c-8 0 -15 2 -21 7l-692 577l-692 -577c-7 -5 -15 -8 -24 -7c-8 1 -16 5 -21 11
l-62 74c-11 13 -9 34 4 45l719 599c42 35 110 35 152 0l244 -204v195c0 18 14 32 32 32h192c18 0 32 -14 32 -32v-408l219 -182c13 -11 15 -32 4 -45z" /> l-62 74c-11 13 -9 34 4 45l719 599c42 35 110 35 152 0l244 -204v195c0 18 14 32 32 32h192c18 0 32 -14 32 -32v-408l219 -182c13 -11 15 -32 4 -45z" />
<glyph glyph-name="calendar" unicode="&#xf102;" horiz-adv-x="1664" <glyph glyph-name="inbox" unicode="&#xf113;"
d="M128 -128h288v288h-288v-288zM480 -128h320v288h-320v-288zM128 224h288v320h-288v-320zM480 224h320v320h-320v-320zM128 608h288v288h-288v-288zM864 -128h320v288h-320v-288zM480 608h320v288h-320v-288zM1248 -128h288v288h-288v-288zM864 224h320v320h-320v-320z d="M1023 576h316c-2 5 -3 11 -5 16l-212 496h-708l-212 -496c-2 -5 -3 -11 -5 -16h316l95 -192h320zM1536 546v-482c0 -35 -29 -64 -64 -64h-1408c-35 0 -64 29 -64 64v482c0 36 11 89 25 123l238 552c14 33 54 59 89 59h832c35 0 75 -26 89 -59l238 -552
M512 1088v288c0 17 -15 32 -32 32h-64c-17 0 -32 -15 -32 -32v-288c0 -17 15 -32 32 -32h64c17 0 32 15 32 32zM1248 224h288v320h-288v-320zM864 608h320v288h-320v-288zM1248 608h288v288h-288v-288zM1280 1088v288c0 17 -15 32 -32 32h-64c-17 0 -32 -15 -32 -32v-288 c14 -34 25 -87 25 -123z" />
c0 -17 15 -32 32 -32h64c17 0 32 15 32 32zM1664 1152v-1280c0 -70 -58 -128 -128 -128h-1408c-70 0 -128 58 -128 128v1280c0 70 58 128 128 128h128v96c0 88 72 160 160 160h64c88 0 160 -72 160 -160v-96h384v96c0 88 72 160 160 160h64c88 0 160 -72 160 -160v-96h128 <glyph glyph-name="key-modern" unicode="&#xf114;" horiz-adv-x="1792"
c70 0 128 -58 128 -128z" /> d="M546 1536v0c139 1 278 -52 383 -158c142 -141 187 -343 137 -525l726 -726v-319c0 -35 -29 -64 -64 -64h-300l-45 45l135 226l-46 45l-225 -135l-45 46l134 225l-45 45l-225 -134l-46 45l135 225l-45 46l-243 -139l-186 186c-182 -50 -382 -5 -524 136
<glyph glyph-name="user-circle-o" unicode="&#xf124;" horiz-adv-x="1792" c-211 212 -209 556 4 770c107 106 246 159 385 160zM405 1290v0c-41 0 -82 -16 -113 -47c-63 -63 -63 -163 0 -226s164 -63 227 0s63 163 0 226c-31 31 -73 47 -114 47z" />
d="M896 1536c495 0 896 -401 896 -896c0 -492 -399 -896 -896 -896c-496 0 -896 403 -896 896c0 495 401 896 896 896zM1515 185c93 128 149 285 149 455c0 423 -345 768 -768 768s-768 -345 -768 -768c0 -170 56 -327 149 -455c36 179 123 327 306 327 <glyph glyph-name="link" unicode="&#xf115;" horiz-adv-x="1632"
c81 -79 191 -128 313 -128s232 49 313 128c183 0 270 -148 306 -327zM1280 832c0 -212 -172 -384 -384 -384s-384 172 -384 384s172 384 384 384s384 -172 384 -384z" /> d="M1440 320c0 26 -10 50 -28 68l-208 208c-18 18 -43 28 -68 28c-29 0 -52 -11 -72 -32c33 -33 72 -61 72 -112c0 -53 -43 -96 -96 -96c-51 0 -79 39 -112 72c-21 -20 -33 -43 -33 -73c0 -25 10 -50 28 -68l206 -207c18 -18 43 -27 68 -27s50 9 68 26l147 146
<glyph glyph-name="hourglass" unicode="&#xf111;" c18 18 28 42 28 67zM737 1025c0 25 -10 50 -28 68l-206 207c-18 18 -43 28 -68 28s-50 -10 -68 -27l-147 -146c-18 -18 -28 -42 -28 -67c0 -26 10 -50 28 -68l208 -208c18 -18 43 -27 68 -27c29 0 52 10 72 31c-33 33 -72 61 -72 112c0 53 43 96 96 96c51 0 79 -39 112 -72
d="M1504 -64c18 0 32 -14 32 -32v-128c0 -18 -14 -32 -32 -32h-1472c-18 0 -32 14 -32 32v128c0 18 14 32 32 32h1472zM130 0c19 337 294 518 478 640c-184 122 -459 303 -478 640h1276c-19 -337 -294 -518 -478 -640c184 -122 459 -303 478 -640h-1276zM1504 1536 c21 20 33 43 33 73zM1632 320c0 -76 -31 -150 -85 -203l-147 -146c-54 -54 -127 -83 -203 -83c-77 0 -150 30 -204 85l-206 207c-54 54 -83 127 -83 203c0 79 32 154 88 209l-88 88c-55 -56 -129 -88 -208 -88c-76 0 -150 30 -204 84l-208 208c-55 55 -84 127 -84 204
c18 0 32 -14 32 -32v-128c0 -18 -14 -32 -32 -32h-1472c-18 0 -32 14 -32 32v128c0 18 14 32 32 32h1472z" /> c0 76 31 150 85 203l147 146c54 54 127 83 203 83c77 0 150 -30 204 -85l206 -207c54 -54 83 -127 83 -203c0 -79 -32 -154 -88 -209l88 -88c55 56 129 88 208 88c76 0 150 -30 204 -84l208 -208c55 -55 84 -127 84 -204z" />
<glyph glyph-name="facebook-square" unicode="&#xf10a;" <glyph glyph-name="moon-o" unicode="&#xf116;" horiz-adv-x="1471"
d="M1248 1408c159 0 288 -129 288 -288v-960c0 -159 -129 -288 -288 -288h-188v595h199l30 232h-229v148c0 67 18 112 115 112l122 1v207c-21 3 -94 9 -178 9c-177 0 -299 -108 -299 -306v-171h-200v-232h200v-595h-532c-159 0 -288 129 -288 288v960c0 159 129 288 288 288
h960z" />
<glyph glyph-name="eye" unicode="&#xf109;" horiz-adv-x="1792"
d="M1664 576c-95 147 -225 273 -381 353c40 -68 61 -146 61 -225c0 -247 -201 -448 -448 -448s-448 201 -448 448c0 79 21 157 61 225c-156 -80 -286 -206 -381 -353c171 -264 447 -448 768 -448s597 184 768 448zM944 960c0 26 -22 48 -48 48c-167 0 -304 -137 -304 -304
c0 -26 22 -48 48 -48s48 22 48 48c0 114 94 208 208 208c26 0 48 22 48 48zM1792 576c0 -25 -8 -48 -20 -69c-184 -303 -521 -507 -876 -507s-692 205 -876 507c-12 21 -20 44 -20 69s8 48 20 69c184 302 521 507 876 507s692 -205 876 -507c12 -21 20 -44 20 -69z" />
<glyph glyph-name="user" unicode="&#xf123;" horiz-adv-x="1280"
d="M1280 137c0 -146 -96 -265 -213 -265h-854c-117 0 -213 119 -213 265c0 263 65 567 327 567c81 -79 191 -128 313 -128s232 49 313 128c262 0 327 -304 327 -567zM1024 1024c0 -212 -172 -384 -384 -384s-384 172 -384 384s172 384 384 384s384 -172 384 -384z" />
<glyph glyph-name="moon-o" unicode="&#xf115;" horiz-adv-x="1471"
d="M1262 233c-36 -6 -73 -9 -110 -9c-371 0 -672 301 -672 672c0 127 37 251 104 357c-266 -79 -456 -323 -456 -613c0 -353 287 -640 640 -640c193 0 374 88 494 233zM1465 318c-125 -271 -399 -446 -697 -446c-423 0 -768 345 -768 768c0 415 325 752 739 767 d="M1262 233c-36 -6 -73 -9 -110 -9c-371 0 -672 301 -672 672c0 127 37 251 104 357c-266 -79 -456 -323 -456 -613c0 -353 287 -640 640 -640c193 0 374 88 494 233zM1465 318c-125 -271 -399 -446 -697 -446c-423 0 -768 345 -768 768c0 415 325 752 739 767
c28 1 51 -15 61 -39c11 -25 4 -54 -15 -72c-114 -104 -177 -246 -177 -400c0 -300 244 -544 544 -544c79 0 155 17 228 51c25 11 53 6 72 -13s24 -48 13 -72z" /> c28 1 51 -15 61 -39c11 -25 4 -54 -15 -72c-114 -104 -177 -246 -177 -400c0 -300 244 -544 544 -544c79 0 155 17 228 51c25 11 53 6 72 -13s24 -48 13 -72z" />
<glyph glyph-name="sign-out" unicode="&#xf11a;" horiz-adv-x="1568" <glyph glyph-name="pencil" unicode="&#xf117;" horiz-adv-x="1515"
d="M640 96c0 -28 13 -96 -32 -96h-320c-159 0 -288 129 -288 288v704c0 159 129 288 288 288h320c17 0 32 -15 32 -32c0 -28 13 -96 -32 -96h-320c-88 0 -160 -72 -160 -160v-704c0 -88 72 -160 160 -160h288c25 0 64 5 64 -32zM1568 640c0 -17 -7 -33 -19 -45l-544 -544
c-12 -12 -28 -19 -45 -19c-35 0 -64 29 -64 64v288h-448c-35 0 -64 29 -64 64v384c0 35 29 64 64 64h448v288c0 35 29 64 64 64c17 0 33 -7 45 -19l544 -544c12 -12 19 -28 19 -45z" />
<glyph glyph-name="pencil" unicode="&#xf116;" horiz-adv-x="1515"
d="M363 0l91 91l-235 235l-91 -91v-107h128v-128h107zM886 928c0 13 -9 22 -22 22c-6 0 -12 -2 -17 -7l-542 -542c-5 -5 -7 -11 -7 -17c0 -13 9 -22 22 -22c6 0 12 2 17 7l542 542c5 5 7 11 7 17zM832 1120l416 -416l-832 -832h-416v416zM1515 1024c0 -34 -14 -67 -37 -90 d="M363 0l91 91l-235 235l-91 -91v-107h128v-128h107zM886 928c0 13 -9 22 -22 22c-6 0 -12 -2 -17 -7l-542 -542c-5 -5 -7 -11 -7 -17c0 -13 9 -22 22 -22c6 0 12 2 17 7l542 542c5 5 7 11 7 17zM832 1120l416 -416l-832 -832h-416v416zM1515 1024c0 -34 -14 -67 -37 -90
l-166 -166l-416 416l166 165c23 24 56 38 90 38s67 -14 91 -38l235 -234c23 -24 37 -57 37 -91z" /> l-166 -166l-416 416l166 165c23 24 56 38 90 38s67 -14 91 -38l235 -234c23 -24 37 -57 37 -91z" />
<glyph glyph-name="star" unicode="&#xf11b;" horiz-adv-x="1664" <glyph glyph-name="plus" unicode="&#xf118;" horiz-adv-x="1408"
d="M1408 800v-192c0 -53 -43 -96 -96 -96h-416v-416c0 -53 -43 -96 -96 -96h-192c-53 0 -96 43 -96 96v416h-416c-53 0 -96 43 -96 96v192c0 53 43 96 96 96h416v416c0 53 43 96 96 96h192c53 0 96 -43 96 -96v-416h416c53 0 96 -43 96 -96z" />
<glyph glyph-name="question-circle" unicode="&#xf119;"
d="M896 160v192c0 18 -14 32 -32 32h-192c-18 0 -32 -14 -32 -32v-192c0 -18 14 -32 32 -32h192c18 0 32 14 32 32zM1152 832c0 183 -192 320 -364 320c-163 0 -285 -70 -371 -213c-9 -14 -5 -32 8 -42l132 -100c5 -4 12 -6 19 -6c9 0 19 4 25 12c47 60 67 78 86 92
c17 12 50 24 86 24c64 0 123 -41 123 -85c0 -52 -27 -78 -88 -106c-71 -32 -168 -115 -168 -212v-36c0 -18 14 -32 32 -32h192c18 0 32 14 32 32c0 23 29 72 76 99c76 43 180 101 180 253zM1536 640c0 -424 -344 -768 -768 -768s-768 344 -768 768s344 768 768 768
s768 -344 768 -768z" />
<glyph glyph-name="reply" unicode="&#xf11a;" horiz-adv-x="1792"
d="M1792 416c0 -140 -70 -323 -127 -451c-11 -23 -22 -55 -37 -76c-7 -10 -14 -17 -28 -17c-20 0 -32 16 -32 35c0 16 4 34 5 50c3 41 5 82 5 123c0 477 -283 560 -714 560h-224v-256c0 -35 -29 -64 -64 -64c-17 0 -33 7 -45 19l-512 512c-12 12 -19 28 -19 45s7 33 19 45
l512 512c12 12 28 19 45 19c35 0 64 -29 64 -64v-256h224c328 0 736 -58 875 -403c42 -106 53 -221 53 -333z" />
<glyph glyph-name="sign-in" unicode="&#xf11b;"
d="M1184 640c0 -17 -7 -33 -19 -45l-544 -544c-12 -12 -28 -19 -45 -19c-35 0 -64 29 -64 64v288h-448c-35 0 -64 29 -64 64v384c0 35 29 64 64 64h448v288c0 35 29 64 64 64c17 0 33 -7 45 -19l544 -544c12 -12 19 -28 19 -45zM1536 992v-704c0 -159 -129 -288 -288 -288
h-320c-17 0 -32 15 -32 32c0 28 -13 96 32 96h320c88 0 160 72 160 160v704c0 88 -72 160 -160 160h-288c-25 0 -64 -5 -64 32c0 28 -13 96 32 96h320c159 0 288 -129 288 -288z" />
<glyph glyph-name="sign-out" unicode="&#xf11c;" horiz-adv-x="1568"
d="M640 96c0 -28 13 -96 -32 -96h-320c-159 0 -288 129 -288 288v704c0 159 129 288 288 288h320c17 0 32 -15 32 -32c0 -28 13 -96 -32 -96h-320c-88 0 -160 -72 -160 -160v-704c0 -88 72 -160 160 -160h288c25 0 64 5 64 -32zM1568 640c0 -17 -7 -33 -19 -45l-544 -544
c-12 -12 -28 -19 -45 -19c-35 0 -64 29 -64 64v288h-448c-35 0 -64 29 -64 64v384c0 35 29 64 64 64h448v288c0 35 29 64 64 64c17 0 33 -7 45 -19l544 -544c12 -12 19 -28 19 -45z" />
<glyph glyph-name="spinner" unicode="&#xf11d;" horiz-adv-x="1664"
d="M462 142c0 -70 -57 -128 -128 -128c-70 0 -128 58 -128 128c0 71 58 128 128 128c71 0 128 -57 128 -128zM960 -64c0 -71 -57 -128 -128 -128s-128 57 -128 128s57 128 128 128s128 -57 128 -128zM256 640c0 -71 -57 -128 -128 -128s-128 57 -128 128s57 128 128 128
s128 -57 128 -128zM1458 142c0 -70 -58 -128 -128 -128c-71 0 -128 58 -128 128c0 71 57 128 128 128c70 0 128 -57 128 -128zM494 1138c0 -88 -72 -160 -160 -160s-160 72 -160 160s72 160 160 160s160 -72 160 -160zM1664 640c0 -71 -57 -128 -128 -128s-128 57 -128 128
s57 128 128 128s128 -57 128 -128zM1024 1344c0 -106 -86 -192 -192 -192s-192 86 -192 192s86 192 192 192s192 -86 192 -192zM1554 1138c0 -124 -101 -224 -224 -224c-124 0 -224 100 -224 224c0 123 100 224 224 224c123 0 224 -101 224 -224z" />
<glyph glyph-name="star" unicode="&#xf11e;" horiz-adv-x="1664"
d="M1664 889c0 -18 -13 -35 -26 -48l-363 -354l86 -500c1 -7 1 -13 1 -20c0 -26 -12 -50 -41 -50c-14 0 -28 5 -40 12l-449 236l-449 -236c-13 -7 -26 -12 -40 -12c-29 0 -42 24 -42 50c0 7 1 13 2 20l86 500l-364 354c-12 13 -25 30 -25 48c0 30 31 42 56 46l502 73 d="M1664 889c0 -18 -13 -35 -26 -48l-363 -354l86 -500c1 -7 1 -13 1 -20c0 -26 -12 -50 -41 -50c-14 0 -28 5 -40 12l-449 236l-449 -236c-13 -7 -26 -12 -40 -12c-29 0 -42 24 -42 50c0 7 1 13 2 20l86 500l-364 354c-12 13 -25 30 -25 48c0 30 31 42 56 46l502 73
l225 455c9 19 26 41 49 41s40 -22 49 -41l225 -455l502 -73c24 -4 56 -16 56 -46z" /> l225 455c9 19 26 41 49 41s40 -22 49 -41l225 -455l502 -73c24 -4 56 -16 56 -46z" />
<glyph glyph-name="users" unicode="&#xf126;" horiz-adv-x="1920" <glyph glyph-name="star-o" unicode="&#xf11f;" horiz-adv-x="1664"
d="M593 640c-104 -3 -198 -48 -265 -128h-134c-100 0 -194 48 -194 159c0 81 -3 353 124 353c21 0 125 -85 260 -85c46 0 90 8 133 23c-3 -22 -5 -44 -5 -66c0 -91 29 -181 81 -256zM1664 3c0 -162 -107 -259 -267 -259h-874c-160 0 -267 97 -267 259c0 226 53 573 346 573 d="M1137 532l306 297l-422 62l-189 382l-189 -382l-422 -62l306 -297l-73 -421l378 199l377 -199zM1664 889c0 -18 -13 -35 -26 -48l-363 -354l86 -500c1 -7 1 -13 1 -20c0 -27 -12 -50 -41 -50c-14 0 -28 5 -40 12l-449 236l-449 -236c-13 -7 -26 -12 -40 -12
c34 0 158 -139 358 -139s324 139 358 139c293 0 346 -347 346 -573zM640 1280c0 -141 -115 -256 -256 -256s-256 115 -256 256s115 256 256 256s256 -115 256 -256zM1344 896c0 -212 -172 -384 -384 -384s-384 172 -384 384s172 384 384 384s384 -172 384 -384zM1920 671 c-29 0 -42 24 -42 50c0 7 1 13 2 20l86 500l-364 354c-12 13 -25 30 -25 48c0 30 31 42 56 46l502 73l225 455c9 19 26 41 49 41s40 -22 49 -41l225 -455l502 -73c24 -4 56 -16 56 -46z" />
c0 -111 -94 -159 -194 -159h-134c-67 80 -161 125 -265 128c52 75 81 165 81 256c0 22 -2 44 -5 66c43 -15 87 -23 133 -23c135 0 239 85 260 85c127 0 124 -272 124 -353zM1792 1280c0 -141 -115 -256 -256 -256s-256 115 -256 256s115 256 256 256s256 -115 256 -256z" /> <glyph glyph-name="sun-o" unicode="&#xf120;" horiz-adv-x="1707"
<glyph glyph-name="key-modern" unicode="&#xf113;" horiz-adv-x="1792"
d="M546 1536v0c139 1 278 -52 383 -158c142 -141 187 -343 137 -525l726 -726v-319c0 -35 -29 -64 -64 -64h-300l-45 45l135 226l-46 45l-225 -135l-45 46l134 225l-45 45l-225 -134l-46 45l135 225l-45 46l-243 -139l-186 186c-182 -50 -382 -5 -524 136
c-211 212 -209 556 4 770c107 106 246 159 385 160zM405 1290v0c-41 0 -82 -16 -113 -47c-63 -63 -63 -163 0 -226s164 -63 227 0s63 163 0 226c-31 31 -73 47 -114 47z" />
<glyph glyph-name="undo" unicode="&#xf122;"
d="M1536 640c0 -423 -345 -768 -768 -768c-229 0 -445 101 -591 277c-10 13 -9 32 2 43l137 138c7 6 16 9 25 9c9 -1 18 -5 23 -12c98 -127 245 -199 404 -199c282 0 512 230 512 512s-230 512 -512 512c-131 0 -255 -50 -348 -137l137 -138c19 -18 24 -46 14 -69
c-10 -24 -33 -40 -59 -40h-448c-35 0 -64 29 -64 64v448c0 26 16 49 40 59c23 10 51 5 69 -14l130 -129c141 133 332 212 529 212c423 0 768 -345 768 -768z" />
<glyph glyph-name="sun-o" unicode="&#xf11d;" horiz-adv-x="1707"
d="M1430 640c0 318 -258 576 -576 576s-576 -258 -576 -576s258 -576 576 -576s576 258 576 576zM1706 363c-3 -10 -11 -17 -20 -20l-292 -96v-306c0 -10 -5 -20 -13 -26c-9 -6 -19 -8 -29 -4l-292 94l-180 -248c-6 -8 -16 -13 -26 -13s-20 5 -26 13l-180 248l-292 -94 d="M1430 640c0 318 -258 576 -576 576s-576 -258 -576 -576s258 -576 576 -576s576 258 576 576zM1706 363c-3 -10 -11 -17 -20 -20l-292 -96v-306c0 -10 -5 -20 -13 -26c-9 -6 -19 -8 -29 -4l-292 94l-180 -248c-6 -8 -16 -13 -26 -13s-20 5 -26 13l-180 248l-292 -94
c-10 -4 -20 -2 -29 4c-8 6 -13 16 -13 26v306l-292 96c-9 3 -17 10 -20 20s-2 21 4 29l180 248l-180 248c-6 9 -7 19 -4 29s11 17 20 20l292 96v306c0 10 5 20 13 26c9 6 19 8 29 4l292 -94l180 248c12 16 40 16 52 0l180 -248l292 94c10 4 20 2 29 -4c8 -6 13 -16 13 -26 c-10 -4 -20 -2 -29 4c-8 6 -13 16 -13 26v306l-292 96c-9 3 -17 10 -20 20s-2 21 4 29l180 248l-180 248c-6 9 -7 19 -4 29s11 17 20 20l292 96v306c0 10 5 20 13 26c9 6 19 8 29 4l292 -94l180 248c12 16 40 16 52 0l180 -248l292 94c10 4 20 2 29 -4c8 -6 13 -16 13 -26
v-306l292 -96c9 -3 17 -10 20 -20s2 -20 -4 -29l-180 -248l180 -248c6 -8 7 -19 4 -29z" /> v-306l292 -96c9 -3 17 -10 20 -20s2 -20 -4 -29l-180 -248l180 -248c6 -8 7 -19 4 -29z" />
<glyph glyph-name="link" unicode="&#xf114;" horiz-adv-x="1632" <glyph glyph-name="table" unicode="&#xf121;" horiz-adv-x="1664"
d="M1440 320c0 26 -10 50 -28 68l-208 208c-18 18 -43 28 -68 28c-29 0 -52 -11 -72 -32c33 -33 72 -61 72 -112c0 -53 -43 -96 -96 -96c-51 0 -79 39 -112 72c-21 -20 -33 -43 -33 -73c0 -25 10 -50 28 -68l206 -207c18 -18 43 -27 68 -27s50 9 68 26l147 146 d="M512 160v192c0 18 -14 32 -32 32h-320c-18 0 -32 -14 -32 -32v-192c0 -18 14 -32 32 -32h320c18 0 32 14 32 32zM512 544v192c0 18 -14 32 -32 32h-320c-18 0 -32 -14 -32 -32v-192c0 -18 14 -32 32 -32h320c18 0 32 14 32 32zM1024 160v192c0 18 -14 32 -32 32h-320
c18 18 28 42 28 67zM737 1025c0 25 -10 50 -28 68l-206 207c-18 18 -43 28 -68 28s-50 -10 -68 -27l-147 -146c-18 -18 -28 -42 -28 -67c0 -26 10 -50 28 -68l208 -208c18 -18 43 -27 68 -27c29 0 52 10 72 31c-33 33 -72 61 -72 112c0 53 43 96 96 96c51 0 79 -39 112 -72 c-18 0 -32 -14 -32 -32v-192c0 -18 14 -32 32 -32h320c18 0 32 14 32 32zM512 928v192c0 18 -14 32 -32 32h-320c-18 0 -32 -14 -32 -32v-192c0 -18 14 -32 32 -32h320c18 0 32 14 32 32zM1024 544v192c0 18 -14 32 -32 32h-320c-18 0 -32 -14 -32 -32v-192
c21 20 33 43 33 73zM1632 320c0 -76 -31 -150 -85 -203l-147 -146c-54 -54 -127 -83 -203 -83c-77 0 -150 30 -204 85l-206 207c-54 54 -83 127 -83 203c0 79 32 154 88 209l-88 88c-55 -56 -129 -88 -208 -88c-76 0 -150 30 -204 84l-208 208c-55 55 -84 127 -84 204 c0 -18 14 -32 32 -32h320c18 0 32 14 32 32zM1536 160v192c0 18 -14 32 -32 32h-320c-18 0 -32 -14 -32 -32v-192c0 -18 14 -32 32 -32h320c18 0 32 14 32 32zM1024 928v192c0 18 -14 32 -32 32h-320c-18 0 -32 -14 -32 -32v-192c0 -18 14 -32 32 -32h320c18 0 32 14 32 32z
c0 76 31 150 85 203l147 146c54 54 127 83 203 83c77 0 150 -30 204 -85l206 -207c54 -54 83 -127 83 -203c0 -79 -32 -154 -88 -209l88 -88c55 56 129 88 208 88c76 0 150 -30 204 -84l208 -208c55 -55 84 -127 84 -204z" /> M1536 544v192c0 18 -14 32 -32 32h-320c-18 0 -32 -14 -32 -32v-192c0 -18 14 -32 32 -32h320c18 0 32 14 32 32zM1536 928v192c0 18 -14 32 -32 32h-320c-18 0 -32 -14 -32 -32v-192c0 -18 14 -32 32 -32h320c18 0 32 14 32 32zM1664 1248v-1088c0 -88 -72 -160 -160 -160
<glyph glyph-name="code-fork" unicode="&#xf105;" horiz-adv-x="1024" h-1344c-88 0 -160 72 -160 160v1088c0 88 72 160 160 160h1344c88 0 160 -72 160 -160z" />
d="M288 64c0 53 -43 96 -96 96s-96 -43 -96 -96s43 -96 96 -96s96 43 96 96zM288 1216c0 53 -43 96 -96 96s-96 -43 -96 -96s43 -96 96 -96s96 43 96 96zM928 1088c0 53 -43 96 -96 96s-96 -43 -96 -96s43 -96 96 -96s96 43 96 96zM1024 1088c0 -71 -39 -133 -96 -166 <glyph glyph-name="th-list" unicode="&#xf122;" horiz-adv-x="1792"
c-3 -361 -259 -441 -429 -495c-159 -50 -211 -74 -211 -171v-26c57 -33 96 -95 96 -166c0 -106 -86 -192 -192 -192s-192 86 -192 192c0 71 39 133 96 166v820c-57 33 -96 95 -96 166c0 106 86 192 192 192s192 -86 192 -192c0 -71 -39 -133 -96 -166v-497
c51 25 105 42 154 57c186 59 292 103 294 312c-57 33 -96 95 -96 166c0 106 86 192 192 192s192 -86 192 -192z" />
<glyph glyph-name="th-list" unicode="&#xf11f;" horiz-adv-x="1792"
d="M512 288v-192c0 -53 -43 -96 -96 -96h-320c-53 0 -96 43 -96 96v192c0 53 43 96 96 96h320c53 0 96 -43 96 -96zM512 800v-192c0 -53 -43 -96 -96 -96h-320c-53 0 -96 43 -96 96v192c0 53 43 96 96 96h320c53 0 96 -43 96 -96zM1792 288v-192c0 -53 -43 -96 -96 -96h-960 d="M512 288v-192c0 -53 -43 -96 -96 -96h-320c-53 0 -96 43 -96 96v192c0 53 43 96 96 96h320c53 0 96 -43 96 -96zM512 800v-192c0 -53 -43 -96 -96 -96h-320c-53 0 -96 43 -96 96v192c0 53 43 96 96 96h320c53 0 96 -43 96 -96zM1792 288v-192c0 -53 -43 -96 -96 -96h-960
c-53 0 -96 43 -96 96v192c0 53 43 96 96 96h960c53 0 96 -43 96 -96zM512 1312v-192c0 -53 -43 -96 -96 -96h-320c-53 0 -96 43 -96 96v192c0 53 43 96 96 96h320c53 0 96 -43 96 -96zM1792 800v-192c0 -53 -43 -96 -96 -96h-960c-53 0 -96 43 -96 96v192c0 53 43 96 96 96 c-53 0 -96 43 -96 96v192c0 53 43 96 96 96h960c53 0 96 -43 96 -96zM512 1312v-192c0 -53 -43 -96 -96 -96h-320c-53 0 -96 43 -96 96v192c0 53 43 96 96 96h320c53 0 96 -43 96 -96zM1792 800v-192c0 -53 -43 -96 -96 -96h-960c-53 0 -96 43 -96 96v192c0 53 43 96 96 96
h960c53 0 96 -43 96 -96zM1792 1312v-192c0 -53 -43 -96 -96 -96h-960c-53 0 -96 43 -96 96v192c0 53 43 96 96 96h960c53 0 96 -43 96 -96z" /> h960c53 0 96 -43 96 -96zM1792 1312v-192c0 -53 -43 -96 -96 -96h-960c-53 0 -96 43 -96 96v192c0 53 43 96 96 96h960c53 0 96 -43 96 -96z" />
<glyph glyph-name="github" unicode="&#xf10c;" <glyph glyph-name="trash-o" unicode="&#xf123;" horiz-adv-x="1408"
d="M768 1408c424 0 768 -344 768 -768c0 -339 -220 -627 -525 -729c-39 -7 -53 17 -53 37c0 25 1 108 1 211c0 72 -24 118 -52 142c171 19 351 84 351 379c0 84 -30 152 -79 206c8 20 34 98 -8 204c-64 20 -211 -79 -211 -79c-61 17 -127 26 -192 26s-131 -9 -192 -26
c0 0 -147 99 -211 79c-42 -106 -16 -184 -8 -204c-49 -54 -79 -122 -79 -206c0 -294 179 -360 350 -379c-22 -20 -42 -54 -49 -103c-44 -20 -156 -54 -223 64c-42 73 -118 79 -118 79c-75 1 -5 -47 -5 -47c50 -23 85 -112 85 -112c45 -137 259 -91 259 -91
c0 -64 1 -124 1 -143c0 -20 -14 -44 -53 -37c-305 102 -525 390 -525 729c0 424 344 768 768 768zM291 305c-2 -4 -8 -5 -13 -2c-6 3 -9 8 -7 12c2 3 7 4 13 2c6 -3 9 -8 7 -12zM322 271c-4 -4 -11 -2 -16 3c-5 6 -6 13 -2 16c4 4 11 2 16 -3c5 -6 6 -13 2 -16zM352 226
c-4 -3 -12 0 -17 7s-5 15 0 18c5 4 13 1 17 -6c5 -7 5 -15 0 -19zM394 184c-4 -5 -13 -4 -20 3c-7 6 -9 15 -4 19c4 5 13 4 20 -3c6 -6 8 -15 4 -19zM451 159c-2 -6 -11 -9 -19 -6c-9 2 -15 9 -13 15s11 9 19 7c9 -3 15 -10 13 -16zM514 154c0 -6 -7 -11 -16 -11
c-10 -1 -17 4 -17 11c0 6 7 11 16 11c9 1 17 -4 17 -11zM572 164c1 -6 -5 -12 -14 -14s-17 2 -18 8c-1 7 5 13 14 15c9 1 17 -3 18 -9z" />
<glyph glyph-name="exclamation-triangle" unicode="&#xf108;" horiz-adv-x="1792"
d="M1024 161v190c0 18 -14 33 -32 33h-192c-18 0 -32 -15 -32 -33v-190c0 -18 14 -33 32 -33h192c18 0 32 15 32 33zM1022 535l18 459c0 6 -3 14 -10 19c-6 5 -15 11 -24 11h-220c-9 0 -18 -6 -24 -11c-7 -5 -10 -15 -10 -21l17 -457c0 -13 15 -23 34 -23h185
c18 0 33 10 34 23zM1008 1469l768 -1408c22 -39 21 -87 -2 -126s-65 -63 -110 -63h-1536c-45 0 -87 24 -110 63s-24 87 -2 126l768 1408c22 41 65 67 112 67s90 -26 112 -67z" />
<glyph glyph-name="address-card-o" unicode="&#xf100;" horiz-adv-x="2048"
d="M1024 405c0 -87 -57 -149 -128 -149h-512c-71 0 -128 62 -128 149c0 155 38 327 196 327c49 -28 115 -76 188 -76s139 48 188 76c158 0 196 -172 196 -327zM867 925c0 -126 -102 -227 -227 -227s-227 101 -227 227c0 125 102 227 227 227s227 -102 227 -227zM1792 480
v-64c0 -18 -14 -32 -32 -32h-576c-18 0 -32 14 -32 32v64c0 18 14 32 32 32h576c18 0 32 -14 32 -32zM1792 732v-56c0 -20 -16 -36 -36 -36h-568c-20 0 -36 16 -36 36v56c0 20 16 36 36 36h568c20 0 36 -16 36 -36zM1792 992v-64c0 -18 -14 -32 -32 -32h-576
c-18 0 -32 14 -32 32v64c0 18 14 32 32 32h576c18 0 32 -14 32 -32zM1920 32v1216c0 17 -15 32 -32 32h-1728c-17 0 -32 -15 -32 -32v-1216c0 -17 15 -32 32 -32h352v96c0 18 14 32 32 32h64c18 0 32 -14 32 -32v-96h768v96c0 18 14 32 32 32h64c18 0 32 -14 32 -32v-96h352
c17 0 32 15 32 32zM2048 1248v-1216c0 -88 -72 -160 -160 -160h-1728c-88 0 -160 72 -160 160v1216c0 88 72 160 160 160h1728c88 0 160 -72 160 -160z" />
<glyph glyph-name="trash-o" unicode="&#xf121;" horiz-adv-x="1408"
d="M512 800v-576c0 -18 -14 -32 -32 -32h-64c-18 0 -32 14 -32 32v576c0 18 14 32 32 32h64c18 0 32 -14 32 -32zM768 800v-576c0 -18 -14 -32 -32 -32h-64c-18 0 -32 14 -32 32v576c0 18 14 32 32 32h64c18 0 32 -14 32 -32zM1024 800v-576c0 -18 -14 -32 -32 -32h-64 d="M512 800v-576c0 -18 -14 -32 -32 -32h-64c-18 0 -32 14 -32 32v576c0 18 14 32 32 32h64c18 0 32 -14 32 -32zM768 800v-576c0 -18 -14 -32 -32 -32h-64c-18 0 -32 14 -32 32v576c0 18 14 32 32 32h64c18 0 32 -14 32 -32zM1024 800v-576c0 -18 -14 -32 -32 -32h-64
c-18 0 -32 14 -32 32v576c0 18 14 32 32 32h64c18 0 32 -14 32 -32zM1152 76v948h-896v-948c0 -48 27 -76 32 -76h832c5 0 32 28 32 76zM480 1152h448l-48 117c-3 4 -12 10 -17 11h-317c-6 -1 -14 -7 -17 -11zM1408 1120v-64c0 -18 -14 -32 -32 -32h-96v-948 c-18 0 -32 14 -32 32v576c0 18 14 32 32 32h64c18 0 32 -14 32 -32zM1152 76v948h-896v-948c0 -48 27 -76 32 -76h832c5 0 32 28 32 76zM480 1152h448l-48 117c-3 4 -12 10 -17 11h-317c-6 -1 -14 -7 -17 -11zM1408 1120v-64c0 -18 -14 -32 -32 -32h-96v-948
c0 -110 -72 -204 -160 -204h-832c-88 0 -160 90 -160 200v952h-96c-18 0 -32 14 -32 32v64c0 18 14 32 32 32h309l70 167c20 49 80 89 133 89h320c53 0 113 -40 133 -89l70 -167h309c18 0 32 -14 32 -32z" /> c0 -110 -72 -204 -160 -204h-832c-88 0 -160 90 -160 200v952h-96c-18 0 -32 14 -32 32v64c0 18 14 32 32 32h309l70 167c20 49 80 89 133 89h320c53 0 113 -40 133 -89l70 -167h309c18 0 32 -14 32 -32z" />
<glyph glyph-name="star-o" unicode="&#xf11c;" horiz-adv-x="1664" <glyph glyph-name="undo" unicode="&#xf124;"
d="M1137 532l306 297l-422 62l-189 382l-189 -382l-422 -62l306 -297l-73 -421l378 199l377 -199zM1664 889c0 -18 -13 -35 -26 -48l-363 -354l86 -500c1 -7 1 -13 1 -20c0 -27 -12 -50 -41 -50c-14 0 -28 5 -40 12l-449 236l-449 -236c-13 -7 -26 -12 -40 -12 d="M1536 640c0 -423 -345 -768 -768 -768c-229 0 -445 101 -591 277c-10 13 -9 32 2 43l137 138c7 6 16 9 25 9c9 -1 18 -5 23 -12c98 -127 245 -199 404 -199c282 0 512 230 512 512s-230 512 -512 512c-131 0 -255 -50 -348 -137l137 -138c19 -18 24 -46 14 -69
c-29 0 -42 24 -42 50c0 7 1 13 2 20l86 500l-364 354c-12 13 -25 30 -25 48c0 30 31 42 56 46l502 73l225 455c9 19 26 41 49 41s40 -22 49 -41l225 -455l502 -73c24 -4 56 -16 56 -46z" /> c-10 -24 -33 -40 -59 -40h-448c-35 0 -64 29 -64 64v448c0 26 16 49 40 59c23 10 51 5 69 -14l130 -129c141 133 332 212 529 212c423 0 768 -345 768 -768z" />
<glyph glyph-name="times" unicode="&#xf120;" horiz-adv-x="1188" <glyph glyph-name="user" unicode="&#xf125;" horiz-adv-x="1280"
d="M1188 214c0 -25 -10 -50 -28 -68l-136 -136c-18 -18 -43 -28 -68 -28s-50 10 -68 28l-294 294l-294 -294c-18 -18 -43 -28 -68 -28s-50 10 -68 28l-136 136c-18 18 -28 43 -28 68s10 50 28 68l294 294l-294 294c-18 18 -28 43 -28 68s10 50 28 68l136 136 d="M1280 137c0 -146 -96 -265 -213 -265h-854c-117 0 -213 119 -213 265c0 263 65 567 327 567c81 -79 191 -128 313 -128s232 49 313 128c262 0 327 -304 327 -567zM1024 1024c0 -212 -172 -384 -384 -384s-384 172 -384 384s172 384 384 384s384 -172 384 -384z" />
c18 18 43 28 68 28s50 -10 68 -28l294 -294l294 294c18 18 43 28 68 28s50 -10 68 -28l136 -136c18 -18 28 -43 28 -68s-10 -50 -28 -68l-294 -294l294 -294c18 -18 28 -43 28 -68z" /> <glyph glyph-name="user-circle-o" unicode="&#xf126;" horiz-adv-x="1792"
<glyph glyph-name="floppy-o" unicode="&#xf10b;" d="M896 1536c495 0 896 -401 896 -896c0 -492 -399 -896 -896 -896c-496 0 -896 403 -896 896c0 495 401 896 896 896zM1515 185c93 128 149 285 149 455c0 423 -345 768 -768 768s-768 -345 -768 -768c0 -170 56 -327 149 -455c36 179 123 327 306 327
d="M384 0h768v384h-768v-384zM1280 0h128v896c0 19 -17 60 -30 73l-281 281c-14 14 -53 30 -73 30v-416c0 -53 -43 -96 -96 -96h-576c-53 0 -96 43 -96 96v416h-128v-1280h128v416c0 53 43 96 96 96h832c53 0 96 -43 96 -96v-416zM896 928v320c0 17 -15 32 -32 32h-192 c81 -79 191 -128 313 -128s232 49 313 128c183 0 270 -148 306 -327zM1280 832c0 -212 -172 -384 -384 -384s-384 172 -384 384s172 384 384 384s384 -172 384 -384z" />
c-17 0 -32 -15 -32 -32v-320c0 -17 15 -32 32 -32h192c17 0 32 15 32 32zM1536 896v-928c0 -53 -43 -96 -96 -96h-1344c-53 0 -96 43 -96 96v1344c0 53 43 96 96 96h928c53 0 126 -30 164 -68l280 -280c38 -38 68 -111 68 -164z" /> <glyph glyph-name="user-plus" unicode="&#xf127;" horiz-adv-x="2048"
<glyph glyph-name="user-plus" unicode="&#xf125;" horiz-adv-x="2048"
d="M704 640c-212 0 -384 172 -384 384s172 384 384 384s384 -172 384 -384s-172 -384 -384 -384zM1664 512h352c17 0 32 -15 32 -32v-192c0 -17 -15 -32 -32 -32h-352v-352c0 -17 -15 -32 -32 -32h-192c-17 0 -32 15 -32 32v352h-352c-17 0 -32 15 -32 32v192 d="M704 640c-212 0 -384 172 -384 384s172 384 384 384s384 -172 384 -384s-172 -384 -384 -384zM1664 512h352c17 0 32 -15 32 -32v-192c0 -17 -15 -32 -32 -32h-352v-352c0 -17 -15 -32 -32 -32h-192c-17 0 -32 15 -32 32v352h-352c-17 0 -32 15 -32 32v192
c0 17 15 32 32 32h352v352c0 17 15 32 32 32h192c17 0 32 -15 32 -32v-352zM928 288c0 -70 58 -128 128 -128h256v-238c-49 -36 -111 -50 -171 -50h-874c-160 0 -267 96 -267 259c0 226 53 573 346 573c16 0 27 -7 39 -17c98 -75 193 -122 319 -122s221 47 319 122 c0 17 15 32 32 32h352v352c0 17 15 32 32 32h192c17 0 32 -15 32 -32v-352zM928 288c0 -70 58 -128 128 -128h256v-238c-49 -36 -111 -50 -171 -50h-874c-160 0 -267 96 -267 259c0 226 53 573 346 573c16 0 27 -7 39 -17c98 -75 193 -122 319 -122s221 47 319 122
c12 10 23 17 39 17c85 0 160 -32 217 -96h-223c-70 0 -128 -58 -128 -128v-192z" /> c12 10 23 17 39 17c85 0 160 -32 217 -96h-223c-70 0 -128 -58 -128 -128v-192z" />
<glyph glyph-name="plus" unicode="&#xf117;" horiz-adv-x="1408" <glyph glyph-name="users" unicode="&#xf128;" horiz-adv-x="1920"
d="M1408 800v-192c0 -53 -43 -96 -96 -96h-416v-416c0 -53 -43 -96 -96 -96h-192c-53 0 -96 43 -96 96v416h-416c-53 0 -96 43 -96 96v192c0 53 43 96 96 96h416v416c0 53 43 96 96 96h192c53 0 96 -43 96 -96v-416h416c53 0 96 -43 96 -96z" /> d="M593 640c-104 -3 -198 -48 -265 -128h-134c-100 0 -194 48 -194 159c0 81 -3 353 124 353c21 0 125 -85 260 -85c46 0 90 8 133 23c-3 -22 -5 -44 -5 -66c0 -91 29 -181 81 -256zM1664 3c0 -162 -107 -259 -267 -259h-874c-160 0 -267 97 -267 259c0 226 53 573 346 573
<glyph glyph-name="wrench" unicode="&#xf127;" horiz-adv-x="1641" c34 0 158 -139 358 -139s324 139 358 139c293 0 346 -347 346 -573zM640 1280c0 -141 -115 -256 -256 -256s-256 115 -256 256s115 256 256 256s256 -115 256 -256zM1344 896c0 -212 -172 -384 -384 -384s-384 172 -384 384s172 384 384 384s384 -172 384 -384zM1920 671
c0 -111 -94 -159 -194 -159h-134c-67 80 -161 125 -265 128c52 75 81 165 81 256c0 22 -2 44 -5 66c43 -15 87 -23 133 -23c135 0 239 85 260 85c127 0 124 -272 124 -353zM1792 1280c0 -141 -115 -256 -256 -256s-256 115 -256 256s115 256 256 256s256 -115 256 -256z" />
<glyph glyph-name="wrench" unicode="&#xf129;" horiz-adv-x="1641"
d="M363 64c0 35 -29 64 -64 64s-64 -29 -64 -64s29 -64 64 -64s64 29 64 64zM1007 484l-682 -682c-23 -23 -56 -37 -90 -37s-67 14 -91 37l-106 108c-24 23 -38 56 -38 90s14 67 38 91l681 681c52 -131 157 -236 288 -288zM1641 919c0 -33 -12 -74 -23 -106 d="M363 64c0 35 -29 64 -64 64s-64 -29 -64 -64s29 -64 64 -64s64 29 64 64zM1007 484l-682 -682c-23 -23 -56 -37 -90 -37s-67 14 -91 37l-106 108c-24 23 -38 56 -38 90s14 67 38 91l681 681c52 -131 157 -236 288 -288zM1641 919c0 -33 -12 -74 -23 -106
c-63 -178 -234 -301 -423 -301c-247 0 -448 201 -448 448s201 448 448 448c73 0 168 -22 229 -63c10 -7 16 -16 16 -28c0 -11 -7 -22 -16 -28l-293 -169v-224l193 -107c33 19 265 165 285 165s32 -15 32 -35z" /> c-63 -178 -234 -301 -423 -301c-247 0 -448 201 -448 448s201 448 448 448c73 0 168 -22 229 -63c10 -7 16 -16 16 -28c0 -11 -7 -22 -16 -28l-293 -169v-224l193 -107c33 19 265 165 285 165s32 -15 32 -35z" />
<glyph glyph-name="chevron-up" unicode="&#xf104;" horiz-adv-x="1612"
d="M1593 205l-166 -165c-25 -25 -65 -25 -90 0l-531 531l-531 -531c-25 -25 -65 -25 -90 0l-166 165c-25 25 -25 66 0 91l742 741c25 25 65 25 90 0l742 -741c25 -25 25 -66 0 -91z" />
<glyph glyph-name="chevron-down" unicode="&#xf103;" horiz-adv-x="1612"
d="M1593 728l-742 -741c-25 -25 -65 -25 -90 0l-742 741c-25 25 -25 66 0 91l166 165c25 25 65 25 90 0l531 -531l531 531c25 25 65 25 90 0l166 -165c25 -25 25 -66 0 -91z" />
<glyph glyph-name="history" unicode="&#xf10f;"
d="M1536 640c0 -423 -345 -768 -768 -768c-229 0 -445 101 -591 277c-10 13 -9 32 2 43l137 138c7 6 16 9 25 9c9 -1 18 -5 23 -12c98 -127 245 -199 404 -199c282 0 512 230 512 512s-230 512 -512 512c-131 0 -255 -50 -348 -137l137 -138c19 -18 24 -46 14 -69
c-10 -24 -33 -40 -59 -40h-448c-35 0 -64 29 -64 64v448c0 26 16 49 40 59c23 10 51 5 69 -14l130 -129c141 133 332 212 529 212c423 0 768 -345 768 -768zM896 928v-448c0 -18 -14 -32 -32 -32h-320c-18 0 -32 14 -32 32v64c0 18 14 32 32 32h224v352c0 18 14 32 32 32h64
c18 0 32 -14 32 -32z" />
</font> </font>
</defs></svg> </defs></svg>

Side by Side Swipe Overlay

Before

Width:  |  Height:  |  Size: 23 KiB

After

Width:  |  Height:  |  Size: 25 KiB

BIN
public/fonts/fa-dtbl-1.ttf
View File

Binary file not shown.

BIN
public/fonts/fa-dtbl-1.woff
View File

Binary file not shown.

BIN
public/fonts/fa-dtbl-1.woff2
View File

Binary file not shown.

18
resources/assets/fa-config/wanted.ini
Unescape View File

@ -38,20 +38,26 @@ download # export buttons
wrench # Table options wrench # Table options
trash-o trash-o
plus plus # Add column in table editor
warning warning # validation fail icon
undo undo # Used in table editor
close spinner
hourglass paper-plane-o # save proposal
# dark mode
sun-o sun-o
moon-o moon-o
# manual sort buttons
chevron-up chevron-up
chevron-down chevron-down
bars bars # sort icon
file-excel-o # CSV button
reply # reply, or back
arrow-left # back
# Unused # Unused
; sliders ; sliders

2
resources/assets/js/components/ColumnEditor.vue
Unescape View File

@ -5,7 +5,7 @@ Complex animated column editor for the table edit page
<template> <template>
<div> <div>
<input type="hidden" :name="name" :value="JSON.stringify(columns)" v-if="newTable"> <input type="hidden" :name="name" :value="JSON.stringify(columns)" v-if="newTable">
<table :class="[{'table': !newTable},{'new-table': newTable},'table-narrow','table-sm','table-fixed','td-va-middle']"> <table :class="[{'table': !newTable}, {'new-table': newTable}, {'mt-3': !newTable}, 'table-narrow', 'table-sm', 'table-fixed', 'td-va-middle']">
<thead> <thead>
<tr> <tr>
<th v-if="sortable"></th> <th v-if="sortable"></th>

152
resources/assets/js/components/RowsEditor.vue
Unescape View File

@ -10,6 +10,40 @@ Rows are identified by row._id, columns by col.id
--> -->
<template> <template>
<div>
<div class="col-md-12 d-flex mt-3" v-if="newRows || hasPages">
<div v-if="hasPages" v-html="pager"></div>
<div class="flex-grow-1"></div>
<form :action="route" method="POST" v-if="newRows" class="form-inline mr-2">
<input type="hidden" name="_token" :value="csrf">
<input type="hidden" name="action" value="rows.add">
<input type="hidden" name="redirect" :value="pageUrl">
<input name="count" id="newrow-count" type="number"
min=1 step=1 value=1 class="form-control mr-1" style="width: 10em">
<button class="btn btn-outline-success">Add Rows</button>
</form>
<a href="" class="btn btn-outline-success mr-2" v-if="newRows">
<v-icon class="fa-file-excel-o fa-pr" alt="CSV"></v-icon><!--
-->CSV
</a>
<form :action="route" method="POST" v-if="newRows" class="form-inline mr-2">
<input type="hidden" name="_token" :value="csrf">
<input type="hidden" name="action" value="rows.remove-empty-new">
<input type="hidden" name="redirect" :value="pageUrl">
<button class="btn btn-outline-danger">Remove Empty</button>
</form>
<button @click="saveAllChanges" type="button" v-if="newRows"
:class="['btn', this.dirtyRows ? 'btn-info' : 'btn-outline-secondary']">
Save Rows
</button>
</div>
<div class="col-md-12 mt-3">
<table class="table table-hover table-sm table-fixed td-va-middle"> <table class="table table-hover table-sm table-fixed td-va-middle">
<thead> <thead>
<tr> <tr>
@ -19,24 +53,30 @@ Rows are identified by row._id, columns by col.id
</thead> </thead>
<tbody> <tbody>
<tr v-for="row in rows" :style="rowStyle(row)"> <tr v-for="row in rows" :style="rowStyle(row)">
<td> <td class="text-nowrap">
<a href="" :class="['mr-1','btn','btn-outline-danger',{'active': row._remove}]" <button :class="['mr-1', 'btn', 'btn-outline-danger', {'active': row._remove}]"
@click.prevent="toggleRowDelete(row._id)"> @click.prevent="toggleRowDelete(row._id)">
<v-icon :class="row._remove ? 'fa-undo' : 'fa-trash-o'" <v-icon :class="row._remove ? 'fa-undo' : 'fa-trash-o'"
:alt="row._remove ? 'Undo Remove' : 'Remove'" /> :alt="row._remove ? 'Undo Remove' : 'Remove'" />
</a><!-- </button><!--
--><a href="" :class="['btn','btn-outline-secondary',{'disabled': row._remove}]" --><button v-if="newRows" :class="['mr-1', 'btn', isRowChanged(row) ? 'btn-info' : 'btn-outline-secondary']"
@click.prevent="submitRowChange(row)">
<v-icon class="fa-save" alt="Save" />
</button><!--
--><button v-else :class="['btn', 'btn-outline-secondary', {'disabled': row._remove}]"
@click.prevent="toggleRowEditing(row._id)"> @click.prevent="toggleRowEditing(row._id)">
<v-icon :class="row._editing ? 'fa-save' : 'fa-pencil'" <v-icon :class="row._editing ? 'fa-save' : 'fa-pencil'"
:alt="row._editing ? 'Save' : 'Edit'" /> :alt="row._editing ? 'Save' : 'Edit'" />
</a> </button>
</td> </td>
<template v-if="row._editing"> <template v-if="row._editing || newRows">
<td v-for="col in columns" class="pr-0"> <td v-for="col in columns" class="pr-0">
<input v-model="row[col.id]" :class="['form-control', { 'is-invalid': row._errors && row._errors[col.id] }]" <input v-model="row[col.id]" :class="['form-control', { 'is-invalid': row._errors && row._errors[col.id] }]"
:title="(row._errors && row._errors[col.id]) ? row._errors[col.id][0] : null" :title="(row._errors && row._errors[col.id]) ? row._errors[col.id][0] : null"
type="text" @keyup.enter="toggleRowEditing(row._id)"> type="text"
@input="markRowDirty(row)"
@keyup.enter="toggleRowEditing(row._id)">
</td> </td>
</template> </template>
@ -53,6 +93,12 @@ Rows are identified by row._id, columns by col.id
</tr> </tr>
</tbody> </tbody>
</table> </table>
</div>
<div class="col-md-12 d-flex" v-if="hasPages">
<div v-if="hasPages" v-html="pager"></div>
</div>
</div>
</template> </template>
<style lang="scss" scoped> <style lang="scss" scoped>
@ -61,7 +107,6 @@ Rows are identified by row._id, columns by col.id
th { th {
border-top: 0 none; border-top: 0 none;
} }
</style> </style>
<script> <script>
@ -69,13 +114,43 @@ Rows are identified by row._id, columns by col.id
export default { export default {
props: { props: {
/** True if pager should be enabled */
hasPages: Boolean,
/** Pager HTML */
pager: String,
/** Update route */
route: String, route: String,
/** Row objects */
xRows: Object, // key'd by _id xRows: Object, // key'd by _id
/** Array of columns */
columns: Array, columns: Array,
/** CSRF token */
csrf: String,
/** Full URL of the current page */
pageUrl: String,
/** Indicate this is the Add Rows page */
newRows: {
type: Boolean,
default: false,
}
}, },
data () { data () {
return { return {
/** All rows */
rows: this.xRows, rows: this.xRows,
/** Number of dirty rows */
dirtyRows: 0,
}
},
watch: {
dirtyRows: function (value) {
if (value > 0) {
$(window).on('beforeunload', function () {
return 'Some row changes are not saved.';
});
} else {
$(window).off('beforeunload');
}
} }
}, },
methods: { methods: {
@ -86,14 +161,18 @@ Rows are identified by row._id, columns by col.id
/** Toggle row delete status, remove new rows (when using the editor widget for added rows) */ /** Toggle row delete status, remove new rows (when using the editor widget for added rows) */
toggleRowDelete (_id) { toggleRowDelete (_id) {
if (!_.isDefined(this.rows[_id])) return let row = this.rows[_id]
if (!_.isDefined(row)) return
let remove = !this.rows[_id]._remove let remove = !row._remove
let wasDirty = this.isRowChanged(row)
this.query({ this.query({
action: remove ? 'row.remove' : 'row.restore', action: remove ? 'row.remove' : 'row.restore',
id: _id id: _id
}, (resp) => { }, (resp) => {
if (wasDirty) this.dirtyRows--
// if response is null, this was a New row // if response is null, this was a New row
// and it was discarded without a way back - hard drop // and it was discarded without a way back - hard drop
if (_.isEmpty(resp.data)) { if (_.isEmpty(resp.data)) {
@ -107,11 +186,14 @@ Rows are identified by row._id, columns by col.id
/** Save a change */ /** Save a change */
submitRowChange (row) { submitRowChange (row) {
let wasDirty = this.isRowChanged(row)
this.query({ this.query({
action: 'row.update', action: 'row.update',
data: row data: row
}, (resp) => { }, (resp) => {
this.$set(this.rows, row._id, resp.data) this.$set(this.rows, row._id, resp.data)
if (wasDirty) this.dirtyRows--
}, (er) => { }, (er) => {
if (!_.isUndefined(er.errors)) { if (!_.isUndefined(er.errors)) {
this.$set(this.rows[row._id], '_errors', er.errors) this.$set(this.rows[row._id], '_errors', er.errors)
@ -122,9 +204,9 @@ Rows are identified by row._id, columns by col.id
/** Toggle editing state - edit or save */ /** Toggle editing state - edit or save */
toggleRowEditing (_id) { toggleRowEditing (_id) {
if (this.rows[_id]._remove) return false // can't edit row marked for removal if (this.rows[_id]._remove) return false // can't edit row marked for removal
let editing = !this.rows[_id]._editing let wasEditing = this.rows[_id]._editing
if (!editing) { if (wasEditing || this.newRows) {
this.submitRowChange(this.rows[_id]) this.submitRowChange(this.rows[_id])
} else { } else {
this.$set(this.rows[_id], '_editing', true) this.$set(this.rows[_id], '_editing', true)
@ -155,9 +237,55 @@ Rows are identified by row._id, columns by col.id
return row._changed && row._changed.indexOf(colId) > -1 return row._changed && row._changed.indexOf(colId) > -1
}, },
/** Test if any field in the row is changed */
isRowChanged(row) {
return row._changed && row._changed.length
},
/** Revert a value cell */ /** Revert a value cell */
revertCell (row, colId) { revertCell (row, colId) {
this.submitRowChange(_.merge({}, row, {[colId]: row._orig[colId]})) this.submitRowChange(_.merge({}, row, {[colId]: row._orig[colId]}))
},
markRowDirty(row) {
if (!this.newRows) return
let wasDirty = this.isRowChanged(row)
let changes = []
_.each(row._orig, (v, k) => {
if (row[k] != v) {
changes.push(k)
}
})
this.rows[row._id]._changed = changes;
let isDirty = this.isRowChanged(row)
if (wasDirty && !isDirty) this.dirtyRows--
else if (!wasDirty && isDirty) this.dirtyRows++
},
saveAllChanges() {
let toChange = _.filter(this.rows, (r) => {
return this.isRowChanged(r)
})
this.query({
action: 'row.update-many',
data: toChange
}, (resp) => {
_.each(resp.data, (row) => {
this.$set(this.rows, row._id, row)
})
this.dirtyRows = 0
}, (er) => {
// TODO
console.log(er)
// if (!_.isUndefined(er.errors)) {
// this.$set(this.rows[row._id], '_errors', er.errors)
// }
})
} }
} }
} }

1
resources/assets/js/udash.js vendored
Unescape View File

@ -6,6 +6,7 @@ export { default as merge } from 'lodash/merge'
export { default as unset } from 'lodash/unset' export { default as unset } from 'lodash/unset'
export { default as isEmpty } from 'lodash/isEmpty' export { default as isEmpty } from 'lodash/isEmpty'
export { default as debounce } from 'lodash/debounce' export { default as debounce } from 'lodash/debounce'
export { default as filter } from 'lodash/filter'
function isDefined (x) { function isDefined (x) {
return typeof x !== 'undefined' return typeof x !== 'undefined'

6
resources/assets/js/vue-init.js vendored
Unescape View File

@ -10,12 +10,12 @@ const Icon = Vue.component('v-icon', require('./components/Icon.vue'))
window.app = { window.app = {
ColumnEditor: function (selector, data) { ColumnEditor: function (selector, data) {
new ColumnEditor({ propsData: data }).$mount(selector) return new ColumnEditor({ propsData: data }).$mount(selector)
}, },
RowsEditor: function (selector, data) { RowsEditor: function (selector, data) {
new RowsEditor({ propsData: data }).$mount(selector) return new RowsEditor({ propsData: data }).$mount(selector)
}, },
Icon: function (selector, data) { Icon: function (selector, data) {
new Icon({ propsData: data }).$mount(selector) return new Icon({ propsData: data }).$mount(selector)
} }
} }

13
resources/assets/sass/_fa-utils.scss vendored
Unescape View File

@ -34,3 +34,16 @@
.fa-huge { .fa-huge {
font-size: 2em; font-size: 2em;
} }
.fa-spin::before {
animation: fa-spin 2s infinite linear;
}
@keyframes fa-spin {
0% {
transform: rotate(0deg);
}
100% {
transform: rotate(359deg);
}
}

7
resources/assets/sass/bootstrap-customizations/_nav.scss vendored
Unescape View File

@ -0,0 +1,7 @@
.nav-tabs .nav-link.highlight {
border-color: $nav-tabs-link-hover-border-color;
&:hover, &:focus {
border-color: $nav-tabs-link-hover-border-color;
}
}

2
resources/views/table/conf.blade.php
Unescape View File

@ -18,7 +18,7 @@
<h1 class="mx-3">{{ $table->title }}</h1> <h1 class="mx-3">{{ $table->title }}</h1>
<a href="{{ $table->viewRoute }}" class="btn btn-outline-primary py-1 btn-sm" @tooltip(Back to Table)> <a href="{{ $table->viewRoute }}" class="btn btn-outline-primary py-1 btn-sm" @tooltip(Back to Table)>
@icon(fa-table, sr:Back to Table) @icon(fa-reply, sr:Back to Table)
</a> </a>
</div> </div>
</div> </div>

27
resources/views/table/propose/add-rows-csv.blade.php
Unescape View File

@ -0,0 +1,27 @@
@php
$tab = 'add-rows';
/** @var \App\Tables\Column[] $columns */
/** @var \App\Tables\Changeset $changeset */
/** @var \App\Models\Row[]|Illuminate\Pagination\Paginator $rows */
/** @var \App\Models\Table $table */
@endphp
@extends('table.propose.layout')
@section('tab-content')
<div class="form-inline py-2 px-1">
<form action="{{$table->draftUpdateRoute}}" method="POST" class="form-inline">
@csrf
<input type="hidden" name="action" value="rows.add-csv">
<input type="hidden" name="redirect" value="{{request()->fullUrl()}}">
<label class="pr-2" for="csv-data">Add CSV:</label>
<textarea name="data" id="csv-data"
title="{{$errors->has('data') ? $errors->first('data') : ''}}"
class="form-control mr-1 {{ $errors->has('data')?'is-invalid':'' }}"
style="width:30em; height:10em">{{old('data')}}</textarea>
<button class="btn btn-outline-success">Append</button>
</form>
</div>
@stop
@push('scripts')
@endpush

51
resources/views/table/propose/add-rows.blade.php
Unescape View File

@ -7,45 +7,36 @@
@endphp @endphp
@extends('table.propose.layout-row-pagination') @extends('table.propose.layout-row-pagination')
@section('header')
<div class="form-inline py-2 px-1 border-bottom mb-3">
{{-- TODO improve layout --}}
<form action="{{$table->draftUpdateRoute}}" method="POST" class="form-inline">
@csrf
<input type="hidden" name="action" value="rows.add-csv">
<input type="hidden" name="redirect" value="{{request()->fullUrl()}}">
<label class="pr-2" for="csv-data">Add CSV:</label>
<textarea name="data" id="csv-data"
title="{{$errors->has('data') ? $errors->first('data') : ''}}"
class="form-control mr-1 {{ $errors->has('data')?'is-invalid':'' }}"
style="width:30em; height:10em">{{old('data')}}</textarea>
<button class="btn btn-outline-success">Append</button>
</form>
<div class="flex-grow-1"></div>
<form action="{{$table->draftUpdateRoute}}" method="POST">
@csrf
<input type="hidden" name="action" value="rows.add">
<input type="hidden" name="redirect" value="{{request()->fullUrl()}}">
<label class="form-inline pr-2" for="newrow-count">Add Empty Rows:</label>
<input name="count" id="newrow-count" type="number" min=1 step=1 value=1 class="form-control mr-1" style="width:10em">
<button class="btn btn-outline-success">Add</button>
</form>
</div>
@stop
@section('rows') @section('rows')
<div id="rows-editor"></div> <div id="rows-editor"></div>
@stop @stop
@push('scripts') @push('scripts')
@php
$xrows = $rows->map(function($r) {
$r['_orig'] = $r;
return $r;
})->keyBy('_id');
@endphp
<script> <script>
ready(function() { ready(function() {
app.RowsEditor('#rows-editor', { var rows_editor = app.RowsEditor('#rows-editor', {
hasPages: @json($rows->hasPages()),
pager:
'<nav class="text-center" aria-label="Table pages">' +
@json((string)$rows->links(null, ['ulClass' => 'mb-0'])) +
'</nav>',
route: {!! toJSON($table->draftUpdateRoute) !!}, route: {!! toJSON($table->draftUpdateRoute) !!},
columns: {!! toJSON($columns) !!}, columns: {!! toJSON($columns) !!},
xRows: {!! toJSON($rows->keyBy('_id'), true) !!}, xRows: {!! toJSON($xrows, true) !!},
newRows: true, // indicate all are new
pageUrl: @json(request()->fullUrl()),
csrf: @json(csrf_token()),
})
$('#save-all-rows').on('click', function () {
rows_editor.saveAllChanges()
}) })
}); });
</script> </script>

5
resources/views/table/propose/edit-rows.blade.php
Unescape View File

@ -23,6 +23,11 @@
<script> <script>
ready(function() { ready(function() {
app.RowsEditor('#rows-editor', { app.RowsEditor('#rows-editor', {
hasPages: @json($rows->hasPages()),
pager:
'<nav class="text-center" aria-label="Table pages">' +
@json((string)$rows->links(null, ['ulClass' => 'mb-0'])) +
'</nav>',
route: {!! toJSON($table->draftUpdateRoute) !!}, route: {!! toJSON($table->draftUpdateRoute) !!},
columns: {!! toJSON($columns) !!}, columns: {!! toJSON($columns) !!},
xRows: {!! toJSON($transformed, true) !!}, xRows: {!! toJSON($transformed, true) !!},

18
resources/views/table/propose/layout-row-pagination.blade.php
Unescape View File

@ -9,23 +9,5 @@
@yield('header') @yield('header')
</div> </div>
@if($rows->hasPages())
<div class="col-md-12 d-flex">
<nav class="text-center" aria-label="Pages of the table">
{{ $rows->links(null, ['ulClass' => 'mb-0']) }}
</nav>
</div>
@endif
<div class="col-12">
@yield('rows') @yield('rows')
</div>
@if($rows->hasPages())
<div class="col-md-12 d-flex">
<nav class="text-center" aria-label="Pages of the table">
{{ $rows->links(null, ['ulClass' => 'mb-0']) }}
</nav>
</div>
@endif
@stop @stop

41
resources/views/table/propose/layout.blade.php
Unescape View File

@ -20,36 +20,45 @@ if (!isset($tab) || $tab == '') $tab = 'edit-rows';
<h1 class="mx-3"> <h1 class="mx-3">
<a href="{{ $table->viewRoute }}" class="link-no-color">{{ $table->title }}</a> <a href="{{ $table->viewRoute }}" class="link-no-color">{{ $table->title }}</a>
</h1> </h1>
<a href="{{$table->draftDiscardRoute}}" class="btn btn-outline-danger mr-2" @tooltip(Discard changes)> <a href="{{$table->draftDiscardRoute}}" class="btn btn-outline-danger mr-2 py-1 btn-sm">
@icon(fa-trash-o, sr:Discard) @icon(fa-trash-o fa-pr, sr:Discard){{--
--}}Discard
</a> </a>
@if(user()->ownsTable($table)) <a href="{{ $table->viewRoute }}" class="btn btn-outline-primary py-1 btn-sm" @tooltip(Back to Table)>
<a href="" class="btn btn-outline-success" @tooltip(Save the changes and apply them as a new table revision)> @icon(fa-reply, sr:Back to Table)
@icon(fa-save fa-pr)Commit
</a>
@else
<a href="" class="btn btn-outline-success" @tooltip(Submit your changes for review by the table owner)>
@icon(fa-save fa-pr)Submit
</a> </a>
@endif
</div> </div>
</div> </div>
<ul class="nav nav-tabs"> <ul class="nav nav-tabs">
<li class="nav-item"> <li class="nav-item">
<a class="nav-link{{ $tab=='edit-rows'?' active':'' }}" href="{{ $table->getDraftRoute('edit-rows') }}">Edit Rows</a> <a class="nav-link {{ $tab=='edit-rows' ? 'active' : '' }}" href="{{ $table->getDraftRoute('edit-rows') }}">
Edit Rows
</a>
</li> </li>
<li class="nav-item"> <li class="nav-item">
<a class="nav-link{{ $tab=='add-rows'?' active':'' }}" href="{{ $table->getDraftRoute('add-rows') }}">Add Rows</a> <a class="nav-link {{ $tab=='add-rows' ? 'active' : '' }}" href="{{ $table->getDraftRoute('add-rows') }}">
Add Rows
</a>
</li> </li>
<li class="nav-item"> <li class="nav-item">
<a class="nav-link{{ $tab=='manage-columns'?' active':'' }}" href="{{ $table->getDraftRoute('manage-columns') }}">Columns</a> <a class="nav-link {{ $tab=='manage-columns' ? 'active' : '' }}" href="{{ $table->getDraftRoute('manage-columns') }}">
Change Columns
</a>
</li> </li>
<li class="nav-item"> <li class="nav-item">
<a class="nav-link{{ $tab=='review'?' active':'' }}" href="{{ $table->getDraftRoute('review') }}">Note & Review</a> <a class="text-success nav-link {{ $tab=='review' ? 'active' : '' }}" href="{{ $table->getDraftRoute('review') }}">
@if(user()->ownsTable($table))
@icon(fa-save fa-pr){{--
--}}Review & Apply
@else
@icon(fa-paper-plane-o fa-pr){{--
--}}Review & Submit
@endif
</a>
</li> </li>
<li class="nav-item ml-auto pt-2 pr-2 opacity-fade" style="opacity:0" id="draft-busy"> <li class="nav-item pt-2 pr-2 opacity-fade ml-auto" style="opacity:0" id="draft-busy">
@icon(fa-hourglass, Working...) @icon(fa-spinner fa-spin, Working...)
</li> </li>
</ul> </ul>

10
resources/views/table/propose/review.blade.php
Unescape View File

@ -2,5 +2,13 @@
@extends('table.propose.layout') @extends('table.propose.layout')
@section('tab-content') @section('tab-content')
... @if(user()->ownsTable($table))
<a href="" class="btn btn-outline-success" @tooltip(Save the changes and apply them as a new table revision)>
@icon(fa-save fa-pr)Commit
</a>
@else
<a href="" class="btn btn-outline-success" @tooltip(Submit your changes for review by the table owner)>
@icon(fa-save fa-pr)Submit
</a>
@endif
@stop @stop

Write Preview
Loading…
Cancel
Save