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

logo, improved listing, some helpers, mail confirms table, confirmed flag, user title column..

Browse Source
pull/26/head
Ondřej Hruška 6 years ago
parent 9081b38425
commit a3ba68ea98
Signed by: MightyPork
GPG Key ID: 2C5FD5035250423D
47 changed files with 1462 additions and 292 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. 45
      app/Console/Commands/ConfirmUser.php
  2. 2
      app/Http/Controllers/Auth/LoginController.php
  3. 15
      app/Http/Controllers/Auth/RegisterController.php
  4. 20
      app/Http/Controllers/HomeController.php
  5. 64
      app/Http/Controllers/TableController.php
  6. 24
      app/Http/Controllers/UserController.php
  7. 2
      app/Models/ContentReport.php
  8. 26
      app/Models/EmailConfirmation.php
  9. 6
      app/Models/Proposal.php
  10. 9
      app/Models/Revision.php
  11. 22
      app/Models/Table.php
  12. 8
      app/Models/TableComment.php
  13. 60
      app/Models/User.php
  14. 3
      app/Providers/AppServiceProvider.php
  15. 6
      app/Providers/RouteServiceProvider.php
  16. 7
      app/View/Widget.php
  17. 21
      app/helpers.php
  18. 5
      database/migrations/2014_10_12_000000_create_users_table.php
  19. 2
      database/migrations/2018_07_08_193600_create_revisions_table.php
  20. 32
      database/migrations/2018_07_22_083900_create_email_confirmations_table.php
  21. 11
      porklib/Utils/Str.php
  22. 491
      public/fonts/fa-dtbl-1-preview.html
  23. 53
      public/fonts/fa-dtbl-1.css
  24. BIN
      public/fonts/fa-dtbl-1.eot
  25. 133
      public/fonts/fa-dtbl-1.svg
  26. BIN
      public/fonts/fa-dtbl-1.ttf
  27. BIN
      public/fonts/fa-dtbl-1.woff2
  28. 270
      public/images/logo.inkscape.svg
  29. 1
      public/images/logo.svg
  30. 4
      resources/assets/sass/_bst-modules.scss
  31. 19
      resources/assets/sass/app.scss
  32. 8
      resources/views/auth/register.blade.php
  33. 2
      resources/views/form/_help.blade.php
  34. 7
      resources/views/form/checkbox.blade.php
  35. 41
      resources/views/form/input.blade.php
  36. 7
      resources/views/form/textarea.blade.php
  37. 52
      resources/views/home.blade.php
  38. 2
      resources/views/layouts/footer.blade.php
  39. 17
      resources/views/layouts/main-nav.blade.php
  40. 21
      resources/views/table/create.blade.php
  41. 2
      resources/views/table/view.blade.php
  42. 120
      resources/views/user/view.blade.php
  43. 26
      resources/views/welcome.blade.php
  44. 13
      routes/login.php
  45. 22
      routes/public.php
  46. 13
      routes/user.php
  47. 40
      routes/web.php

45
app/Console/Commands/ConfirmUser.php
Unescape View File

@ -0,0 +1,45 @@
<?php
namespace App\Console\Commands;
use App\Models\User;
use Illuminate\Console\Command;
class ConfirmUser extends Command
{
/**
* The name and signature of the console command.
*
* @var string
*/
protected $signature = 'user:confirm {user}';
/**
* The console command description.
*
* @var string
*/
protected $description = 'Confirm user\'s e-mail (for testing)';
/**
* Create a new command instance.
*
* @return void
*/
public function __construct()
{
parent::__construct();
}
/**
* Execute the console command.
*
* @return mixed
*/
public function handle()
{
$u = User::resolve($this->argument('user'));
$u->update('confirmed', true);
$this->info("User #$u->id with e-mail $u->email and handle @$u->name was confirmed.");
}
}

2
app/Http/Controllers/Auth/LoginController.php
Unescape View File

@ -25,7 +25,7 @@ class LoginController extends Controller
*
* @var string
*/
protected $redirectTo = '/home';
protected $redirectTo = '/';
/**
* Create a new controller instance.

15
app/Http/Controllers/Auth/RegisterController.php
Unescape View File

@ -7,6 +7,7 @@ use App\Http\Controllers\Controller;
use Illuminate\Support\Facades\Hash;
use Illuminate\Support\Facades\Validator;
use Illuminate\Foundation\Auth\RegistersUsers;
use Illuminate\Validation\Rule;
class RegisterController extends Controller
{
@ -28,7 +29,7 @@ class RegisterController extends Controller
*
* @var string
*/
protected $redirectTo = '/home';
protected $redirectTo = '/';
/**
* Create a new controller instance.
@ -49,9 +50,15 @@ class RegisterController extends Controller
protected function validator(array $data)
{
return Validator::make($data, [
'name' => 'required|string|max:255|regex:/^[a-zA-Z0-9_.-]+$/',
'name' => [
'regex:/^[a-zA-Z0-9_.-]+$/',
'required',
'string',
'max:255',
'unique:users'
],
'email' => 'required|string|email|max:255|unique:users',
'password' => 'required|string|min:6|confirmed',
'password' => 'required|string|min:6|max:1000|confirmed', // max len to foil DOS attempts
]);
}
@ -65,7 +72,7 @@ class RegisterController extends Controller
{
return User::create([
'name' => $data['name'],
'title' => $data['name'], // display name - by default, init to name
'title' => $data['name'],
'email' => $data['email'],
'password' => Hash::make($data['password']),
]);

20
app/Http/Controllers/HomeController.php
Unescape View File

@ -1,20 +0,0 @@
<?php
namespace App\Http\Controllers;
use Illuminate\Http\Request;
class HomeController extends Controller
{
/**
* Show the application dashboard.
*
* @return \Illuminate\Http\Response
*/
public function index()
{
$tables = \Auth::user()->tables()->paginate(10);
return view('home')->with(compact('tables'));
}
}

64
app/Http/Controllers/TableController.php
Unescape View File

@ -8,6 +8,7 @@ use App\Models\Table;
use App\Models\User;
use App\Utils\Column;
use Illuminate\Http\Request;
use Illuminate\Validation\Rule;
use MightyPork\Exceptions\NotApplicableException;
class TableController extends Controller
@ -16,7 +17,7 @@ class TableController extends Controller
{
/** @var Table $tableModel */
$tableModel = $user->tables()->where('name', $table)->first();
$revision = $tableModel->activeRevision;
$revision = $tableModel->revision;
return view('table.view', [
'table' => $tableModel,
@ -54,12 +55,12 @@ class TableController extends Controller
$u = \Auth::user();
$this->validate($request, [
'name' => 'required',
'title' => 'string',
'description' => 'string|nullable',
'license' => 'string|nullable',
'origin' => 'string|nullable',
'columns' => 'required',
'name' => 'required|string|max:255',
'title' => 'string|string|max:255',
'description' => 'string|nullable|max:4000',
'license' => 'string|nullable|max:4000',
'origin' => 'string|nullable|max:4000',
'columns' => 'required|string',
'data' => 'string|nullable',
]);
@ -74,16 +75,24 @@ class TableController extends Controller
// Parse and validate the columns specification
/** @var Column[] $columns */
$columns = [];
$column_keys = []; // for checking duplicates
$colTable = array_map('str_getcsv', explode("\n", $request->get('columns')));
// prevent griefing via long list of columns
if (count($colTable) > 100) return $this->backWithErrors(['columns' => "Too many columns"]);
foreach ($colTable as $col) {
$col = array_map('trim', $col);
if (count($col) < 2) {
return $this->backWithErrors([
'columns' => "All columns must have at least name and type.",
]);
if (count($col) < 2 || strlen($col[0])==0) {
return $this->backWithErrors(['columns' => "All columns must have at least name and type."]);
}
try {
if (in_array($col[0], $column_keys)) {
return $this->backWithErrors(['columns' => "Duplicate column: $col[0]"]);
}
$column_keys[] = $col[0];
$columns[] = new Column([
'name' => $col[0],
'type' => $col[1],
@ -93,6 +102,7 @@ class TableController extends Controller
return $this->backWithErrors(['columns' => $e->getMessage()]);
}
}
if (count($columns) == 0) return $this->backWithErrors(['columns' => "Define at least one column"]);
$rowTable = array_map('str_getcsv', explode("\n", $request->get('data')));
@ -110,38 +120,42 @@ class TableController extends Controller
}
return [
'data' => json_encode($parsed),
'refs' => 1,
];
}, $rowTable);
} catch (\Exception $e) {
return $this->backWithErrors(['columns' => $e->getMessage()]);
}
$revision = Revision::create([
'refs' => 1, // from the new table
$revisionFields = [
'note' => "Initial revision of table $u->name/$tabName",
'columns' => json_encode($columns),
]);
'row_count' => count($rowsData),
];
$table = Table::create([
$tableFields = [
'owner_id' => $u->id,
'revision_id' => $revision->id,
'revision_id' => 0,
'name' => $tabName,
'title' => $request->get('title'),
'description' => $request->get('description'),
'license' => $request->get('license'),
'origin' => $request->get('origin'),
]);
];
\DB::transaction(function () use ($revisionFields, $tableFields, $rowsData) {
$revision = Revision::create($revisionFields);
// Attach the revision to the table, set as current
$table->revisions()->attach($revision);
$table->activeRevision()->associate($revision);
$tableFields['revision_id'] = $revision->id; // to meet the not-null constraint
$table = Table::create($tableFields);
// Spawn the rows, linked to the revision
$revision->rows()->createMany($rowsData);
// Attach the revision to the table, set as current
$table->revisions()->attach($revision);
$table->revision()->associate($revision);
// Now we create rows, a revision pointing to them, and the table using it.
// Spawn rows, linked to the revision
$revision->rows()->createMany($rowsData);
});
return "Ok.";
return redirect(route('table.view', ['user' => $u, 'table' => $tabName]));
}
}

24
app/Http/Controllers/UserController.php
Unescape View File

@ -0,0 +1,24 @@
<?php
namespace App\Http\Controllers;
use App\Models\User;
class UserController extends Controller
{
/**
* Show the application dashboard.
*
* @return \Illuminate\Http\Response
*/
public function view(User $user)
{
$tables = $user->tables()
->with('revision:id,row_count')
->paginate(3);
return view('user.view')->with(compact('tables', 'user'));
}
}

2
app/Models/ContentReport.php
Unescape View File

@ -14,8 +14,8 @@ use Illuminate\Database\Eloquent\Model;
* @property int $object_id
* @property int $author_id
* @property string $message
* @property User $author
* @property mixed $object - morph
* @property-read User $author
*/
class ContentReport extends Model
{

26
app/Models/EmailConfirmation.php
Unescape View File

@ -0,0 +1,26 @@
<?php
namespace App\Models;
use Illuminate\Database\Eloquent\Model;
/**
* E-mail confirmation
*
* @property int $id
* @property \Carbon\Carbon $created_at
* @property int $user_id
* @property string $token
* @property-read User $user
*/
class EmailConfirmation extends Model
{
protected $guarded = [];
const UPDATED_AT = null; // disable update timestamp
/** Authoring user */
public function user()
{
return $this->belongsTo(User::class, 'user_id');
}
}

6
app/Models/Proposal.php
Unescape View File

@ -15,10 +15,10 @@ use Illuminate\Database\Eloquent\Model;
* @property int $revision_id
* @property int $author_id
* @property string $note
* @property User $author
* @property Table $table
* @property Revision $revision
* @property object $changes - JSONB
* @property-read User $author
* @property-read Table $table
* @property-read Revision $revision
*/
class Proposal extends Model
{

9
app/Models/Revision.php
Unescape View File

@ -15,10 +15,11 @@ use Riesjart\Relaquent\Model\Concerns\HasRelaquentRelationships;
* @property int $ancestor_id
* @property string $note
* @property object $columns
* @property Revision|null $parentRevision
* @property Row[]|Collection $rows
* @property Proposal|null $sourceProposal - proposal that was used to create this revision
* @property Proposal[]|Collection $dependentProposals
* @property int $row_count - cached number of rows in the revision
* @property-read Revision|null $parentRevision
* @property-read Row[]|Collection $rows
* @property-read Proposal|null $sourceProposal - proposal that was used to create this revision
* @property-read Proposal[]|Collection $dependentProposals
*/
class Revision extends Model
{

22
app/Models/Table.php
Unescape View File

@ -2,9 +2,11 @@
namespace App\Models;
use App\Models\Concerns\ManyManyThrough;
use App\Models\Concerns\Reportable;
use Illuminate\Database\Eloquent\Collection;
use Illuminate\Database\Eloquent\Model;
use Riesjart\Relaquent\Model\Concerns\HasRelaquentRelationships;
/**
* A data table object (referencing revisions)
@ -20,15 +22,15 @@ use Illuminate\Database\Eloquent\Model;
* @property string $description
* @property string $license
* @property string $origin
* @property User $owner
* @property Table $parentTable
* @property Table[]|Collection $forks
* @property Revision[]|Collection $revisions
* @property Revision $activeRevision
* @property Proposal[]|Collection $proposal
* @property TableComment[]|Collection $comments
* @property User[]|Collection $favouritingUsers
* @property User[]|Collection $discussionFollowers
* @property-read User $owner
* @property-read Table $parentTable
* @property-read Table[]|Collection $forks
* @property-read Revision[]|Collection $revisions
* @property-read Revision $revision
* @property-read Proposal[]|Collection $proposal
* @property-read TableComment[]|Collection $comments
* @property-read User[]|Collection $favouritingUsers
* @property-read User[]|Collection $discussionFollowers
*/
class Table extends Model
{
@ -60,7 +62,7 @@ class Table extends Model
}
/** Active revision */
public function activeRevision()
public function revision()
{
return $this->belongsTo(Revision::class, 'revision_id');
}

8
app/Models/TableComment.php
Unescape View File

@ -16,10 +16,10 @@ use Illuminate\Database\Eloquent\Model;
* @property int $author_id
* @property int $ancestor_id
* @property string $message
* @property User $author
* @property Table $table
* @property TableComment|null $ancestor
* @property TableComment[]|Collection $replies
* @property-read User $author
* @property-read Table $table
* @property-read TableComment|null $ancestor
* @property-read TableComment[]|Collection $replies
*/
class TableComment extends Model
{

60
app/Models/User.php
Unescape View File

@ -8,6 +8,8 @@ use Illuminate\Database\Eloquent\Collection;
use Illuminate\Notifications\Notifiable;
use Illuminate\Foundation\Auth\User as Authenticatable;
use Illuminate\Notifications\Notification;
use MightyPork\Exceptions\ArgumentException;
use MightyPork\Exceptions\NotExistException;
/**
* A user in the application
@ -19,16 +21,18 @@ use Illuminate\Notifications\Notification;
* @property string $title - for display
* @property string $email - unique, for login and social auth chaining
* @property string $password - hashed pw
* @property Proposal[]|Collection $proposals
* @property Table[]|Collection $tables
* @property OAuthIdentity[]|Collection $socialIdentities
* @property TableComment[]|Collection $tableComments
* @property Table[]|Collection $favouriteTables
* @property Table[]|Collection $followedDiscussions
* @property ContentReport[]|Collection $authoredReports
* @property Notification[]|Collection $notifications
* @property Notification[]|Collection $readNotifications
* @property Notification[]|Collection $unreadNotifications
* @property bool $confirmed - user e-mail is confirmed
* @property-read Proposal[]|Collection $proposals
* @property-read Table[]|Collection $tables
* @property-read OAuthIdentity[]|Collection $socialIdentities
* @property-read TableComment[]|Collection $tableComments
* @property-read Table[]|Collection $favouriteTables
* @property-read Table[]|Collection $followedDiscussions
* @property-read ContentReport[]|Collection $authoredReports
* @property-read Notification[]|Collection $notifications
* @property-read Notification[]|Collection $readNotifications
* @property-read Notification[]|Collection $unreadNotifications
* @property-read string $handle - user handle, including @
*/
class User extends Authenticatable
{
@ -137,12 +141,36 @@ class User extends Authenticatable
$this->followedDiscussions()->detach($table);
}
public function fakeTables()
/**
* Resolve user by a given name, id, or e-mail
*
* @param string $ident
* @return User
*/
public static function resolve($ident)
{
return [
(object)['title' => 'Table 1'],
(object)['title' => 'Table 2'],
(object)['title' => 'Table 3']
];
$ident = "$ident";
if (strlen($ident) == 0) throw new ArgumentException("Can't find user by empty string.");
if (is_numeric($ident)) {
$u = static::find((int)$ident);
}
else if ($ident[0] == '@') {
$u = static::where('name', substr($ident, 1))->first();
}
else {
$u = static::where('email', $ident)->first();
}
if (!$u) throw new NotExistException("No user found matching \"$ident\"");
return $u;
}
public function __get($name)
{
if ($name == 'handle') return "@$this->name";
return parent::__get($name);
}
}

3
app/Providers/AppServiceProvider.php
Unescape View File

@ -22,7 +22,8 @@ class AppServiceProvider extends ServiceProvider
\Route::bind('user', function ($value) {
$u = User::where('name', $value)->first();
// it may also be the _id directly
if (!$u) $u = User::find($value);
if (!$u && is_numeric($value)) $u = User::find((int)$value);
if (!$u) abort(404);
return $u;
});
}

6
app/Providers/RouteServiceProvider.php
Unescape View File

@ -53,11 +53,7 @@ class RouteServiceProvider extends ServiceProvider
{
Route::middleware('web')
->namespace($this->namespace)
->group(base_path('routes/public.php'));
Route::middleware(['web', 'auth'])
->namespace($this->namespace)
->group(base_path('routes/user.php'));
->group(base_path('routes/web.php'));
}
/**

7
app/View/Widget.php
Unescape View File

@ -19,9 +19,10 @@ class Widget
{
protected $attributesArray = [],
$id, $name, $label, $value,
$viewName,
$help,
$labelCols, $fieldCols,
$viewName, // view to use inside the form namespace
$help, // help button with tooltip
$prepend, $append, // input-group (add-ons)
$labelCols, $fieldCols, // grid layout setting (label/field cols)
$styleArray = [];
public function __construct($viewName, $name, $label)

21
app/helpers.php
Unescape View File

@ -1,3 +1,24 @@
<?php
// global helpers
function authed() {
return ! \Auth::guest();
}
function guest() {
return \Auth::guest();
}
function user() {
return \Auth::user();
}
function ellipsis($s, $len) {
return \MightyPork\Utils\Str::ellipsis($s, $len);
}
function faker() {
static $fac = null;
if ($fac !== null) return $fac;
return $fac = Faker\Factory::create();
}

5
database/migrations/2014_10_12_000000_create_users_table.php
Unescape View File

@ -18,8 +18,11 @@ class CreateUsersTable extends Migration
$table->timestamps();
$table->string('name')->unique();
$table->string('title')->index();
$table->text('bio')->nullable();
$table->text('website')->nullable();
$table->string('email')->unique(); // would have to be nullable if we supported login via providers that don't give us e-mail
$table->string('password')->nullable();
$table->string('password')->nullable(); // null if registered via provider and not set a pw yet
$table->boolean('confirmed')->default(false); // set to 1 after e-mail is verified
$table->rememberToken();
});
}

2
database/migrations/2018_07_08_193600_create_revisions_table.php
Unescape View File

@ -18,6 +18,8 @@ class CreateRevisionsTable extends Migration
$table->timestamps();
$table->unsignedInteger('ancestor_id')->index()->nullable(); // parent revision
$table->unsignedInteger('row_count'); // cached nbr of rows
// columns specification
// array with: {name, title, type}
$table->jsonb('columns');

32
database/migrations/2018_07_22_083900_create_email_confirmations_table.php
Unescape View File

@ -0,0 +1,32 @@
<?php
use Illuminate\Support\Facades\Schema;
use Illuminate\Database\Schema\Blueprint;
use Illuminate\Database\Migrations\Migration;
class CreateEmailConfirmationsTable extends Migration
{
/**
* Run the migrations.
*
* @return void
*/
public function up()
{
Schema::create('email_confirmations', function (Blueprint $table) {
$table->unsignedInteger('user_id')->index();
$table->timestamp('created_at')->nullable();
$table->string('token');
});
}
/**
* Reverse the migrations.
*
* @return void
*/
public function down()
{
Schema::dropIfExists('email_confirmations');
}
}

11
porklib/Utils/Str.php
Unescape View File

@ -654,11 +654,18 @@ class Str extends \Illuminate\Support\Str
return preg_replace('/,\s*([}\]])/s','\1', $str);
}
public static function ellipsis($str, $maxlen)
public static function ellipsis($str, $maxlen, $margin=10)
{
$len = mb_strlen($str);
if ($len > $maxlen) {
return mb_substr($str, 0, $maxlen) . '…';
$hard = mb_substr($str, 0, $maxlen);
$lastspace = mb_strrpos($hard, ' ');
if ($lastspace > $maxlen - $margin) {
$hard = mb_substr($hard, 0, $lastspace);
}
return $hard . '…';
}
return $str;

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

@ -161,18 +161,47 @@
[data-icon]:before { content: attr(data-icon); }
[data-icon]:before,
.fa-check:before,
.fa-bell:before,
.fa-bell-o:before,
.fa-calendar:before,
.fa-check:before,
.fa-clock-o:before,
.fa-cloud-upload:before,
.fa-code-fork:before,
.fa-download:before,
.fa-eye:before,
.fa-eye-slash:before,
.fa-facebook-square:before,
.fa-filter:before,
.fa-flag:before,
.fa-floppy-o:before,
.fa-gavel:before,
.fa-github:before,
.fa-google:before,
.fa-history:before,
.fa-link:before,
.fa-pencil-square-o:before,
.fa-question-circle:before,
.fa-quote-left:before,
.fa-reply:before,
.fa-rss:before,
.fa-search:before,
.fa-share-alt:before,
.fa-sign-in:before,
.fa-sign-out:before,
.fa-sliders:before,
.fa-sort:before,
.fa-sort-asc:before,
.fa-sort-desc:before,
.fa-star:before,
.fa-star-o:before,
.fa-table:before,
.fa-times:before,
.fa-trash:before,
.fa-trash-o:before,
.fa-user-circle-o:before,
.fa-user-plus:before {
.fa-user-plus:before,
.fa-wrench:before {
display: inline-block;
font-family: "fa-dtbl-1";
font-style: normal;
@ -187,18 +216,47 @@
font-smoothing: antialiased;
}
.fa-check:before { content: "\f100"; }
.fa-facebook-square:before { content: "\f101"; }
.fa-floppy-o:before { content: "\f102"; }
.fa-github:before { content: "\f103"; }
.fa-google:before { content: "\f104"; }
.fa-question-circle:before { content: "\f105"; }
.fa-sign-in:before { content: "\f106"; }
.fa-sign-out:before { content: "\f107"; }
.fa-times:before { content: "\f108"; }
.fa-trash-o:before { content: "\f109"; }
.fa-user-circle-o:before { content: "\f10a"; }
.fa-user-plus:before { content: "\f10b"; }
.fa-bell:before { content: "\f100"; }
.fa-bell-o:before { content: "\f101"; }
.fa-calendar:before { content: "\f102"; }
.fa-check:before { content: "\f103"; }
.fa-clock-o:before { content: "\f104"; }
.fa-cloud-upload:before { content: "\f105"; }
.fa-code-fork:before { content: "\f106"; }
.fa-download:before { content: "\f107"; }
.fa-eye:before { content: "\f108"; }
.fa-eye-slash:before { content: "\f109"; }
.fa-facebook-square:before { content: "\f10a"; }
.fa-filter:before { content: "\f10b"; }
.fa-flag:before { content: "\f10c"; }
.fa-floppy-o:before { content: "\f10d"; }
.fa-gavel:before { content: "\f10e"; }
.fa-github:before { content: "\f10f"; }
.fa-google:before { content: "\f110"; }
.fa-history:before { content: "\f111"; }
.fa-link:before { content: "\f112"; }
.fa-pencil-square-o:before { content: "\f113"; }
.fa-question-circle:before { content: "\f114"; }
.fa-quote-left:before { content: "\f115"; }
.fa-reply:before { content: "\f116"; }
.fa-rss:before { content: "\f117"; }
.fa-search:before { content: "\f118"; }
.fa-share-alt:before { content: "\f119"; }
.fa-sign-in:before { content: "\f11a"; }
.fa-sign-out:before { content: "\f11b"; }
.fa-sliders:before { content: "\f11c"; }
.fa-sort:before { content: "\f11d"; }
.fa-sort-asc:before { content: "\f11e"; }
.fa-sort-desc:before { content: "\f11f"; }
.fa-star:before { content: "\f120"; }
.fa-star-o:before { content: "\f121"; }
.fa-table:before { content: "\f122"; }
.fa-times:before { content: "\f123"; }
.fa-trash:before { content: "\f124"; }
.fa-trash-o:before { content: "\f125"; }
.fa-user-circle-o:before { content: "\f126"; }
.fa-user-plus:before { content: "\f127"; }
.fa-wrench:before { content: "\f128"; }
</style>
<!--[if lte IE 8]><script src="http://html5shiv.googlecode.com/svn/trunk/html5.js"></script><![endif]-->
@ -214,11 +272,50 @@
<body class="characters-off">
<div id="page" class="container">
<header>
<h1>fa-dtbl-1 contains 12 glyphs:</h1>
<h1>fa-dtbl-1 contains 41 glyphs:</h1>
<a onclick="toggleCharacters(); return false;" href="#">Toggle Preview Characters</a>
</header>
<div class="glyph">
<div class="preview-glyphs">
<span class="step size-12"><span class="letters">Pp</span><i id="fa-bell" class="fa-bell"></i></span><span class="step size-14"><span class="letters">Pp</span><i id="fa-bell" class="fa-bell"></i></span><span class="step size-16"><span class="letters">Pp</span><i id="fa-bell" class="fa-bell"></i></span><span class="step size-18"><span class="letters">Pp</span><i id="fa-bell" class="fa-bell"></i></span><span class="step size-21"><span class="letters">Pp</span><i id="fa-bell" class="fa-bell"></i></span><span class="step size-24"><span class="letters">Pp</span><i id="fa-bell" class="fa-bell"></i></span><span class="step size-36"><span class="letters">Pp</span><i id="fa-bell" class="fa-bell"></i></span><span class="step size-48"><span class="letters">Pp</span><i id="fa-bell" class="fa-bell"></i></span><span class="step size-60"><span class="letters">Pp</span><i id="fa-bell" class="fa-bell"></i></span><span class="step size-72"><span class="letters">Pp</span><i id="fa-bell" class="fa-bell"></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-bell" />
<input class="point" type="text" readonly="readonly" onClick="this.select();" value="&amp;#xf100;" />
</div>
</div>
<div class="glyph">
<div class="preview-glyphs">
<span class="step size-12"><span class="letters">Pp</span><i id="fa-bell-o" class="fa-bell-o"></i></span><span class="step size-14"><span class="letters">Pp</span><i id="fa-bell-o" class="fa-bell-o"></i></span><span class="step size-16"><span class="letters">Pp</span><i id="fa-bell-o" class="fa-bell-o"></i></span><span class="step size-18"><span class="letters">Pp</span><i id="fa-bell-o" class="fa-bell-o"></i></span><span class="step size-21"><span class="letters">Pp</span><i id="fa-bell-o" class="fa-bell-o"></i></span><span class="step size-24"><span class="letters">Pp</span><i id="fa-bell-o" class="fa-bell-o"></i></span><span class="step size-36"><span class="letters">Pp</span><i id="fa-bell-o" class="fa-bell-o"></i></span><span class="step size-48"><span class="letters">Pp</span><i id="fa-bell-o" class="fa-bell-o"></i></span><span class="step size-60"><span class="letters">Pp</span><i id="fa-bell-o" class="fa-bell-o"></i></span><span class="step size-72"><span class="letters">Pp</span><i id="fa-bell-o" class="fa-bell-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-bell-o" />
<input class="point" type="text" readonly="readonly" onClick="this.select();" value="&amp;#xf101;" />
</div>
</div>
<div class="glyph">
<div class="preview-glyphs">
<span class="step size-12"><span class="letters">Pp</span><i id="fa-calendar" class="fa-calendar"></i></span><span class="step size-14"><span class="letters">Pp</span><i id="fa-calendar" class="fa-calendar"></i></span><span class="step size-16"><span class="letters">Pp</span><i id="fa-calendar" class="fa-calendar"></i></span><span class="step size-18"><span class="letters">Pp</span><i id="fa-calendar" class="fa-calendar"></i></span><span class="step size-21"><span class="letters">Pp</span><i id="fa-calendar" class="fa-calendar"></i></span><span class="step size-24"><span class="letters">Pp</span><i id="fa-calendar" class="fa-calendar"></i></span><span class="step size-36"><span class="letters">Pp</span><i id="fa-calendar" class="fa-calendar"></i></span><span class="step size-48"><span class="letters">Pp</span><i id="fa-calendar" class="fa-calendar"></i></span><span class="step size-60"><span class="letters">Pp</span><i id="fa-calendar" class="fa-calendar"></i></span><span class="step size-72"><span class="letters">Pp</span><i id="fa-calendar" class="fa-calendar"></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-calendar" />
<input class="point" type="text" readonly="readonly" onClick="this.select();" value="&amp;#xf102;" />
</div>
</div>
<div class="glyph">
<div class="preview-glyphs">
<span class="step size-12"><span class="letters">Pp</span><i id="fa-check" class="fa-check"></i></span><span class="step size-14"><span class="letters">Pp</span><i id="fa-check" class="fa-check"></i></span><span class="step size-16"><span class="letters">Pp</span><i id="fa-check" class="fa-check"></i></span><span class="step size-18"><span class="letters">Pp</span><i id="fa-check" class="fa-check"></i></span><span class="step size-21"><span class="letters">Pp</span><i id="fa-check" class="fa-check"></i></span><span class="step size-24"><span class="letters">Pp</span><i id="fa-check" class="fa-check"></i></span><span class="step size-36"><span class="letters">Pp</span><i id="fa-check" class="fa-check"></i></span><span class="step size-48"><span class="letters">Pp</span><i id="fa-check" class="fa-check"></i></span><span class="step size-60"><span class="letters">Pp</span><i id="fa-check" class="fa-check"></i></span><span class="step size-72"><span class="letters">Pp</span><i id="fa-check" class="fa-check"></i></span>
@ -228,7 +325,85 @@
</div>
<div class="usage">
<input class="class" type="text" readonly="readonly" onClick="this.select();" value=".fa-check" />
<input class="point" type="text" readonly="readonly" onClick="this.select();" value="&amp;#xf100;" />
<input class="point" type="text" readonly="readonly" onClick="this.select();" value="&amp;#xf103;" />
</div>
</div>
<div class="glyph">
<div class="preview-glyphs">
<span class="step size-12"><span class="letters">Pp</span><i id="fa-clock-o" class="fa-clock-o"></i></span><span class="step size-14"><span class="letters">Pp</span><i id="fa-clock-o" class="fa-clock-o"></i></span><span class="step size-16"><span class="letters">Pp</span><i id="fa-clock-o" class="fa-clock-o"></i></span><span class="step size-18"><span class="letters">Pp</span><i id="fa-clock-o" class="fa-clock-o"></i></span><span class="step size-21"><span class="letters">Pp</span><i id="fa-clock-o" class="fa-clock-o"></i></span><span class="step size-24"><span class="letters">Pp</span><i id="fa-clock-o" class="fa-clock-o"></i></span><span class="step size-36"><span class="letters">Pp</span><i id="fa-clock-o" class="fa-clock-o"></i></span><span class="step size-48"><span class="letters">Pp</span><i id="fa-clock-o" class="fa-clock-o"></i></span><span class="step size-60"><span class="letters">Pp</span><i id="fa-clock-o" class="fa-clock-o"></i></span><span class="step size-72"><span class="letters">Pp</span><i id="fa-clock-o" class="fa-clock-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-clock-o" />
<input class="point" type="text" readonly="readonly" onClick="this.select();" value="&amp;#xf104;" />
</div>
</div>
<div class="glyph">
<div class="preview-glyphs">
<span class="step size-12"><span class="letters">Pp</span><i id="fa-cloud-upload" class="fa-cloud-upload"></i></span><span class="step size-14"><span class="letters">Pp</span><i id="fa-cloud-upload" class="fa-cloud-upload"></i></span><span class="step size-16"><span class="letters">Pp</span><i id="fa-cloud-upload" class="fa-cloud-upload"></i></span><span class="step size-18"><span class="letters">Pp</span><i id="fa-cloud-upload" class="fa-cloud-upload"></i></span><span class="step size-21"><span class="letters">Pp</span><i id="fa-cloud-upload" class="fa-cloud-upload"></i></span><span class="step size-24"><span class="letters">Pp</span><i id="fa-cloud-upload" class="fa-cloud-upload"></i></span><span class="step size-36"><span class="letters">Pp</span><i id="fa-cloud-upload" class="fa-cloud-upload"></i></span><span class="step size-48"><span class="letters">Pp</span><i id="fa-cloud-upload" class="fa-cloud-upload"></i></span><span class="step size-60"><span class="letters">Pp</span><i id="fa-cloud-upload" class="fa-cloud-upload"></i></span><span class="step size-72"><span class="letters">Pp</span><i id="fa-cloud-upload" class="fa-cloud-upload"></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-cloud-upload" />
<input class="point" type="text" readonly="readonly" onClick="this.select();" value="&amp;#xf105;" />
</div>
</div>
<div class="glyph">
<div class="preview-glyphs">
<span class="step size-12"><span class="letters">Pp</span><i id="fa-code-fork" class="fa-code-fork"></i></span><span class="step size-14"><span class="letters">Pp</span><i id="fa-code-fork" class="fa-code-fork"></i></span><span class="step size-16"><span class="letters">Pp</span><i id="fa-code-fork" class="fa-code-fork"></i></span><span class="step size-18"><span class="letters">Pp</span><i id="fa-code-fork" class="fa-code-fork"></i></span><span class="step size-21"><span class="letters">Pp</span><i id="fa-code-fork" class="fa-code-fork"></i></span><span class="step size-24"><span class="letters">Pp</span><i id="fa-code-fork" class="fa-code-fork"></i></span><span class="step size-36"><span class="letters">Pp</span><i id="fa-code-fork" class="fa-code-fork"></i></span><span class="step size-48"><span class="letters">Pp</span><i id="fa-code-fork" class="fa-code-fork"></i></span><span class="step size-60"><span class="letters">Pp</span><i id="fa-code-fork" class="fa-code-fork"></i></span><span class="step size-72"><span class="letters">Pp</span><i id="fa-code-fork" class="fa-code-fork"></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-code-fork" />
<input class="point" type="text" readonly="readonly" onClick="this.select();" value="&amp;#xf106;" />
</div>
</div>
<div class="glyph">
<div class="preview-glyphs">
<span class="step size-12"><span class="letters">Pp</span><i id="fa-download" class="fa-download"></i></span><span class="step size-14"><span class="letters">Pp</span><i id="fa-download" class="fa-download"></i></span><span class="step size-16"><span class="letters">Pp</span><i id="fa-download" class="fa-download"></i></span><span class="step size-18"><span class="letters">Pp</span><i id="fa-download" class="fa-download"></i></span><span class="step size-21"><span class="letters">Pp</span><i id="fa-download" class="fa-download"></i></span><span class="step size-24"><span class="letters">Pp</span><i id="fa-download" class="fa-download"></i></span><span class="step size-36"><span class="letters">Pp</span><i id="fa-download" class="fa-download"></i></span><span class="step size-48"><span class="letters">Pp</span><i id="fa-download" class="fa-download"></i></span><span class="step size-60"><span class="letters">Pp</span><i id="fa-download" class="fa-download"></i></span><span class="step size-72"><span class="letters">Pp</span><i id="fa-download" class="fa-download"></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-download" />
<input class="point" type="text" readonly="readonly" onClick="this.select();" value="&amp;#xf107;" />
</div>
</div>
<div class="glyph">
<div class="preview-glyphs">
<span class="step size-12"><span class="letters">Pp</span><i id="fa-eye" class="fa-eye"></i></span><span class="step size-14"><span class="letters">Pp</span><i id="fa-eye" class="fa-eye"></i></span><span class="step size-16"><span class="letters">Pp</span><i id="fa-eye" class="fa-eye"></i></span><span class="step size-18"><span class="letters">Pp</span><i id="fa-eye" class="fa-eye"></i></span><span class="step size-21"><span class="letters">Pp</span><i id="fa-eye" class="fa-eye"></i></span><span class="step size-24"><span class="letters">Pp</span><i id="fa-eye" class="fa-eye"></i></span><span class="step size-36"><span class="letters">Pp</span><i id="fa-eye" class="fa-eye"></i></span><span class="step size-48"><span class="letters">Pp</span><i id="fa-eye" class="fa-eye"></i></span><span class="step size-60"><span class="letters">Pp</span><i id="fa-eye" class="fa-eye"></i></span><span class="step size-72"><span class="letters">Pp</span><i id="fa-eye" class="fa-eye"></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-eye" />
<input class="point" type="text" readonly="readonly" onClick="this.select();" value="&amp;#xf108;" />
</div>
</div>
<div class="glyph">
<div class="preview-glyphs">
<span class="step size-12"><span class="letters">Pp</span><i id="fa-eye-slash" class="fa-eye-slash"></i></span><span class="step size-14"><span class="letters">Pp</span><i id="fa-eye-slash" class="fa-eye-slash"></i></span><span class="step size-16"><span class="letters">Pp</span><i id="fa-eye-slash" class="fa-eye-slash"></i></span><span class="step size-18"><span class="letters">Pp</span><i id="fa-eye-slash" class="fa-eye-slash"></i></span><span class="step size-21"><span class="letters">Pp</span><i id="fa-eye-slash" class="fa-eye-slash"></i></span><span class="step size-24"><span class="letters">Pp</span><i id="fa-eye-slash" class="fa-eye-slash"></i></span><span class="step size-36"><span class="letters">Pp</span><i id="fa-eye-slash" class="fa-eye-slash"></i></span><span class="step size-48"><span class="letters">Pp</span><i id="fa-eye-slash" class="fa-eye-slash"></i></span><span class="step size-60"><span class="letters">Pp</span><i id="fa-eye-slash" class="fa-eye-slash"></i></span><span class="step size-72"><span class="letters">Pp</span><i id="fa-eye-slash" class="fa-eye-slash"></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-eye-slash" />
<input class="point" type="text" readonly="readonly" onClick="this.select();" value="&amp;#xf109;" />
</div>
</div>
@ -241,7 +416,33 @@
</div>
<div class="usage">
<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;#xf101;" />
<input class="point" type="text" readonly="readonly" onClick="this.select();" value="&amp;#xf10a;" />
</div>
</div>
<div class="glyph">
<div class="preview-glyphs">
<span class="step size-12"><span class="letters">Pp</span><i id="fa-filter" class="fa-filter"></i></span><span class="step size-14"><span class="letters">Pp</span><i id="fa-filter" class="fa-filter"></i></span><span class="step size-16"><span class="letters">Pp</span><i id="fa-filter" class="fa-filter"></i></span><span class="step size-18"><span class="letters">Pp</span><i id="fa-filter" class="fa-filter"></i></span><span class="step size-21"><span class="letters">Pp</span><i id="fa-filter" class="fa-filter"></i></span><span class="step size-24"><span class="letters">Pp</span><i id="fa-filter" class="fa-filter"></i></span><span class="step size-36"><span class="letters">Pp</span><i id="fa-filter" class="fa-filter"></i></span><span class="step size-48"><span class="letters">Pp</span><i id="fa-filter" class="fa-filter"></i></span><span class="step size-60"><span class="letters">Pp</span><i id="fa-filter" class="fa-filter"></i></span><span class="step size-72"><span class="letters">Pp</span><i id="fa-filter" class="fa-filter"></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-filter" />
<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-flag" class="fa-flag"></i></span><span class="step size-14"><span class="letters">Pp</span><i id="fa-flag" class="fa-flag"></i></span><span class="step size-16"><span class="letters">Pp</span><i id="fa-flag" class="fa-flag"></i></span><span class="step size-18"><span class="letters">Pp</span><i id="fa-flag" class="fa-flag"></i></span><span class="step size-21"><span class="letters">Pp</span><i id="fa-flag" class="fa-flag"></i></span><span class="step size-24"><span class="letters">Pp</span><i id="fa-flag" class="fa-flag"></i></span><span class="step size-36"><span class="letters">Pp</span><i id="fa-flag" class="fa-flag"></i></span><span class="step size-48"><span class="letters">Pp</span><i id="fa-flag" class="fa-flag"></i></span><span class="step size-60"><span class="letters">Pp</span><i id="fa-flag" class="fa-flag"></i></span><span class="step size-72"><span class="letters">Pp</span><i id="fa-flag" class="fa-flag"></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-flag" />
<input class="point" type="text" readonly="readonly" onClick="this.select();" value="&amp;#xf10c;" />
</div>
</div>
@ -255,7 +456,21 @@
<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-save" />
<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;#xf10d;" />
</div>
</div>
<div class="glyph">
<div class="preview-glyphs">
<span class="step size-12"><span class="letters">Pp</span><i id="fa-gavel" class="fa-gavel"></i></span><span class="step size-14"><span class="letters">Pp</span><i id="fa-gavel" class="fa-gavel"></i></span><span class="step size-16"><span class="letters">Pp</span><i id="fa-gavel" class="fa-gavel"></i></span><span class="step size-18"><span class="letters">Pp</span><i id="fa-gavel" class="fa-gavel"></i></span><span class="step size-21"><span class="letters">Pp</span><i id="fa-gavel" class="fa-gavel"></i></span><span class="step size-24"><span class="letters">Pp</span><i id="fa-gavel" class="fa-gavel"></i></span><span class="step size-36"><span class="letters">Pp</span><i id="fa-gavel" class="fa-gavel"></i></span><span class="step size-48"><span class="letters">Pp</span><i id="fa-gavel" class="fa-gavel"></i></span><span class="step size-60"><span class="letters">Pp</span><i id="fa-gavel" class="fa-gavel"></i></span><span class="step size-72"><span class="letters">Pp</span><i id="fa-gavel" class="fa-gavel"></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-gavel" />
<input class="class" type="text" readonly="readonly" onClick="this.select();" value=".fa-legal" />
<input class="point" type="text" readonly="readonly" onClick="this.select();" value="&amp;#xf10e;" />
</div>
</div>
@ -268,7 +483,7 @@
</div>
<div class="usage">
<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;#xf103;" />
<input class="point" type="text" readonly="readonly" onClick="this.select();" value="&amp;#xf10f;" />
</div>
</div>
@ -281,7 +496,47 @@
</div>
<div class="usage">
<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;#xf104;" />
<input class="point" type="text" readonly="readonly" onClick="this.select();" value="&amp;#xf110;" />
</div>
</div>
<div class="glyph">
<div class="preview-glyphs">
<span class="step size-12"><span class="letters">Pp</span><i id="fa-history" class="fa-history"></i></span><span class="step size-14"><span class="letters">Pp</span><i id="fa-history" class="fa-history"></i></span><span class="step size-16"><span class="letters">Pp</span><i id="fa-history" class="fa-history"></i></span><span class="step size-18"><span class="letters">Pp</span><i id="fa-history" class="fa-history"></i></span><span class="step size-21"><span class="letters">Pp</span><i id="fa-history" class="fa-history"></i></span><span class="step size-24"><span class="letters">Pp</span><i id="fa-history" class="fa-history"></i></span><span class="step size-36"><span class="letters">Pp</span><i id="fa-history" class="fa-history"></i></span><span class="step size-48"><span class="letters">Pp</span><i id="fa-history" class="fa-history"></i></span><span class="step size-60"><span class="letters">Pp</span><i id="fa-history" class="fa-history"></i></span><span class="step size-72"><span class="letters">Pp</span><i id="fa-history" class="fa-history"></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-history" />
<input class="point" type="text" readonly="readonly" onClick="this.select();" value="&amp;#xf111;" />
</div>
</div>
<div class="glyph">
<div class="preview-glyphs">
<span class="step size-12"><span class="letters">Pp</span><i id="fa-link" class="fa-link"></i></span><span class="step size-14"><span class="letters">Pp</span><i id="fa-link" class="fa-link"></i></span><span class="step size-16"><span class="letters">Pp</span><i id="fa-link" class="fa-link"></i></span><span class="step size-18"><span class="letters">Pp</span><i id="fa-link" class="fa-link"></i></span><span class="step size-21"><span class="letters">Pp</span><i id="fa-link" class="fa-link"></i></span><span class="step size-24"><span class="letters">Pp</span><i id="fa-link" class="fa-link"></i></span><span class="step size-36"><span class="letters">Pp</span><i id="fa-link" class="fa-link"></i></span><span class="step size-48"><span class="letters">Pp</span><i id="fa-link" class="fa-link"></i></span><span class="step size-60"><span class="letters">Pp</span><i id="fa-link" class="fa-link"></i></span><span class="step size-72"><span class="letters">Pp</span><i id="fa-link" class="fa-link"></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-link" />
<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-pencil-square-o" class="fa-pencil-square-o"></i></span><span class="step size-14"><span class="letters">Pp</span><i id="fa-pencil-square-o" class="fa-pencil-square-o"></i></span><span class="step size-16"><span class="letters">Pp</span><i id="fa-pencil-square-o" class="fa-pencil-square-o"></i></span><span class="step size-18"><span class="letters">Pp</span><i id="fa-pencil-square-o" class="fa-pencil-square-o"></i></span><span class="step size-21"><span class="letters">Pp</span><i id="fa-pencil-square-o" class="fa-pencil-square-o"></i></span><span class="step size-24"><span class="letters">Pp</span><i id="fa-pencil-square-o" class="fa-pencil-square-o"></i></span><span class="step size-36"><span class="letters">Pp</span><i id="fa-pencil-square-o" class="fa-pencil-square-o"></i></span><span class="step size-48"><span class="letters">Pp</span><i id="fa-pencil-square-o" class="fa-pencil-square-o"></i></span><span class="step size-60"><span class="letters">Pp</span><i id="fa-pencil-square-o" class="fa-pencil-square-o"></i></span><span class="step size-72"><span class="letters">Pp</span><i id="fa-pencil-square-o" class="fa-pencil-square-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-pencil-square-o" />
<input class="class" type="text" readonly="readonly" onClick="this.select();" value=".fa-edit" />
<input class="point" type="text" readonly="readonly" onClick="this.select();" value="&amp;#xf113;" />
</div>
</div>
@ -294,7 +549,72 @@
</div>
<div class="usage">
<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;#xf105;" />
<input class="point" type="text" readonly="readonly" onClick="this.select();" value="&amp;#xf114;" />
</div>
</div>
<div class="glyph">
<div class="preview-glyphs">
<span class="step size-12"><span class="letters">Pp</span><i id="fa-quote-left" class="fa-quote-left"></i></span><span class="step size-14"><span class="letters">Pp</span><i id="fa-quote-left" class="fa-quote-left"></i></span><span class="step size-16"><span class="letters">Pp</span><i id="fa-quote-left" class="fa-quote-left"></i></span><span class="step size-18"><span class="letters">Pp</span><i id="fa-quote-left" class="fa-quote-left"></i></span><span class="step size-21"><span class="letters">Pp</span><i id="fa-quote-left" class="fa-quote-left"></i></span><span class="step size-24"><span class="letters">Pp</span><i id="fa-quote-left" class="fa-quote-left"></i></span><span class="step size-36"><span class="letters">Pp</span><i id="fa-quote-left" class="fa-quote-left"></i></span><span class="step size-48"><span class="letters">Pp</span><i id="fa-quote-left" class="fa-quote-left"></i></span><span class="step size-60"><span class="letters">Pp</span><i id="fa-quote-left" class="fa-quote-left"></i></span><span class="step size-72"><span class="letters">Pp</span><i id="fa-quote-left" class="fa-quote-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-quote-left" />
<input class="point" type="text" readonly="readonly" onClick="this.select();" value="&amp;#xf115;" />
</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;#xf116;" />
</div>
</div>
<div class="glyph">
<div class="preview-glyphs">
<span class="step size-12"><span class="letters">Pp</span><i id="fa-rss" class="fa-rss"></i></span><span class="step size-14"><span class="letters">Pp</span><i id="fa-rss" class="fa-rss"></i></span><span class="step size-16"><span class="letters">Pp</span><i id="fa-rss" class="fa-rss"></i></span><span class="step size-18"><span class="letters">Pp</span><i id="fa-rss" class="fa-rss"></i></span><span class="step size-21"><span class="letters">Pp</span><i id="fa-rss" class="fa-rss"></i></span><span class="step size-24"><span class="letters">Pp</span><i id="fa-rss" class="fa-rss"></i></span><span class="step size-36"><span class="letters">Pp</span><i id="fa-rss" class="fa-rss"></i></span><span class="step size-48"><span class="letters">Pp</span><i id="fa-rss" class="fa-rss"></i></span><span class="step size-60"><span class="letters">Pp</span><i id="fa-rss" class="fa-rss"></i></span><span class="step size-72"><span class="letters">Pp</span><i id="fa-rss" class="fa-rss"></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-rss" />
<input class="point" type="text" readonly="readonly" onClick="this.select();" value="&amp;#xf117;" />
</div>
</div>
<div class="glyph">
<div class="preview-glyphs">
<span class="step size-12"><span class="letters">Pp</span><i id="fa-search" class="fa-search"></i></span><span class="step size-14"><span class="letters">Pp</span><i id="fa-search" class="fa-search"></i></span><span class="step size-16"><span class="letters">Pp</span><i id="fa-search" class="fa-search"></i></span><span class="step size-18"><span class="letters">Pp</span><i id="fa-search" class="fa-search"></i></span><span class="step size-21"><span class="letters">Pp</span><i id="fa-search" class="fa-search"></i></span><span class="step size-24"><span class="letters">Pp</span><i id="fa-search" class="fa-search"></i></span><span class="step size-36"><span class="letters">Pp</span><i id="fa-search" class="fa-search"></i></span><span class="step size-48"><span class="letters">Pp</span><i id="fa-search" class="fa-search"></i></span><span class="step size-60"><span class="letters">Pp</span><i id="fa-search" class="fa-search"></i></span><span class="step size-72"><span class="letters">Pp</span><i id="fa-search" class="fa-search"></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-search" />
<input class="point" type="text" readonly="readonly" onClick="this.select();" value="&amp;#xf118;" />
</div>
</div>
<div class="glyph">
<div class="preview-glyphs">
<span class="step size-12"><span class="letters">Pp</span><i id="fa-share-alt" class="fa-share-alt"></i></span><span class="step size-14"><span class="letters">Pp</span><i id="fa-share-alt" class="fa-share-alt"></i></span><span class="step size-16"><span class="letters">Pp</span><i id="fa-share-alt" class="fa-share-alt"></i></span><span class="step size-18"><span class="letters">Pp</span><i id="fa-share-alt" class="fa-share-alt"></i></span><span class="step size-21"><span class="letters">Pp</span><i id="fa-share-alt" class="fa-share-alt"></i></span><span class="step size-24"><span class="letters">Pp</span><i id="fa-share-alt" class="fa-share-alt"></i></span><span class="step size-36"><span class="letters">Pp</span><i id="fa-share-alt" class="fa-share-alt"></i></span><span class="step size-48"><span class="letters">Pp</span><i id="fa-share-alt" class="fa-share-alt"></i></span><span class="step size-60"><span class="letters">Pp</span><i id="fa-share-alt" class="fa-share-alt"></i></span><span class="step size-72"><span class="letters">Pp</span><i id="fa-share-alt" class="fa-share-alt"></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-share-alt" />
<input class="point" type="text" readonly="readonly" onClick="this.select();" value="&amp;#xf119;" />
</div>
</div>
@ -307,7 +627,7 @@
</div>
<div class="usage">
<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;#xf106;" />
<input class="point" type="text" readonly="readonly" onClick="this.select();" value="&amp;#xf11a;" />
</div>
</div>
@ -320,7 +640,98 @@
</div>
<div class="usage">
<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;#xf107;" />
<input class="point" type="text" readonly="readonly" onClick="this.select();" value="&amp;#xf11b;" />
</div>
</div>
<div class="glyph">
<div class="preview-glyphs">
<span class="step size-12"><span class="letters">Pp</span><i id="fa-sliders" class="fa-sliders"></i></span><span class="step size-14"><span class="letters">Pp</span><i id="fa-sliders" class="fa-sliders"></i></span><span class="step size-16"><span class="letters">Pp</span><i id="fa-sliders" class="fa-sliders"></i></span><span class="step size-18"><span class="letters">Pp</span><i id="fa-sliders" class="fa-sliders"></i></span><span class="step size-21"><span class="letters">Pp</span><i id="fa-sliders" class="fa-sliders"></i></span><span class="step size-24"><span class="letters">Pp</span><i id="fa-sliders" class="fa-sliders"></i></span><span class="step size-36"><span class="letters">Pp</span><i id="fa-sliders" class="fa-sliders"></i></span><span class="step size-48"><span class="letters">Pp</span><i id="fa-sliders" class="fa-sliders"></i></span><span class="step size-60"><span class="letters">Pp</span><i id="fa-sliders" class="fa-sliders"></i></span><span class="step size-72"><span class="letters">Pp</span><i id="fa-sliders" class="fa-sliders"></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-sliders" />
<input class="point" type="text" readonly="readonly" onClick="this.select();" value="&amp;#xf11c;" />
</div>
</div>
<div class="glyph">
<div class="preview-glyphs">
<span class="step size-12"><span class="letters">Pp</span><i id="fa-sort" class="fa-sort"></i></span><span class="step size-14"><span class="letters">Pp</span><i id="fa-sort" class="fa-sort"></i></span><span class="step size-16"><span class="letters">Pp</span><i id="fa-sort" class="fa-sort"></i></span><span class="step size-18"><span class="letters">Pp</span><i id="fa-sort" class="fa-sort"></i></span><span class="step size-21"><span class="letters">Pp</span><i id="fa-sort" class="fa-sort"></i></span><span class="step size-24"><span class="letters">Pp</span><i id="fa-sort" class="fa-sort"></i></span><span class="step size-36"><span class="letters">Pp</span><i id="fa-sort" class="fa-sort"></i></span><span class="step size-48"><span class="letters">Pp</span><i id="fa-sort" class="fa-sort"></i></span><span class="step size-60"><span class="letters">Pp</span><i id="fa-sort" class="fa-sort"></i></span><span class="step size-72"><span class="letters">Pp</span><i id="fa-sort" class="fa-sort"></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-sort" />
<input class="point" type="text" readonly="readonly" onClick="this.select();" value="&amp;#xf11d;" />
</div>
</div>
<div class="glyph">
<div class="preview-glyphs">
<span class="step size-12"><span class="letters">Pp</span><i id="fa-sort-asc" class="fa-sort-asc"></i></span><span class="step size-14"><span class="letters">Pp</span><i id="fa-sort-asc" class="fa-sort-asc"></i></span><span class="step size-16"><span class="letters">Pp</span><i id="fa-sort-asc" class="fa-sort-asc"></i></span><span class="step size-18"><span class="letters">Pp</span><i id="fa-sort-asc" class="fa-sort-asc"></i></span><span class="step size-21"><span class="letters">Pp</span><i id="fa-sort-asc" class="fa-sort-asc"></i></span><span class="step size-24"><span class="letters">Pp</span><i id="fa-sort-asc" class="fa-sort-asc"></i></span><span class="step size-36"><span class="letters">Pp</span><i id="fa-sort-asc" class="fa-sort-asc"></i></span><span class="step size-48"><span class="letters">Pp</span><i id="fa-sort-asc" class="fa-sort-asc"></i></span><span class="step size-60"><span class="letters">Pp</span><i id="fa-sort-asc" class="fa-sort-asc"></i></span><span class="step size-72"><span class="letters">Pp</span><i id="fa-sort-asc" class="fa-sort-asc"></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-sort-asc" />
<input class="point" type="text" readonly="readonly" onClick="this.select();" value="&amp;#xf11e;" />
</div>
</div>
<div class="glyph">
<div class="preview-glyphs">
<span class="step size-12"><span class="letters">Pp</span><i id="fa-sort-desc" class="fa-sort-desc"></i></span><span class="step size-14"><span class="letters">Pp</span><i id="fa-sort-desc" class="fa-sort-desc"></i></span><span class="step size-16"><span class="letters">Pp</span><i id="fa-sort-desc" class="fa-sort-desc"></i></span><span class="step size-18"><span class="letters">Pp</span><i id="fa-sort-desc" class="fa-sort-desc"></i></span><span class="step size-21"><span class="letters">Pp</span><i id="fa-sort-desc" class="fa-sort-desc"></i></span><span class="step size-24"><span class="letters">Pp</span><i id="fa-sort-desc" class="fa-sort-desc"></i></span><span class="step size-36"><span class="letters">Pp</span><i id="fa-sort-desc" class="fa-sort-desc"></i></span><span class="step size-48"><span class="letters">Pp</span><i id="fa-sort-desc" class="fa-sort-desc"></i></span><span class="step size-60"><span class="letters">Pp</span><i id="fa-sort-desc" class="fa-sort-desc"></i></span><span class="step size-72"><span class="letters">Pp</span><i id="fa-sort-desc" class="fa-sort-desc"></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-sort-desc" />
<input class="point" type="text" readonly="readonly" onClick="this.select();" value="&amp;#xf11f;" />
</div>
</div>
<div class="glyph">
<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>
</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-star" />
<input class="point" type="text" readonly="readonly" onClick="this.select();" value="&amp;#xf120;" />
</div>
</div>
<div class="glyph">
<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>
</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-star-o" />
<input class="point" type="text" readonly="readonly" onClick="this.select();" value="&amp;#xf121;" />
</div>
</div>
<div class="glyph">
<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>
</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-table" />
<input class="point" type="text" readonly="readonly" onClick="this.select();" value="&amp;#xf122;" />
</div>
</div>
@ -334,7 +745,20 @@
<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-close" />
<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;#xf123;" />
</div>
</div>
<div class="glyph">
<div class="preview-glyphs">
<span class="step size-12"><span class="letters">Pp</span><i id="fa-trash" class="fa-trash"></i></span><span class="step size-14"><span class="letters">Pp</span><i id="fa-trash" class="fa-trash"></i></span><span class="step size-16"><span class="letters">Pp</span><i id="fa-trash" class="fa-trash"></i></span><span class="step size-18"><span class="letters">Pp</span><i id="fa-trash" class="fa-trash"></i></span><span class="step size-21"><span class="letters">Pp</span><i id="fa-trash" class="fa-trash"></i></span><span class="step size-24"><span class="letters">Pp</span><i id="fa-trash" class="fa-trash"></i></span><span class="step size-36"><span class="letters">Pp</span><i id="fa-trash" class="fa-trash"></i></span><span class="step size-48"><span class="letters">Pp</span><i id="fa-trash" class="fa-trash"></i></span><span class="step size-60"><span class="letters">Pp</span><i id="fa-trash" class="fa-trash"></i></span><span class="step size-72"><span class="letters">Pp</span><i id="fa-trash" class="fa-trash"></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-trash" />
<input class="point" type="text" readonly="readonly" onClick="this.select();" value="&amp;#xf124;" />
</div>
</div>
@ -347,7 +771,7 @@
</div>
<div class="usage">
<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;#xf109;" />
<input class="point" type="text" readonly="readonly" onClick="this.select();" value="&amp;#xf125;" />
</div>
</div>
@ -360,7 +784,7 @@
</div>
<div class="usage">
<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;#xf10a;" />
<input class="point" type="text" readonly="readonly" onClick="this.select();" value="&amp;#xf126;" />
</div>
</div>
@ -373,7 +797,20 @@
</div>
<div class="usage">
<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;#xf10b;" />
<input class="point" type="text" readonly="readonly" onClick="this.select();" value="&amp;#xf127;" />
</div>
</div>
<div class="glyph">
<div class="preview-glyphs">
<span class="step size-12"><span class="letters">Pp</span><i id="fa-wrench" class="fa-wrench"></i></span><span class="step size-14"><span class="letters">Pp</span><i id="fa-wrench" class="fa-wrench"></i></span><span class="step size-16"><span class="letters">Pp</span><i id="fa-wrench" class="fa-wrench"></i></span><span class="step size-18"><span class="letters">Pp</span><i id="fa-wrench" class="fa-wrench"></i></span><span class="step size-21"><span class="letters">Pp</span><i id="fa-wrench" class="fa-wrench"></i></span><span class="step size-24"><span class="letters">Pp</span><i id="fa-wrench" class="fa-wrench"></i></span><span class="step size-36"><span class="letters">Pp</span><i id="fa-wrench" class="fa-wrench"></i></span><span class="step size-48"><span class="letters">Pp</span><i id="fa-wrench" class="fa-wrench"></i></span><span class="step size-60"><span class="letters">Pp</span><i id="fa-wrench" class="fa-wrench"></i></span><span class="step size-72"><span class="letters">Pp</span><i id="fa-wrench" class="fa-wrench"></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-wrench" />
<input class="point" type="text" readonly="readonly" onClick="this.select();" value="&amp;#xf128;" />
</div>
</div>

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

@ -38,15 +38,44 @@
font-smoothing: antialiased;
}
.fa-check::before { content: "\f100"; }
.fa-facebook-square::before { content: "\f101"; }
.fa-floppy-o::before, .fa-save::before { content: "\f102"; }
.fa-github::before { content: "\f103"; }
.fa-google::before { content: "\f104"; }
.fa-question-circle::before { content: "\f105"; }
.fa-sign-in::before { content: "\f106"; }
.fa-sign-out::before { content: "\f107"; }
.fa-times::before, .fa-close::before { content: "\f108"; }
.fa-trash-o::before { content: "\f109"; }
.fa-user-circle-o::before { content: "\f10a"; }
.fa-user-plus::before { content: "\f10b"; }
.fa-bell::before { content: "\f100"; }
.fa-bell-o::before { content: "\f101"; }
.fa-calendar::before { content: "\f102"; }
.fa-check::before { content: "\f103"; }
.fa-clock-o::before { content: "\f104"; }
.fa-cloud-upload::before { content: "\f105"; }
.fa-code-fork::before { content: "\f106"; }
.fa-download::before { content: "\f107"; }
.fa-eye::before { content: "\f108"; }
.fa-eye-slash::before { content: "\f109"; }
.fa-facebook-square::before { content: "\f10a"; }
.fa-filter::before { content: "\f10b"; }
.fa-flag::before { content: "\f10c"; }
.fa-floppy-o::before, .fa-save::before { content: "\f10d"; }
.fa-gavel::before, .fa-legal::before { content: "\f10e"; }
.fa-github::before { content: "\f10f"; }
.fa-google::before { content: "\f110"; }
.fa-history::before { content: "\f111"; }
.fa-link::before { content: "\f112"; }
.fa-pencil-square-o::before, .fa-edit::before { content: "\f113"; }
.fa-question-circle::before { content: "\f114"; }
.fa-quote-left::before { content: "\f115"; }
.fa-reply::before { content: "\f116"; }
.fa-rss::before { content: "\f117"; }
.fa-search::before { content: "\f118"; }
.fa-share-alt::before { content: "\f119"; }
.fa-sign-in::before { content: "\f11a"; }
.fa-sign-out::before { content: "\f11b"; }
.fa-sliders::before { content: "\f11c"; }
.fa-sort::before { content: "\f11d"; }
.fa-sort-asc::before { content: "\f11e"; }
.fa-sort-desc::before { content: "\f11f"; }
.fa-star::before { content: "\f120"; }
.fa-star-o::before { content: "\f121"; }
.fa-table::before { content: "\f122"; }
.fa-times::before, .fa-close::before { content: "\f123"; }
.fa-trash::before { content: "\f124"; }
.fa-trash-o::before { content: "\f125"; }
.fa-user-circle-o::before { content: "\f126"; }
.fa-user-plus::before { content: "\f127"; }
.fa-wrench::before { content: "\f128"; }

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

Binary file not shown.

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

@ -1,11 +1,11 @@
<?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" >
<!--
2018-7-21: Created with FontForge (http://fontforge.org)
2018-7-22: 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">
<metadata>
Created by FontForge 20170805 at Sat Jul 21 17:17:47 2018
Created by FontForge 20170805 at Sun Jul 22 15:14:07 2018
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
</metadata>
@ -19,54 +19,155 @@ The Fork Awesome font is licensed under the SIL OFL 1.1 (http://scripts.sil.org/
panose-1="2 0 5 3 0 0 0 0 0 0"
ascent="1536"
descent="-256"
bbox="0 -256 2048 1536"
bbox="-0.0376684 -256 2048 1536"
underline-thickness="89.6"
underline-position="-179.2"
unicode-range="U+0020-F10B"
unicode-range="U+0020-F128"
/>
<missing-glyph />
<glyph glyph-name="space" unicode=" " horiz-adv-x="200"
/>
<glyph glyph-name="check" unicode="&#xf100;" horiz-adv-x="1550"
<glyph glyph-name="bell" unicode="&#xf100;" horiz-adv-x="1664"
d="M848 -160c0 9 -7 16 -16 16c-79 0 -144 65 -144 144c0 9 -7 16 -16 16s-16 -7 -16 -16c0 -97 79 -176 176 -176c9 0 16 7 16 16zM182 128h1300c-179 202 -266 476 -266 832c0 129 -122 320 -384 320s-384 -191 -384 -320c0 -356 -87 -630 -266 -832zM1664 128
c0 -70 -58 -128 -128 -128h-448c0 -141 -115 -256 -256 -256s-256 115 -256 256h-448c-70 0 -128 58 -128 128c148 125 320 349 320 832c0 192 159 402 424 441c-5 12 -8 25 -8 39c0 53 43 96 96 96s96 -43 96 -96c0 -14 -3 -27 -8 -39c265 -39 424 -249 424 -441
c0 -483 172 -707 320 -832z" />
<glyph glyph-name="bell-o" unicode="&#xf101;" horiz-adv-x="1664"
d="M848 -160c0 9 -7 16 -16 16c-79 0 -144 65 -144 144c0 9 -7 16 -16 16s-16 -7 -16 -16c0 -97 79 -176 176 -176c9 0 16 7 16 16zM1664 128c0 -70 -58 -128 -128 -128h-448c0 -141 -115 -256 -256 -256s-256 115 -256 256h-448c-70 0 -128 58 -128 128
c148 125 320 349 320 832c0 192 159 402 424 441c-5 12 -8 25 -8 39c0 53 43 96 96 96s96 -43 96 -96c0 -14 -3 -27 -8 -39c265 -39 424 -249 424 -441c0 -483 172 -707 320 -832z" />
<glyph glyph-name="calendar" unicode="&#xf102;" horiz-adv-x="1664"
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
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
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
c70 0 128 -58 128 -128z" />
<glyph glyph-name="check" unicode="&#xf103;" horiz-adv-x="1550"
d="M1550 970c0 -25 -10 -50 -28 -68l-724 -724l-136 -136c-18 -18 -43 -28 -68 -28s-50 10 -68 28l-136 136l-362 362c-18 18 -28 43 -28 68s10 50 28 68l136 136c18 18 43 28 68 28s50 -10 68 -28l294 -295l656 657c18 18 43 28 68 28s50 -10 68 -28l136 -136
c18 -18 28 -43 28 -68z" />
<glyph glyph-name="facebook-square" unicode="&#xf101;"
<glyph glyph-name="clock-o" unicode="&#xf104;"
d="M896 992v-448c0 -18 -14 -32 -32 -32h-320c-18 0 -32 14 -32 32v64c0 18 14 32 32 32h224v352c0 18 14 32 32 32h64c18 0 32 -14 32 -32zM1312 640c0 300 -244 544 -544 544s-544 -244 -544 -544s244 -544 544 -544s544 244 544 544zM1536 640
c0 -424 -344 -768 -768 -768s-768 344 -768 768s344 768 768 768s768 -344 768 -768z" />
<glyph glyph-name="cloud-upload" unicode="&#xf105;" horiz-adv-x="1920"
d="M1280 672c0 8 -3 17 -9 23l-352 352c-6 6 -14 9 -23 9c-8 0 -17 -3 -23 -9l-351 -351c-6 -7 -10 -15 -10 -24c0 -18 14 -32 32 -32h224v-352c0 -17 15 -32 32 -32h192c17 0 32 15 32 32v352h224c18 0 32 15 32 32zM1920 384c0 -212 -172 -384 -384 -384h-1088
c-247 0 -448 201 -448 448c0 174 101 332 258 405c-1 15 -2 29 -2 43c0 283 229 512 512 512c208 0 395 -126 474 -318c46 40 105 62 166 62c141 0 256 -115 256 -256c0 -49 -14 -97 -41 -138c174 -41 297 -196 297 -374z" />
<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="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="eye" unicode="&#xf108;" 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="eye-slash" unicode="&#xf109;" horiz-adv-x="1792"
d="M555 201l78 141c-116 84 -185 219 -185 362c0 79 21 157 61 225c-156 -80 -286 -206 -381 -353c104 -161 251 -296 427 -375zM944 960c0 26 -22 48 -48 48c-167 0 -304 -137 -304 -304c0 -26 22 -48 48 -48s48 22 48 48c0 115 94 208 208 208c26 0 48 22 48 48z
M1307 1151c0 -2 0 -7 -1 -9c-211 -377 -420 -756 -631 -1133l-49 -89c-6 -10 -17 -16 -28 -16c-18 0 -113 58 -134 70c-10 6 -16 16 -16 28c0 16 34 70 44 87c-194 88 -357 238 -472 418c-13 20 -20 44 -20 69c0 24 7 49 20 69c198 304 507 507 876 507c60 0 121 -6 180 -17
l54 97c6 10 16 16 28 16c18 0 112 -58 133 -70c10 -6 16 -16 16 -27zM1344 704c0 -186 -115 -352 -288 -418l280 502c5 -28 8 -56 8 -84zM1792 576c0 -26 -7 -47 -20 -69c-31 -51 -70 -100 -109 -145c-196 -225 -466 -362 -767 -362l74 132c291 25 538 202 694 444
c-74 115 -169 216 -282 294l63 112c124 -83 249 -208 327 -337c13 -22 20 -43 20 -69z" />
<glyph glyph-name="facebook-square" unicode="&#xf10a;"
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="floppy-o" unicode="&#xf102;"
<glyph glyph-name="filter" unicode="&#xf10b;" horiz-adv-x="1408"
d="M1403 1241c10 -24 5 -52 -14 -70l-493 -493v-742c0 -26 -16 -49 -39 -59c-8 -3 -17 -5 -25 -5c-17 0 -33 6 -45 19l-256 256c-12 12 -19 28 -19 45v486l-493 493c-19 18 -24 46 -14 70c10 23 33 39 59 39h1280c26 0 49 -16 59 -39z" />
<glyph glyph-name="flag" unicode="&#xf10c;" horiz-adv-x="1728"
d="M256 1280c0 -46 -25 -87 -64 -110v-1266c0 -17 -15 -32 -32 -32h-64c-17 0 -32 15 -32 32v1266c-39 23 -64 64 -64 110c0 71 57 128 128 128s128 -57 128 -128zM1728 1216v-763c0 -37 -23 -51 -52 -66c-113 -61 -238 -116 -369 -116c-184 0 -272 140 -490 140
c-159 0 -326 -72 -464 -146c-11 -6 -21 -9 -33 -9c-35 0 -64 29 -64 64v742c0 24 12 41 31 55c24 16 53 30 79 43c126 64 279 120 421 120c157 0 280 -52 419 -117c28 -14 57 -19 88 -19c157 0 326 136 370 136c35 0 64 -29 64 -64z" />
<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="&#xf103;"
<glyph glyph-name="gavel" unicode="&#xf10e;" horiz-adv-x="1731"
d="M1731 0c0 -34 -14 -67 -37 -90l-107 -108c-24 -23 -57 -37 -91 -37s-67 14 -90 37l-363 364c-24 23 -38 56 -38 90c0 38 16 69 43 96l-256 256l-126 -126c-9 -9 -21 -14 -34 -14s-25 5 -34 14c30 -30 58 -52 58 -98c0 -26 -10 -49 -28 -68c-34 -36 -70 -84 -124 -84
c-25 0 -50 10 -68 28l-408 408c-18 18 -28 43 -28 68c0 54 48 90 84 124c19 18 42 28 68 28c46 0 68 -28 98 -58c-9 9 -14 21 -14 34s5 25 14 34l348 348c9 9 21 14 34 14s25 -5 34 -14c-30 30 -58 52 -58 98c0 26 10 49 28 68c34 36 70 84 124 84c25 0 50 -10 68 -28
l408 -408c18 -18 28 -43 28 -68c0 -54 -48 -90 -84 -124c-19 -18 -42 -28 -68 -28c-46 0 -68 28 -98 58c9 -9 14 -21 14 -34s-5 -25 -14 -34l-126 -126l256 -256c27 27 58 43 96 43c34 0 67 -14 91 -37l363 -363c23 -24 37 -57 37 -91z" />
<glyph glyph-name="github" unicode="&#xf10f;"
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="google" unicode="&#xf104;" horiz-adv-x="1505"
<glyph glyph-name="google" unicode="&#xf110;" horiz-adv-x="1505"
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" />
<glyph glyph-name="question-circle" unicode="&#xf105;"
<glyph glyph-name="history" unicode="&#xf111;"
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" />
<glyph glyph-name="link" unicode="&#xf112;" horiz-adv-x="1632"
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
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
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 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="pencil-square-o" unicode="&#xf113;" horiz-adv-x="1784"
d="M888 352l116 116l-152 152l-116 -116v-56h96v-96h56zM1328 1072c-9 9 -24 8 -33 -1l-350 -350c-9 -9 -10 -24 -1 -33s24 -8 33 1l350 350c9 9 10 24 1 33zM1408 478v-190c0 -159 -129 -288 -288 -288h-832c-159 0 -288 129 -288 288v832c0 159 129 288 288 288h832
c40 0 80 -8 117 -25c9 -4 16 -13 18 -23c2 -11 -1 -21 -9 -29l-49 -49c-9 -9 -21 -12 -32 -8c-15 4 -30 6 -45 6h-832c-88 0 -160 -72 -160 -160v-832c0 -88 72 -160 160 -160h832c88 0 160 72 160 160v126c0 8 3 16 9 22l64 64c10 10 23 12 35 7s20 -16 20 -29zM1312 1216
l288 -288l-672 -672h-288v288zM1756 1084l-92 -92l-288 288l92 92c37 37 99 37 136 0l152 -152c37 -37 37 -99 0 -136z" />
<glyph glyph-name="question-circle" unicode="&#xf114;"
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="sign-in" unicode="&#xf106;"
<glyph glyph-name="quote-left" unicode="&#xf115;" horiz-adv-x="1664"
d="M768 576v-384c0 -106 -86 -192 -192 -192h-384c-106 0 -192 86 -192 192v704c0 282 230 512 512 512h64c35 0 64 -29 64 -64v-128c0 -35 -29 -64 -64 -64h-64c-141 0 -256 -115 -256 -256v-32c0 -53 43 -96 96 -96h224c106 0 192 -86 192 -192zM1664 576v-384
c0 -106 -86 -192 -192 -192h-384c-106 0 -192 86 -192 192v704c0 282 230 512 512 512h64c35 0 64 -29 64 -64v-128c0 -35 -29 -64 -64 -64h-64c-141 0 -256 -115 -256 -256v-32c0 -53 43 -96 96 -96h224c106 0 192 -86 192 -192z" />
<glyph glyph-name="reply" unicode="&#xf116;" 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="rss" unicode="&#xf117;" horiz-adv-x="1408"
d="M384 192c0 -106 -86 -192 -192 -192s-192 86 -192 192s86 192 192 192s192 -86 192 -192zM896 69c1 -18 -5 -35 -17 -48c-12 -14 -29 -21 -47 -21h-135c-33 0 -60 25 -63 58c-29 305 -271 547 -576 576c-33 3 -58 30 -58 63v135c0 18 7 35 21 47c11 11 27 17 43 17h5
c213 -17 414 -110 565 -262c152 -151 245 -352 262 -565zM1408 67c1 -17 -5 -34 -18 -47c-12 -13 -28 -20 -46 -20h-143c-34 0 -62 26 -64 60c-33 581 -496 1044 -1077 1078c-34 2 -60 30 -60 63v143c0 18 7 34 20 46c12 12 28 18 44 18h3c350 -18 679 -165 927 -414
c249 -248 396 -577 414 -927z" />
<glyph glyph-name="search" unicode="&#xf118;" horiz-adv-x="1664"
d="M1152 704c0 247 -201 448 -448 448s-448 -201 -448 -448s201 -448 448 -448s448 201 448 448zM1664 -128c0 -70 -58 -128 -128 -128c-34 0 -67 14 -90 38l-343 342c-117 -81 -257 -124 -399 -124c-389 0 -704 315 -704 704s315 704 704 704s704 -315 704 -704
c0 -142 -43 -282 -124 -399l343 -343c23 -23 37 -56 37 -90z" />
<glyph glyph-name="share-alt" unicode="&#xf119;"
d="M1216 512c177 0 320 -143 320 -320s-143 -320 -320 -320s-320 143 -320 320c0 11 1 23 2 34l-360 180c-57 -53 -134 -86 -218 -86c-177 0 -320 143 -320 320s143 320 320 320c84 0 161 -33 218 -86l360 180c-1 11 -2 23 -2 34c0 177 143 320 320 320s320 -143 320 -320
s-143 -320 -320 -320c-84 0 -161 33 -218 86l-360 -180c1 -11 2 -23 2 -34s-1 -23 -2 -34l360 -180c57 53 134 86 218 86z" />
<glyph glyph-name="sign-in" unicode="&#xf11a;"
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="&#xf107;" horiz-adv-x="1568"
<glyph glyph-name="sign-out" unicode="&#xf11b;" 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="times" unicode="&#xf108;" horiz-adv-x="1188"
<glyph glyph-name="sliders" unicode="&#xf11c;"
d="M352 128v-128h-352v128h352zM704 256c35 0 64 -29 64 -64v-256c0 -35 -29 -64 -64 -64h-256c-35 0 -64 29 -64 64v256c0 35 29 64 64 64h256zM864 640v-128h-864v128h864zM224 1152v-128h-224v128h224zM1536 128v-128h-736v128h736zM576 1280c35 0 64 -29 64 -64v-256
c0 -35 -29 -64 -64 -64h-256c-35 0 -64 29 -64 64v256c0 35 29 64 64 64h256zM1216 768c35 0 64 -29 64 -64v-256c0 -35 -29 -64 -64 -64h-256c-35 0 -64 29 -64 64v256c0 35 29 64 64 64h256zM1536 640v-128h-224v128h224zM1536 1152v-128h-864v128h864z" />
<glyph glyph-name="sort" unicode="&#xf11d;" horiz-adv-x="1024"
d="M1024 448c0 -17 -7 -33 -19 -45l-448 -448c-12 -12 -28 -19 -45 -19s-33 7 -45 19l-448 448c-12 12 -19 28 -19 45c0 35 29 64 64 64h896c35 0 64 -29 64 -64zM1024 832c0 -35 -29 -64 -64 -64h-896c-35 0 -64 29 -64 64c0 17 7 33 19 45l448 448c12 12 28 19 45 19
s33 -7 45 -19l448 -448c12 -12 19 -28 19 -45z" />
<glyph glyph-name="sort-asc" unicode="&#xf11e;" horiz-adv-x="1024"
d="M1024 832c0 -35 -29 -64 -64 -64h-896c-35 0 -64 29 -64 64c0 17 7 33 19 45l448 448c12 12 28 19 45 19s33 -7 45 -19l448 -448c12 -12 19 -28 19 -45z" />
<glyph glyph-name="sort-desc" unicode="&#xf11f;" horiz-adv-x="1024"
d="M1024 448c0 -17 -7 -33 -19 -45l-448 -448c-12 -12 -28 -19 -45 -19s-33 7 -45 19l-448 448c-12 12 -19 28 -19 45c0 35 29 64 64 64h896c35 0 64 -29 64 -64z" />
<glyph glyph-name="star" unicode="&#xf120;" 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
l225 455c9 19 26 41 49 41s40 -22 49 -41l225 -455l502 -73c24 -4 56 -16 56 -46z" />
<glyph glyph-name="star-o" unicode="&#xf121;" horiz-adv-x="1664"
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
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" />
<glyph glyph-name="table" unicode="&#xf122;" horiz-adv-x="1664"
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="times" unicode="&#xf123;" horiz-adv-x="1188"
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
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="trash-o" unicode="&#xf109;" horiz-adv-x="1408"
<glyph glyph-name="trash" unicode="&#xf124;" horiz-adv-x="1408"
d="M512 160v704c0 18 -14 32 -32 32h-64c-18 0 -32 -14 -32 -32v-704c0 -18 14 -32 32 -32h64c18 0 32 14 32 32zM768 160v704c0 18 -14 32 -32 32h-64c-18 0 -32 -14 -32 -32v-704c0 -18 14 -32 32 -32h64c18 0 32 14 32 32zM1024 160v704c0 18 -14 32 -32 32h-64
c-18 0 -32 -14 -32 -32v-704c0 -18 14 -32 32 -32h64c18 0 32 14 32 32zM480 1152h448l-48 117c-3 4 -12 10 -17 11h-317c-6 -1 -14 -7 -17 -11zM1408 1120v-64c0 -18 -14 -32 -32 -32h-96v-948c0 -110 -72 -204 -160 -204h-832c-88 0 -160 90 -160 200v952h-96
c-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="trash-o" unicode="&#xf125;" 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
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" />
<glyph glyph-name="user-circle-o" unicode="&#xf10a;" horiz-adv-x="1792"
<glyph glyph-name="user-circle-o" unicode="&#xf126;" horiz-adv-x="1792"
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
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" />
<glyph glyph-name="user-plus" unicode="&#xf10b;" horiz-adv-x="2048"
<glyph glyph-name="user-plus" unicode="&#xf127;" 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
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" />
<glyph glyph-name="wrench" unicode="&#xf128;" 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
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" />
</font>
</defs></svg>

Side by Side Swipe Overlay

Before

Width:  |  Height:  |  Size: 7.5 KiB

After

Width:  |  Height:  |  Size: 24 KiB

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

Binary file not shown.

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

Binary file not shown.

270
public/images/logo.inkscape.svg
Unescape View File

@ -0,0 +1,270 @@
<?xml version="1.0" encoding="UTF-8" standalone="no"?>
<!-- Created with Inkscape (http://www.inkscape.org/) -->
<svg
xmlns:dc="http://purl.org/dc/elements/1.1/"
xmlns:cc="http://creativecommons.org/ns#"
xmlns:rdf="http://www.w3.org/1999/02/22-rdf-syntax-ns#"
xmlns:svg="http://www.w3.org/2000/svg"
xmlns="http://www.w3.org/2000/svg"
xmlns:sodipodi="http://sodipodi.sourceforge.net/DTD/sodipodi-0.dtd"
xmlns:inkscape="http://www.inkscape.org/namespaces/inkscape"
width="1872.0001"
height="1655.9703"
viewBox="0 0 1872.0002 1655.9703"
id="svg5504"
version="1.1"
inkscape:version="0.92.2 2405546, 2018-03-11"
sodipodi:docname="logo.svg"
style="enable-background:new">
<defs
id="defs5506">
<clipPath
id="a">
<path
id="path3718"
d="M 0,195.911 H 208.792 V 0 H 0 Z"
inkscape:connector-curvature="0" />
</clipPath>
<filter
inkscape:collect="always"
style="color-interpolation-filters:sRGB"
id="filter895">
<feBlend
inkscape:collect="always"
mode="darken"
in2="BackgroundImage"
id="feBlend897" />
</filter>
</defs>
<sodipodi:namedview
id="base"
pagecolor="#ffffff"
bordercolor="#666666"
borderopacity="1.0"
inkscape:pageopacity="0.0"
inkscape:pageshadow="2"
inkscape:zoom="0.35"
inkscape:cx="1397.6023"
inkscape:cy="1097.2416"
inkscape:document-units="px"
inkscape:current-layer="g850"
showgrid="true"
units="px"
inkscape:showpageshadow="false"
showguides="true"
inkscape:guide-bbox="true"
inkscape:window-width="1920"
inkscape:window-height="1139"
inkscape:window-x="0"
inkscape:window-y="30"
inkscape:window-maximized="1"
inkscape:snap-global="false"
fit-margin-top="0"
fit-margin-left="0"
fit-margin-right="0"
fit-margin-bottom="0">
<inkscape:grid
type="xygrid"
id="grid5512"
spacingx="64.000003"
spacingy="64"
dotted="false"
empspacing="2"
color="#3cd81a"
opacity="0.09411765"
empcolor="#3cd81a"
empopacity="0.26666667"
originx="-216.00005"
originy="-87.743039" />
<sodipodi:guide
position="-216.00002,40.256957"
orientation="0,1"
id="guide5514"
inkscape:locked="false" />
<sodipodi:guide
position="1320.0001,-87.743031"
orientation="1,0"
id="guide5516"
inkscape:locked="false" />
<sodipodi:guide
position="1192.0001,1576.2569"
orientation="0,1"
id="guide5518"
inkscape:locked="false" />
<sodipodi:guide
position="1064.0001,-87.743031"
orientation="1,0"
id="guide5520"
inkscape:locked="false" />
<sodipodi:guide
position="1576.0001,-87.743031"
orientation="1,0"
id="guide5522"
inkscape:locked="false" />
<sodipodi:guide
position="1832.0001,-87.743031"
orientation="1,0"
id="guide5713"
inkscape:locked="false" />
<sodipodi:guide
position="-216.00002,168.25695"
orientation="0,1"
id="guide5715"
inkscape:locked="false" />
<sodipodi:guide
position="424.00001,-87.743031"
orientation="1,0"
id="guide6919"
inkscape:locked="false" />
<sodipodi:guide
position="2428.5715,1445.7143"
orientation="0,1"
id="guide10169"
inkscape:locked="false" />
<sodipodi:guide
position="936.00002,808.25697"
orientation="0,1"
id="guide10171"
inkscape:locked="false" />
<sodipodi:guide
position="2465.7143,1705.7143"
orientation="0,1"
id="guide3346"
inkscape:locked="false" />
<sodipodi:guide
position="-216.00002,-87.743031"
orientation="0,1"
id="guide3348"
inkscape:locked="false" />
<sodipodi:guide
position="-216.00002,-87.743031"
orientation="1,0"
id="guide3350"
inkscape:locked="false" />
<sodipodi:guide
position="2088.0003,-87.743031"
orientation="1,0"
id="guide88"
inkscape:locked="false" />
</sodipodi:namedview>
<metadata
id="metadata5509">
<rdf:RDF>
<cc:Work
rdf:about="">
<dc:format>image/svg+xml</dc:format>
<dc:type
rdf:resource="http://purl.org/dc/dcmitype/StillImage" />
<dc:title></dc:title>
</cc:Work>
</rdf:RDF>
</metadata>
<path
sodipodi:nodetypes="ccccccc"
inkscape:connector-curvature="0"
id="path1765-3"
d="m 45.428522,106.46434 c 256.000008,-63.999995 831.999988,-63.999995 895.999988,128 64.00009,-191.999995 616.05789,-195.041295 896.00009,-128 V 1514.4641 c -256,-128 -768,-64 -896.00009,128.0001 -128,-192.0001 -639.99998,-256.0001 -895.999988,-128.0001 z"
style="display:inline;fill:#ffffff;fill-opacity:1;fill-rule:evenodd;stroke:none;stroke-width:80;stroke-linecap:square;stroke-linejoin:round;stroke-miterlimit:4;stroke-dasharray:none;stroke-opacity:1;paint-order:stroke fill markers;filter:url(#filter895)"
inkscape:label="backdrop1" />
<g
id="g850"
style="stroke:#302200;stroke-opacity:1"
inkscape:label="book"
transform="translate(-10,-10.02369)">
<g
id="g912"
style="stroke:#0075bf;stroke-width:50;stroke-linecap:butt;stroke-linejoin:round;stroke-miterlimit:4;stroke-dasharray:none;stroke-opacity:1;paint-order:normal"
inkscape:label="grid">
<path
inkscape:connector-curvature="0"
id="path1821-5"
d="m 1516.8573,1113.737 c 0,-767.99995 0,-767.99995 0,-767.99995"
style="fill:none;fill-rule:evenodd;stroke:#0075bf;stroke-width:50;stroke-linecap:butt;stroke-linejoin:round;stroke-miterlimit:4;stroke-dasharray:none;stroke-opacity:1;paint-order:normal" />
<path
style="fill:none;fill-rule:evenodd;stroke:#0075bf;stroke-width:50;stroke-linecap:butt;stroke-linejoin:round;stroke-miterlimit:4;stroke-dasharray:none;stroke-opacity:1;paint-order:normal"
d="m 1842,921.73705 c -255.9999,-127.99995 -831.9999,-64 -895.99991,127.99995"
id="path1786-6"
inkscape:connector-curvature="0"
sodipodi:nodetypes="cc" />
<path
sodipodi:nodetypes="cc"
inkscape:connector-curvature="0"
id="path1786"
d="m 1842,665.73705 c -255.9999,-127.99995 -831.9999,-64 -895.99991,128"
style="fill:none;fill-rule:evenodd;stroke:#0075bf;stroke-width:50;stroke-linecap:butt;stroke-linejoin:round;stroke-miterlimit:4;stroke-dasharray:none;stroke-opacity:1;paint-order:normal" />
<path
sodipodi:nodetypes="cc"
inkscape:connector-curvature="0"
id="path1786-3"
d="m 1842,409.73705 c -255.9999,-127.99995 -831.9999,-64 -895.99991,128"
style="fill:none;fill-rule:evenodd;stroke:#0075bf;stroke-width:50;stroke-linecap:butt;stroke-linejoin:round;stroke-miterlimit:4;stroke-dasharray:none;stroke-opacity:1;paint-order:normal" />
<path
inkscape:connector-curvature="0"
id="path1821"
d="m 1232.2858,1126.3084 c 0,-767.99992 0,-767.99992 0,-767.99992"
style="fill:none;fill-rule:evenodd;stroke:#0075bf;stroke-width:50;stroke-linecap:butt;stroke-linejoin:round;stroke-miterlimit:4;stroke-dasharray:none;stroke-opacity:1;paint-order:normal" />
<path
sodipodi:nodetypes="cc"
inkscape:connector-curvature="0"
id="path1786-5"
d="m 1842,1177.737 c -255.9999,-127.9999 -831.9999,-64 -895.99991,128"
style="fill:none;fill-rule:evenodd;stroke:#0075bf;stroke-width:50;stroke-linecap:butt;stroke-linejoin:round;stroke-miterlimit:4;stroke-dasharray:none;stroke-opacity:1;paint-order:normal" />
</g>
<g
id="g958"
inkscape:label="outlines"
style="stroke-width:90;stroke-miterlimit:4;stroke-dasharray:none;stroke:#545454;stroke-opacity:1">
<path
style="fill:none;fill-rule:evenodd;stroke:#545454;stroke-width:90;stroke-linecap:round;stroke-linejoin:miter;stroke-miterlimit:4;stroke-dasharray:none;stroke-opacity:1"
d="m 946.00009,1625.737 c 270.56831,-41.9153 576.00001,-128 832.00001,0"
id="path1844"
inkscape:connector-curvature="0"
sodipodi:nodetypes="cc" />
<path
style="fill:none;fill-rule:evenodd;stroke:#545454;stroke-width:90;stroke-linecap:butt;stroke-linejoin:miter;stroke-miterlimit:4;stroke-dasharray:none;stroke-opacity:1"
d="m 1778.0001,1625.737 v -128"
id="path1846"
inkscape:connector-curvature="0" />
<path
style="fill:none;fill-rule:evenodd;stroke:#545454;stroke-width:90;stroke-linecap:round;stroke-linejoin:miter;stroke-miterlimit:4;stroke-dasharray:none;stroke-opacity:1"
d="m 946.00009,1625.737 c -270.56837,-41.9154 -576.00007,-128 -832.00006,0"
id="path1844-2"
inkscape:connector-curvature="0"
sodipodi:nodetypes="cc" />
<path
style="fill:none;fill-rule:evenodd;stroke:#545454;stroke-width:90;stroke-linecap:butt;stroke-linejoin:miter;stroke-miterlimit:4;stroke-dasharray:none;stroke-opacity:1"
d="m 114.00003,1625.737 v -128"
id="path1846-9"
inkscape:connector-curvature="0" />
<path
style="fill:none;fill-rule:evenodd;stroke:#545454;stroke-width:90;stroke-linecap:butt;stroke-linejoin:miter;stroke-miterlimit:4;stroke-dasharray:none;stroke-opacity:1"
d="m 946.00009,217.7371 c 0,1407.9999 0,1407.9999 0,1407.9999"
id="path1769"
inkscape:connector-curvature="0" />
<path
style="fill:none;fill-opacity:1;fill-rule:evenodd;stroke:#545454;stroke-width:90;stroke-linecap:square;stroke-linejoin:round;stroke-miterlimit:4;stroke-dasharray:none;stroke-opacity:1;paint-order:stroke fill markers"
d="m 50,89.737053 c 256.00001,-64 832.00009,-64 896.00009,128.000047 C 1010.0001,25.737053 1562.0579,22.695816 1842.0001,89.737103 V 1497.737 c -256,-128 -768,-64 -896.00001,128 -128.0001,-192 -640.00008,-256 -896.00009,-128 z"
id="path1765"
inkscape:connector-curvature="0"
sodipodi:nodetypes="ccccccc" />
</g>
<g
aria-label="{}"
style="font-style:normal;font-variant:normal;font-weight:normal;font-stretch:normal;font-size:666.66668701px;line-height:25px;font-family:'IBM Plex';-inkscape-font-specification:'IBM Plex';letter-spacing:0px;word-spacing:0px;fill:#0075bf;fill-opacity:1;stroke:none;stroke-width:80;stroke-linecap:butt;stroke-linejoin:miter;stroke-miterlimit:4;stroke-dasharray:none;stroke-opacity:1"
id="text1870"
transform="translate(-206.00001,-38.262947)"
inkscape:label="braces">
<path
d="m 630.73519,457.51817 c -38.70234,3.83081 -79.80496,7.29488 -114.1543,30.1565 -25.33806,17.65798 -34.16896,49.77456 -36.9375,77.94316 -5.83539,52.61078 4.86375,105.06143 -7.68164,157.63497 -5.88661,17.48896 -22.54505,30.74027 -40.25186,33.66114 -18.16392,4.87657 -36.8065,4.73461 -55.05087,7.0026 -0.0137,20.82543 -0.0274,41.65086 -0.041,62.47628 26.50344,-1.76087 55.56865,-8.16953 79.33984,4.18079 16.72017,10.18693 20.3316,31.85792 21.24897,50.74602 3.65353,54.80872 -6.49313,112.57065 10.89752,164.39307 8.22265,22.9252 30.11208,39.0963 54.41017,42.0712 34.28617,6.9922 70.10953,1.9255 105.45506,-0.3008 5.11071,-5.432 0.77113,-12.75 1.99408,-19.1297 -0.0676,-14.7142 0.4287,-29.4594 -0.82025,-44.0016 -26.95565,0.9957 -56.35728,8.9857 -80.95703,-2.9342 -13.98146,-11.7357 -12.88217,-32.8596 -13.98633,-50.09398 -2.58631,-49.92481 6.10771,-102.11261 -9.11914,-149.45663 -7.04556,-17.46249 -20.87804,-31.24412 -38.5918,-37.96317 24.83704,-13.63268 41.98546,-40.69827 44.26172,-67.9957 8.47672,-50.94494 -1.0888,-101.34749 5.35352,-152.34495 2.18976,-12.08024 6.67482,-26.29569 18.97851,-32.16024 17.62984,-9.52004 37.59613,-8.7406 56.3086,-11.40378 6.2864,-0.54271 12.57318,-1.05545 18.85937,-1.68294 0.013,-20.84556 0.026,-41.6911 0.0391,-62.53667 -6.51824,0.57493 -13.03646,1.15586 -19.55469,1.73879 z"
id="path1874"
inkscape:connector-curvature="0"
style="fill:#0075bf;fill-opacity:1;stroke-width:80;stroke-miterlimit:4;stroke-dasharray:none" />
<path
style="font-style:normal;font-variant:normal;font-weight:normal;font-stretch:normal;font-size:666.66668701px;line-height:25px;font-family:'IBM Plex';-inkscape-font-specification:'IBM Plex';letter-spacing:0px;word-spacing:0px;fill:#0075bf;fill-opacity:1;stroke:none;stroke-width:80;stroke-linecap:butt;stroke-linejoin:miter;stroke-miterlimit:4;stroke-dasharray:none;stroke-opacity:1"
d="m 764.07822,457.42415 c 39.17964,3.1804 80.79414,5.96149 115.40583,27.99572 25.52499,17.0374 34.2059,48.60398 36.77749,76.36746 5.47619,51.84386 -5.79827,103.78646 6.4765,155.48933 5.81912,17.1727 22.58686,29.99493 40.50234,32.60322 18.36242,4.53173 37.25142,4.10204 55.71672,6.05748 -0.1583,20.55753 -0.3176,41.11501 -0.476,61.67253 -26.83736,-1.32654 -56.23175,-7.20137 -80.41792,5.35941 -17.02451,10.3157 -20.863,31.76421 -21.94894,50.42378 -4.15573,54.16092 5.64578,111.02283 -12.40302,162.44922 -8.52074,22.7582 -30.83206,39.0615 -55.47439,42.3753 -34.79505,7.435 -71.04758,2.9899 -106.83955,1.3413 -5.13292,-5.2829 -0.67563,-12.5742 -1.86181,-18.8529 0.19042,-14.526 -0.19025,-29.074 1.19566,-43.4487 27.30193,0.5645 57.02408,7.9947 82.04614,-4.1539 14.26257,-11.802 13.32387,-32.63739 14.58537,-49.6674 3.03399,-49.32322 -5.34196,-100.70511 10.47742,-147.67707 7.28292,-17.34745 21.41152,-31.16678 39.41393,-38.07458 -25.05074,-13.07167 -42.20044,-39.52297 -44.28046,-66.43415 -8.16607,-50.15839 1.94289,-100.06161 -4.16159,-150.30345 -2.11848,-11.89094 -6.54472,-25.854 -18.96165,-31.45204 -17.78284,-9.12383 -38.01821,-8.04427 -56.95469,-10.38258 -6.36461,-0.43806 -12.72982,-0.84658 -19.09349,-1.36836 0.15953,-20.57738 0.31915,-41.15478 0.47857,-61.73216 6.5992,0.46629 13.19836,0.93851 19.79747,1.41268 z"
id="path1874-1"
inkscape:connector-curvature="0" />
</g>
</g>
</svg>
Side by Side

After

Width:  |  Height:  |  Size: 14 KiB

1
public/images/logo.svg
Unescape View File

@ -0,0 +1 @@
<svg xmlns="http://www.w3.org/2000/svg" width="1872" height="1655.97" enable-background="new"><defs><filter id="a" color-interpolation-filters="sRGB"><feBlend mode="darken" in2="BackgroundImage"/></filter></defs><path d="M45.429 106.464c256-64 832-64 896 128 64-192 616.057-195.041 896-128v1408c-256-128-768-64-896 128-128-192-640-256-896-128z" fill="#fff" fill-rule="evenodd" paint-order="stroke fill markers" filter="url(#a)"/><g stroke="#302200"><g stroke="#0075bf" stroke-width="50" stroke-linejoin="round" fill="none"><path d="M1506.857 1103.713v-768M1832 911.713c-256-128-832-64-896 128M1832 655.713c-256-128-832-64-896 128M1832 399.713c-256-128-832-64-896 128M1222.286 1116.285v-768M1832 1167.713c-256-128-832-64-896 128"/></g><g stroke-width="90" stroke="#545454" fill="none"><path d="M936 1615.713c270.568-41.915 576-128 832 0" stroke-linecap="round"/><path d="M1768 1615.713v-128"/><path d="M936 1615.713c-270.568-41.915-576-128-832 0" stroke-linecap="round"/><path d="M104 1615.713v-128M936 207.713v1408"/><path d="M40 79.713c256-64 832-64 896 128 64-192 616.058-195.04 896-128v1408c-256-128-768-64-896 128-128-192-640-256-896-128z" stroke-linecap="square" stroke-linejoin="round" paint-order="stroke fill markers"/></g><g aria-label="{}" style="line-height:25px;-inkscape-font-specification:'IBM Plex'" font-weight="400" font-size="666.667" font-family="IBM Plex" letter-spacing="0" word-spacing="0" fill="#0075bf" stroke="none" stroke-width="80"><path d="M414.735 409.232c-38.702 3.83-79.805 7.294-114.154 30.156-25.338 17.658-34.17 49.775-36.938 77.943-5.835 52.611 4.864 105.062-7.681 157.635-5.887 17.49-22.545 30.74-40.252 33.661-18.164 4.877-36.807 4.735-55.051 7.003l-.041 62.476c26.503-1.76 55.569-8.17 79.34 4.181 16.72 10.187 20.331 31.858 21.249 50.746 3.653 54.809-6.493 112.57 10.897 164.393 8.223 22.925 30.112 39.096 54.41 42.071 34.287 6.992 70.11 1.926 105.456-.3 5.11-5.433.77-12.75 1.994-19.13-.068-14.714.428-29.46-.82-44.002-26.956.996-56.358 8.986-80.958-2.934-13.981-11.736-12.882-32.86-13.986-50.094-2.586-49.925 6.108-102.113-9.12-149.457-7.045-17.462-20.877-31.244-38.59-37.963 24.836-13.632 41.985-40.698 44.26-67.996 8.478-50.944-1.088-101.347 5.354-152.344 2.19-12.08 6.675-26.296 18.979-32.16 17.63-9.52 37.596-8.741 56.308-11.404 6.287-.543 12.574-1.056 18.86-1.683l.039-62.537c-6.518.575-13.037 1.156-19.555 1.739z"/><path style="line-height:25px;-inkscape-font-specification:'IBM Plex'" d="M548.078 409.138c39.18 3.18 80.794 5.961 115.406 27.995 25.525 17.038 34.206 48.604 36.778 76.368 5.476 51.844-5.799 103.786 6.476 155.489 5.82 17.173 22.587 29.995 40.502 32.603 18.363 4.532 37.252 4.102 55.717 6.058l-.476 61.672c-26.837-1.326-56.232-7.201-80.418 5.36-17.024 10.315-20.863 31.764-21.949 50.423-4.156 54.161 5.646 111.023-12.403 162.45-8.52 22.758-30.832 39.061-55.474 42.375-34.795 7.435-71.048 2.99-106.84 1.341-5.133-5.283-.675-12.574-1.862-18.853.19-14.526-.19-29.074 1.196-43.448 27.302.564 57.024 7.994 82.046-4.154 14.263-11.802 13.324-32.638 14.586-49.668 3.034-49.323-5.342-100.705 10.477-147.677 7.283-17.347 21.412-31.166 39.414-38.074-25.05-13.072-42.2-39.523-44.28-66.434-8.167-50.159 1.942-100.062-4.162-150.304-2.119-11.89-6.545-25.854-18.962-31.452-17.783-9.124-38.018-8.044-56.954-10.383-6.365-.438-12.73-.846-19.094-1.368l.479-61.732c6.599.466 13.198.938 19.797 1.413z"/></g></g></svg>
Side by Side

After

Width:  |  Height:  |  Size: 3.3 KiB

4
resources/assets/sass/_bst-modules.scss vendored
Unescape View File

@ -10,12 +10,12 @@
@import "~bootstrap/scss/transitions";
@import "~bootstrap/scss/dropdown";
@import "~bootstrap/scss/button-group";
//@import "~bootstrap/scss/input-group";
@import "~bootstrap/scss/input-group";
@import "~bootstrap/scss/custom-forms";
//@import "~bootstrap/scss/nav";
@import "~bootstrap/scss/navbar";
@import "~bootstrap/scss/card";
//@import "~bootstrap/scss/breadcrumb";
@import "~bootstrap/scss/breadcrumb";
@import "~bootstrap/scss/pagination";
@import "~bootstrap/scss/badge";
//@import "~bootstrap/scss/jumbotron";

19
resources/assets/sass/app.scss vendored
Unescape View File

@ -7,15 +7,33 @@
@import "variables";
@import "bst-modules";
// generic hiding class
.hidden {
display: none !important;
}
// padding right for icons (must not use space next to it!)
.fa-pr::before {
margin-right: ($spacer*.5);
}
// button in card header, adjusting margins to not stretch the header
.card-header .btn {
margin-top: -3px;
margin-bottom: -10px;
}
html {
overflow-y: scroll;
}
// help bubble icon
.form-help {
display: inline-block;
margin-top: $form-text-margin-top;
}
// tooltip tweaking
.tooltip-inner {
text-align: left;
}
@ -24,6 +42,7 @@ html {
box-shadow: 0 2px 5px rgba(black, .3);
}
// layout tweaks
.page-navbar {
background: white;
border-bottom: 1px solid $primary;

8
resources/views/auth/register.blade.php
Unescape View File

@ -13,12 +13,12 @@
@php(Widget::setLayout(4, 6))
{!! Widget::text('name', 'Name')->required()->autofocus()
{!! Widget::text('name', 'Username')->required()->prepend('@')
->help('This will be part of your vanity URL; only letters, digits and
some symbols are allowed. You can always change this later, and even
set a different Display Name.') !!}
some symbols are allowed. You can always change this later.') !!}
{!! Widget::email('email', 'E-Mail Address')->required()->autofocus() !!}
{!! Widget::email('email', 'E-Mail Address')->required()->autofocus()
->help('Used to login and for password reset e-mails') !!}
{!! Widget::password('password', 'Password')->required() !!}
{!! Widget::password('password_confirmation', 'Confirm Password')->required() !!}

2
resources/views/form/_help.blade.php
Unescape View File

@ -1,4 +1,4 @@
<div class="col-md-1 pl-0">
<div class="col-md-1 {{$mobile ? 'd-inline pl-1 d-md-none':'d-none d-md-block'}} pl-0">
@if($w->help)
<i class="fa-question-circle form-help"
data-toggle="tooltip"

7
resources/views/form/checkbox.blade.php
Unescape View File

@ -9,7 +9,10 @@
id="field-{{ $w->name }}"
{{+$w->value?'checked':''}}
name="{{ $w->name }}">
<label class="custom-control-label" for="field-{{ $w->name }}">{{ $w->label }}</label>
<label class="custom-control-label" for="field-{{ $w->name }}">
{{ $w->label }}
</label>
@include('form._help', ['mobile' => true])
</div>
@if ($errors->has($w->name))
@ -18,5 +21,5 @@
</span>
@endif
</div>
@include('form._help')
@include('form._help', ['mobile' => false])
</div>

41
resources/views/form/input.blade.php
Unescape View File

@ -3,19 +3,36 @@
@endphp
<div class="row form-group">
<label for="field-{{ $w->name }}" class="col-md-{{$w->labelCols}} col-form-label text-md-right">{{ $w->label }}</label>
<label for="field-{{ $w->name }}" class="col-md-{{$w->labelCols}} col-form-label text-md-right">
{{ $w->label }}
@include('form._help', ['mobile' => true])
</label>
<div class="col-md-{{$w->fieldCols}}">
<input id="field-{{ $w->name }}"
name="{{ $w->name }}"
class="form-control{{ $errors->has($w->name) ? ' is-invalid' : '' }}"
value="{{ $w->value }}"
{!! $w->attributes !!}>
<div class="input-group">
@if($w->prepend)
<div class="input-group-prepend">
<span class="input-group-text">{{$w->prepend}}</span>
</div>
@endif
@if ($errors->has($w->name))
<span class="invalid-feedback" role="alert">
<strong>{{ $errors->first($w->name) }}</strong>
</span>
@endif
<input id="field-{{ $w->name }}"
name="{{ $w->name }}"
class="form-control{{ $errors->has($w->name) ? ' is-invalid' : '' }}"
value="{{ $w->value }}"
{!! $w->attributes !!}>
@if($w->append)
<div class="input-group-append">
<span class="input-group-text">{{$w->append}}</span>
</div>
@endif
@if ($errors->has($w->name))
<span class="invalid-feedback" role="alert">
<strong>{{ $errors->first($w->name) }}</strong>
</span>
@endif
</div>
</div>
@include('form._help')
@include('form._help', ['mobile' => false])
</div>

7
resources/views/form/textarea.blade.php
Unescape View File

@ -3,7 +3,10 @@
@endphp
<div class="row form-group">
<label for="field-{{ $w->name }}" class="col-md-{{$w->labelCols}} col-form-label text-md-right">{{ $w->label }}</label>
<label for="field-{{ $w->name }}" class="col-md-{{$w->labelCols}} col-form-label text-md-right">
{{ $w->label }}
@include('form._help', ['mobile' => true])
</label>
<div class="col-md-{{$w->fieldCols}}">
<textarea id="field-{{ $w->name }}"
name="{{ $w->name }}"
@ -16,5 +19,5 @@
</span>
@endif
</div>
@include('form._help')
@include('form._help', ['mobile' => false])
</div>

52
resources/views/home.blade.php
Unescape View File

@ -1,52 +0,0 @@
@extends('layouts.app')
@section('content')
<div class="container">
<div class="row justify-content-center">
{{-- Dash card --}}
<div class="col-md-8">
<div class="card">
<div class="card-header">Dashboard</div>
<div class="card-body">
@if (session('status'))
<div class="alert alert-success" role="alert">
{{ session('status') }}
</div>
@endif
<p>You are logged in!</p>
<p>blabla dashboard things ...</p>
</div>
</div>
</div>
{{-- Table list card --}}
<div class="col-md-4">
<div class="card">
<div class="card-header">
<span class="d-inline-block">Your Tables</span>
<a href="{{route('table.create')}}" class="btn btn-sm btn-outline-light float-right"
style="margin-top:-2px; margin-bottom:-2px;">New</a>
</div>
<div class="list-group list-group-flush">
@if(count($tables) == 0)
<span class="list-group-item">No tables yet.</span>
@else
@foreach($tables as $table)
<a class="list-group-item list-group-item-action" href="{{route('table.view', ['user' => Auth::user()->name, 'table' => $table->name])}}">{{
$table->title
}}</a>
@endforeach
{{ $tables->links() }}
@endif
</div>
</div>
</div>
</div>
</div>
@endsection

2
resources/views/layouts/footer.blade.php
Unescape View File

@ -1,3 +1,5 @@
{{-- Global footer --}}
<footer class="page-footer text-muted mt-2">
<div class="container py-2 py-md-4">
<ul class="d-flex p-0">

17
resources/views/layouts/main-nav.blade.php
Unescape View File

@ -1,7 +1,10 @@
{{-- Global navbar --}}
<nav class="navbar navbar-expand-md navbar-light page-navbar">
<div class="container">
<a class="navbar-brand" href="{{ url('/') }}">
{{ config('app.name', 'Laravel') }}
<img src="/images/logo.svg" alt="Logo" height="32px" style="margin: -10px 0" class="mr-2">{{--
--}}datatable.directory
</a>
<button class="navbar-toggler" type="button" data-toggle="collapse" data-target="#navbarSupportedContent"
aria-controls="navbarSupportedContent" aria-expanded="false" aria-label="{{ __('Toggle navigation') }}">
@ -17,7 +20,7 @@
<!-- Right Side Of Navbar -->
<ul class="navbar-nav ml-auto">
<!-- Authentication Links -->
@guest
@guest()
<li class="nav-item">
<a class="nav-link" href="{{ route('login') }}">
<i class="fa-sign-in pr-1"></i>
@ -34,15 +37,15 @@
<li class="nav-item dropdown">
<a id="navbarDropdown" class="nav-link dropdown-toggle" href="#" role="button" data-toggle="dropdown"
aria-haspopup="true" aria-expanded="false" v-pre>
<i class="fa-user-circle-o pr-1"></i>
{{ Auth::user()->name }} <span class="caret"></span>
<i class="fa-user-circle-o fa-pr"></i>{{--
--}}{{ user()->title }} <span class="caret"></span>
</a>
<div class="dropdown-menu dropdown-menu-right" aria-labelledby="navbarDropdown">
<a class="dropdown-item" href="{{ route('logout') }}"
onclick="event.preventDefault(); document.getElementById('logout-form').submit();">
<i class="fa-sign-out pr-1"></i>
{{ __('Logout') }}
<i class="fa-sign-out fa-pr"></i>{{--
--}}{{ __('Logout') }}
</a>
<form id="logout-form" action="{{ route('logout') }}" method="POST" style="display: none;">
@ -50,7 +53,7 @@
</form>
</div>
</li>
@endguest
@endif
</ul>
</div>
</div>

21
resources/views/table/create.blade.php
Unescape View File

@ -1,24 +1,33 @@
{{-- New table form --}}
@extends('layouts.app')
@section('content')
<div class="container">
<div class="row justify-content-center">
<div class="col-md-8">
<div class="row">
<h2 class="col-md-8 offset-md-3">New Table</h2>
</div>
</div>
</div>
<form method="POST" action="{{route('table.storeNew')}}" class="row justify-content-center"
aria-label="New Table">
<h2>New Table</h2>
@csrf
<div class="col-md-8">
@php(Widget::setLayout(3, 8))
{!! Widget::text('title', 'Title')->autoAlias('name', '-')
->help('Unique among your tables') !!}
{!! Widget::text('name', 'Name')->value('molluscs-'.uniqid())
{!! Widget::text('name', 'Name')->value('')->prepend(user()->handle.' /')
->help('Unique among your tables, and part of the URL; only letters, digits and
some symbols are allowed.') !!}
{!! Widget::textarea('description', 'Description')->height('8em')
->help('Description what data is in the table. Please use the dedicated
fields for License and data source. URLs in a full format will be clickable.') !!}
->help('Description of the table. URLs in a full format will be clickable.') !!}
{!! Widget::text('license', 'License')
->help('License applicable to the table\'s data, if any. By default, all
@ -47,7 +56,7 @@
<div class="row form-group">
<div class="col-md-8 offset-md-3">
<button type="submit" class="btn btn-primary">
<i class="fa-save pr-2"></i>Create New Table
<i class="fa-save pr-2"></i>Create Table
</button>
</div>
</div>

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

@ -1,3 +1,5 @@
{{-- Basic table view --}}
@extends('layouts.app')
@php

120
resources/views/user/view.blade.php
Unescape View File

@ -0,0 +1,120 @@
{{-- User's dashboard / profile page --}}
@extends('layouts.app')
@php
/** @var \App\Models\Table[] $tables */
/** @var \App\Models\User $user */
@endphp
@section('content')
<div class="container">
<div class="row justify-content-center">
{{-- Dash card --}}
<div class="col-md-4">
<div class="card">
<div class="card-header">
<i class="fa-user-circle-o pr-1"></i>
{{ $user->title }}
@if(authed() && user()->is($user))
<a href="{{route('user.edit')}}" class="btn btn-sm btn-outline-light float-right">Edit</a>
@endif
</div>
<div class="card-body">
@if (session('status'))
<div class="alert alert-success" role="alert">
{{ session('status') }}
</div>
@endif
@if($user->bio)
@if(mb_strlen($user->bio) > 250)
<p id="bio-short" aria-hidden=true>
{{mb_substr($user->bio, 0, 250)}}…
<a class="text-muted small" title="Show more" href="#" onclick="$('#bio-short').addClass('hidden'); $('#bio-full').removeClass('hidden'); return false;">
[more]
</a>
</p>
<p id="bio-full" class="hidden">
{{ $user->bio }}
<a class="text-muted small" title="Collapse" href="#" onclick="$('#bio-full').addClass('hidden'); $('#bio-short').removeClass('hidden'); return false;">
[collapse]
</a>
</p>
@else
<p>
{{ $user->bio }}
</p>
@endif
@endif
@if($user->website)
<p>
<i class="fa-link fa-pr" aria-label="User's Website" title="User's Website"></i>{{--
--}}<a href="{{ $user->website }}">{{ $user->website }}</a>
</p>
@endif
<p class="mb-0">
<i class="fa-calendar fa-pr" aria-hidden=true></i>{{--
--}}Joined {{ $user->created_at->diffForHumans() }}
</p>
</div>
</div>
</div>
{{-- Table list card --}}
<div class="col-md-8">
<div class="card">
<div class="card-header">
<span class="d-inline-block">
@if(authed() && user()->is($user))
Your Tables
@else
User's Tables
@endif
</span>
@if(authed() && user()->is($user))
<a href="{{route('table.create')}}" class="btn btn-sm btn-outline-light float-right">New</a>
@endif
</div>
<div class="list-group list-group-flush">
@if(count($tables) == 0)
<span class="list-group-item">No tables yet.</span>
@else
@foreach($tables as $table)
<a class="list-group-item list-group-item-action"
href="{{route('table.view', ['user' => $user->name, 'table' => $table->name])}}">
<span class="d-block row">
<span class="d-inline-block col-10">
<i class="fa-table fa-pr"></i>{{ $table->title }}
</span>{{--
--}}<span class="d-inline-block col-2 small text-right">
{{ $table->revision->row_count }} rows
</span>
</span>
<span class="d-block small row">
<span class="d-inline-block col-8">
{{ ellipsis($table->description, 215) }}
</span>{{--
--}}<span class="d-inline-block col-4 text-right text-muted">
Last change {{ $table->updated_at->diffForHumans() }}
</span>
</span>
</a>
@endforeach
{{ $tables->links() }}
@endif
</div>
</div>
</div>
</div>
</div>
@endsection

26
resources/views/welcome.blade.php
Unescape View File

@ -1,17 +1,19 @@
{{-- Public landing page --}}
@extends('layouts.app')
@section('content')
<div class="container">
<div class="row justify-content-center">
<div class="col-md-8">
<div class="card">
<div class="card-header">Dashboard</div>
<div class="container">
<div class="row justify-content-center">
<div class="col-md-8">
<div class="card">
<div class="card-header">Dashboard</div>
<div class="card-body">
<h1>Welcome to the public landing page.</h1>
</div>
</div>
</div>
</div>
</div>
<div class="card-body">
<h1>Welcome to the public landing page.</h1>
</div>
</div>
</div>
</div>
</div>
@endsection

13
routes/login.php
Unescape View File

@ -1,6 +1,7 @@
<?php
// auth related routes, using the web middleware
use App\Models\User;
use SocialNorm\Exceptions\ApplicationRejectedException;
use SocialNorm\Exceptions\InvalidAuthorizationCodeException;
use SocialNorm\ProviderUser;
@ -11,16 +12,24 @@ Auth::routes();
function _loginVia($method) {
try {
SocialAuth::login($method, function (\App\Models\User $user, ProviderUser $details) {
SocialAuth::login($method, function (User $user, ProviderUser $details) {
// update user name first time user logs in
if (!$user->exists) {
$user->name = $details->nickname ?: ($details->full_name ?: $details->email);
$basename = $details->nickname ?: ($details->full_name ?: $details->email);
$user->name = $basename;
$cnt = 1;
while (User::where('name', $user->name)->exists()) {
$cnt++;
$user->name = $basename . $cnt;
}
}
// set e-mail from provider data, only if user e-mail is empty
if ("$user->email" === "") {
$user->email = $details->email;
}
$user->confirmed = true; // mark as confirmed, we trust the provider
});
} catch (ApplicationRejectedException $e) {
abort(401, $e->getMessage());

22
routes/public.php
Unescape View File

@ -1,22 +0,0 @@
<?php
// Routes using the web middleware
require "login.php";
Route::get('/about/terms', function () {
return view('about.terms');
});
Route::get('/about/privacy', function () {
return view('about.privacy');
});
Route::get('/', function () {
if (!Auth::guest()) {
return redirect('/home');
}
return view('welcome');
});
// Table resource
Route::get('{user}/{table}', 'TableController@view')->name('table.view');

13
routes/user.php
Unescape View File

@ -1,13 +0,0 @@
<?php
// Routes using the web+auth middlewares
Route::get('/home', 'HomeController@index')->name('home');
// Table resource
Route::group([
'prefix' => 'table',
], function () {
Route::get('create', 'TableController@create')->name('table.create');
Route::post('create', 'TableController@storeNew')->name('table.storeNew');
});

40
routes/web.php
Unescape View File

@ -0,0 +1,40 @@
<?php
// Routes using the web middleware
require "login.php";
Route::get('/about/terms', function () {
return view('about.terms');
});
Route::get('/about/privacy', function () {
return view('about.privacy');
});
Route::get('/', function () {
if (!Auth::guest()) {
return redirect(route('user.view', Auth::user()->name));
}
return view('welcome');
});
Route::group(['middleware' => 'auth'], function () {
// Table resource
Route::group([
'prefix' => 'table',
], function () {
Route::get('create', 'TableController@create')->name('table.create');
Route::post('create', 'TableController@storeNew')->name('table.storeNew');
});
Route::group([
'prefix' => 'user',
], function () {
Route::get('edit', 'UserController@edit')->name('user.edit');
Route::post('create', 'TableController@storeNew')->name('table.storeNew');
});
});
// Table resource - located at the end to work as a fallback
Route::get('@{user}', 'UserController@view')->name('user.view');
Route::get('@{user}/{table}', 'TableController@view')->name('table.view');
Write Preview
Loading…
Cancel
Save