mastermindzh/rickvanlieshout.com
1
0
Fork 0
mirror of https://github.com/mastermindzh/rickvanlieshout.com synced 2025-07-26 12:12:41 +02:00
Code Issues Packages Projects Releases Wiki Activity

🔖 Upgrade to Gatsby 1.8.12

Browse Source
This commit is contained in:
wpioneer
2017-08-20 14:43:49 +03:00
parent 88481e75f0
commit a2f8738ea6
115 changed files with 4734 additions and 5018 deletions
Download Patch File Download Diff File Expand all files Collapse all files

12
src/assets/fonts/fontello-771c82e0/LICENSE.txt Normal file
View File

@@ -0,0 +1,12 @@
Font license info
## Font Awesome
Copyright (C) 2016 by Dave Gandy
Author: Dave Gandy
License: SIL ()
Homepage: http://fortawesome.github.com/Font-Awesome/

75
src/assets/fonts/fontello-771c82e0/README.txt Normal file
View File

@@ -0,0 +1,75 @@
This webfont is generated by http://fontello.com open source project.
================================================================================
Please, note, that you should obey original font licenses, used to make this
webfont pack. Details available in LICENSE.txt file.
- Usually, it's enough to publish content of LICENSE.txt file somewhere on your
site in "About" section.
- If your project is open-source, usually, it will be ok to make LICENSE.txt
file publicly available in your repository.
- Fonts, used in Fontello, don't require a clickable link on your site.
But any kind of additional authors crediting is welcome.
================================================================================
Comments on archive content
---------------------------
- /font/* - fonts in different formats
- /css/* - different kinds of css, for all situations. Should be ok with
twitter bootstrap. Also, you can skip <i> style and assign icon classes
directly to text elements, if you don't mind about IE7.
- demo.html - demo file, to show your webfont content
- LICENSE.txt - license info about source fonts, used to build your one.
- config.json - keeps your settings. You can import it back into fontello
anytime, to continue your work
Why so many CSS files ?
-----------------------
Because we like to fit all your needs :)
- basic file, <your_font_name>.css - is usually enough, it contains @font-face
and character code definitions
- *-ie7.css - if you need IE7 support, but still don't wish to put char codes
directly into html
- *-codes.css and *-ie7-codes.css - if you like to use your own @font-face
rules, but still wish to benefit from css generation. That can be very
convenient for automated asset build systems. When you need to update font -
no need to manually edit files, just override old version with archive
content. See fontello source code for examples.
- *-embedded.css - basic css file, but with embedded WOFF font, to avoid
CORS issues in Firefox and IE9+, when fonts are hosted on the separate domain.
We strongly recommend to resolve this issue by `Access-Control-Allow-Origin`
server headers. But if you ok with dirty hack - this file is for you. Note,
that data url moved to separate @font-face to avoid problems with <IE9, when
string is too long.
- animate.css - use it to get ideas about spinner rotation animation.
Attention for server setup
--------------------------
You MUST setup server to reply with proper `mime-types` for font files -
otherwise some browsers will fail to show fonts.
Usually, `apache` already has necessary settings, but `nginx` and other
webservers should be tuned. Here is list of mime types for our file extensions:
- `application/vnd.ms-fontobject` - eot
- `application/x-font-woff` - woff
- `application/x-font-ttf` - ttf
- `image/svg+xml` - svg

792
src/assets/fonts/fontello-771c82e0/config.json Normal file
View File

@@ -0,0 +1,792 @@
{
"name": "fontello",
"css_prefix_text": "icon-",
"css_use_suffix": false,
"hinting": true,
"units_per_em": 1000,
"ascent": 850,
"glyphs": [
{
"uid": "58a16628dcbd6456c61218f3d27591be",
"css": "skype",
"code": 61822,
"src": "fontawesome"
},
{
"uid": "627abcdb627cb1789e009c08e2678ef9",
"css": "twitter",
"code": 61593,
"src": "fontawesome"
},
{
"uid": "f3d95e13eb43f3f6b8efe1eb424a1e3b",
"css": "vkontakte",
"code": 61833,
"src": "fontawesome"
},
{
"uid": "87276033a77d0b9b890125c3639e4f87",
"css": "slack",
"code": 61848,
"src": "fontawesome"
},
{
"uid": "e1597911f34fea0a188ae51fe4a2d9a9",
"css": "stackoverflow",
"code": 61804,
"src": "fontawesome"
},
{
"uid": "8e04c98c8f5ca0a035776e3001ad2638",
"css": "facebook",
"code": 61594,
"src": "fontawesome"
},
{
"uid": "5e0a374728ffa8d0ae1f331a8f648231",
"css": "github",
"code": 61715,
"src": "fontawesome"
},
{
"uid": "38575a803c4da31ce20d77e1e1236bcb",
"css": "paper-plane",
"code": 61912,
"src": "fontawesome"
},
{
"uid": "4c1ef492f1d2c39a2250ae457cee2a6e",
"css": "instagram",
"code": 61805,
"src": "fontawesome"
},
{
"uid": "bf882b30900da12fca090d9796bc3030",
"css": "mail",
"code": 59392,
"src": "fontawesome"
},
{
"uid": "199c44bca402ec5a6351f75ba5228375",
"css": "dribbble",
"code": 61821,
"src": "fontawesome"
},
{
"uid": "72b1277834cba5b7944b0a6cac7ddb0d",
"css": "rss",
"code": 61598,
"src": "fontawesome"
},
{
"uid": "9d3e9faf68fd4e12def853f0d4e1173b",
"css": "whatsapp",
"code": 62002,
"src": "fontawesome"
},
{
"uid": "e9107949dd6c9e8ab2b29ae07156e38c",
"css": "linkedin",
"code": 61665,
"src": "fontawesome"
},
{
"uid": "43fcf807461234935e65261328e1dff6",
"css": "tumblr",
"code": 61811,
"src": "fontawesome"
},
{
"uid": "2f87e74e6eb8d985044bf7f3c47cb50b",
"css": "odnoklassniki",
"code": 62051,
"src": "fontawesome"
},
{
"uid": "190ef5c5f25ece755d6d64130ae02f80",
"css": "file-text2",
"code": 59396,
"src": "custom_icons",
"selected": false,
"svg": {
"path": "M896.3 223.7C874.6 194.1 844.4 159.5 811.2 126.3S743.4 62.9 713.8 41.2C663.4 4.3 639 0 625 0H140.6C97.5 0 62.5 35 62.5 78.1V921.9C62.5 965 97.5 1000 140.6 1000H859.4C902.5 1000 937.5 965 937.5 921.9V312.5C937.5 298.5 933.2 274.1 896.3 223.7ZM767 170.5C796.9 200.5 820.5 227.6 837.8 250H687.5V99.7C709.9 117 737 140.6 767 170.5ZM875 921.9C875 930.3 867.8 937.5 859.4 937.5H140.6C132.2 937.5 125 930.3 125 921.9V78.1C125 69.7 132.2 62.5 140.6 62.5 140.6 62.5 625 62.5 625 62.5V281.3C625 298.5 639 312.5 656.3 312.5H875V921.9ZM718.8 812.5H281.3C264 812.5 250 798.5 250 781.3S264 750 281.3 750H718.8C736 750 750 764 750 781.3S736 812.5 718.8 812.5ZM718.8 687.5H281.3C264 687.5 250 673.5 250 656.3S264 625 281.3 625H718.8C736 625 750 639 750 656.3S736 687.5 718.8 687.5ZM718.8 562.5H281.3C264 562.5 250 548.5 250 531.3S264 500 281.3 500H718.8C736 500 750 514 750 531.3S736 562.5 718.8 562.5Z",
"width": 1000
},
"search": [
"file-text2"
]
},
{
"uid": "b841cb9f2cce3ce2a2a385d28e3e5f29",
"css": "clock",
"code": 59405,
"src": "custom_icons",
"selected": false,
"svg": {
"path": "M643.3 731.7L437.5 525.9V250H562.5V474.1L731.7 643.3ZM500 0C223.9 0 0 223.9 0 500S223.9 1000 500 1000 1000 776.1 1000 500 776.1 0 500 0ZM500 875C292.9 875 125 707.1 125 500S292.9 125 500 125C707.1 125 875 292.9 875 500S707.1 875 500 875Z",
"width": 1000
},
"search": [
"clock"
]
},
{
"uid": "9e646020c04b332e553c7b0a22dd998d",
"css": "alarm",
"code": 59406,
"src": "custom_icons",
"selected": false,
"svg": {
"path": "M500 125C258.4 125 62.5 320.9 62.5 562.5S258.4 1000 500 1000 937.5 804.1 937.5 562.5 741.6 125 500 125ZM500 914.1C305.8 914.1 148.4 756.7 148.4 562.5 148.4 368.3 305.8 210.9 500 210.9 694.2 210.9 851.6 368.3 851.6 562.5 851.6 756.7 694.2 914.1 500 914.1ZM912.9 280.4C928.5 253 937.5 221.3 937.5 187.5 937.5 83.9 853.6 0 750 0 689.6 0 635.9 28.5 601.6 72.8 730.4 99.4 841.1 175.6 912.9 280.4V280.4ZM398.4 72.8C364.1 28.5 310.4 0 250 0 146.4 0 62.5 83.9 62.5 187.5 62.5 221.3 71.5 253 87.1 280.4 158.9 175.6 269.6 99.4 398.4 72.8ZM500 562.5V312.5H437.5V625H687.5V562.5Z",
"width": 1000
},
"search": [
"alarm"
]
},
{
"uid": "9e816caf7d05ad7f7e464df5e172fa51",
"css": "display",
"code": 59651,
"src": "custom_icons",
"selected": false,
"svg": {
"path": "M0 62.5V687.5H1000V62.5H0ZM937.5 625H62.5V125H937.5V625ZM656.3 750H343.8L312.5 875 250 937.5H750L687.5 875Z",
"width": 1000
},
"search": [
"display"
]
},
{
"uid": "531ef1039ee5966723e693a867c22bc4",
"css": "mobile",
"code": 59652,
"src": "custom_icons",
"selected": false,
"svg": {
"path": "M718.8 0H281.3C229.7 0 187.5 42.2 187.5 93.8V906.3C187.5 957.8 229.7 1000 281.3 1000H718.8C770.3 1000 812.5 957.8 812.5 906.3V93.8C812.5 42.2 770.3 0 718.8 0ZM375 46.9H625V78.1H375V46.9ZM500 937.5C465.5 937.5 437.5 909.5 437.5 875S465.5 812.5 500 812.5 562.5 840.5 562.5 875 534.5 937.5 500 937.5ZM750 750H250V125H750V750Z",
"width": 1000
},
"search": [
"mobile"
]
},
{
"uid": "fb64ed4352555da6a0e29454001b91c3",
"css": "mobile2",
"code": 59653,
"src": "custom_icons",
"selected": false,
"svg": {
"path": "M750 0H187.5C153.1 0 125 28.1 125 62.5V937.5C125 971.9 153.1 1000 187.5 1000H750C784.4 1000 812.5 971.9 812.5 937.5V62.5C812.5 28.1 784.4 0 750 0ZM468.8 954.9C441.9 954.9 420.1 933.1 420.1 906.3S441.9 857.6 468.8 857.6 517.4 879.4 517.4 906.3 495.6 954.9 468.8 954.9ZM750 812.5H187.5V125H750V812.5Z",
"width": 1000
},
"search": [
"mobile2"
]
},
{
"uid": "4baa9f36aa5fa117649f3bc826e8b3e9",
"css": "tablet",
"code": 59654,
"src": "custom_icons",
"selected": false,
"svg": {
"path": "M781.3 0H156.3C104.7 0 62.5 42.2 62.5 93.8V906.3C62.5 957.8 104.7 1000 156.3 1000H781.3C832.8 1000 875 957.8 875 906.3V93.8C875 42.2 832.8 0 781.3 0ZM468.8 968.8C451.5 968.8 437.5 954.8 437.5 937.5S451.5 906.3 468.8 906.3 500 920.2 500 937.5 486 968.8 468.8 968.8ZM750 875H187.5V125H750V875Z",
"width": 1000
},
"search": [
"tablet"
]
},
{
"uid": "2d5c7be7d8fad80dd6c6da86c2d2cf3e",
"css": "database",
"code": 59400,
"src": "custom_icons",
"selected": false,
"svg": {
"path": "M500 0C223.9 0 0 70 0 156.3V281.3C0 367.5 223.9 437.5 500 437.5S1000 367.5 1000 281.3V156.3C1000 70 776.1 0 500 0ZM500 531.3C223.9 531.3 0 461.3 0 375V562.5C0 648.8 223.9 718.8 500 718.8S1000 648.8 1000 562.5V375C1000 461.3 776.1 531.3 500 531.3ZM500 812.5C223.9 812.5 0 742.5 0 656.3V843.8C0 930 223.9 1000 500 1000S1000 930 1000 843.8V656.3C1000 742.5 776.1 812.5 500 812.5Z",
"width": 1000
},
"search": [
"database"
]
},
{
"uid": "0486b501f6560b04a9a7e8e346d748a8",
"css": "hour-glass",
"code": 59656,
"src": "custom_icons",
"selected": false,
"svg": {
"path": "M711.9 500C846.4 414.7 937.5 250.8 937.5 62.5 937.5 41.3 936.3 20.5 934.1 0H65.9C63.7 20.5 62.5 41.3 62.5 62.5 62.5 250.8 153.6 414.7 288.1 500 153.6 585.3 62.5 749.2 62.5 937.5 62.5 958.7 63.7 979.5 65.9 1000H934.1C936.3 979.5 937.5 958.7 937.5 937.5 937.5 749.2 846.4 585.3 711.9 500ZM156.3 937.5C156.3 755 234.5 600.2 375 549.1V450.9C234.5 399.8 156.3 245 156.3 62.5V62.5H843.8C843.8 245 765.5 399.8 625 450.9V549.1C765.5 600.2 843.8 755 843.8 937.5H156.3ZM605.1 653.9C535.1 614.2 531.3 562.7 531.3 531.5V468.8C531.3 437.5 535 385.8 605.2 346 642.8 324.2 675.3 291 700 250H300C324.7 291 357.2 324.3 394.9 346.1 464.9 385.8 468.7 437.3 468.8 468.5V531.3C468.8 562.5 465 614.2 394.8 654 323.9 695.2 271 776.7 255 875H745C729 776.7 676.1 695.1 605.1 653.9Z",
"width": 1000
},
"search": [
"hour-glass"
]
},
{
"uid": "c3c5f6a9226093594755ed6178974408",
"css": "search",
"code": 59395,
"src": "custom_icons",
"selected": false,
"svg": {
"path": "M969 851L732.1 649.5C707.7 627.5 681.5 617.4 660.3 618.3 716.2 552.8 750 467.9 750 375 750 167.9 582.1 0 375 0 167.9 0 0 167.9 0 375S167.9 750 375 750C467.9 750 552.8 716.2 618.3 660.3 617.4 681.5 627.5 707.7 649.5 732.1L851 969C885.5 1007.3 941.8 1010.6 976.2 976.2S1007.3 885.5 969 851ZM375 625C236.9 625 125 513.1 125 375S236.9 125 375 125 625 236.9 625 375 513.1 625 375 625Z",
"width": 1000
},
"search": [
"search"
]
},
{
"uid": "1edec97f65d29893b288b845a045b063",
"css": "key",
"code": 59401,
"src": "custom_icons",
"selected": false,
"svg": {
"path": "M687.5 0C514.9 0 375 139.9 375 312.5 375 332.1 376.8 351.2 380.3 369.8L0 750V937.5C0 972 28 1000 62.5 1000H125V937.5H250V812.5H375V687.5H500L581.1 606.4C614.3 618.4 650.1 625 687.5 625 860.1 625 1000 485.1 1000 312.5S860.1 0 687.5 0ZM781.1 312.6C729.3 312.6 687.4 270.7 687.4 218.9S729.3 125.1 781.1 125.1 874.9 167.1 874.9 218.9 832.9 312.6 781.1 312.6Z",
"width": 1000
},
"search": [
"key"
]
},
{
"uid": "337184e63a772c6f3f2721cd9b75fb90",
"css": "key2",
"code": 59402,
"src": "custom_icons",
"selected": false,
"svg": {
"path": "M978.6 306.9L879.9 208.1C855.7 183.9 816.1 144.3 791.9 120.1L693.1 21.4C668.9-2.9 625.8-7.1 597.3 11.9L327.3 191.8C298.8 210.8 288.1 251.4 303.4 282.1L372.2 419.7C374.3 423.9 376.7 428.4 379.4 433.1L31.3 781.3 0 1000H187.5V937.5H312.5V812.5H437.5V687.5H562.5V618C568.7 621.7 574.7 625 580.3 627.8L717.9 696.6C748.6 711.9 789.2 701.2 808.2 672.7L988.1 402.7C1007.1 374.2 1002.9 331.1 978.6 306.9ZM147.1 834.6L102.9 790.4 407.2 486.1 451.4 530.3 147.1 834.6ZM895.5 413.8L851.3 458C839.2 470.2 819.3 470.2 807.1 458L542 192.9C529.8 180.7 529.8 160.8 542 148.7L586.2 104.5C598.3 92.3 618.2 92.3 630.4 104.5L895.5 369.6C907.7 381.8 907.7 401.7 895.5 413.8Z",
"width": 1000
},
"search": [
"key2"
]
},
{
"uid": "482d798b2fd95eb7e6b89c9b042a9b83",
"css": "lock",
"code": 59403,
"src": "custom_icons",
"selected": false,
"svg": {
"path": "M578.1 437.5H562.5V250C562.5 146.6 478.4 62.5 375 62.5H250C146.6 62.5 62.5 146.6 62.5 250V437.5H46.9C21.1 437.5 0 458.6 0 484.4V953.1C0 978.9 21.1 1000 46.9 1000H578.1C603.9 1000 625 978.9 625 953.1V484.4C625 458.6 603.9 437.5 578.1 437.5ZM187.5 250C187.5 215.5 215.5 187.5 250 187.5H375C409.5 187.5 437.5 215.5 437.5 250V437.5H187.5V250Z",
"width": 1000
},
"search": [
"lock"
]
},
{
"uid": "86ba7d10c3e3dee2e2741d43af6c748c",
"css": "unlocked",
"code": 59404,
"src": "custom_icons",
"selected": false,
"svg": {
"path": "M750 62.5C853.4 62.5 937.5 146.6 937.5 250V437.5H812.5V250C812.5 215.5 784.5 187.5 750 187.5H625C590.5 187.5 562.5 215.5 562.5 250V437.5H578.1C603.9 437.5 625 458.6 625 484.4V953.1C625 978.9 603.9 1000 578.1 1000H46.9C21.1 1000 0 978.9 0 953.1V484.4C0 458.6 21.1 437.5 46.9 437.5H437.5V250C437.5 146.6 521.6 62.5 625 62.5H750Z",
"width": 1000
},
"search": [
"unlocked"
]
},
{
"uid": "e461ff71fe3a3d83794b84c2a6fc088a",
"css": "cog",
"code": 59392,
"src": "custom_icons",
"selected": false,
"svg": {
"path": "M911.9 595.9C859.4 505.1 891 388.6 982.4 335.7L884.1 165.5C856 182 823.4 191.4 788.5 191.4 683.5 191.4 598.4 105.7 598.4 0H401.9C402.1 32.6 394 65.7 376.5 95.9 324 186.8 207.4 217.7 115.9 165L17.6 335.3C45.9 351.3 70.4 374.9 87.8 405.1 140.2 495.8 108.8 612 17.8 665L116.1 835.2C144.1 818.9 176.5 809.6 211.2 809.6 315.9 809.6 400.8 894.8 401.3 1000H597.9C597.8 967.7 605.9 935 623.2 905.1 675.6 814.3 792 783.4 883.4 835.7L981.7 665.5C953.6 649.4 929.2 626 911.9 595.9ZM500 702.5C388.2 702.5 297.5 611.8 297.5 500 297.5 388.2 388.2 297.5 500 297.5 611.8 297.5 702.5 388.2 702.5 500 702.5 611.8 611.8 702.5 500 702.5Z",
"width": 1000
},
"search": [
"cog"
]
},
{
"uid": "1ae3c5c6f62f8e25572e3d4f00261e48",
"css": "cogs",
"code": 59393,
"src": "custom_icons",
"selected": false,
"svg": {
"path": "M355.2 705.1L395.5 648.7 351.3 604.5 294.9 644.8C284.4 638.9 273.2 634.3 261.4 630.9L250 562.5H187.5L176.1 630.9C164.3 634.3 153.1 638.9 142.6 644.8L86.2 604.5 42 648.7 82.3 705.1C76.4 715.6 71.8 726.8 68.4 738.6L0 750V812.5L68.4 823.9C71.8 835.7 76.4 846.9 82.3 857.4L42 913.8 86.2 958 142.6 917.7C153.1 923.6 164.3 928.2 176.1 931.6L187.5 1000H250L261.4 931.6C273.2 928.2 284.4 923.6 294.9 917.7L351.3 958 395.5 913.8 355.2 857.4C361 846.9 365.7 835.7 369.1 823.9L437.5 812.5V750L369.1 738.6C365.7 726.8 361.1 715.6 355.2 705.1ZM218.8 843.8C184.2 843.8 156.3 815.8 156.3 781.3S184.2 718.8 218.8 718.8 281.3 746.7 281.3 781.3 253.3 843.8 218.8 843.8ZM1000 375V312.5L934.2 300.5C933 292.7 931.4 284.9 929.6 277.3L985.8 241.1 961.9 183.3 896.5 197.5C892.4 190.7 888 184.2 883.3 177.8L921.4 122.8 877.2 78.6 822.2 116.7C815.8 112 809.3 107.6 802.5 103.5L816.7 38.1 758.9 14.2 722.7 70.4C715.1 68.6 707.3 67 699.5 65.8L687.5 0H625L613 65.8C605.2 67 597.4 68.6 589.8 70.4L553.6 14.2 495.8 38.1 510 103.5C503.2 107.6 496.7 112 490.3 116.7L435.3 78.6 391.1 122.8 429.2 177.8C424.5 184.2 420.1 190.7 416 197.5L350.6 183.3 326.7 241.1 382.9 277.3C381.1 284.9 379.5 292.7 378.3 300.5L312.5 312.5V375L378.3 387C379.5 394.8 381.1 402.6 382.9 410.2L326.7 446.4 350.6 504.2 416 490C420.1 496.8 424.5 503.3 429.2 509.7L391.1 564.7 435.3 608.9 490.3 570.8C496.7 575.5 503.2 579.9 510 584L495.8 649.4 553.6 673.3 589.8 617.1C597.4 618.9 605.2 620.5 613 621.7L625 687.5H687.5L699.5 621.7C707.3 620.5 715.1 618.9 722.7 617.1L758.9 673.3 816.7 649.4 802.5 584C809.3 579.9 815.8 575.5 822.2 570.8L877.2 608.9 921.4 564.7 883.3 509.7C888 503.3 892.4 496.8 896.5 490L961.9 504.2 985.8 446.4 929.6 410.2C931.4 402.6 933 394.8 934.2 387L1000 375ZM656.3 479.7C581.2 479.7 520.3 418.8 520.3 343.8S581.2 207.8 656.3 207.8 792.2 268.7 792.2 343.8C792.2 418.8 731.3 479.7 656.3 479.7Z",
"width": 1000
},
"search": [
"cogs"
]
},
{
"uid": "22564d007384d83cb8d0b19b64054152",
"css": "aid-kit",
"code": 59664,
"src": "custom_icons",
"selected": false,
"svg": {
"path": "M875 250H687.5V125C687.5 90.6 659.4 62.5 625 62.5H375C340.6 62.5 312.5 90.6 312.5 125V250H125C56.3 250 0 306.3 0 375V875C0 943.8 56.3 1000 125 1000H875C943.8 1000 1000 943.8 1000 875V375C1000 306.3 943.8 250 875 250ZM375 125H625V250H375V125ZM750 687.5H562.5V875H437.5V687.5H250V562.5H437.5V375H562.5V562.5H750V687.5Z",
"width": 1000
},
"search": [
"aid-kit"
]
},
{
"uid": "835771ff28375ecd0288bf5f49e57cdc",
"css": "meter",
"code": 59394,
"src": "custom_icons",
"selected": false,
"svg": {
"path": "M500 62.5C776.1 62.5 1000 286.4 1000 562.5 1000 750.8 895.9 914.7 742.2 1000H257.8C104.1 914.7 0 750.8 0 562.5 0 286.4 223.9 62.5 500 62.5ZM783.1 845.6C858.7 770 900.4 669.4 900.4 562.5H812.5V500H895.5C888.7 456.1 874.7 413.9 854 375H750V312.5H812.8C803.6 301 793.7 289.9 783.1 279.4 738 234.2 684 201.2 625 181.9V250H562.5V167C542 163.8 521.1 162.1 500 162.1S458 163.8 437.5 167V250H375V181.9C316 201.2 262 234.2 216.9 279.4 206.3 289.9 196.4 301 187.2 312.5H250V375H146C125.3 413.9 111.3 456.1 104.5 500H187.5V562.5H99.6C99.6 669.4 141.3 770 216.9 845.6 227.3 856.1 238.3 865.9 249.7 875H437.5L473.2 375H526.8L562.5 875H750.3C761.7 865.9 772.7 856.1 783.1 845.6Z",
"width": 1000
},
"search": [
"meter"
]
},
{
"uid": "19bb52fb40a141b7613533cb0fded2ce",
"css": "meter2",
"code": 59395,
"src": "custom_icons",
"selected": false,
"svg": {
"path": "M500 0C223.9 0 0 223.9 0 500S223.9 1000 500 1000 1000 776.1 1000 500 776.1 0 500 0ZM295.7 814.6C306.6 784.7 312.5 752.4 312.5 718.8 312.5 597.3 235.5 493.9 127.7 454.5 137.7 371.6 174.8 294.8 234.8 234.8 305.7 164 399.8 125 500 125S694.3 164 765.2 234.8C825.2 294.8 862.3 371.6 872.3 454.5 764.5 493.9 687.5 597.3 687.5 718.8 687.5 752.4 693.4 784.7 704.3 814.6 644 853.9 573.6 875 500 875 426.4 875 356 853.9 295.7 814.6ZM538.8 626C552.4 629.4 562.5 641.7 562.5 656.3V718.8C562.5 735.9 548.4 750 531.3 750H468.8C451.6 750 437.5 735.9 437.5 718.8V656.3C437.5 641.7 447.6 629.4 461.2 626L484.4 187.5H515.6L538.8 626Z",
"width": 1000
},
"search": [
"meter2"
]
},
{
"uid": "6c1bb252a361b9d0bbfc6a63bbe7a096",
"css": "wordpress",
"code": 59667,
"src": "custom_icons",
"selected": false,
"svg": {
"path": "M125 500C125 644.5 211.3 769.5 336.4 828.7L157.5 351.4C136.7 396.8 125 447 125 500ZM753.2 481.6C753.2 436.4 736.5 405.2 722.2 380.8 703.2 350.7 685.4 325.3 685.4 295.2 685.4 261.6 711.5 230.4 748.4 230.4 750 230.4 751.6 230.6 753.2 230.7 686.5 171.1 597.6 134.8 500 134.8 369 134.8 253.7 200.2 186.7 299.4 195.5 299.7 203.8 299.8 210.8 299.8 250 299.8 310.8 295.2 310.8 295.2 331 294 333.3 323 313.2 325.3 313.2 325.3 292.8 327.6 270.2 328.8L406.8 724.4 488.9 484.7 430.4 328.8C410.2 327.6 391.1 325.3 391.1 325.3 370.9 324.1 373.3 294 393.5 295.2 393.5 295.2 455.4 299.8 492.3 299.8 531.5 299.8 592.2 295.2 592.2 295.2 612.4 294 614.8 323 594.6 325.3 594.6 325.3 574.3 327.6 551.7 328.8L687.2 721.3 724.6 599.6C740.8 549.1 753.2 512.8 753.2 481.6ZM506.6 531.9L394.1 850.4C427.7 860 463.2 865.2 500 865.2 543.7 865.2 585.6 857.9 624.5 844.5 623.5 843 622.6 841.3 621.8 839.5L506.6 531.9ZM829.1 324.8C830.7 336.4 831.6 348.9 831.6 362.3 831.6 399.4 824.5 441 803.1 493.1L688.5 815.7C800 752.4 875 634.7 875 500 875 436.5 858.3 376.8 829.1 324.8ZM500 0C223.9 0 0 223.9 0 500S223.9 1000 500 1000 1000 776.1 1000 500 776.1 0 500 0ZM500 937.5C258.4 937.5 62.5 741.6 62.5 500S258.4 62.5 500 62.5 937.5 258.4 937.5 500 741.6 937.5 500 937.5Z",
"width": 1000
},
"search": [
"wordpress"
]
},
{
"uid": "6cde86e693a9fb99d864e087a402c08b",
"css": "chrome",
"code": 59405,
"src": "custom_icons",
"selected": false,
"svg": {
"path": "M252.2 436.1L109.1 188.2C200.7 73.5 341.8 0 500 0 683 0 843.1 98.4 930.2 245.1H522.2C514.9 244.5 507.5 244.1 500 244.1 381 244.1 280.7 325.8 252.2 436.1ZM679 317.4H965.6C987.8 374 1000 435.6 1000 500 1000 774.2 779.2 996.9 505.7 999.9L710.2 645.8C739 604.4 755.9 554.1 755.9 500 755.9 428.5 726.4 363.8 679 317.4ZM318.4 500C318.4 399.8 399.8 318.4 500 318.4S681.6 399.8 681.6 500C681.6 600.2 600.2 681.6 500 681.6S318.4 600.2 318.4 500ZM568.5 746.5L425.4 994.5C184.6 958.4 0 750.8 0 500 0 410.9 23.3 327.3 64.2 254.9L268.3 608.4C309.2 695.5 397.7 755.9 500 755.9 523.7 755.9 546.7 752.6 568.5 746.5Z",
"width": 1000
},
"search": [
"chrome"
]
},
{
"uid": "239e2cb8ae14ba1347db383178b34301",
"css": "firefox",
"code": 59402,
"src": "custom_icons",
"selected": false,
"svg": {
"path": "M998.6 326.3L987 400.6C987 400.6 970.4 263.1 950.1 211.6 919 132.8 905.2 133.5 905.1 133.6 925.9 186.5 922.2 214.9 922.2 214.9S885.3 114.4 787.7 82.4C679.6 46.9 621.1 56.6 614.3 58.5 613.3 58.4 612.3 58.4 611.4 58.4 612.2 58.5 613 58.6 613.8 58.6 613.7 58.7 613.7 58.7 613.7 58.7 614.1 59.2 733.1 79.5 754.2 108.5 754.2 108.5 703.7 108.5 653.4 123 651.1 123.6 838.4 146.4 876.8 333.6 876.8 333.6 856.2 290.8 830.8 283.5 847.5 334.3 843.2 430.7 827.3 478.7 825.3 484.8 823.2 452 791.8 437.9 801.9 509.8 791.2 623.9 741.3 655.3 737.5 657.7 772.6 542.7 748.4 587.2 609.1 800.8 444.3 685.8 370.2 635.1 408.2 643.4 480.3 633.8 512.2 610.1 512.2 610.1 512.2 610.1 512.3 610 546.9 586.3 567.4 569.1 585.8 573.1 604.3 577.3 616.5 558.8 602.2 542.4 587.9 525.9 553.1 503.3 506 515.6 472.8 524.3 431.7 561.1 368.9 523.9 320.6 495.3 316.1 471.6 315.7 455.1 316.9 449.3 318.4 443.9 320.2 438.9 325.7 423.4 342.5 418.7 351.9 415 367.8 417.8 381.4 422.7 395.8 430.1 396 425.3 396 419 395.8 411.8 397.2 409 396.3 400.8 394.1 390.7 392.8 380.6 390.8 370.2 387.5 360.7 387.5 360.7 387.5 360.7 387.5 360.7 387.6 360.7 387.6 360.7 387.7 360.6 387.8 360.6 387.8 360.5 387.9 360.4 387.9 360.4 387.9 360.4 387.9 360.4 388 360.3 388.1 360.1 388.1 359.9 389.1 355.4 399.9 346.7 413.2 337.4 425.2 329 439.3 320.1 450.4 313.2 460.2 307.1 467.7 302.6 469.3 301.4 469.9 300.9 470.6 300.4 471.4 299.8 471.6 299.7 471.7 299.6 471.9 299.5 472 299.4 472.1 299.3 472.1 299.2 477.4 295 485.3 287.1 487 270.3 487 270.3 487 270.3 487 270.2 487 269.7 487.1 269.2 487.1 268.7 487.1 268.4 487.2 268 487.2 267.7 487.2 267.4 487.2 267.1 487.2 266.8 487.2 266.2 487.3 265.5 487.3 264.8 487.3 264.8 487.3 264.7 487.3 264.7 487.3 263.1 487.3 261.4 487.2 259.6 487.1 258.6 487.1 257.7 486.9 256.9 486.9 256.9 486.9 256.8 486.9 256.8 486.8 256.7 486.8 256.6 486.8 256.5 486.8 256.4 486.7 256.3 486.7 256.1 486.7 256.1 486.7 256.1 486.7 256.1 486.6 255.9 486.6 255.8 486.5 255.6 486.5 255.6 486.5 255.6 486.5 255.6 484.8 251.6 478.4 250.1 451.9 249.6 451.9 249.6 451.8 249.6 451.8 249.6V249.6C441 249.5 426.9 249.4 408.3 249.5 375.9 249.7 357.9 217.8 352.2 205.4 360.1 162 382.7 131.1 420 110.1 420.7 109.7 420.6 109.4 419.8 109.2 427 104.7 331.6 109 287.7 164.9 248.8 155.2 214.8 155.8 185.6 162.7 180 162.5 173 161.8 164.6 160.1 145.2 142.5 117.3 109.9 115.8 71 115.8 71 115.8 71.1 115.6 71.2 115.6 70.9 115.5 70.5 115.5 70.1 115.5 70.1 56.2 115.7 65.1 239.9 65.1 241.9 65 243.8 65 245.7 48.9 267.4 41 285.7 40.4 289.8 26.2 318.7 11.7 362.3 0 428.4 0 428.4 8.2 402.4 24.7 372.9 12.6 410 3 467.8 8.6 554.4 8.6 554.4 10.1 535.2 15.4 507.5 19.4 561.2 37.3 627.6 82.6 705.5 169.5 855.3 303 930.9 450.6 942.5 476.8 944.6 503.3 944.7 530.1 942.7 532.5 942.5 535 942.3 537.4 942.1 567.7 940 598.1 935.4 628.5 928.1 1043.7 827.7 998.6 326.3 998.6 326.3Z",
"width": 1000
},
"search": [
"firefox"
]
},
{
"uid": "2754d01a17a427ca7308c96ba44016be",
"css": "IE",
"code": 59401,
"src": "custom_icons",
"selected": false,
"svg": {
"path": "M717 614.1H947.5C949.3 598.1 950 581.8 950 565.1 950 486.7 929 413.2 892.3 350 930.2 249.1 928.9 163.5 878 112.3 829.7 64.2 700 72 553.4 136.9 542.6 136.1 531.6 135.6 520.6 135.6 319.4 135.6 150.5 274.1 103.9 460.7 167 379.9 233.4 321.3 322.1 278.6 314 286.2 267 333 259.1 340.9 25.1 574.8-48.6 880.2 30.7 959.6 91.1 1020 200.4 1009.8 326 948.3 384.4 978 450.5 994.8 520.6 994.8 709.2 994.8 869 873.4 926.9 704.3H694.6C662.7 763.3 600.1 803.4 528.4 803.4 456.6 803.4 394.1 763.3 362.2 704.3 348 677.7 339.8 647.1 339.8 614.8V614.1H717ZM340.1 500.8C345.5 406 424.3 330.3 520.6 330.3S695.7 405.9 701 500.8H340.1ZM875.9 160C908.7 193.1 907.9 253.9 879.9 329.9 831.9 256.8 762.2 199.1 679.9 166.2 767.9 128.5 839.4 123.5 875.9 160ZM91.3 944.6C49.5 902.8 62.1 815.1 115.9 709.4 149.4 803.4 214.7 882.3 298.9 933.2 205.7 975.5 129.4 982.7 91.3 944.6Z",
"width": 1000
},
"search": [
"IE"
]
},
{
"uid": "739a1ff3d86266305f1a7b52ba792cc1",
"css": "opera",
"code": 59400,
"src": "custom_icons",
"selected": false,
"svg": {
"path": "M498.1 0C224.9 0 28.6 198.1 28.6 495.3 28.6 759.8 219.5 1000 498.1 1000 779.5 1000 971.4 759.9 971.4 495.3 971.4 195.8 768.8 0 498.1 0ZM672.2 486.9C672.2 652.2 663.3 887.7 498.1 887.7V887.8C335.3 887.8 328.8 652.1 328.8 487.1 328.8 293.3 346.9 107.6 498.1 107.6 649.4 107.6 672.2 295.7 672.2 486.9Z",
"width": 1000
},
"search": [
"opera"
]
},
{
"uid": "8400314587873c54e2777a165ae9c7ea",
"css": "safari",
"code": 59398,
"src": "custom_icons",
"selected": false,
"svg": {
"path": "M500 62.5C476.5 62.5 453.4 64.3 430.8 67.6 430.5 66.8 430.2 66.1 429.9 65.3 442.4 55.6 449 42.1 446.1 28.7 442.5 11.5 424.3 0 400.8 0 395.7 0 390.6 0.5 385.5 1.6 356 7.9 336.5 29.6 341 51 343.8 64 355 73.8 370.5 77.8 370.5 78.7 370.5 79.7 370.5 80.6 174.6 136.8 31.3 317.3 31.3 531.3 31.3 790.1 241.1 1000 500 1000 758.9 1000 968.8 790.1 968.8 531.3 968.8 272.4 758.9 62.5 500 62.5ZM356.3 47.8C353.7 35.3 368.5 21.2 388.7 16.9 392.7 16.1 396.8 15.6 400.8 15.6 416.4 15.6 428.8 22.3 430.8 31.9 432.4 39.3 427.8 47.2 419.7 53.3 412.8 48.5 404.1 46.4 395.2 48.2 386.4 50.1 379.2 55.6 374.9 62.7 365 60.4 357.8 54.9 356.3 47.8ZM751.4 782.6C708.4 825.5 656.4 856.1 599.7 872.6L558.3 805.4 547.8 883.5C532.1 885.6 516.1 886.7 500 886.7 405.1 886.7 315.8 849.7 248.6 782.6 205.7 739.7 175.1 687.7 158.7 630.9L225.8 589.5 147.7 579C145.6 563.3 144.5 547.4 144.5 531.3 144.5 436.3 181.5 347 248.6 279.9 291.6 237 343.6 206.4 400.3 189.9L441.7 257.1 452.2 179C467.9 176.9 483.9 175.8 500 175.8 594.9 175.8 684.2 212.8 751.4 279.9 794.3 322.8 824.9 374.8 841.3 431.6L774.2 473 852.3 483.5C854.4 499.2 855.5 515.1 855.5 531.3 855.5 626.2 818.5 715.5 751.4 782.6ZM743.1 288.2L550.7 434.4C536.4 426.9 520.6 422.6 504.4 421.9L454.5 317.3 451.5 433.2C438.6 439.5 427 448.5 417.5 459.5L355.9 437.6 400.9 485C394.7 498.2 391.2 512.4 390.7 526.9L286 576.7 402 579.7C402.4 580.5 402.7 581.2 403.1 582L256.9 774.3 449.3 628.1C463.6 635.6 479.4 639.9 495.6 640.6L545.5 745.2 548.5 629.3C561.5 623 573 614 582.5 603L644.1 624.9 599.1 577.5C605.3 564.3 608.8 550.1 609.3 535.6L714 485.8 598 482.8C597.6 482 597.3 481.3 596.9 480.5L743.1 288.2ZM500.1 434.1V434.1ZM480.5 439.5C487.1 438.2 493.6 437.5 500.1 437.5 504.1 437.5 508.2 437.7 512.1 438.3L512.2 438.3 512.2 438.3C520.7 439.4 529 441.7 536.7 445L466.9 498.1 413.8 568C411.4 562.5 409.6 556.8 408.3 550.7 397.5 500.1 429.9 450.3 480.5 439.5ZM548.9 611.2V611.2 611.2C540.1 616.6 530.2 620.7 519.5 623 512.9 624.3 506.4 625 499.9 625 495.9 625 491.8 624.8 487.9 624.2L487.8 624.2C479.3 623.1 471.1 620.8 463.3 617.5L533.1 564.4 586.3 494.5C588.6 500 590.4 505.7 591.7 511.8 600.2 551.7 581.9 591.1 548.9 611.2Z",
"width": 1000
},
"search": [
"safari"
]
},
{
"uid": "b9e321d44e62e5745b691ba42b063b03",
"css": "pinterest-p",
"code": 59399,
"src": "custom_icons",
"selected": false,
"svg": {
"path": "M0 342.1Q0 281.8 20.9 228.5T78.7 135.6 163.5 67 266.7 23.4 379.5 8.9Q467.6 8.9 543.5 46T666.9 154 714.3 314.2Q714.3 367.7 703.7 419.1T670.2 517.9 614.4 601.3 533.5 658.8 428 680.2Q390.1 680.2 352.7 662.4T299.1 613.3Q293.5 635 283.5 676.1T270.4 729.1 258.9 768.7 244.4 808.3 226.6 843.2 200.9 886.4 166.3 934.7L158.5 937.5 153.5 931.9Q145.1 844.3 145.1 827 145.1 775.7 157.1 711.8T194.2 551.3 223.2 438.1Q205.4 401.8 205.4 343.8 205.4 297.4 234.4 256.7T308 216Q342.1 216 361 238.6T380 295.8Q380 332.6 355.5 402.3T330.9 506.7Q330.9 541.9 356 565T416.9 588.2Q447.5 588.2 473.8 574.2T517.6 536.3 548.8 483.3 570 421.6 581.2 359.7 584.8 304.1Q584.8 207.6 523.7 153.7T364.4 99.9Q252.8 99.9 178 172.2T103.2 355.5Q103.2 380 110.2 402.9T125.3 439.2 140.3 464.6 147.3 481.6Q147.3 497.2 139 522.3T118.3 547.4Q117.2 547.4 108.8 545.8 80.4 537.4 58.3 514.5T24.3 461.8 6.1 401.5 0 342.1Z",
"width": 713.8671875
},
"search": [
"pinterest-p"
]
},
{
"uid": "c6abb859dc98ce46376a3a1d2b916ec9",
"css": "user-secret",
"code": 59674,
"src": "custom_icons",
"selected": false,
"svg": {
"path": "M321.4 866.1L375 616.1 321.4 544.6 250 508.9ZM464.3 866.1L535.7 508.9 464.3 544.6 410.7 616.1ZM553.6 302.5Q552.5 300.2 551.3 299.1 545.8 294.6 497.8 294.6 458.7 294.6 404.6 305.2 400.7 306.4 392.9 306.4T381.1 305.2Q327 294.6 287.9 294.6 240 294.6 234.4 299.1 233.3 300.2 232.1 302.5 233.3 312.5 234.4 317.5 235.5 319.2 238.6 321.1T242.7 327Q243.9 329.2 246.9 338.4T250.8 349.9 255 359.4 259.8 368.9 264.8 376.7 271.5 384.2 279.3 389.5 289.1 394 300.5 396.2 314.2 397.3Q334.3 397.3 347.1 390.3T365.2 373.6 373.3 354.4 379.7 337.9 389.5 330.9H396.2Q402.3 330.9 406 337.9T412.4 354.4 420.5 373.6 438.6 390.3 471.5 397.3Q478.8 397.3 485.2 396.2T496.6 394 506.4 389.5 514.2 384.2 520.9 376.7 525.9 368.9 530.7 359.4 534.9 349.9 538.8 338.4 543 327Q544.1 323.1 547.2 321.1T551.3 317.5Q552.5 312.5 553.6 302.5ZM785.7 793Q785.7 860.5 745 899T636.7 937.5H149Q81.5 937.5 40.7 899T0 793Q0 758.9 2.5 727.1T13.1 657.1 34 588.2 69.5 530.4 121.7 488.8L71.4 366.1H190.8Q178.6 330.4 178.6 294.6 178.6 287.9 179.7 276.8 71.4 254.5 71.4 223.2 71.4 191.4 188.6 168 198.1 133.4 217.4 93.2T256.7 29.6Q274.6 8.9 299.1 8.9 315.9 8.9 346 26.2T392.9 43.5 439.7 26.2 486.6 8.9Q511.2 8.9 529 29.6 549.1 53 568.4 93.2T597.1 168Q714.3 191.4 714.3 223.2 714.3 254.5 606 276.8 609.9 322 594.9 366.1H714.3L668.5 491.6Q703.7 510 728.5 545.5T765.1 625.6 781.3 710.1 785.7 793Z",
"width": 786.1328125
},
"search": [
"user-secret"
]
},
{
"uid": "0e49f4940343074bea7cb8a910941290",
"css": "line-chart",
"code": 59675,
"src": "custom_icons",
"selected": false,
"svg": {
"path": "M1142.9 866.1V937.5H0V80.4H71.4V866.1H1142.9ZM1071.4 169.6V412.4Q1071.4 424.1 1060.5 428.8T1040.7 424.7L973.2 357.1 620 710.4Q614.4 716 607.1 716T594.3 710.4L464.3 580.4 232.1 812.5 125 705.4 451.5 378.9Q457 373.3 464.3 373.3T477.1 378.9L607.1 508.9 866.1 250 798.5 182.5Q789.6 173.5 794.4 162.7T810.8 151.8H1053.6Q1061.4 151.8 1066.4 156.8T1071.4 169.6Z",
"width": 1142.578125
},
"search": [
"line-chart"
]
},
{
"uid": "dfb1ef1c8e8b2a4e6ec85ab8a5702fe4",
"css": "pie-chart",
"code": 59676,
"src": "custom_icons",
"selected": false,
"svg": {
"path": "M428.6 505.6L733.3 810.3Q674.1 870.5 595.1 904T428.6 937.5Q311.9 937.5 213.4 880T57.5 724.1 0 508.9 57.5 293.8 213.4 137.8 428.6 80.4V505.6ZM532.9 508.9H964.3Q964.3 596.5 930.8 675.5T837.1 813.6ZM928.6 437.5H500V8.9Q616.6 8.9 715.1 66.4T871.1 222.4 928.6 437.5Z",
"width": 1000
},
"search": [
"pie-chart"
]
},
{
"uid": "a0d910d27a9c3f4a2631869bfe85288f",
"css": "area-chart",
"code": 59677,
"src": "custom_icons",
"selected": false,
"svg": {
"path": "M1142.9 866.1V937.5H0V80.4H71.4V866.1H1142.9ZM928.6 294.6L1071.4 794.6H142.9V473.2L392.9 151.8 714.3 473.2Z",
"width": 1142.578125
},
"search": [
"area-chart"
]
},
{
"uid": "1a22134ce6369882654aaaa93ea4367d",
"css": "paint-brush",
"code": 59678,
"src": "custom_icons",
"selected": false,
"svg": {
"path": "M901.2 8.9Q940.3 8.9 969.6 34.9T998.9 99.9Q998.9 135 973.8 184.2 788.5 535.2 714.3 603.8 660.2 654.6 592.6 654.6 522.3 654.6 471.8 603T421.3 480.5Q421.3 409 472.7 362.2L828.7 39.1Q861.6 8.9 901.2 8.9ZM394 585.9Q415.7 628.3 453.4 658.5T537.4 700.9L537.9 740.5Q540.2 859.4 465.7 934.2T271.2 1008.9Q202.6 1008.9 149.6 983T64.5 911.8 16.2 809.7 0 686.9Q3.9 689.7 22.9 703.7T57.5 728.5 90.4 748.9 116.1 758.4Q139 758.4 146.8 737.7 160.7 700.9 178.9 674.9T217.6 632.5 266.7 606 324.2 591.8 394 585.9Z",
"width": 1000
},
"search": [
"paint-brush"
]
},
{
"uid": "4b5bba8110cc0cf5c56fc9c7451de8f1",
"css": "vk",
"code": 59392,
"src": "custom_icons",
"selected": false,
"svg": {
"path": "M1069.8 299.1Q1082.6 334.8 986 463.2 972.7 481 949.8 510.6 906.3 566.4 899.6 583.7 890.1 606.6 907.4 628.9 916.9 640.6 952.6 674.7H953.1L955.4 676.9Q1034 750 1061.9 800.2 1063.6 803 1065.6 807.2T1069.5 822 1069.2 841 1055.2 856.3 1022.3 863.3L879.5 865.5Q866.1 868.3 848.2 862.7T819.2 850.4L808 843.8Q791.3 832 769 808T730.7 764.8 696.7 732.4 665.2 723.8Q663.5 724.3 660.7 725.7T651.2 733.8 639.2 750.3 629.7 779.3 626.1 822.5Q626.1 830.9 624.2 837.9T620 848.2L617.7 851Q607.7 861.6 588.2 863.3H524Q484.4 865.5 442.5 854.1T369.1 824.5 311.7 787.7 272.3 755.6L258.4 742.2Q252.8 736.6 243 725.4T203.1 674.7 144 590.4 75.6 472.7 2.8 320.9Q-0.6 311.9-0.6 305.8T1.1 296.9L3.3 293.5Q11.7 282.9 35.2 282.9L188.1 281.8Q194.8 282.9 200.9 285.4T209.8 290.2L212.6 291.9Q221.5 298 226 309.7 237.2 337.6 251.7 367.5T274.6 412.9L283.5 429.1Q299.7 462.6 314.7 487.2T341.8 525.4 365 546.9 383.9 554.7 399 551.9Q400.1 551.3 401.8 549.1T408.5 536.8 416 510.6 421.3 465.4 421.3 395.6Q420.2 373.3 416.3 354.9T408.5 329.2L405.1 322.5Q391.2 303.6 357.7 298.5 350.4 297.4 360.5 285.2 370 274.6 381.7 268.4 411.3 253.9 515.1 255 560.8 255.6 590.4 262.3 601.6 265.1 609.1 269.8T620.5 283.2 626.4 301.1 628.3 326.5 627.8 357.1 626.4 396.5 625.6 442.5Q625.6 448.7 625 466T624.7 492.7 626.7 515.3 633.1 537.1 645.6 550.8Q650.1 551.9 655.1 553T669.6 546.9 690.8 527.6 719.9 490.2 757.8 430.2Q791.3 372.2 817.5 304.7 819.8 299.1 823.1 294.9T829.2 289.1L831.5 287.4 834.3 286T841.5 284.3 852.7 284L1013.4 282.9Q1035.2 280.1 1049.1 284.3T1066.4 293.5Z",
"width": 1071.2890625
},
"search": [
"vk"
]
},
{
"uid": "4543990c3c3e8b8aa88742e31afdfa44",
"css": "tumblr-1",
"code": 59423,
"src": "custom_icons",
"selected": false,
"svg": {
"path": "M526.8 750.6L571.4 882.8Q558.6 902.3 509.5 919.6T410.7 937.5Q352.7 938.6 304.4 923T224.9 881.7 171.9 822.5 140.9 755.6 131.7 689.7V386.2H37.9V266.2Q78.1 251.7 109.9 227.4T160.7 177.2 193.1 120.3 212.1 65 220.4 15.6Q221 12.8 222.9 10.9T227.1 8.9H363.3V245.5H549.1V386.2H362.7V675.2Q362.7 692 366.3 706.5T378.9 735.8 406.5 758.9 452 766.7Q495.5 765.6 526.8 750.6Z",
"width": 571.2890625
},
"search": [
"tumblr"
]
},
{
"uid": "3f854f5d504c40689944c513274856d4",
"css": "stack-overflow",
"code": 59424,
"src": "custom_icons",
"selected": false,
"svg": {
"path": "M517.9 790.7V875L123.3 875.6V791.3ZM652.3 597.7V988.8L651.8 1008.4V1008.9L0 1008.4V597.7H67.5V942.5H585.4V597.7H652.3ZM134.5 646.8L527.3 683 520.1 766.7 126.7 730.5ZM172.4 470.4L553.6 572.5 531.8 654 150.7 551.9ZM263.4 275.7L603.2 476.6 560.3 549.1 220.4 348.2ZM464.3 91L686.4 417.4 617.2 464.8 394.5 139ZM717.1 8.9L784.6 397.9 701.5 412.4 633.9 23.4Z",
"width": 786.1328125
},
"search": [
"stack-overflow"
]
},
{
"uid": "466f2bf65cfac3c3359a7c6596f47946",
"css": "bitcoin-1",
"code": 59393,
"src": "custom_icons",
"selected": false,
"svg": {
"path": "M651.2 366.1Q661.3 467.6 578.1 510 643.4 525.7 675.8 567.5T700.9 686.9Q697 726.6 682.8 756.7T646.8 806.4 592.6 839 524.8 858.3 443.6 866.6V1008.9H357.7V868.9Q313.1 868.9 289.6 868.3V1008.9H203.7V866.6Q193.6 866.6 173.5 866.4T142.9 866.1H31.2L48.5 764H110.5Q138.4 764 142.9 735.5V511.2H151.8Q148.4 510.6 142.9 510.6V350.4Q135.6 312.5 93.2 312.5H31.2V221L149.6 221.5Q185.3 221.5 203.7 221V80.4H289.6V218.2Q335.4 217.1 357.7 217.1V80.4H443.6V221Q487.7 224.9 521.8 233.5T584.8 258.7 630.9 302.2 651.2 366.1ZM531.3 670.2Q531.3 650.1 522.9 634.5T502.2 608.8 470.1 591.8 433.6 581.5 392.3 576.5 353.8 574.8 317.8 575.3 291.3 575.9V764.5Q295.8 764.5 311.9 764.8T338.7 765.1 368.3 764.2 400.9 762 432.8 757.3 463.7 749.4 490.2 737.7 512.3 721 525.9 698.7 531.3 670.2ZM491.6 404.6Q491.6 386.2 484.7 371.9T467.6 348.5 440.8 332.9 410.2 323.7 375.8 319.2 343.5 317.8 313.3 318.4 291.3 318.6V490Q294.1 490 310.5 490.2T336.5 490.2 364.4 489.1 395.1 486 423.8 479.9 450.9 469.6 471.5 454.5 486.6 433 491.6 404.6Z",
"width": 713.8671875
},
"search": [
"bitcoin"
]
},
{
"uid": "eb29dbd6a0be7b54cf9aadcba49309e3",
"css": "dollar",
"code": 59683,
"src": "custom_icons",
"selected": false,
"svg": {
"path": "M545.8 670.2Q545.8 755.6 490.2 817.2T346 893.4V991.1Q346 998.9 341 1003.9T328.1 1008.9H252.8Q245.5 1008.9 240.2 1003.6T234.9 991.1V893.4Q198.1 888.4 163.8 876.1T107.1 851.3 65.8 824.5 39.9 803.6 30.1 793.5Q20.6 781.8 29 770.6L86.5 695.3Q90.4 689.7 99.3 688.6 107.7 687.5 112.7 693.6L113.8 694.8Q176.9 750 249.4 764.5 270.1 769 290.7 769 335.9 769 370.3 745T404.6 676.9Q404.6 661.3 396.2 647.3T377.5 623.9 344.9 603 308 585.1 263.4 567Q241.6 558 229.1 553T194.8 538.2 159.9 520.9 128.3 501.1 98.5 477.4 74.2 450.1 54.4 417.7 42.7 380.6 37.9 337.1Q37.9 260 92.6 202T234.9 127.2V26.8Q234.9 19.5 240.2 14.2T252.8 8.9H328.1Q335.9 8.9 341 13.9T346 26.8V125Q377.8 128.3 407.6 137.8T456.2 156.5 491.6 177.5 513.4 193.6 521.8 201.4Q531.3 211.5 524.6 222.7L479.4 304.1Q474.9 312.5 466.5 313.1 458.7 314.7 451.5 309.2 449.8 307.5 443.4 302.5T421.6 287.7 389 269.8 347.4 255.3 299.7 248.9Q246.7 248.9 213.2 272.9T179.7 334.8Q179.7 349.3 184.4 361.6T200.9 384.8 222.9 403.2 254.2 420.5 287.9 435.5 327 450.9Q356.6 462.1 372.2 468.5T414.6 488 456.8 511.7 491.4 539.6 520.9 575.1 538.5 617.7 545.8 670.2Z",
"width": 571.2890625
},
"search": [
"dollar"
]
},
{
"uid": "a7b4fdbc9f251ba0f6c07b03aba6817d",
"css": "shield",
"code": 59684,
"src": "custom_icons",
"selected": false,
"svg": {
"path": "M607.1 544.6V187.5H357.1V822Q423.5 786.8 476 745.5 607.1 642.9 607.1 544.6ZM714.3 116.1V544.6Q714.3 592.6 695.6 639.8T649.3 723.5 583.4 794.6 512.8 852.1 445.3 895.4 395.4 923 371.7 934.2Q365 937.5 357.1 937.5T342.6 934.2Q333.7 930.2 318.9 923T269 895.4 201.4 852.1 130.9 794.6 65 723.5 18.7 639.8 0 544.6V116.1Q0 101.6 10.6 91T35.7 80.4H678.6Q693.1 80.4 703.7 91T714.3 116.1Z",
"width": 713.8671875
},
"search": [
"shield"
]
},
{
"uid": "e4d8f1f6a76e0f7de244fc64ccd99217",
"css": "code",
"code": 59685,
"src": "custom_icons",
"selected": false,
"svg": {
"path": "M344.3 789.6L316.4 817.5Q310.8 823.1 303.6 823.1T290.7 817.5L30.7 557.5Q25.1 551.9 25.1 544.6T30.7 531.8L290.7 271.8Q296.3 266.2 303.6 266.2T316.4 271.8L344.3 299.7Q349.9 305.2 349.9 312.5T344.3 325.3L125 544.6 344.3 763.9Q349.9 769.5 349.9 776.8T344.3 789.6ZM674.1 194.2L466 914.6Q463.7 921.9 457.3 925.5T444.2 926.9L409.6 917.4Q402.3 915.2 398.7 908.8T397.3 895.1L605.5 174.7Q607.7 167.4 614.1 163.8T627.2 162.4L661.8 171.9Q669.1 174.1 672.7 180.5T674.1 194.2ZM1040.7 557.5L780.7 817.5Q775.1 823.1 767.9 823.1T755 817.5L727.1 789.6Q721.5 784 721.5 776.8T727.1 764L946.4 544.6 727.1 325.3Q721.5 319.8 721.5 312.5T727.1 299.7L755 271.8Q760.6 266.2 767.9 266.2T780.7 271.8L1040.7 531.8Q1046.3 537.4 1046.3 544.6T1040.7 557.5Z",
"width": 1071.2890625
},
"search": [
"code"
]
},
{
"uid": "ebea27c533c91e2a2d852528cdf515a1",
"css": "github-alt",
"code": 59394,
"src": "custom_icons",
"selected": false,
"svg": {
"path": "M357.1 687.5Q357.1 709.8 350.2 733.3T326.2 775.7 285.7 794.6 245.3 775.7 221.3 733.3 214.3 687.5 221.3 641.7 245.3 599.3 285.7 580.4 326.2 599.3 350.2 641.7 357.1 687.5ZM714.3 687.5Q714.3 709.8 707.3 733.3T683.3 775.7 642.9 794.6 602.4 775.7 578.4 733.3 571.4 687.5 578.4 641.7 602.4 599.3 642.9 580.4 683.3 599.3 707.3 641.7 714.3 687.5ZM803.6 687.5Q803.6 620.5 765.1 573.7T660.7 526.8Q637.8 526.8 551.9 538.5 512.3 544.6 464.3 544.6T376.7 538.5Q291.9 526.8 267.9 526.8 202 526.8 163.5 573.7T125 687.5Q125 736.6 142.9 773.2T188.1 830.6 256.1 864.1 334.3 880.6 417.4 884.5H511.2Q556.9 884.5 594.3 880.6T672.4 864.1 740.5 830.6 785.7 773.2 803.6 687.5ZM928.6 589.3Q928.6 704.8 894.5 774 873.3 817 835.7 848.2T757 896.2 662.1 922.7 566.4 935 473.2 937.5Q429.7 937.5 394 935.8T311.7 928.9 226.6 912.1 150.1 883.4 82.6 838.2 34.6 774Q0 705.4 0 589.3 0 457 75.9 368.3 60.8 322.5 60.8 273.4 60.8 208.7 89.3 151.8 149.6 151.8 195.3 173.8T300.8 242.7Q382.8 223.2 473.2 223.2 555.8 223.2 629.5 241.1 688.1 195.3 733.8 173.5T839.3 151.8Q867.7 208.7 867.7 273.4 867.7 322 852.7 367.2 928.6 456.5 928.6 589.3Z",
"width": 928.7109375
},
"search": [
"github-alt"
]
},
{
"uid": "4f73560e87937d9f892fc96a0ec2d6c8",
"css": "linkedin-1",
"code": 59406,
"src": "custom_icons",
"selected": false,
"svg": {
"path": "M194.8 357.7V910.7H10.6V357.7H194.8ZM206.5 186.9Q207 227.7 178.3 255T102.7 282.4H101.6Q55.8 282.4 27.9 255T0 186.9Q0 145.6 28.7 118.6T103.8 91.5 178 118.6 206.5 186.9ZM857.1 593.8V910.7H673.5V615Q673.5 556.4 650.9 523.2T580.4 490Q545.2 490 521.5 509.2T486 556.9Q479.9 573.7 479.9 602.1V910.7H296.3Q297.4 688.1 297.4 549.7T296.9 384.5L296.3 357.7H479.9V438.1H478.8Q490 420.2 501.7 406.8T533.2 377.8 581.8 353.5 645.6 344.9Q741.1 344.9 799.1 408.2T857.1 593.8Z",
"width": 857.421875
},
"search": [
"linkedin"
]
},
{
"uid": "8a4d1f55d7e3df9f761ce979a00d6939",
"css": "google-plus",
"code": 59688,
"src": "custom_icons",
"selected": false,
"svg": {
"path": "M410.2 453.1Q410.2 473.2 428 492.5T471.3 530.4 521.8 571.4 564.7 629.5 582.6 708.7Q582.6 758.9 555.8 805.2 515.6 873.3 438.1 905.4T271.8 937.5Q198.1 937.5 134.2 914.3T38.5 837.6Q17.9 804.1 17.9 764.5 17.9 719.3 42.7 680.8T108.8 616.6Q181.9 570.9 334.3 560.8 316.4 537.4 307.8 519.5T299.1 478.8Q299.1 458.7 310.8 431.4 285.2 433.6 272.9 433.6 190.3 433.6 133.7 379.7T77 243.3Q77 197.5 97.1 154.6T152.3 81.5Q195.3 44.6 254.2 26.8T375.6 8.9H608.8L531.8 58H458.7Q500 93.2 521.2 132.3T542.4 221.5Q542.4 261.7 528.7 293.8T495.8 345.7 457 382 423.8 416.3 410.2 453.1ZM328.7 399.6Q349.9 399.6 372.2 390.3T409 366.1Q438.6 334.3 438.6 277.3 438.6 245 429.1 207.6T402.1 135.3 354.9 77.6 289.6 54.7Q266.2 54.7 243.6 65.6T207 94.9Q180.8 127.8 180.8 184.2 180.8 209.8 186.4 238.6T204 296 233 347.7 274.8 385 328.7 399.6ZM329.8 886.7Q362.2 886.7 392 879.5T447.3 857.7 488 817 503.3 756.1Q503.3 742.2 499.4 728.8T491.3 705.4 476.3 682.2 459.8 662.7 438.3 643.4 418 627.2 394.8 610.5 374.4 596Q365.5 594.9 347.7 594.9 318.1 594.9 289.1 598.8T229.1 612.7 174.9 638.4 136.7 680 121.6 738.8Q121.6 777.9 141.2 807.8T192.2 854.1 258.6 878.6 329.8 886.7ZM781.8 397.9H900.7V458.1H781.8V580.4H723.2V458.1H604.9V397.9H723.2V276.8H781.8V397.9Z",
"width": 928.7109375
},
"search": [
"google-plus"
]
},
{
"uid": "f977e468736fcc7d3bd500027e26243c",
"css": "magic",
"code": 59689,
"src": "custom_icons",
"selected": false,
"svg": {
"path": "M664.1 333.1L827.6 169.6 767.9 109.9 604.4 273.4ZM913.5 169.6Q913.5 184.7 903.5 194.8L185.8 912.4Q175.8 922.4 160.7 922.4T135.6 912.4L25.1 801.9Q15.1 791.9 15.1 776.8T25.1 751.7L742.7 34Q752.8 24 767.9 24T793 34L903.5 144.5Q913.5 154.6 913.5 169.6ZM159.6 63.6L214.3 80.4 159.6 97.1 142.9 151.8 126.1 97.1 71.4 80.4 126.1 63.6 142.9 8.9ZM354.9 154L464.3 187.5 354.9 221 321.4 330.4 287.9 221 178.6 187.5 287.9 154 321.4 44.6ZM873.9 420.8L928.6 437.5 873.9 454.2 857.1 508.9 840.4 454.2 785.7 437.5 840.4 420.8 857.1 366.1ZM516.7 63.6L571.4 80.4 516.7 97.1 500 151.8 483.3 97.1 428.6 80.4 483.3 63.6 500 8.9Z",
"width": 928.7109375
},
"search": [
"magic"
]
},
{
"uid": "a6226d354f47d58634594af44f9f89fb",
"css": "wrench",
"code": 59398,
"src": "custom_icons",
"selected": false,
"svg": {
"path": "M214.3 830.4Q214.3 815.8 203.7 805.2T178.6 794.6 153.5 805.2 142.9 830.4 153.5 855.5 178.6 866.1 203.7 855.5 214.3 830.4ZM573.7 596L193.1 976.6Q172.4 997.2 142.9 997.2 113.8 997.2 92.1 976.6L32.9 916.3Q11.7 896.2 11.7 866.1 11.7 836.5 32.9 815.3L412.9 435.3Q434.7 490 476.8 532.1T573.7 596ZM927.5 353.2Q927.5 375 914.6 412.4 888.4 487.2 822.8 533.8T678.6 580.4Q575.3 580.4 502 507T428.6 330.4 502 153.7 678.6 80.4Q710.9 80.4 746.4 89.6T806.4 115.5Q815.3 121.7 815.3 131.1T806.4 146.8L642.9 241.1V366.1L750.6 425.8Q753.3 424.1 794.6 398.7T870.3 353.5 909.6 333.7Q918 333.7 922.7 339.3T927.5 353.2Z",
"width": 928.7109375
},
"search": [
"wrench"
]
},
{
"uid": "fd324937aabece202989f1094a3eb247",
"css": "feed",
"code": 59422,
"src": "custom_icons",
"selected": false,
"svg": {
"path": "M214.3 758.9Q214.3 803.6 183 834.8T107.1 866.1 31.3 834.8 0 758.9 31.3 683 107.1 651.8 183 683 214.3 758.9ZM500 827.6Q501.1 843.2 490.5 854.4 480.5 866.1 464.3 866.1H389Q375 866.1 365 856.9T353.8 833.7Q341.5 705.9 250.8 615.2T32.4 512.3Q18.4 511.2 9.2 501.1T0 477.1V401.8Q0 385.6 11.7 375.6 21.2 366.1 35.7 366.1H38.5Q127.8 373.3 209.3 411T353.8 512.3Q417.4 575.3 455.1 656.8T500 827.6ZM785.7 828.7Q786.8 843.8 775.7 854.9 765.6 866.1 750 866.1H670.2Q655.7 866.1 645.4 856.3T634.5 832.6Q627.8 712.6 578.1 604.6T448.9 417.1 261.4 287.9 33.5 231Q19.5 230.5 9.8 220.1T0 195.9V116.1Q0 100.4 11.2 90.4 21.2 80.4 35.7 80.4H37.4Q183.6 87.6 317.2 147.3T554.7 311.4Q659 415.2 718.7 548.8T785.7 828.7Z",
"width": 786.1328125
},
"search": [
"feed"
]
},
{
"uid": "18f599287f49a17c0ab4256f19f55fdb",
"css": "credit-card",
"code": 59692,
"src": "custom_icons",
"selected": false,
"svg": {
"path": "M982.1 80.4Q1019 80.4 1045.2 106.6T1071.4 169.6V848.2Q1071.4 885 1045.2 911.3T982.1 937.5H89.3Q52.5 937.5 26.2 911.3T0 848.2V169.6Q0 132.8 26.2 106.6T89.3 80.4H982.1ZM89.3 151.8Q82 151.8 76.7 157.1T71.4 169.6V294.6H1000V169.6Q1000 162.4 994.7 157.1T982.1 151.8H89.3ZM982.1 866.1Q989.4 866.1 994.7 860.8T1000 848.2V508.9H71.4V848.2Q71.4 855.5 76.7 860.8T89.3 866.1H982.1ZM142.9 794.6V723.2H285.7V794.6H142.9ZM357.1 794.6V723.2H571.4V794.6H357.1Z",
"width": 1071.2890625
},
"search": [
"credit-card"
]
},
{
"uid": "c0e3ec66b0cb403907ac0088a9a0c2a0",
"css": "github-1",
"code": 59421,
"src": "custom_icons",
"selected": false,
"svg": {
"path": "M857.1 508.9Q857.1 649 775.4 760.9T564.2 915.7Q549.1 918.5 542.1 911.8T535.2 895.1V777.3Q535.2 723.2 506.1 698.1 537.9 694.8 563.3 688.1T615.8 666.3 661 629.2 690.6 570.6 702 486.6Q702 419.1 657.9 371.7 678.6 320.9 653.5 257.8 637.8 252.8 608.3 264T556.9 288.5L535.7 301.9Q483.8 287.4 428.6 287.4T321.4 301.9Q312.5 295.8 297.7 286.8T251.1 265.3 203.1 257.8Q178.6 320.9 199.2 371.7 155.1 419.1 155.1 486.6 155.1 534 166.6 570.3T195.9 628.9 240.8 666.3 293.2 688.1 350.4 698.1Q328.1 718.2 323.1 755.6 311.4 761.2 298 764T266.2 766.7 229.6 754.7 198.7 719.9Q188.1 702 171.6 690.8T144 677.5L132.8 675.8Q121.1 675.8 116.6 678.3T113.8 684.7 118.9 692.5 126.1 699.2L130 702Q142.3 707.6 154.3 723.2T171.9 751.7L177.5 764.5Q184.7 785.7 202 798.8T239.4 815.6 278.2 819.5 309.2 817.5L322 815.3Q322 836.5 322.3 865T322.5 895.1Q322.5 905.1 315.3 911.8T293 915.7Q163.5 872.8 81.8 760.9T0 508.9Q0 392.3 57.5 293.8T213.4 137.8 428.6 80.4 643.7 137.8 799.7 293.8 857.1 508.9Z",
"width": 857.421875
},
"search": [
"github"
]
},
{
"uid": "a3c8113b1393d6b5b19bce6b76a213ce",
"css": "facebook-1",
"code": 59420,
"src": "custom_icons",
"selected": false,
"svg": {
"path": "M535.2 15.6V162.9H447.5Q399.6 162.9 382.8 183T366.1 243.3V348.8H529.6L507.8 514H366.1V937.5H195.3V514H53V348.8H195.3V227.1Q195.3 123.3 253.3 66.1T407.9 8.9Q490 8.9 535.2 15.6Z",
"width": 571.2890625
},
"search": [
"facebook"
]
},
{
"uid": "5988460df34b4c5186bc82c06077fa2b",
"css": "twitter-1",
"code": 59396,
"src": "custom_icons",
"selected": false,
"svg": {
"path": "M904 236.6Q866.6 291.3 813.6 329.8 814.2 337.6 814.2 353.2 814.2 425.8 793 498T728.5 636.7 625.6 754.2 481.6 835.7 301.3 866.1Q150.1 866.1 24.6 785.2 44.1 787.4 68.1 787.4 193.6 787.4 291.9 710.4 233.3 709.3 186.9 674.4T123.3 585.4Q141.7 588.2 157.4 588.2 181.4 588.2 204.8 582 142.3 569.2 101.3 519.8T60.3 405.1V402.9Q98.2 424.1 141.7 425.8 104.9 401.2 83.1 361.6T61.4 275.7Q61.4 226.6 85.9 184.7 153.5 267.9 250.3 317.8T457.6 373.3Q453.1 352.1 453.1 332 453.1 257.3 505.9 204.5T633.4 151.8Q711.5 151.8 765.1 208.7 825.9 197 879.5 165.2 858.8 229.4 800.2 264.5 852.1 258.9 904 236.6Z",
"width": 928.7109375
},
"search": [
"twitter"
]
},
{
"uid": "614bae07570394fea18e83f41140593b",
"css": "cogs2",
"code": 59399,
"src": "custom_icons",
"selected": false,
"svg": {
"path": "M500 508.9Q500 449.8 458.1 407.9T357.1 366.1 256.1 407.9 214.3 508.9 256.1 609.9 357.1 651.8 458.1 609.9 500 508.9ZM928.6 794.6Q928.6 765.6 907.4 744.4T857.1 723.2 806.9 744.4 785.7 794.6Q785.7 824.2 806.6 845.1T857.1 866.1 907.6 845.1 928.6 794.6ZM928.6 223.2Q928.6 194.2 907.4 173T857.1 151.8 806.9 173 785.7 223.2Q785.7 252.8 806.6 273.7T857.1 294.6 907.6 273.7 928.6 223.2ZM714.3 458.1V561.4Q714.3 567 710.4 572.3T701.5 578.1L615 591.5Q608.8 611 597.1 633.9 616.1 660.7 647.3 698.1 651.2 703.7 651.2 709.3 651.2 716 647.3 719.9 634.5 736.6 601.3 769.8T557.5 803Q551.3 803 545.8 799.1L481.6 748.9Q460.9 759.5 438.6 766.2 432.5 826.5 425.8 852.7 421.9 866.1 409 866.1H305.2Q299.1 866.1 294.1 861.9T288.5 852.1L275.7 766.7Q256.7 761.2 233.8 749.4L168 799.1Q164.1 803 156.8 803 150.7 803 145.1 798.5 64.7 724.3 64.7 709.3 64.7 704.2 68.6 698.7 74.2 690.8 91.5 669.1T117.7 635Q104.9 610.5 98.2 589.3L13.4 575.9Q7.8 575.3 3.9 570.6T0 559.7V456.5Q0 450.9 3.9 445.6T12.8 439.7L99.3 426.3Q105.5 406.8 117.2 383.9 98.2 357.1 67 319.8 63.1 313.6 63.1 308.6 63.1 301.9 67 297.4 79.2 280.7 112.7 247.8T156.8 214.8Q162.9 214.8 168.5 218.7L232.7 269Q251.7 258.9 275.7 251.1 281.8 190.8 288.5 165.2 292.4 151.8 305.2 151.8H409Q415.2 151.8 420.2 156T425.8 165.7L438.6 251.1Q457.6 256.7 480.5 268.4L546.3 218.7Q550.8 214.8 557.5 214.8 563.6 214.8 569.2 219.3 649.6 293.5 649.6 308.6 649.6 313.6 645.6 319.2 639 328.1 622.2 349.3T597.1 382.8Q609.9 409.6 616.1 428.6L700.9 441.4Q706.5 442.5 710.4 447.3T714.3 458.1ZM1071.4 755.6V833.7Q1071.4 842.6 988.3 851 981.6 866.1 971.5 880 1000 943.1 1000 957 1000 959.3 997.8 960.9 929.7 1000.6 928.6 1000.6 924.1 1000.6 902.9 974.3T873.9 936.4Q862.7 937.5 857.1 937.5T840.4 936.4Q832.6 948.1 811.4 974.3T785.7 1000.6Q784.6 1000.6 716.5 960.9 714.3 959.3 714.3 957 714.3 943.1 742.7 880 732.7 866.1 726 851 642.9 842.6 642.9 833.7V755.6Q642.9 746.7 726 738.3 733.3 722.1 742.7 709.3 714.3 646.2 714.3 632.3 714.3 630 716.5 628.3 718.8 627.2 736 617.2T769 598.2 785.7 589.3Q790.2 589.3 811.4 615.2T840.4 652.9Q851.6 651.8 857.1 651.8T873.9 652.9Q902.3 613.3 925.2 590.4L928.6 589.3Q930.8 589.3 997.8 628.3 1000 630 1000 632.3 1000 646.2 971.5 709.3 981 722.1 988.3 738.3 1071.4 746.6 1071.4 755.6ZM1071.4 184.2V262.3Q1071.4 271.2 988.3 279.6 981.6 294.6 971.5 308.6 1000 371.7 1000 385.6 1000 387.8 997.8 389.5 929.7 429.1 928.6 429.1 924.1 429.1 902.9 402.9T873.9 365Q862.7 366.1 857.1 366.1T840.4 365Q832.6 376.7 811.4 402.9T785.7 429.1Q784.6 429.1 716.5 389.5 714.3 387.8 714.3 385.6 714.3 371.7 742.7 308.6 732.7 294.6 726 279.6 642.9 271.2 642.9 262.3V184.2Q642.9 175.2 726 166.9 733.3 150.7 742.7 137.8 714.3 74.8 714.3 60.8 714.3 58.6 716.5 56.9 718.8 55.8 736 45.8T769 26.8 785.7 17.9Q790.2 17.9 811.4 43.8T840.4 81.5Q851.6 80.4 857.1 80.4T873.9 81.5Q902.3 41.9 925.2 19L928.6 17.9Q930.8 17.9 997.8 56.9 1000 58.6 1000 60.8 1000 74.8 971.5 137.8 981 150.7 988.3 166.9 1071.4 175.2 1071.4 184.2Z",
"width": 1071.2890625
},
"search": [
"cogs2"
]
}
]
}

85
src/assets/fonts/fontello-771c82e0/css/animation.css vendored Normal file
View File

@@ -0,0 +1,85 @@
/*
Animation example, for spinners
*/
.animate-spin {
-moz-animation: spin 2s infinite linear;
-o-animation: spin 2s infinite linear;
-webkit-animation: spin 2s infinite linear;
animation: spin 2s infinite linear;
display: inline-block;
}
@-moz-keyframes spin {
0% {
-moz-transform: rotate(0deg);
-o-transform: rotate(0deg);
-webkit-transform: rotate(0deg);
transform: rotate(0deg);
}
100% {
-moz-transform: rotate(359deg);
-o-transform: rotate(359deg);
-webkit-transform: rotate(359deg);
transform: rotate(359deg);
}
}
@-webkit-keyframes spin {
0% {
-moz-transform: rotate(0deg);
-o-transform: rotate(0deg);
-webkit-transform: rotate(0deg);
transform: rotate(0deg);
}
100% {
-moz-transform: rotate(359deg);
-o-transform: rotate(359deg);
-webkit-transform: rotate(359deg);
transform: rotate(359deg);
}
}
@-o-keyframes spin {
0% {
-moz-transform: rotate(0deg);
-o-transform: rotate(0deg);
-webkit-transform: rotate(0deg);
transform: rotate(0deg);
}
100% {
-moz-transform: rotate(359deg);
-o-transform: rotate(359deg);
-webkit-transform: rotate(359deg);
transform: rotate(359deg);
}
}
@-ms-keyframes spin {
0% {
-moz-transform: rotate(0deg);
-o-transform: rotate(0deg);
-webkit-transform: rotate(0deg);
transform: rotate(0deg);
}
100% {
-moz-transform: rotate(359deg);
-o-transform: rotate(359deg);
-webkit-transform: rotate(359deg);
transform: rotate(359deg);
}
}
@keyframes spin {
0% {
-moz-transform: rotate(0deg);
-o-transform: rotate(0deg);
-webkit-transform: rotate(0deg);
transform: rotate(0deg);
}
100% {
-moz-transform: rotate(359deg);
-o-transform: rotate(359deg);
-webkit-transform: rotate(359deg);
transform: rotate(359deg);
}
}

17
src/assets/fonts/fontello-771c82e0/css/fontello-codes.css vendored Normal file
View File

@@ -0,0 +1,17 @@
.icon-mail:before { content: '\e800'; } /* '' */
.icon-twitter:before { content: '\f099'; } /* '' */
.icon-facebook:before { content: '\f09a'; } /* '' */
.icon-rss:before { content: '\f09e'; } /* '' */
.icon-linkedin:before { content: '\f0e1'; } /* '' */
.icon-github:before { content: '\f113'; } /* '' */
.icon-stackoverflow:before { content: '\f16c'; } /* '' */
.icon-instagram:before { content: '\f16d'; } /* '' */
.icon-tumblr:before { content: '\f173'; } /* '' */
.icon-dribbble:before { content: '\f17d'; } /* '' */
.icon-skype:before { content: '\f17e'; } /* '' */
.icon-vkontakte:before { content: '\f189'; } /* '' */
.icon-slack:before { content: '\f198'; } /* '' */
.icon-paper-plane:before { content: '\f1d8'; } /* '' */
.icon-whatsapp:before { content: '\f232'; } /* '' */
.icon-odnoklassniki:before { content: '\f263'; } /* '' */

70
src/assets/fonts/fontello-771c82e0/css/fontello-embedded.css vendored Normal file
View File

File diff suppressed because one or more lines are too long

17
src/assets/fonts/fontello-771c82e0/css/fontello-ie7-codes.css vendored Normal file
View File

@@ -0,0 +1,17 @@
.icon-mail { *zoom: expression( this.runtimeStyle['zoom'] = '1', this.innerHTML = '&#xe800;&nbsp;'); }
.icon-twitter { *zoom: expression( this.runtimeStyle['zoom'] = '1', this.innerHTML = '&#xf099;&nbsp;'); }
.icon-facebook { *zoom: expression( this.runtimeStyle['zoom'] = '1', this.innerHTML = '&#xf09a;&nbsp;'); }
.icon-rss { *zoom: expression( this.runtimeStyle['zoom'] = '1', this.innerHTML = '&#xf09e;&nbsp;'); }
.icon-linkedin { *zoom: expression( this.runtimeStyle['zoom'] = '1', this.innerHTML = '&#xf0e1;&nbsp;'); }
.icon-github { *zoom: expression( this.runtimeStyle['zoom'] = '1', this.innerHTML = '&#xf113;&nbsp;'); }
.icon-stackoverflow { *zoom: expression( this.runtimeStyle['zoom'] = '1', this.innerHTML = '&#xf16c;&nbsp;'); }
.icon-instagram { *zoom: expression( this.runtimeStyle['zoom'] = '1', this.innerHTML = '&#xf16d;&nbsp;'); }
.icon-tumblr { *zoom: expression( this.runtimeStyle['zoom'] = '1', this.innerHTML = '&#xf173;&nbsp;'); }
.icon-dribbble { *zoom: expression( this.runtimeStyle['zoom'] = '1', this.innerHTML = '&#xf17d;&nbsp;'); }
.icon-skype { *zoom: expression( this.runtimeStyle['zoom'] = '1', this.innerHTML = '&#xf17e;&nbsp;'); }
.icon-vkontakte { *zoom: expression( this.runtimeStyle['zoom'] = '1', this.innerHTML = '&#xf189;&nbsp;'); }
.icon-slack { *zoom: expression( this.runtimeStyle['zoom'] = '1', this.innerHTML = '&#xf198;&nbsp;'); }
.icon-paper-plane { *zoom: expression( this.runtimeStyle['zoom'] = '1', this.innerHTML = '&#xf1d8;&nbsp;'); }
.icon-whatsapp { *zoom: expression( this.runtimeStyle['zoom'] = '1', this.innerHTML = '&#xf232;&nbsp;'); }
.icon-odnoklassniki { *zoom: expression( this.runtimeStyle['zoom'] = '1', this.innerHTML = '&#xf263;&nbsp;'); }

28
src/assets/fonts/fontello-771c82e0/css/fontello-ie7.css vendored Normal file
View File

@@ -0,0 +1,28 @@
[class^="icon-"], [class*=" icon-"] {
font-family: 'fontello';
font-style: normal;
font-weight: normal;
/* fix buttons height */
line-height: 1em;
/* you can be more comfortable with increased icons size */
/* font-size: 120%; */
}
.icon-mail { *zoom: expression( this.runtimeStyle['zoom'] = '1', this.innerHTML = '&#xe800;&nbsp;'); }
.icon-twitter { *zoom: expression( this.runtimeStyle['zoom'] = '1', this.innerHTML = '&#xf099;&nbsp;'); }
.icon-facebook { *zoom: expression( this.runtimeStyle['zoom'] = '1', this.innerHTML = '&#xf09a;&nbsp;'); }
.icon-rss { *zoom: expression( this.runtimeStyle['zoom'] = '1', this.innerHTML = '&#xf09e;&nbsp;'); }
.icon-linkedin { *zoom: expression( this.runtimeStyle['zoom'] = '1', this.innerHTML = '&#xf0e1;&nbsp;'); }
.icon-github { *zoom: expression( this.runtimeStyle['zoom'] = '1', this.innerHTML = '&#xf113;&nbsp;'); }
.icon-stackoverflow { *zoom: expression( this.runtimeStyle['zoom'] = '1', this.innerHTML = '&#xf16c;&nbsp;'); }
.icon-instagram { *zoom: expression( this.runtimeStyle['zoom'] = '1', this.innerHTML = '&#xf16d;&nbsp;'); }
.icon-tumblr { *zoom: expression( this.runtimeStyle['zoom'] = '1', this.innerHTML = '&#xf173;&nbsp;'); }
.icon-dribbble { *zoom: expression( this.runtimeStyle['zoom'] = '1', this.innerHTML = '&#xf17d;&nbsp;'); }
.icon-skype { *zoom: expression( this.runtimeStyle['zoom'] = '1', this.innerHTML = '&#xf17e;&nbsp;'); }
.icon-vkontakte { *zoom: expression( this.runtimeStyle['zoom'] = '1', this.innerHTML = '&#xf189;&nbsp;'); }
.icon-slack { *zoom: expression( this.runtimeStyle['zoom'] = '1', this.innerHTML = '&#xf198;&nbsp;'); }
.icon-paper-plane { *zoom: expression( this.runtimeStyle['zoom'] = '1', this.innerHTML = '&#xf1d8;&nbsp;'); }
.icon-whatsapp { *zoom: expression( this.runtimeStyle['zoom'] = '1', this.innerHTML = '&#xf232;&nbsp;'); }
.icon-odnoklassniki { *zoom: expression( this.runtimeStyle['zoom'] = '1', this.innerHTML = '&#xf263;&nbsp;'); }

73
src/assets/fonts/fontello-771c82e0/css/fontello.css vendored Normal file
View File

@@ -0,0 +1,73 @@
@font-face {
font-family: 'fontello';
src: url('../font/fontello.eot?65524428');
src: url('../font/fontello.eot?65524428#iefix') format('embedded-opentype'),
url('../font/fontello.woff2?65524428') format('woff2'),
url('../font/fontello.woff?65524428') format('woff'),
url('../font/fontello.ttf?65524428') format('truetype'),
url('../font/fontello.svg?65524428#fontello') format('svg');
font-weight: normal;
font-style: normal;
}
/* Chrome hack: SVG is rendered more smooth in Windozze. 100% magic, uncomment if you need it. */
/* Note, that will break hinting! In other OS-es font will be not as sharp as it could be */
/*
@media screen and (-webkit-min-device-pixel-ratio:0) {
@font-face {
font-family: 'fontello';
src: url('../font/fontello.svg?65524428#fontello') format('svg');
}
}
*/
[class^="icon-"]:before, [class*=" icon-"]:before {
font-family: "fontello";
font-style: normal;
font-weight: normal;
speak: none;
display: inline-block;
text-decoration: inherit;
width: 1em;
margin-right: .2em;
text-align: center;
/* opacity: .8; */
/* For safety - reset parent styles, that can break glyph codes*/
font-variant: normal;
text-transform: none;
/* fix buttons height, for twitter bootstrap */
line-height: 1em;
/* Animation center compensation - margins should be symmetric */
/* remove if not needed */
margin-left: .2em;
/* you can be more comfortable with increased icons size */
/* font-size: 120%; */
/* Font smoothing. That was taken from TWBS */
-webkit-font-smoothing: antialiased;
-moz-osx-font-smoothing: grayscale;
/* Uncomment for 3D effect */
/* text-shadow: 1px 1px 1px rgba(127, 127, 127, 0.3); */
}
.icon-mail:before { content: '\e800'; } /* '' */
.icon-twitter:before { content: '\f099'; } /* '' */
.icon-facebook:before { content: '\f09a'; } /* '' */
.icon-rss:before { content: '\f09e'; } /* '' */
.icon-linkedin:before { content: '\f0e1'; } /* '' */
.icon-github:before { content: '\f113'; } /* '' */
.icon-stackoverflow:before { content: '\f16c'; } /* '' */
.icon-instagram:before { content: '\f16d'; } /* '' */
.icon-tumblr:before { content: '\f173'; } /* '' */
.icon-dribbble:before { content: '\f17d'; } /* '' */
.icon-skype:before { content: '\f17e'; } /* '' */
.icon-vkontakte:before { content: '\f189'; } /* '' */
.icon-slack:before { content: '\f198'; } /* '' */
.icon-paper-plane:before { content: '\f1d8'; } /* '' */
.icon-whatsapp:before { content: '\f232'; } /* '' */
.icon-odnoklassniki:before { content: '\f263'; } /* '' */

330
src/assets/fonts/fontello-771c82e0/demo.html Normal file
View File

@@ -0,0 +1,330 @@
<!DOCTYPE html>
<html>
<head><!--[if lt IE 9]><script language="javascript" type="text/javascript" src="//html5shim.googlecode.com/svn/trunk/html5.js"></script><![endif]-->
<meta charset="UTF-8"><style>/*
* Bootstrap v2.2.1
*
* Copyright 2012 Twitter, Inc
* Licensed under the Apache License v2.0
* http://www.apache.org/licenses/LICENSE-2.0
*
* Designed and built with all the love in the world @twitter by @mdo and @fat.
*/
.clearfix {
*zoom: 1;
}
.clearfix:before,
.clearfix:after {
display: table;
content: "";
line-height: 0;
}
.clearfix:after {
clear: both;
}
html {
font-size: 100%;
-webkit-text-size-adjust: 100%;
-ms-text-size-adjust: 100%;
}
a:focus {
outline: thin dotted #333;
outline: 5px auto -webkit-focus-ring-color;
outline-offset: -2px;
}
a:hover,
a:active {
outline: 0;
}
button,
input,
select,
textarea {
margin: 0;
font-size: 100%;
vertical-align: middle;
}
button,
input {
*overflow: visible;
line-height: normal;
}
button::-moz-focus-inner,
input::-moz-focus-inner {
padding: 0;
border: 0;
}
body {
margin: 0;
font-family: "Helvetica Neue", Helvetica, Arial, sans-serif;
font-size: 14px;
line-height: 20px;
color: #333;
background-color: #fff;
}
a {
color: #08c;
text-decoration: none;
}
a:hover {
color: #005580;
text-decoration: underline;
}
.row {
margin-left: -20px;
*zoom: 1;
}
.row:before,
.row:after {
display: table;
content: "";
line-height: 0;
}
.row:after {
clear: both;
}
[class*="span"] {
float: left;
min-height: 1px;
margin-left: 20px;
}
.container,
.navbar-static-top .container,
.navbar-fixed-top .container,
.navbar-fixed-bottom .container {
width: 940px;
}
.span12 {
width: 940px;
}
.span11 {
width: 860px;
}
.span10 {
width: 780px;
}
.span9 {
width: 700px;
}
.span8 {
width: 620px;
}
.span7 {
width: 540px;
}
.span6 {
width: 460px;
}
.span5 {
width: 380px;
}
.span4 {
width: 300px;
}
.span3 {
width: 220px;
}
.span2 {
width: 140px;
}
.span1 {
width: 60px;
}
[class*="span"].pull-right,
.row-fluid [class*="span"].pull-right {
float: right;
}
.container {
margin-right: auto;
margin-left: auto;
*zoom: 1;
}
.container:before,
.container:after {
display: table;
content: "";
line-height: 0;
}
.container:after {
clear: both;
}
p {
margin: 0 0 10px;
}
.lead {
margin-bottom: 20px;
font-size: 21px;
font-weight: 200;
line-height: 30px;
}
small {
font-size: 85%;
}
h1 {
margin: 10px 0;
font-family: inherit;
font-weight: bold;
line-height: 20px;
color: inherit;
text-rendering: optimizelegibility;
}
h1 small {
font-weight: normal;
line-height: 1;
color: #999;
}
h1 {
line-height: 40px;
}
h1 {
font-size: 38.5px;
}
h1 small {
font-size: 24.5px;
}
body {
margin-top: 90px;
}
.header {
position: fixed;
top: 0;
left: 50%;
margin-left: -480px;
background-color: #fff;
border-bottom: 1px solid #ddd;
padding-top: 10px;
z-index: 10;
}
.footer {
color: #ddd;
font-size: 12px;
text-align: center;
margin-top: 20px;
}
.footer a {
color: #ccc;
text-decoration: underline;
}
.the-icons {
font-size: 14px;
line-height: 24px;
}
.switch {
position: absolute;
right: 0;
bottom: 10px;
color: #666;
}
.switch input {
margin-right: 0.3em;
}
.codesOn .i-name {
display: none;
}
.codesOn .i-code {
display: inline;
}
.i-code {
display: none;
}
@font-face {
font-family: 'fontello';
src: url('./font/fontello.eot?33839734');
src: url('./font/fontello.eot?33839734#iefix') format('embedded-opentype'),
url('./font/fontello.woff?33839734') format('woff'),
url('./font/fontello.ttf?33839734') format('truetype'),
url('./font/fontello.svg?33839734#fontello') format('svg');
font-weight: normal;
font-style: normal;
}
.demo-icon
{
font-family: "fontello";
font-style: normal;
font-weight: normal;
speak: none;
display: inline-block;
text-decoration: inherit;
width: 1em;
margin-right: .2em;
text-align: center;
/* opacity: .8; */
/* For safety - reset parent styles, that can break glyph codes*/
font-variant: normal;
text-transform: none;
/* fix buttons height, for twitter bootstrap */
line-height: 1em;
/* Animation center compensation - margins should be symmetric */
/* remove if not needed */
margin-left: .2em;
/* You can be more comfortable with increased icons size */
/* font-size: 120%; */
/* Font smoothing. That was taken from TWBS */
-webkit-font-smoothing: antialiased;
-moz-osx-font-smoothing: grayscale;
/* Uncomment for 3D effect */
/* text-shadow: 1px 1px 1px rgba(127, 127, 127, 0.3); */
}
</style>
<link rel="stylesheet" href="css/animation.css"><!--[if IE 7]><link rel="stylesheet" href="css/fontello-ie7.css"><![endif]-->
<script>
function toggleCodes(on) {
var obj = document.getElementById('icons');
if (on) {
obj.className += ' codesOn';
} else {
obj.className = obj.className.replace(' codesOn', '');
}
}
</script>
</head>
<body>
<div class="container header">
<h1>
fontello
<small>font demo</small>
</h1>
<label class="switch">
<input type="checkbox" onclick="toggleCodes(this.checked)">show codes
</label>
</div>
<div id="icons" class="container">
<div class="row">
<div title="Code: 0xe800" class="the-icons span3"><i class="demo-icon icon-mail">&#xe800;</i> <span class="i-name">icon-mail</span><span class="i-code">0xe800</span></div>
<div title="Code: 0xf099" class="the-icons span3"><i class="demo-icon icon-twitter">&#xf099;</i> <span class="i-name">icon-twitter</span><span class="i-code">0xf099</span></div>
<div title="Code: 0xf09a" class="the-icons span3"><i class="demo-icon icon-facebook">&#xf09a;</i> <span class="i-name">icon-facebook</span><span class="i-code">0xf09a</span></div>
<div title="Code: 0xf09e" class="the-icons span3"><i class="demo-icon icon-rss">&#xf09e;</i> <span class="i-name">icon-rss</span><span class="i-code">0xf09e</span></div>
</div>
<div class="row">
<div title="Code: 0xf0e1" class="the-icons span3"><i class="demo-icon icon-linkedin">&#xf0e1;</i> <span class="i-name">icon-linkedin</span><span class="i-code">0xf0e1</span></div>
<div title="Code: 0xf113" class="the-icons span3"><i class="demo-icon icon-github">&#xf113;</i> <span class="i-name">icon-github</span><span class="i-code">0xf113</span></div>
<div title="Code: 0xf16c" class="the-icons span3"><i class="demo-icon icon-stackoverflow">&#xf16c;</i> <span class="i-name">icon-stackoverflow</span><span class="i-code">0xf16c</span></div>
<div title="Code: 0xf16d" class="the-icons span3"><i class="demo-icon icon-instagram">&#xf16d;</i> <span class="i-name">icon-instagram</span><span class="i-code">0xf16d</span></div>
</div>
<div class="row">
<div title="Code: 0xf173" class="the-icons span3"><i class="demo-icon icon-tumblr">&#xf173;</i> <span class="i-name">icon-tumblr</span><span class="i-code">0xf173</span></div>
<div title="Code: 0xf17d" class="the-icons span3"><i class="demo-icon icon-dribbble">&#xf17d;</i> <span class="i-name">icon-dribbble</span><span class="i-code">0xf17d</span></div>
<div title="Code: 0xf17e" class="the-icons span3"><i class="demo-icon icon-skype">&#xf17e;</i> <span class="i-name">icon-skype</span><span class="i-code">0xf17e</span></div>
<div title="Code: 0xf189" class="the-icons span3"><i class="demo-icon icon-vkontakte">&#xf189;</i> <span class="i-name">icon-vkontakte</span><span class="i-code">0xf189</span></div>
</div>
<div class="row">
<div title="Code: 0xf198" class="the-icons span3"><i class="demo-icon icon-slack">&#xf198;</i> <span class="i-name">icon-slack</span><span class="i-code">0xf198</span></div>
<div title="Code: 0xf1d8" class="the-icons span3"><i class="demo-icon icon-paper-plane">&#xf1d8;</i> <span class="i-name">icon-paper-plane</span><span class="i-code">0xf1d8</span></div>
<div title="Code: 0xf232" class="the-icons span3"><i class="demo-icon icon-whatsapp">&#xf232;</i> <span class="i-name">icon-whatsapp</span><span class="i-code">0xf232</span></div>
<div title="Code: 0xf263" class="the-icons span3"><i class="demo-icon icon-odnoklassniki">&#xf263;</i> <span class="i-name">icon-odnoklassniki</span><span class="i-code">0xf263</span></div>
</div>
</div>
<div class="container footer">Generated by <a href="http://fontello.com">fontello.com</a></div>
</body>
</html>

BIN
src/assets/fonts/fontello-771c82e0/font/fontello.eot Normal file
View File

Binary file not shown.

42
src/assets/fonts/fontello-771c82e0/font/fontello.svg Normal file
View File

@@ -0,0 +1,42 @@
<?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">
<svg xmlns="http://www.w3.org/2000/svg">
<metadata>Copyright (C) 2017 by original authors @ fontello.com</metadata>
<defs>
<font id="fontello" horiz-adv-x="1000" >
<font-face font-family="fontello" font-weight="400" font-stretch="normal" units-per-em="1000" ascent="850" descent="-150" />
<missing-glyph horiz-adv-x="1000" />
<glyph glyph-name="mail" unicode="&#xe800;" d="M929 11v428q-18-20-39-36-149-115-238-189-28-24-46-37t-48-28-57-13h-2q-26 0-57 13t-48 28-46 37q-88 74-238 189-21 16-39 36v-428q0-7 6-13t12-5h822q7 0 12 5t6 13z m0 586v14t-1 7-1 7-3 5-5 4-8 2h-822q-7 0-12-6t-6-12q0-94 83-159 107-84 223-176 4-3 20-17t25-21 25-17 28-16 24-5h2q11 0 24 5t28 16 25 17 25 21 20 17q116 92 224 176 30 24 56 65t26 73z m71 21v-607q0-37-26-63t-63-27h-822q-36 0-63 27t-26 63v607q0 37 26 63t63 26h822q37 0 63-26t26-63z" horiz-adv-x="1000" />
<glyph glyph-name="twitter" unicode="&#xf099;" d="M904 622q-37-54-90-93 0-8 0-23 0-73-21-145t-64-139-103-117-144-82-181-30q-151 0-276 81 19-2 43-2 126 0 224 77-59 1-105 36t-64 89q19-3 34-3 24 0 48 6-63 13-104 62t-41 115v2q38-21 82-23-37 25-59 64t-22 86q0 49 25 91 68-83 164-133t208-55q-5 21-5 41 0 75 53 127t127 53q79 0 132-57 61 12 115 44-21-64-80-100 52 6 104 28z" horiz-adv-x="928.6" />
<glyph glyph-name="facebook" unicode="&#xf09a;" d="M535 843v-147h-87q-48 0-65-20t-17-60v-106h164l-22-165h-142v-424h-171v424h-142v165h142v122q0 104 58 161t155 57q82 0 127-7z" horiz-adv-x="571.4" />
<glyph glyph-name="rss" unicode="&#xf09e;" d="M214 100q0-45-31-76t-76-31-76 31-31 76 31 76 76 31 76-31 31-76z m286-69q1-15-9-26-10-12-27-12h-75q-14 0-24 9t-11 23q-12 128-103 219t-219 103q-14 1-23 11t-9 24v75q0 16 12 26 9 10 24 10h3q89-7 170-45t145-101q63-63 101-145t45-171z m286-1q1-15-10-26-10-11-26-11h-80q-14 0-25 10t-10 23q-7 120-57 228t-129 188-188 129-227 57q-14 1-24 11t-10 24v80q0 16 11 26 10 10 25 10h1q147-8 280-67t238-164q104-104 164-238t67-280z" horiz-adv-x="785.7" />
<glyph glyph-name="linkedin" unicode="&#xf0e1;" d="M195 501v-553h-184v553h184z m12 171q0-41-29-68t-75-27h-1q-46 0-74 27t-28 68q0 41 29 68t75 27 74-27 29-68z m650-407v-317h-183v296q0 59-23 92t-71 33q-35 0-58-19t-36-48q-6-17-6-45v-309h-184q1 223 1 361t0 165l-1 27h184v-80h-1q11 18 23 31t31 29 49 24 64 9q95 0 153-63t58-186z" horiz-adv-x="857.1" />
<glyph glyph-name="github" unicode="&#xf113;" d="M357 171q0-22-7-45t-24-43-40-19-41 19-24 43-7 45 7 46 24 43 41 19 40-19 24-43 7-46z m357 0q0-22-7-45t-24-43-40-19-41 19-24 43-7 45 7 46 24 43 41 19 40-19 24-43 7-46z m90 0q0 67-39 114t-104 47q-23 0-109-12-40-6-88-6t-87 6q-85 12-109 12-66 0-104-47t-39-114q0-49 18-85t45-58 68-33 78-17 83-4h94q46 0 83 4t78 17 69 33 45 58 18 85z m125 99q0-116-34-185-22-43-59-74t-79-48-95-27-96-12-93-3q-43 0-79 2t-82 7-85 17-77 29-67 45-48 64q-35 69-35 185 0 132 76 221-15 45-15 95 0 64 28 121 61 0 106-22t106-69q82 20 172 20 83 0 157-18 58 46 104 67t105 22q29-57 29-121 0-49-15-94 76-89 76-222z" horiz-adv-x="928.6" />
<glyph glyph-name="stackoverflow" unicode="&#xf16c;" d="M719-61h-624v268h-89v-357h803v357h-90v-268z m-525 293l18 87 437-92-18-87z m57 208l38 82 404-189-37-81z m112 199l57 69 343-287-57-68z m222 211l266-358-71-53-267 357z m-401-821v89h447v-89h-447z" horiz-adv-x="857.1" />
<glyph glyph-name="instagram" unicode="&#xf16d;" d="M571 350q0 59-41 101t-101 42-101-42-42-101 42-101 101-42 101 42 41 101z m77 0q0-91-64-156t-155-64-156 64-64 156 64 156 156 64 155-64 64-156z m61 229q0-21-15-36t-37-15-36 15-15 36 15 36 36 15 37-15 15-36z m-280 123q-4 0-43 0t-59 0-54-2-57-5-40-11q-28-11-49-32t-33-49q-6-16-10-40t-6-58-1-53 0-59 0-43 0-43 0-59 1-53 6-58 10-40q12-28 33-49t49-32q16-6 40-11t57-5 54-2 59 0 43 0 42 0 59 0 54 2 58 5 39 11q28 11 50 32t32 49q6 16 10 40t6 58 1 53 0 59 0 43 0 43 0 59-1 53-6 58-10 40q-11 28-32 49t-50 32q-16 6-39 11t-58 5-54 2-59 0-42 0z m428-352q0-128-3-177-5-116-69-180t-179-69q-50-3-177-3t-177 3q-116 6-180 69t-69 180q-3 49-3 177t3 177q5 116 69 180t180 69q49 3 177 3t177-3q116-6 179-69t69-180q3-49 3-177z" horiz-adv-x="857.1" />
<glyph glyph-name="tumblr" unicode="&#xf173;" d="M527 108l44-132q-12-19-61-37t-99-18q-58-1-107 15t-79 41-53 59-31 67-9 66v304h-94v120q40 14 72 39t51 50 32 57 19 55 8 49q1 3 3 5t4 2h136v-237h186v-140h-186v-289q0-17 3-31t13-30 28-23 45-8q44 1 75 16z" horiz-adv-x="571.4" />
<glyph glyph-name="dribbble" unicode="&#xf17d;" d="M571 13q-23 134-78 278h-1l-1-1q-9-3-24-9t-56-27-77-46-73-64-57-82l-9 6q103-84 234-84 73 0 142 29z m-103 339q-11 27-29 62-174-52-376-52 0-4 0-12 0-69 24-132t69-112q28 49 69 93t80 69 73 45 55 27l21 7q2 1 7 2t7 3z m-59 118q-67 119-137 211-77-36-130-104t-72-152q169 0 339 45z m381-178q-117 33-228 16 49-133 71-262 62 42 104 106t53 140z m-449 414q-1 0-1-1 0 1 1 1z m329-81q-103 91-241 91-43 0-87-10 73-95 137-214 39 15 73 34t54 34 36 32 21 23z m125-271q-2 129-83 229l-1-1q-5-7-11-13t-24-25-40-34-55-36-74-36q14-30 25-53 1-3 3-10t5-9q20 2 41 4t41 1 39-1 35-2 32-3 27-4 20-3 14-3z m62-4q0-117-57-215t-156-156-215-58-216 58-155 156-58 215 58 215 155 156 216 58 215-58 156-156 57-215z" horiz-adv-x="857.1" />
<glyph glyph-name="skype" unicode="&#xf17e;" d="M655 257q0 28-11 51t-27 38-41 27-46 19-49 13l-58 14q-17 4-25 6t-19 6-17 9-9 12-4 16q0 43 80 43 24 0 43-6t30-16 21-19 23-16 27-7q26 0 42 18t16 43q0 31-32 55t-79 38-101 13q-38 0-74-9t-67-26-49-48-19-72q0-34 10-60t32-42 44-27 58-18l81-20q51-12 63-20 18-11 18-34 0-21-23-36t-58-14q-29 0-51 9t-37 22-25 25-26 21-30 9q-28 0-42-17t-14-41q0-52 68-88t162-37q41 0 78 10t69 30 49 52 19 74z m202-121q0-89-63-152t-151-63q-73 0-131 45-43-9-83-9-80 0-153 31t-126 84-83 125-31 153q0 41 9 84-45 58-45 130 0 89 63 152t151 63q73 0 131-45 43 9 84 9 79 0 152-31t126-84 84-125 30-153q0-41-8-84 44-58 44-130z" horiz-adv-x="857.1" />
<glyph glyph-name="vkontakte" unicode="&#xf189;" d="M1070 560q13-36-84-164-13-18-36-48-22-28-31-40t-17-27-7-24 8-19 18-24 32-30q2-1 2-2 79-73 107-123 2-3 4-7t4-15-1-19-14-15-33-7l-142-3q-14-2-32 3t-29 13l-11 6q-17 12-39 36t-38 43-34 33-32 8q-1 0-4-2t-10-8-12-16-9-29-4-44q0-8-2-15t-4-10l-2-3q-10-11-30-12h-64q-40-3-81 9t-74 29-57 37-40 32l-14 14q-5 5-15 17t-40 50-59 85-68 117-73 152q-4 9-4 15t2 9l2 3q9 11 32 11l153 1q7-1 13-3t9-5l3-2q9-6 13-18 11-28 26-57t23-46l9-16q16-34 31-58t27-38 23-22 19-8 15 3q1 1 3 3t7 12 7 26 5 46 0 69q-1 23-5 41t-7 26l-4 6q-14 19-47 24-8 2 3 14 8 10 21 17 29 14 133 13 46-1 75-7 12-3 19-8t12-13 5-18 2-25 0-31-2-40 0-46q0-6-1-23t0-27 2-22 6-22 13-14q4-1 9-2t15 6 21 19 29 38 38 60q33 58 60 125 2 6 5 10t6 6l3 2 2 1t8 2 11 0l160 1q22 3 36-1t17-10z" horiz-adv-x="1071.4" />
<glyph glyph-name="slack" unicode="&#xf198;" d="M848 417q34 0 57-23t24-56q0-54-52-73l-96-33 31-93q4-12 4-26 0-33-24-57t-56-24q-26 0-48 15t-29 40l-31 92-173-59 31-91q4-14 4-27 0-33-23-57t-57-24q-27 0-48 15t-29 41l-31 91-85-30q-17-5-28-5-34 0-57 22t-23 57q0 26 16 47t40 30l87 29-59 175-87-30q-14-5-27-5-33 0-56 23t-23 56q0 26 15 48t40 29l88 30-30 88q-4 14-4 27 0 33 23 57t57 24q26 0 48-16t29-40l30-89 173 59-30 89q-4 13-4 26 0 33 23 57t57 24q26 0 48-15t30-40l29-90 91 31q11 3 24 3 33 0 57-22t24-55q0-25-17-45t-41-29l-88-30 59-177 91 32q13 4 26 4z m-443-146l173 58-59 176-173-60z" horiz-adv-x="928.6" />
<glyph glyph-name="paper-plane" unicode="&#xf1d8;" d="M984 844q19-13 15-36l-142-857q-3-16-18-25-8-5-18-5-6 0-13 3l-253 104-135-165q-10-13-27-13-7 0-12 2-11 4-17 13t-7 21v195l482 590-596-516-221 91q-20 8-22 30-1 23 18 33l928 536q9 5 18 5 11 0 20-6z" horiz-adv-x="1000" />
<glyph glyph-name="whatsapp" unicode="&#xf232;" d="M550 307q7 0 54-25t50-30q1-2 1-8 0-18-9-42-9-22-40-37t-57-15q-32 0-106 35-55 25-95 66t-82 103q-41 60-40 108v5q2 50 41 88 14 12 29 12 4 0 10-1t11-1q11 0 15-3t8-16q5-11 19-49t14-41q0-12-19-33t-20-26q0-3 3-8 19-41 57-76 31-30 84-57 7-4 13-4 8 0 30 27t29 28z m-114-296q71 0 136 28t112 74 75 112 28 136-28 136-75 112-112 75-136 28-135-28-112-75-75-112-28-136q0-113 67-205l-44-130 135 43q88-58 192-58z m0 771q86 0 164-34t134-89 90-135 33-163-33-163-90-134-134-90-164-34q-108 0-203 53l-233-75 76 226q-60 99-60 217 0 86 33 163t90 135 134 89 163 34z" horiz-adv-x="857.1" />
<glyph glyph-name="odnoklassniki" unicode="&#xf263;" d="M357 344q-105 0-179 74t-74 179q0 105 74 179t179 74 179-74 75-179q0-105-75-179t-179-74z m0 378q-51 0-88-37t-36-88q0-52 36-88t88-37 88 37 37 88q0 52-37 88t-88 37z m292-409q7-15 8-27t-2-23-15-21-24-21-34-23q-64-41-176-53l41-40 149-149q17-17 17-41t-17-41l-7-7q-17-17-41-17t-41 17q-38 38-149 149l-149-149q-18-17-42-17t-40 17l-7 7q-17 17-17 41t17 41l149 149 40 40q-113 12-177 53-21 14-34 23t-24 21-15 21-2 23 8 27q6 11 16 20t23 12 32-1 36-20q3-2 8-6t24-13 39-17 51-14 63-6q51 0 97 14t67 28l21 14q19 15 37 20t31 1 23-12 16-20z" horiz-adv-x="714.3" />
</font>
</defs>
</svg>
Side by Side

After

Width:  |  Height:  |  Size: 8.5 KiB

BIN
src/assets/fonts/fontello-771c82e0/font/fontello.ttf Normal file
View File

Binary file not shown.

BIN
src/assets/fonts/fontello-771c82e0/font/fontello.woff Normal file
View File

Binary file not shown.

BIN
src/assets/fonts/fontello-771c82e0/font/fontello.woff2 Normal file
View File

Binary file not shown.

5
src/assets/scss/_base.scss Normal file
View File

@@ -0,0 +1,5 @@
@charset "UTF-8";
@import "base/normalize";
@import "base/generic";
@import "base/highlight";

6
src/assets/scss/_mixins.scss Normal file
View File

@@ -0,0 +1,6 @@
@charset "UTF-8";
@import "mixins/breakpoints";
@import "mixins/margin";
@import "mixins/padding";
@import "mixins/line-height";

4
src/assets/scss/_pages.scss Normal file
View File

@@ -0,0 +1,4 @@
@charset "UTF-8";
@import "pages/tags";
@import "pages/categories";

37
src/assets/scss/_variables.scss Normal file
View File

@@ -0,0 +1,37 @@
/**
* Variables
*/
// Colors
$color-base: #222;
$color-primary: #5d93ff;
$color-secondary: #f7a046;
$color-white: lighten($color-base, 100%);
$color-gray: lighten($color-base, 40%);
$color-gray-border: lighten($color-base, 77%);
$color-gray-bg: lighten($color-base, 79%);
// Typographic
$typographic-font-family: "Roboto", "Helvetica Neue", "Helvetica", "Arial", sans-serif;
$typographic-root-font-size: 100;
$typographic-base-font-size: 16px;
$typographic-small-font-size: 14px;
$typographic-base-line-height: 1.625;
$typographic-base-font-color: $color-base;
$typographic-link-p-font-color: $color-primary;
$typographic-link-s-font-color: $color-secondary;
$typographic-leading: round(16 * ($typographic-root-font-size / 100) * $typographic-base-line-height);
// Layout
$layout-post-single-max-width: 945px;
$layout-post-single-width: $layout-post-single-max-width - 305px;
$layout-width: 1070px;
$layout-breakpoint-sm: 685px;
$layout-breakpoint-md: 960px;
$layout-breakpoint-lg: 1100px;

182
src/assets/scss/base/_generic.scss Normal file
View File

@@ -0,0 +1,182 @@
/**
* Generic
*/
html {
font-size: $typographic-root-font-size;
}
body {
font-family: $typographic-font-family;
color: $typographic-base-font-color;
line-height: $typographic-base-line-height;
font-size: $typographic-base-font-size;
-ms-text-size-adjust: 100%;
-webkit-text-size-adjust: 100%;
text-rendering: optimizeLegibility;
-webkit-font-smoothing: antialiased;
-moz-osx-font-smoothing: grayscale;
}
h1,
h2,
h3,
h4,
h5,
h6 {
font-family: $typographic-font-family;
font-weight: 500;
}
h1 {
font-size: $typographic-base-font-size * 2.5;
@include line-height(2);
@include margin-top(4);
@include margin-bottom(1);
}
h2 {
font-size: $typographic-base-font-size * 1.6875;
@include line-height(1.5);
@include margin-top(2);
@include margin-bottom(.5);
}
h3 {
font-size: $typographic-base-font-size * 1.375;
@include line-height(1);
@include margin-top(2);
@include margin-bottom(.5);
}
h4 {
font-size: $typographic-base-font-size * 1.2;
@include line-height(1);
@include margin-top(1.5);
@include margin-bottom(.5);
}
h5 {
font-size: $typographic-base-font-size;
@include line-height(1);
@include margin-top(2.5);
@include margin-bottom(.5);
}
h6 {
font-size: $typographic-base-font-size;
@include line-height(1);
@include margin-top(2.5);
@include margin-bottom(.5);
}
img {
border: 0;
max-width: 100%;
display: block;
margin: inherit auto;
}
hr {
margin-top: 52px;
margin-bottom: 52px;
border: 0;
color: $color-base;
display: block;
height: 26px;
margin-right: auto;
margin-left: auto;
background-size: 100% 26px;
background-image: linear-gradient(to bottom, transparent 1px, transparent 11px, $color-base 11px, $color-base 15px, transparent 15px, transparent 26px);
width: 100px;
}
a {
color: $typographic-link-p-font-color;
text-decoration: none;
&:hover,
&:focus,
&:active {
color: $typographic-link-s-font-color;
}
}
b,
strong {
font-weight: 500;
}
ul {
list-style: square;
@include margin-bottom(1);
& li {
padding: 0 5px;
margin-bottom: 10px;
}
}
p {
@include line-height(1);
@include margin-bottom(1);
}
blockquote {
padding: 0;
font-style: italic;
text-align: center;
}
figure {
display: block;
width: 100%;
height: auto;
}
figcaption {
@include line-height(.75);
@include margin-top(.25);
color: $color-base;
font-size: $typographic-small-font-size;
font-style: italic;
margin-bottom: 0;
text-align: center;
}
.layout {
lost-center: $layout-width;
}
.content {
&__inner {
padding: 25px 20px;
}
}
@include breakpoint-sm {
figure.float-left,
figure.float-right {
max-width: 310px;
@include padding(0, 1, 0, 1);
}
.float-right {
float: right;
}
.float-left {
float: left;
}
.content {
lost-column: 7/12;
&__inner {
padding: 30px 20px;
}
}
}
@include breakpoint-md {
.content {
lost-column: 2/3;
&__inner {
padding: 40px 35px;
}
}
}

137
src/assets/scss/base/_highlight.scss Normal file
View File

@@ -0,0 +1,137 @@
/**
* prism.js default theme for JavaScript, CSS and HTML
* Based on dabblet (http://dabblet.com)
* @author Lea Verou
*/
code[class*="language-"],
pre[class*="language-"] {
color: black;
background: none;
text-shadow: 0 1px white;
font-family: Consolas, Monaco, 'Andale Mono', 'Ubuntu Mono', monospace;
text-align: left;
white-space: pre;
word-spacing: normal;
word-break: normal;
word-wrap: normal;
line-height: 1.5;
-moz-tab-size: 4;
-o-tab-size: 4;
tab-size: 4;
-webkit-hyphens: none;
-moz-hyphens: none;
-ms-hyphens: none;
hyphens: none;
}
pre[class*="language-"]::-moz-selection, pre[class*="language-"] ::-moz-selection,
code[class*="language-"]::-moz-selection, code[class*="language-"] ::-moz-selection {
text-shadow: none;
background: #b3d4fc;
}
pre[class*="language-"]::selection, pre[class*="language-"] ::selection,
code[class*="language-"]::selection, code[class*="language-"] ::selection {
text-shadow: none;
background: #b3d4fc;
}
@media print {
code[class*="language-"],
pre[class*="language-"] {
text-shadow: none;
}
}
/* Code blocks */
pre[class*="language-"] {
padding: 1em;
margin: .5em 0;
overflow: auto;
}
:not(pre) > code[class*="language-"],
pre[class*="language-"] {
background: #f5f2f0;
}
/* Inline code */
:not(pre) > code[class*="language-"] {
padding: .1em;
border-radius: .3em;
white-space: normal;
}
.token.comment,
.token.prolog,
.token.doctype,
.token.cdata {
color: slategray;
}
.token.punctuation {
color: #999;
}
.namespace {
opacity: .7;
}
.token.property,
.token.tag,
.token.boolean,
.token.number,
.token.constant,
.token.symbol,
.token.deleted {
color: #905;
}
.token.selector,
.token.attr-name,
.token.string,
.token.char,
.token.builtin,
.token.inserted {
color: #690;
}
.token.operator,
.token.entity,
.token.url,
.language-css .token.string,
.style .token.string {
color: #a67f59;
background: hsla(0, 0%, 100%, .5);
}
.token.atrule,
.token.attr-value,
.token.keyword {
color: #07a;
}
.token.function {
color: #DD4A68;
}
.token.regex,
.token.important,
.token.variable {
color: #e90;
}
.token.important,
.token.bold {
font-weight: bold;
}
.token.italic {
font-style: italic;
}
.token.entity {
cursor: help;
}

461
src/assets/scss/base/_normalize.scss Normal file
View File

@@ -0,0 +1,461 @@
/*! normalize.css v5.0.0 | MIT License | github.com/necolas/normalize.css */
/**
* 1. Change the default font family in all browsers (opinionated).
* 2. Correct the line height in all browsers.
* 3. Prevent adjustments of font size after orientation changes in
* IE on Windows Phone and in iOS.
*/
/* Document
========================================================================== */
html {
font-family: sans-serif; /* 1 */
line-height: 1.15; /* 2 */
-ms-text-size-adjust: 100%; /* 3 */
-webkit-text-size-adjust: 100%; /* 3 */
}
/* Sections
========================================================================== */
/**
* Remove the margin in all browsers (opinionated).
*/
body {
margin: 0;
}
/**
* Add the correct display in IE 9-.
*/
article,
aside,
footer,
header,
nav,
section {
display: block;
}
/**
* Correct the font size and margin on `h1` elements within `section` and
* `article` contexts in Chrome, Firefox, and Safari.
*/
h1 {
font-size: 2em;
margin: 0.67em 0;
}
/* Grouping content
========================================================================== */
/**
* Add the correct display in IE 9-.
* 1. Add the correct display in IE.
*/
figcaption,
figure,
main { /* 1 */
display: block;
}
/**
* Add the correct margin in IE 8.
*/
figure {
margin: 1em 40px;
}
/**
* 1. Add the correct box sizing in Firefox.
* 2. Show the overflow in Edge and IE.
*/
hr {
box-sizing: content-box; /* 1 */
height: 0; /* 1 */
overflow: visible; /* 2 */
}
/**
* 1. Correct the inheritance and scaling of font size in all browsers.
* 2. Correct the odd `em` font sizing in all browsers.
*/
pre {
font-family: monospace, monospace; /* 1 */
font-size: 1em; /* 2 */
}
/* Text-level semantics
========================================================================== */
/**
* 1. Remove the gray background on active links in IE 10.
* 2. Remove gaps in links underline in iOS 8+ and Safari 8+.
*/
a {
background-color: transparent; /* 1 */
-webkit-text-decoration-skip: objects; /* 2 */
}
/**
* Remove the outline on focused links when they are also active or hovered
* in all browsers (opinionated).
*/
a:active,
a:hover {
outline-width: 0;
}
/**
* 1. Remove the bottom border in Firefox 39-.
* 2. Add the correct text decoration in Chrome, Edge, IE, Opera, and Safari.
*/
abbr[title] {
border-bottom: none; /* 1 */
text-decoration: underline; /* 2 */
text-decoration: underline dotted; /* 2 */
}
/**
* Prevent the duplicate application of `bolder` by the next rule in Safari 6.
*/
b,
strong {
font-weight: inherit;
}
/**
* Add the correct font weight in Chrome, Edge, and Safari.
*/
b,
strong {
font-weight: bolder;
}
/**
* 1. Correct the inheritance and scaling of font size in all browsers.
* 2. Correct the odd `em` font sizing in all browsers.
*/
code,
kbd,
samp {
font-family: monospace, monospace; /* 1 */
font-size: 1em; /* 2 */
}
/**
* Add the correct font style in Android 4.3-.
*/
dfn {
font-style: italic;
}
/**
* Add the correct background and color in IE 9-.
*/
mark {
background-color: #ff0;
color: #000;
}
/**
* Add the correct font size in all browsers.
*/
small {
font-size: 80%;
}
/**
* Prevent `sub` and `sup` elements from affecting the line height in
* all browsers.
*/
sub,
sup {
font-size: 75%;
line-height: 0;
position: relative;
vertical-align: baseline;
}
sub {
bottom: -0.25em;
}
sup {
top: -0.5em;
}
/* Embedded content
========================================================================== */
/**
* Add the correct display in IE 9-.
*/
audio,
video {
display: inline-block;
}
/**
* Add the correct display in iOS 4-7.
*/
audio:not([controls]) {
display: none;
height: 0;
}
/**
* Remove the border on images inside links in IE 10-.
*/
img {
border-style: none;
}
/**
* Hide the overflow in IE.
*/
svg:not(:root) {
overflow: hidden;
}
/* Forms
========================================================================== */
/**
* 1. Change the font styles in all browsers (opinionated).
* 2. Remove the margin in Firefox and Safari.
*/
button,
input,
optgroup,
select,
textarea {
font-family: sans-serif; /* 1 */
font-size: 100%; /* 1 */
line-height: 1.15; /* 1 */
margin: 0; /* 2 */
}
/**
* Show the overflow in IE.
* 1. Show the overflow in Edge.
*/
button,
input { /* 1 */
overflow: visible;
}
/**
* Remove the inheritance of text transform in Edge, Firefox, and IE.
* 1. Remove the inheritance of text transform in Firefox.
*/
button,
select { /* 1 */
text-transform: none;
}
/**
* 1. Prevent a WebKit bug where (2) destroys native `audio` and `video`
* controls in Android 4.
* 2. Correct the inability to style clickable types in iOS and Safari.
*/
button,
html [type="button"], /* 1 */
[type="reset"],
[type="submit"] {
-webkit-appearance: button; /* 2 */
}
/**
* Remove the inner border and padding in Firefox.
*/
button::-moz-focus-inner,
[type="button"]::-moz-focus-inner,
[type="reset"]::-moz-focus-inner,
[type="submit"]::-moz-focus-inner {
border-style: none;
padding: 0;
}
/**
* Restore the focus styles unset by the previous rule.
*/
button:-moz-focusring,
[type="button"]:-moz-focusring,
[type="reset"]:-moz-focusring,
[type="submit"]:-moz-focusring {
outline: 1px dotted ButtonText;
}
/**
* Change the border, margin, and padding in all browsers (opinionated).
*/
fieldset {
border: 1px solid #c0c0c0;
margin: 0 2px;
padding: 0.35em 0.625em 0.75em;
}
/**
* 1. Correct the text wrapping in Edge and IE.
* 2. Correct the color inheritance from `fieldset` elements in IE.
* 3. Remove the padding so developers are not caught out when they zero out
* `fieldset` elements in all browsers.
*/
legend {
box-sizing: border-box; /* 1 */
color: inherit; /* 2 */
display: table; /* 1 */
max-width: 100%; /* 1 */
padding: 0; /* 3 */
white-space: normal; /* 1 */
}
/**
* 1. Add the correct display in IE 9-.
* 2. Add the correct vertical alignment in Chrome, Firefox, and Opera.
*/
progress {
display: inline-block; /* 1 */
vertical-align: baseline; /* 2 */
}
/**
* Remove the default vertical scrollbar in IE.
*/
textarea {
overflow: auto;
}
/**
* 1. Add the correct box sizing in IE 10-.
* 2. Remove the padding in IE 10-.
*/
[type="checkbox"],
[type="radio"] {
box-sizing: border-box; /* 1 */
padding: 0; /* 2 */
}
/**
* Correct the cursor style of increment and decrement buttons in Chrome.
*/
[type="number"]::-webkit-inner-spin-button,
[type="number"]::-webkit-outer-spin-button {
height: auto;
}
/**
* 1. Correct the odd appearance in Chrome and Safari.
* 2. Correct the outline style in Safari.
*/
[type="search"] {
-webkit-appearance: textfield; /* 1 */
outline-offset: -2px; /* 2 */
}
/**
* Remove the inner padding and cancel buttons in Chrome and Safari on macOS.
*/
[type="search"]::-webkit-search-cancel-button,
[type="search"]::-webkit-search-decoration {
-webkit-appearance: none;
}
/**
* 1. Correct the inability to style clickable types in iOS and Safari.
* 2. Change font properties to `inherit` in Safari.
*/
::-webkit-file-upload-button {
-webkit-appearance: button; /* 1 */
font: inherit; /* 2 */
}
/* Interactive
========================================================================== */
/*
* Add the correct display in IE 9-.
* 1. Add the correct display in Edge, IE, and Firefox.
*/
details, /* 1 */
menu {
display: block;
}
/*
* Add the correct display in all browsers.
*/
summary {
display: list-item;
}
/* Scripting
========================================================================== */
/**
* Add the correct display in IE 9-.
*/
canvas {
display: inline-block;
}
/**
* Add the correct display in IE.
*/
template {
display: none;
}
/* Hidden
========================================================================== */
/**
* Add the correct display in IE 10-.
*/
[hidden] {
display: none;
}

6
src/assets/scss/init.scss Normal file
View File

@@ -0,0 +1,6 @@
@charset "UTF-8";
@import "variables";
@import "mixins";
@import "base";
@import "pages";

25
src/assets/scss/mixins/_breakpoints.scss Normal file
View File

@@ -0,0 +1,25 @@
/**
* Breakpoints
*/
@mixin breakpoint-xs {
@content;
}
@mixin breakpoint-sm {
@media screen and (min-width: $layout-breakpoint-sm) {
@content;
}
}
@mixin breakpoint-md {
@media screen and (min-width: $layout-breakpoint-md) {
@content;
}
}
@mixin breakpoint-lg {
@media screen and (min-width: $layout-breakpoint-lg) {
@content
}
}

7
src/assets/scss/mixins/_line-height.scss Normal file
View File

@@ -0,0 +1,7 @@
/**
* Line-Height
*/
@mixin line-height($number) {
line-height: #{ $number * $typographic-leading + "px"};
}

23
src/assets/scss/mixins/_margin.scss Normal file
View File

@@ -0,0 +1,23 @@
/**
* Margin
*/
@mixin margin-top($number) {
margin-top: #{ $number * $typographic-leading + "px"};
}
@mixin margin-bottom($number) {
margin-bottom: #{ $number * $typographic-leading + "px"};
}
@mixin margin($top, $right, $bottom:null, $left:null) {
@if $left==null and $bottom==null {
margin: #{ $top * $typographic-leading + "px"} #{ $right * $typographic-leading + "px"};
}
@else if $left==null or $left==$right {
margin: #{ $top * $typographic-leading + "px"} #{ $right * $typographic-leading + "px"} #{ $bottom * $typographic-leading + "px"};
}
@else {
margin: #{ $top * $typographic-leading + "px"} #{ $right * $typographic-leading + "px"} #{ $bottom * $typographic-leading + "px"} #{ $left * $typographic-leading + "px"};
}
}

19
src/assets/scss/mixins/_padding.scss Normal file
View File

@@ -0,0 +1,19 @@
/**
* Padding
*/
@mixin padding($top, $right, $bottom:null, $left:null) {
@if $left==null and $bottom==null {
padding: #{ $top * $typographic-leading + "px"} #{ $right * $typographic-leading + "px"};
}
@else if $left==null or $left==$right {
padding: #{ $top * $typographic-leading + "px"} #{ $right * $typographic-leading + "px"} #{ $bottom * $typographic-leading + "px"};
}
@else {
padding: #{ $top * $typographic-leading + "px"} #{ $right * $typographic-leading + "px"} #{ $bottom * $typographic-leading + "px"} #{ $left * $typographic-leading + "px"};
}
}
@mixin padding-equal($number) {
padding: #{ $number * $typographic-leading + "px"};
}

18
src/assets/scss/pages/_categories.scss Normal file
View File

@@ -0,0 +1,18 @@
/**
* Categories
*/
.categories {
&__list {
&-item {
&-link {
color: $color-base;
&:hover,
&:focus {
color: $color-primary;
border-bottom: 1px solid $color-primary;
}
}
}
}
}

18
src/assets/scss/pages/_tags.scss Normal file
View File

@@ -0,0 +1,18 @@
/**
* Tags
*/
.tags {
&__list {
&-item {
&-link {
color: $color-base;
&:hover,
&:focus {
color: $color-primary;
border-bottom: 1px solid $color-primary;
}
}
}
}
}

44
src/components/CategoryTemplateDetails/index.jsx Normal file
View File

@@ -0,0 +1,44 @@
import React from 'react';
import PropTypes from 'prop-types';
import Post from '../Post';
class CategoryTemplateDetails extends React.Component {
render() {
const items = [];
const category = this.props.pathContext.category;
const posts = this.props.data.allMarkdownRemark.edges;
posts.forEach((post) => {
items.push(
<Post data={post} key={post.node.fields.slug} />
);
});
return (
<div className="content">
<div className="content__inner">
<div className="page">
<h1 className="page__title">
{category}
</h1>
<div className="page__body">
{items}
</div>
</div>
</div>
</div>
);
}
}
CategoryTemplateDetails.propTypes = {
data: PropTypes.shape({
allMarkdownRemark: PropTypes.shape({
edges: PropTypes.array.isRequired
})
}),
pathContext: PropTypes.shape({
category: PropTypes.string.isRequired
})
};
export default CategoryTemplateDetails;

65
src/components/Links/index.jsx Normal file
View File

@@ -0,0 +1,65 @@
import React from 'react';
import PropTypes from 'prop-types';
import './style.scss';
import '../../assets/fonts/fontello-771c82e0/css/fontello.css';
class Links extends React.Component {
render() {
const author = this.props.data;
const links = {
telegram: author.telegram,
twitter: author.twitter,
github: author.github,
vk: author.vk,
rss: author.rss,
email: author.email
};
return (
<div className="links">
<ul className="links__list">
<li className="links__list-item">
<a href={links.twitter}>
<i className="icon-twitter" />
</a>
</li>
<li className="links__list-item">
<a href={links.github}>
<i className="icon-github" />
</a>
</li>
<li className="links__list-item">
<a href={links.vk}>
<i className="icon-vkontakte" />
</a>
</li>
</ul>
<ul className="links__list">
<li className="links__list-item">
<a href={`mailto:${links.email}`}>
<i className="icon-mail" />
</a>
</li>
<li className="links__list-item">
<a href={`telegram:${links.telegram}`}>
<i className="icon-paper-plane" />
</a>
</li>
</ul>
<ul className="links__list">
<li className="links__list-item">
<a href={links.rss}>
<i className="icon-rss" />
</a>
</li>
</ul>
</div>
);
}
}
Links.propTypes = {
data: PropTypes.object.isRequired
};
export default Links;

35
src/components/Links/style.scss Normal file
View File

@@ -0,0 +1,35 @@
@import "../../assets/scss/variables";
@import "../../assets/scss/mixins";
.links {
@include margin-bottom(1);
&__list {
display: flex;
list-style: none;
padding: 0;
margin: 10px -3px;
&-item {
padding: 0;
margin: 0 3px;
height: 24px;
width: 24px;
line-height: 24px;
border-radius: 3px;
text-align: center;
background: $color-gray-bg;
& a {
border: 0;
& i {
font-size: 14px;
color: lighten($color-base, 20%);
}
&:hover,
&:focus {
& i {
color: $color-base;
}
}
}
}
}
}

38
src/components/Menu/index.jsx Normal file
View File

@@ -0,0 +1,38 @@
import React from 'react';
import PropTypes from 'prop-types';
import Link from 'gatsby-link';
import './style.scss';
class Menu extends React.Component {
render() {
const menu = this.props.data;
const menuBlock = (
<ul className="menu__list">
{menu.map(item =>
<li className="menu__list-item" key={item.path}>
<Link
exact to={item.path}
className="menu__list-item-link"
activeClassName="menu__list-item-link menu__list-item-link--active"
>
{item.label}
</Link>
</li>
)}
</ul>
);
return (
<nav className="menu">
{menuBlock}
</nav>
);
}
}
Menu.propTypes = {
data: PropTypes.array.isRequired
};
export default Menu;

30
src/components/Menu/style.scss Normal file
View File

@@ -0,0 +1,30 @@
@import "../../assets/scss/variables";
@import "../../assets/scss/mixins";
.menu {
@include margin-bottom(1);
&__list {
list-style: none;
padding: 0;
margin: 0;
&-item {
padding: 0;
margin: 10px 0;
&-link {
font-size: $typographic-base-font-size;
color: $typographic-base-font-color;
font-weight: 400;
border: 0;
&:hover,
&:focus {
color: $color-primary;
border-bottom: 1px solid $color-primary;
}
&--active {
color: $color-base;
border-bottom: 1px solid $color-base;
}
}
}
}
}

32
src/components/PageTemplateDetails/index.jsx Normal file
View File

@@ -0,0 +1,32 @@
import React from 'react';
import PropTypes from 'prop-types';
import Sidebar from '../Sidebar';
import './style.scss';
class PageTemplateDetails extends React.Component {
render() {
const page = this.props.data.markdownRemark;
return (
<div>
<Sidebar {...this.props} />
<div className="content">
<div className="content__inner">
<div className="page">
<h1 className="page__title">{page.frontmatter.title}</h1>
<div className="page__body" dangerouslySetInnerHTML={{ __html: page.html }} />
</div>
</div>
</div>
</div>
);
}
}
PageTemplateDetails.propTypes = {
data: PropTypes.shape({
markdownRemark: PropTypes.object.isRequired
})
};
export default PageTemplateDetails;

18
src/components/PageTemplateDetails/style.scss Normal file
View File

@@ -0,0 +1,18 @@
@import "../../assets/scss/variables";
@import "../../assets/scss/mixins";
.page {
@include margin-bottom(2);
&__title {
font-size: $typographic-base-font-size * 2.5;
font-weight: 500;
@include line-height(2);
@include margin-top(0);
@include margin-bottom(1.45);
}
&__body {
font-size: $typographic-base-font-size;
@include line-height(1);
@include margin(0, 0, 1);
}
}

46
src/components/Post/index.jsx Normal file
View File

@@ -0,0 +1,46 @@
import React from 'react';
import PropTypes from 'prop-types';
import Link from 'gatsby-link';
import moment from 'moment';
import './style.scss';
class Post extends React.Component {
render() {
const data = this.props.data;
const post = {
title: data.node.frontmatter.title,
slug: data.node.fields.slug,
description: data.node.frontmatter.description,
date: data.node.frontmatter.date,
category: data.node.frontmatter.category,
categorySlug: data.node.fields.categorySlug
};
return (
<div className="post">
<div className="post__meta">
<time className="post__meta-time" dateTime={moment(post.date).format('MMMM D, YYYY')}>
{moment(post.date).format('MMMM YYYY')}
</time>
<span className="post__meta-divider" />
<span className="post__meta-category" key={post.categorySlug}>
<Link to={post.categorySlug} className="post__meta-category-link">
{post.category}
</Link>
</span>
</div>
<h2 className="post__title">
<Link className="post__title-link" to={post.slug}>{post.title}</Link>
</h2>
<p className="post__description">{post.description}</p>
<Link className="post__readmore" to={post.slug}>Read</Link>
</div>
);
}
}
Post.propTypes = {
data: PropTypes.object.isRequired
};
export default Post;

60
src/components/Post/style.scss Normal file
View File

@@ -0,0 +1,60 @@
@import "../../assets/scss/variables";
@import "../../assets/scss/mixins";
.post {
@include margin-bottom(1.25);
&:last-child {
@include margin-bottom(.5);
}
&__title {
font-size: $typographic-base-font-size * 1.6875;
@include line-height(1.5);
@include margin-top(0);
@include margin-bottom(.5);
&-link {
color: $color-base;
&:hover,
&:focus {
color: $color-base;
border-bottom: 1px solid $color-base;
}
}
}
&__description {
font-size: $typographic-base-font-size;
@include line-height(1);
@include margin-bottom(.75);
}
&__meta {
&-time {
font-size: $typographic-small-font-size;
color: $color-base;
font-weight: 500;
text-transform: uppercase;
}
&-divider {
margin: 0 5px;
}
&-category {
&-link {
font-size: $typographic-small-font-size;
color: $color-secondary;
font-weight: 500;
text-transform: uppercase;
&:hover,
&:focus {
color: $color-primary;
}
}
}
}
&__readmore {
font-size: $typographic-base-font-size;
color: $color-primary;
&:hover,
&:focus {
color: $color-primary;
border-bottom: 1px solid $color-primary;
}
}
}

72
src/components/PostTemplateDetails/index.jsx Normal file
View File

@@ -0,0 +1,72 @@
import React from 'react';
import PropTypes from 'prop-types';
import Link from 'gatsby-link';
import moment from 'moment';
import './style.scss';
class PostTemplateDetails extends React.Component {
render() {
const { subtitle, author } = this.props.data.site.siteMetadata;
const post = this.props.data.markdownRemark;
const tags = post.fields.tagSlugs;
const homeBlock = (
<div>
<Link className="post-single__home-button" to="/">All Articles</Link>
</div>
);
const tagsBlock = (
<div className="post-single__tags">
<ul className="post-single__tags-list">
{tags.map((tag, i) =>
<li className="post-single__tags-list-item" key={tag}>
<Link to={tag} className="post-single__tags-list-item-link">
{post.frontmatter.tags[i]}
</Link>
</li>
)}
</ul>
</div>
);
return (
<div>
{homeBlock}
<div className="post-single">
<div className="post-single__inner">
<h1 className="post-single__title">{post.frontmatter.title}</h1>
<div className="post-single__body" dangerouslySetInnerHTML={{ __html: post.html }} />
<div className="post-single__date">
<em>Published {moment(post.frontmatter.date).format('D MMM YYYY')}</em>
</div>
</div>
<div className="post-single__footer">
{tagsBlock}
<hr />
<p className="post-single__footer-text">
{subtitle}
<a href={author.twitter} target="_blank" rel="noopener noreferrer">
<br /> <strong>{author.name}</strong> on Twitter
</a>
</p>
</div>
</div>
</div>
);
}
}
PostTemplateDetails.propTypes = {
data: PropTypes.shape({
site: PropTypes.shape({
siteMetadata: PropTypes.shape({
subtitle: PropTypes.string.isRequired,
author: PropTypes.object.isRequired
})
}),
markdownRemark: PropTypes.object.isRequired
})
};
export default PostTemplateDetails;

166
src/components/PostTemplateDetails/style.scss Normal file
View File

@@ -0,0 +1,166 @@
@import "../../assets/scss/variables";
@import "../../assets/scss/mixins";
.post-single {
&__inner {
max-width: $layout-post-single-max-width;
padding: 0 15px;
margin: 0 auto;
}
&__title {
font-size: $typographic-base-font-size * 2;
max-width: $layout-post-single-width;
margin-left: auto;
margin-right: auto;
font-weight: 600;
text-align: center;
@include line-height(1.65);
@include margin-top(1);
@include margin-bottom(0);
}
&__body {
& figure {
@include margin-bottom(1);
& blockquote {
font-style: italic;
text-align: center;
margin-top: 0;
@include padding(1, 0);
& p {
max-width: $layout-post-single-width;
font-size: $typographic-base-font-size * 1.6817;
margin-top: 0;
@include margin-bottom(1);
@include line-height(1.5);
}
}
}
& a {
text-decoration: underline;
}
& .gatsby-highlight {
max-width: $layout-post-single-width;
margin-left: 15px;
margin-right: 15px;
@include margin-bottom(1);
}
& :not(div) {
max-width: $layout-post-single-width;
margin-left: auto;
margin-right: auto;
}
}
&__footer {
max-width: $layout-post-single-width;
margin-left: 15px;
margin-right: 15px;
@include line-height(1);
@include margin-top(1);
@include margin-bottom(2);
&-text {
& a {
text-decoration: underline;
}
}
}
&__date {
max-width: $layout-post-single-width;
margin-left: auto;
margin-right: auto;
}
&__tags {
@include margin-bottom(.5);
&-list {
list-style: none;
margin: 0 -5px;
padding: 0;
&-item {
display: inline-block;
margin: 10px 5px;
&-link {
background: $color-gray-bg;
text-decoration: none;
border: 0;
border-radius: 3px;
color: lighten($color-base, 20%);
line-height: $typographic-base-line-height;
padding: 8px 16px;
&:hover,
&:focus {
color: $color-base;
background: darken($color-gray-bg, 5%);
border: 0;
}
}
}
}
}
&__home-button {
display: block;
margin-left: auto;
margin-right: auto;
max-width: 90px;
font-size: $typographic-base-font-size;
padding: 0 16px;
height: 35px;
line-height: 35px;
text-align: center;
color: lighten($color-base, 20%);
background: $color-gray-bg;
font-weight: 400;
border-radius: 3px;
@include margin-top(1);
&:hover,
&:focus {
color: $color-base;
background: darken($color-gray-bg, 5%);
border: 0;
}
}
}
@include breakpoint-sm {
.post-single {
&__footer {
margin-left: auto;
margin-right: auto;
}
&__body {
& .gatsby-highlight {
margin-left: auto;
margin-right: auto;
}
}
}
}
@include breakpoint-md {
.post-single {
&__inner {
padding: 0;
}
&__title {
font-size: $typographic-base-font-size * 3;
@include line-height(2.25);
@include margin-top(2.25);
@include margin-bottom(1.5);
}
&__body {
font-size: $typographic-base-font-size * 1.125;
@include line-height(1.125);
@include margin-bottom(1.125);
& p {
font-size: $typographic-base-font-size * 1.125;
@include line-height(1.125);
@include margin-bottom(1.125);
}
}
&__home-button {
position: fixed;
max-width: auto;
margin: 0;
top: 30px;
left: 30px;
}
}
}

74
src/components/Sidebar/index.jsx Normal file
View File

@@ -0,0 +1,74 @@
import React from 'react';
import PropTypes from 'prop-types';
import get from 'lodash/get';
import Link from 'gatsby-link';
import Menu from '../Menu';
import Links from '../Links';
import profilePic from '../../pages/photo.jpg';
import './style.scss';
class Sidebar extends React.Component {
render() {
const { location } = this.props;
const { author, subtitle, copyright, menu } = this.props.data.site.siteMetadata;
const isHomePage = get(location, 'pathname', '/') === '/';
/* eslint-disable jsx-a11y/img-redundant-alt*/
const authorBlock = (
<div>
<Link to="/">
<img
src={profilePic}
className="sidebar__author-photo"
width="75" height="75"
alt={author.name}
/>
</Link>
{ isHomePage ? (
<h1 className="sidebar__author-title">
<Link className="sidebar__author-title-link" to="/">{author.name}</Link>
</h1>
) :
<h2 className="sidebar__author-title">
<Link className="sidebar__author-title-link" to="/">{author.name}</Link>
</h2>
}
<p className="sidebar__author-subtitle">{subtitle}</p>
</div>
);
/* eslint-enable jsx-a11y/img-redundant-alt*/
return (
<div className="sidebar">
<div className="sidebar__inner">
<div className="sidebar__author">
{authorBlock}
</div>
<div>
<Menu data={menu} />
<Links data={author} />
<p className="sidebar__copyright">
{copyright}
</p>
</div>
</div>
</div>
);
}
}
Sidebar.propTypes = {
data: PropTypes.shape({
site: PropTypes.shape({
siteMetadata: PropTypes.shape({
subtitle: PropTypes.string.isRequired,
author: PropTypes.object.isRequired,
copyright: PropTypes.string.isRequired,
menu: PropTypes.array.isRequired
})
})
}),
location: PropTypes.object
};
export default Sidebar;

69
src/components/Sidebar/style.scss Normal file
View File

@@ -0,0 +1,69 @@
@import "../../assets/scss/variables";
@import "../../assets/scss/mixins";
.sidebar {
width: 100%;
&__inner {
position: relative;
padding: 25px 20px 0;
}
&__author {
&-photo {
display: inline-block;
margin-bottom: 0;
border-radius: 50%;
background-clip: padding-box;
}
&-title {
font-size: $typographic-base-font-size * 1.125;
font-weight: 500;
@include line-height(1.125);
@include margin(.5, 0, .5, 0);
&-link {
color: $color-base;
&:hover,
&:focus {
color: $color-base;
}
}
}
&-subtitle {
color: $color-gray;
@include line-height(1);
@include margin-bottom(1);
}
}
&__copyright {
color: lighten($color-gray, 18%);
font-size: $typographic-small-font-size;
}
}
@include breakpoint-sm {
.sidebar {
lost-column: 5/12;
&__inner {
padding: 30px 20px 0;
&:after {
background: $color-gray-border;
background: linear-gradient(to bottom, $color-gray-border 0%, $color-gray-border 48%, $color-white 100%);
position: absolute;
content: "";
width: 1px;
height: 540px;
top: 30px;
right: -10px;
bottom: 0;
}
}
}
}
@include breakpoint-md {
.sidebar {
lost-column: 1/3;
&__inner {
padding: 40px;
}
}
}

44
src/components/TagTemplateDetails/index.jsx Normal file
View File

@@ -0,0 +1,44 @@
import React from 'react';
import PropTypes from 'prop-types';
import Post from '../Post';
class TagTemplateDetails extends React.Component {
render() {
const items = [];
const tagTitle = this.props.pathContext.tag;
const posts = this.props.data.allMarkdownRemark.edges;
posts.forEach((post) => {
items.push(
<Post data={post} key={post.node.fields.slug} />
);
});
return (
<div className="content">
<div className="content__inner">
<div className="page">
<h1 className="page__title">
All Posts tagget as &quot;{tagTitle}&quot;
</h1>
<div className="page__body">
{items}
</div>
</div>
</div>
</div>
);
}
}
TagTemplateDetails.propTypes = {
data: PropTypes.shape({
allMarkdownRemark: PropTypes.shape({
edges: PropTypes.array.isRequired
})
}),
pathContext: PropTypes.shape({
tag: PropTypes.string.isRequired
})
};
export default TagTemplateDetails;

57
src/html.js Normal file
View File

@@ -0,0 +1,57 @@
import React from 'react';
import PropTypes from 'prop-types';
class HTML extends React.Component {
render() {
const { postBodyComponents, headComponents, body } = this.props;
let styles;
if (process.env.NODE_ENV === 'production') {
try {
// eslint-disable-next-line import/no-webpack-loader-syntax
styles = require('!raw-loader!../public/styles.css');
} catch (e) {
console.log(e);
}
}
let css;
if (process.env.NODE_ENV === 'production') {
css = (
<style
id="gatsby-inlined-css"
dangerouslySetInnerHTML={{ __html: styles }}
/>
);
}
return (
<html lang="en">
<head>
<meta charSet="utf-8" />
<meta httpEquiv="X-UA-Compatible" content="IE=edge" />
<meta
name="viewport"
content="width=device-width, initial-scale=1.0"
/>
{headComponents}
{css}
</head>
<body>
<div
id="___gatsby"
dangerouslySetInnerHTML={{ __html: body }}
/>
{postBodyComponents}
</body>
</html>
);
}
}
HTML.propTypes = {
postBodyComponents: PropTypes.node.isRequired,
headComponents: PropTypes.node.isRequired,
body: PropTypes.node.isRequired
};
export default HTML;

24
src/layouts/index.jsx Normal file
View File

@@ -0,0 +1,24 @@
import React from 'react';
import PropTypes from 'prop-types';
import Helmet from 'react-helmet';
import 'typeface-roboto';
import '../assets/scss/init.scss';
class Layout extends React.Component {
render() {
const { children } = this.props;
return (
<div className="layout">
<Helmet defaultTitle="Blog by John Doe" />
{children()}
</div>
);
}
}
Layout.propTypes = {
children: PropTypes.func
};
export default Layout;

49
src/pages/404.jsx Normal file
View File

@@ -0,0 +1,49 @@
import React from 'react';
import Sidebar from '../components/Sidebar';
class NotFoundRoute extends React.Component {
render() {
return (
<div>
<Sidebar {...this.props} />
<div className="content">
<div className="content__inner">
<div className="page">
<h1 className="page__title">NOT FOUND</h1>
<div className="page__body">
<p>You just hit a route that doesn&#39;t exist... the sadness.</p>
</div>
</div>
</div>
</div>
</div>
);
}
}
export default NotFoundRoute;
export const pageQuery = graphql`
query NotFoundQuery {
site {
siteMetadata {
title
subtitle
copyright
menu {
label
path
}
author {
name
email
telegram
twitter
github
rss
vk
}
}
}
}
`;

BIN
src/pages/articles/2016-01-09---Perfecting-the-Art-of-Perfection/1.jpg Normal file
View File

Binary file not shown.
Side by Side

After

Width:  |  Height:  |  Size: 821 KiB

20
src/pages/articles/2016-01-09---Perfecting-the-Art-of-Perfection/index.md Normal file
View File

@@ -0,0 +1,20 @@
---
title: Perfecting the Art of Perfection
date: "2016-09-01T23:46:37.121Z"
layout: post
draft: false
path: "/posts/perfecting-the-art-of-perfection/"
category: "Design Inspiration"
tags:
- "Handwriting"
- "Learning to write"
description: "Quisque cursus, metus vitae pharetra auctor, sem massa mattis sem, at interdum magna augue eget diam. Vestibulum ante ipsum primis in faucibus orci luctus et ultrices posuere cubilia Curae; Morbi lacinia molestie dui. Praesent blandit dolor. Sed non quam. In vel mi sit amet augue congue elementum."
---
Quisque cursus, metus vitae pharetra auctor, sem massa mattis sem, at interdum magna augue eget diam. Vestibulum ante ipsum primis in faucibus orci luctus et ultrices posuere cubilia Curae; Morbi lacinia molestie dui. Praesent blandit dolor. Sed non quam. In vel mi sit amet augue congue elementum.
![Nulla faucibus vestibulum eros in tempus. Vestibulum tempor imperdiet velit nec dapibus](./1.jpg)
Pellentesque habitant morbi tristique senectus et netus et malesuada fames ac turpis egestas. Vestibulum tortor quam, feugiat vitae, ultricies eget, tempor sit amet, ante. Donec eu libero sit amet quam egestas semper. Aenean ultricies mi vitae est. Mauris placerat eleifend leo. Quisque sit amet est et sapien ullamcorper pharetra. Vestibulum erat wisi, condimentum sed, commodo vitae, ornare sit amet, wisi. Aenean fermentum, elit eget tincidunt condimentum, eros ipsum rutrum orci, sagittis tempus lacus enim ac dui. Donec non enim in turpis pulvinar facilisis. Ut felis.
Praesent dapibus, neque id cursus faucibus, tortor neque egestas augue, eu vulputate magna eros eu erat. Aliquam erat volutpat. Nam dui mi, tincidunt quis, accumsan porttitor, facilisis luctus, metus.

BIN
src/pages/articles/2016-01-12---The-Origins-of-Social-Stationery-Lettering/1.jpg Normal file
View File

Binary file not shown.
Side by Side

After

Width:  |  Height:  |  Size: 948 KiB

52
src/pages/articles/2016-01-12---The-Origins-of-Social-Stationery-Lettering/index.md Normal file
View File

@@ -0,0 +1,52 @@
---
title: The Origins of Social Stationery Lettering
date: "2016-12-01T22:40:32.169Z"
layout: post
draft: false
path: "/posts/the-origins-of-social-stationery-lettering"
category: "Design Culture"
tags:
- "Typefaces"
- "Lettering"
- "History"
description: "Pellentesque habitant morbi tristique senectus et netus et malesuada fames ac turpis egestas. Vestibulum tortor quam, feugiat vitae, ultricies eget, tempor sit amet, ante."
---
**Pellentesque habitant morbi tristique** senectus et netus et malesuada fames ac turpis egestas. Vestibulum tortor quam, feugiat vitae, ultricies eget, tempor sit amet, ante. Donec eu libero sit amet quam egestas semper. *Aenean ultricies mi vitae est.* Mauris placerat eleifend leo. Quisque sit amet est et sapien ullamcorper pharetra.
Vestibulum erat wisi, condimentum sed, commodo vitae, ornare sit amet, wisi. Aenean fermentum, elit eget tincidunt condimentum, eros ipsum rutrum orci, sagittis tempus lacus enim ac dui. [Donec non enim](#) in turpis pulvinar facilisis.
![Nulla faucibus vestibulum eros in tempus. Vestibulum tempor imperdiet velit nec dapibus](./1.jpg)
## Header Level 2
+ Lorem ipsum dolor sit amet, consectetuer adipiscing elit.
+ Aliquam tincidunt mauris eu risus.
Donec non enim in turpis pulvinar facilisis. Ut felis. Praesent dapibus, neque id cursus faucibus, tortor neque egestas augue, eu vulputate magna eros eu erat. Aliquam erat volutpat.
<figure>
<blockquote>
<p>Lorem ipsum dolor sit amet, consectetur adipiscing elit. Vivamus magna. Cras in mi at felis aliquet congue. Ut a est eget ligula molestie gravida. Curabitur massa. Donec eleifend, libero at sagittis mollis, tellus est malesuada tellus, at luctus turpis elit sit amet quam. Vivamus pretium ornare est.</p>
<footer>
<cite>— Aliquam tincidunt mauris eu risus.</cite>
</footer>
</blockquote>
</figure>
### Header Level 3
+ Lorem ipsum dolor sit amet, consectetuer adipiscing elit.
+ Aliquam tincidunt mauris eu risus.
Pellentesque habitant morbi tristique senectus et netus et malesuada fames ac turpis egestas. Vestibulum tortor quam, feugiat vitae, ultricies eget, tempor sit amet, ante. Donec eu libero sit amet quam egestas semper. Aenean ultricies mi vitae est. Mauris placerat eleifend leo. Quisque sit amet est et sapien ullamcorper pharetra.
```css
#header h1 a {
display: block;
width: 300px;
height: 80px;
}
```
Vestibulum erat wisi, condimentum sed, commodo vitae, ornare sit amet, wisi. Aenean fermentum, elit eget tincidunt condimentum, eros ipsum rutrum orci, sagittis tempus lacus enim ac dui. Donec non enim in turpis pulvinar facilisis. Ut felis. Praesent dapibus, neque id cursus faucibus, tortor neque egestas augue, eu vulputate magna eros eu erat. Aliquam erat volutpat. Nam dui mi, tincidunt quis, accumsan porttitor, facilisis luctus, metus.

BIN
src/pages/articles/2016-02-02---A-Brief-History-of-Typography/1.jpg Normal file
View File

Binary file not shown.
Side by Side

After

Width:  |  Height:  |  Size: 2.9 MiB

53
src/pages/articles/2016-02-02---A-Brief-History-of-Typography/index.md Normal file
View File

@@ -0,0 +1,53 @@
---
title: "A Brief History of Typography"
date: "2016-02-02T22:40:32.169Z"
layout: post
draft: false
path: "/posts/a-brief-history-of-typography/"
category: "Design Inspiration"
tags:
- "Linotype"
- "Monotype"
- "History of typography"
- "Helvetica"
description: "Morbi in sem quis dui placerat ornare. Pellentesque odio nisi, euismod in, pharetra a, ultricies in, diam. Sed arcu. Cras consequat."
---
**Pellentesque habitant morbi tristique** senectus et netus et malesuada fames ac turpis egestas. Vestibulum tortor quam, feugiat vitae, ultricies eget, tempor sit amet, ante. Donec eu libero sit amet quam egestas semper. *Aenean ultricies mi vitae est.* Mauris placerat eleifend leo. Quisque sit amet est et sapien ullamcorper pharetra.
Vestibulum erat wisi, condimentum sed, commodo vitae, ornare sit amet, wisi. Aenean fermentum, elit eget tincidunt condimentum, eros ipsum rutrum orci, sagittis tempus lacus enim ac dui. [Donec non enim](#) in turpis pulvinar facilisis.
![Nulla faucibus vestibulum eros in tempus. Vestibulum tempor imperdiet velit nec dapibus](./1.jpg)
## Header Level 2
+ Lorem ipsum dolor sit amet, consectetuer adipiscing elit.
+ Aliquam tincidunt mauris eu risus.
Donec non enim in turpis pulvinar facilisis. Ut felis. Praesent dapibus, neque id cursus faucibus, tortor neque egestas augue, eu vulputate magna eros eu erat. Aliquam erat volutpat.
<figure>
<blockquote>
<p>Lorem ipsum dolor sit amet, consectetur adipiscing elit. Vivamus magna. Cras in mi at felis aliquet congue. Ut a est eget ligula molestie gravida. Curabitur massa. Donec eleifend, libero at sagittis mollis, tellus est malesuada tellus, at luctus turpis elit sit amet quam. Vivamus pretium ornare est.</p>
<footer>
<cite>— Aliquam tincidunt mauris eu risus.</cite>
</footer>
</blockquote>
</figure>
### Header Level 3
+ Lorem ipsum dolor sit amet, consectetuer adipiscing elit.
+ Aliquam tincidunt mauris eu risus.
Pellentesque habitant morbi tristique senectus et netus et malesuada fames ac turpis egestas. Vestibulum tortor quam, feugiat vitae, ultricies eget, tempor sit amet, ante. Donec eu libero sit amet quam egestas semper. Aenean ultricies mi vitae est. Mauris placerat eleifend leo. Quisque sit amet est et sapien ullamcorper pharetra.
```css
#header h1 a {
display: block;
width: 300px;
height: 80px;
}
```
Vestibulum erat wisi, condimentum sed, commodo vitae, ornare sit amet, wisi. Aenean fermentum, elit eget tincidunt condimentum, eros ipsum rutrum orci, sagittis tempus lacus enim ac dui. Donec non enim in turpis pulvinar facilisis. Ut felis. Praesent dapibus, neque id cursus faucibus, tortor neque egestas augue, eu vulputate magna eros eu erat. Aliquam erat volutpat. Nam dui mi, tincidunt quis, accumsan porttitor, facilisis luctus, metus.

BIN
src/pages/articles/2017-18-08---The-Birth-of-Movable-Type/Gutenberg.jpg Normal file
View File

Binary file not shown.
Side by Side

After

Width:  |  Height:  |  Size: 151 KiB

BIN
src/pages/articles/2017-18-08---The-Birth-of-Movable-Type/Printing-press.png Normal file
View File

Binary file not shown.
Side by Side

After

Width:  |  Height:  |  Size: 319 KiB

109
src/pages/articles/2017-18-08---The-Birth-of-Movable-Type/index.md Normal file
View File

@@ -0,0 +1,109 @@
---
title: "Johannes Gutenberg: The Birth of Movable Type"
date: "2017-08-18T22:12:03.284Z"
layout: post
draft: false
path: "/posts/the-birth-of-movable-type/"
category: "Typography"
tags:
- "Open source"
- "Gatsby"
- "Typography"
description: "German inventor Johannes Gutenberg developed a method of movable type and used it to create one of the western world’s first major printed books, the “Forty–Two–Line” Bible."
---
German inventor Johannes Gutenberg developed a method of movable type and used it to create one of the western world’s first major printed books, the “Forty–Two–Line” Bible.
**Johannes Gensfleisch zur Laden zum Gutenberg** (c. 1398 – 1468) was a German blacksmith, goldsmith, printer, and publisher who introduced printing to Europe. His invention of mechanical movable type printing started the Printing Revolution and is widely regarded as the most important event of the modern period. It played a key role in the development of the Renaissance, Reformation, the Age of Enlightenment, and the Scientific revolution and laid the material basis for the modern knowledge-based economy and the spread of learning to the masses.
<figure class="float-right" style="width: 240px">
<img src="./Gutenberg.jpg" alt="Gutenberg">
<figcaption>Johannes Gutenberg</figcaption>
</figure>
With his invention of the printing press, Gutenberg was the first European to use movable type printing, in around 1439. Among his many contributions to printing are: the invention of a process for mass-producing movable type; the use of oil-based ink; and the use of a wooden printing press similar to the agricultural screw presses of the period. His truly epochal invention was the combination of these elements into a practical system that allowed the mass production of printed books and was economically viable for printers and readers alike. Gutenberg's method for making type is traditionally considered to have included a type metal alloy and a hand mould for casting type. The alloy was a mixture of lead, tin, and antimony that melted at a relatively low temperature for faster and more economical casting, cast well, and created a durable type.
In Renaissance Europe, the arrival of mechanical movable type printing introduced the era of mass communication which permanently altered the structure of society. The relatively unrestricted circulation of information — including revolutionary ideas — transcended borders, captured the masses in the Reformation and threatened the power of political and religious authorities; the sharp increase in literacy broke the monopoly of the literate elite on education and learning and bolstered the emerging middle class. Across Europe, the increasing cultural self-awareness of its people led to the rise of proto-nationalism, accelerated by the flowering of the European vernacular languages to the detriment of Latin's status as lingua franca. In the 19th century, the replacement of the hand-operated Gutenberg-style press by steam-powered rotary presses allowed printing on an industrial scale, while Western-style printing was adopted all over the world, becoming practically the sole medium for modern bulk printing.
The use of movable type was a marked improvement on the handwritten manuscript, which was the existing method of book production in Europe, and upon woodblock printing, and revolutionized European book-making. Gutenberg's printing technology spread rapidly throughout Europe and later the world.
His major work, the Gutenberg Bible (also known as the 42-line Bible), has been acclaimed for its high aesthetic and technical quality.
## Printing Press
Around 1439, Gutenberg was involved in a financial misadventure making polished metal mirrors (which were believed to capture holy light from religious relics) for sale to pilgrims to Aachen: in 1439 the city was planning to exhibit its collection of relics from Emperor Charlemagne but the event was delayed by one year due to a severe flood and the capital already spent could not be repaid. When the question of satisfying the investors came up, Gutenberg is said to have promised to share a “secret”. It has been widely speculated that this secret may have been the idea of printing with movable type. Also around 1439–1440, the Dutch Laurens Janszoon Coster came up with the idea of printing. Legend has it that the idea came to him “like a ray of light”.
<figure class="float-left" style="width: 240px">
<img src="./Printing-press.png" alt="Early Printing Press">
<figcaption>Early wooden printing press as depicted in 1568.</figcaption>
</figure>
Until at least 1444 he lived in Strasbourg, most likely in the St. Arbogast parish. It was in Strasbourg in 1440 that Gutenberg is said to have perfected and unveiled the secret of printing based on his research, mysteriously entitled Kunst und Aventur (art and enterprise). It is not clear what work he was engaged in, or whether some early trials with printing from movable type may have been conducted there. After this, there is a gap of four years in the record. In 1448, he was back in Mainz, where he took out a loan from his brother-in-law Arnold Gelthus, quite possibly for a printing press or related paraphernalia. By this date, Gutenberg may have been familiar with intaglio printing; it is claimed that he had worked on copper engravings with an artist known as the Master of Playing Cards.
By 1450, the press was in operation, and a German poem had been printed, possibly the first item to be printed there. Gutenberg was able to convince the wealthy moneylender Johann Fust for a loan of 800 guilders. Peter Schöffer, who became Fust’s son-in-law, also joined the enterprise. Schöffer had worked as a scribe in Paris and is believed to have designed some of the first typefaces.
<figure>
<blockquote>
<p>All that has been written to me about that marvelous man seen at Frankfurt is true. I have not seen complete Bibles but only a number of quires of various books of the Bible. The script was very neat and legible, not at all difficult to follow—your grace would be able to read it without effort, and indeed without glasses.</p>
<footer>
<cite>—Future pope Pius II in a letter to Cardinal Carvajal, March 1455</cite>
</footer>
</blockquote>
</figure>
Gutenberg's workshop was set up at Hof Humbrecht, a property belonging to a distant relative. It is not clear when Gutenberg conceived the Bible project, but for this he borrowed another 800 guilders from Fust, and work commenced in 1452. At the same time, the press was also printing other, more lucrative texts (possibly Latin grammars). There is also some speculation that there may have been two presses, one for the pedestrian texts, and one for the Bible. One of the profit-making enterprises of the new press was the printing of thousands of indulgences for the church, documented from 1454–55.
In 1455 Gutenberg completed his 42-line Bible, known as the Gutenberg Bible. About 180 copies were printed, most on paper and some on vellum.
## Court Case
Some time in 1456, there was a dispute between Gutenberg and Fust, and Fust demanded his money back, accusing Gutenberg of misusing the funds. Meanwhile the expenses of the Bible project had proliferated, and Gutenberg's debt now exceeded 20,000 guilders. Fust sued at the archbishop's court. A November 1455 legal document records that there was a partnership for a "project of the books," the funds for which Gutenberg had used for other purposes, according to Fust. The court decided in favor of Fust, giving him control over the Bible printing workshop and half of all printed Bibles.
Thus Gutenberg was effectively bankrupt, but it appears he retained (or re-started) a small printing shop, and participated in the printing of a Bible in the town of Bamberg around 1459, for which he seems at least to have supplied the type. But since his printed books never carry his name or a date, it is difficult to be certain, and there is consequently a considerable scholarly debate on this subject. It is also possible that the large Catholicon dictionary, 300 copies of 754 pages, printed in Mainz in 1460, may have been executed in his workshop.
Meanwhile, the Fust–Schöffer shop was the first in Europe to bring out a book with the printer's name and date, the Mainz Psalter of August 1457, and while proudly proclaiming the mechanical process by which it had been produced, it made no mention of Gutenberg.
## Later Life
In 1462, during a conflict between two archbishops, Mainz was sacked by archbishop Adolph von Nassau, and Gutenberg was exiled. An old man by now, he moved to Eltville where he may have initiated and supervised a new printing press belonging to the brothers Bechtermünze.
In January 1465, Gutenberg's achievements were recognized and he was given the title Hofmann (gentleman of the court) by von Nassau. This honor included a stipend, an annual court outfit, as well as 2,180 litres of grain and 2,000 litres of wine tax-free. It is believed he may have moved back to Mainz around this time, but this is not certain.
***
Gutenberg died in 1468 and was buried in the Franciscan church at Mainz, his contributions largely unknown. This church and the cemetery were later destroyed, and Gutenberg's grave is now lost.
In 1504, he was mentioned as the inventor of typography in a book by Professor Ivo Wittig. It was not until 1567 that the first portrait of Gutenberg, almost certainly an imaginary reconstruction, appeared in Heinrich Pantaleon's biography of famous Germans.
## Printing Method With Movable Type
Gutenberg's early printing process, and what tests he may have made with movable type, are not known in great detail. His later Bibles were printed in such a way as to have required large quantities of type, some estimates suggesting as many as 100,000 individual sorts. Setting each page would take, perhaps, half a day, and considering all the work in loading the press, inking the type, pulling the impressions, hanging up the sheets, distributing the type, etc., it is thought that the Gutenberg–Fust shop might have employed as many as 25 craftsmen.
![Movable metal type, and composing stick, descended from Gutenberg's press. Photo by Willi Heidelbach. Licensed under CC BY 2.5](./movable-type.jpg)
*Movable metal type, and composing stick, descended from Gutenberg's press. Photo by Willi Heidelbach. Licensed under CC BY 2.5*
Gutenberg's technique of making movable type remains unclear. In the following decades, punches and copper matrices became standardized in the rapidly disseminating printing presses across Europe. Whether Gutenberg used this sophisticated technique or a somewhat primitive version has been the subject of considerable debate.
In the standard process of making type, a hard metal punch (made by punchcutting, with the letter carved back to front) is hammered into a softer copper bar, creating a matrix. This is then placed into a hand-held mould and a piece of type, or "sort", is cast by filling the mould with molten type-metal; this cools almost at once, and the resulting piece of type can be removed from the mould. The matrix can be reused to create hundreds, or thousands, of identical sorts so that the same character appearing anywhere within the book will appear very uniform, giving rise, over time, to the development of distinct styles of typefaces or fonts. After casting, the sorts are arranged into type-cases, and used to make up pages which are inked and printed, a procedure which can be repeated hundreds, or thousands, of times. The sorts can be reused in any combination, earning the process the name of “movable type”.
The invention of the making of types with punch, matrix and mold has been widely attributed to Gutenberg. However, recent evidence suggests that Gutenberg's process was somewhat different. If he used the punch and matrix approach, all his letters should have been nearly identical, with some variations due to miscasting and inking. However, the type used in Gutenberg's earliest work shows other variations.
<figure>
<blockquote>
<p>It is a press, certainly, but a press from which shall flow in inexhaustible streams… Through it, god will spread his word.</p>
<footer>
<cite>—Johannes Gutenberg</cite>
</footer>
</blockquote>
</figure>
In 2001, the physicist Blaise Agüera y Arcas and Princeton librarian Paul Needham, used digital scans of a Papal bull in the Scheide Library, Princeton, to carefully compare the same letters (types) appearing in different parts of the printed text. The irregularities in Gutenberg's type, particularly in simple characters such as the hyphen, suggested that the variations could not have come from either ink smear or from wear and damage on the pieces of metal on the types themselves. While some identical types are clearly used on other pages, other variations, subjected to detailed image analysis, suggested that they could not have been produced from the same matrix. Transmitted light pictures of the page also appeared to reveal substructures in the type that could not arise from traditional punchcutting techniques. They hypothesized that the method may have involved impressing simple shapes to create alphabets in “cuneiform” style in a matrix made of some soft material, perhaps sand. Casting the type would destroy the mould, and the matrix would need to be recreated to make each additional sort. This could explain the variations in the type, as well as the substructures observed in the printed images.
Thus, they feel that “the decisive factor for the birth of typography”, the use of reusable moulds for casting type, might have been a more progressive process than was previously thought. They suggest that the additional step of using the punch to create a mould that could be reused many times was not taken until twenty years later, in the 1470s. Others have not accepted some or all of their suggestions, and have interpreted the evidence in other ways, and the truth of the matter remains very uncertain.
A 1568 history by Hadrianus Junius of Holland claims that the basic idea of the movable type came to Gutenberg from Laurens Janszoon Coster via Fust, who was apprenticed to Coster in the 1430s and may have brought some of his equipment from Haarlem to Mainz. While Coster appears to have experimented with moulds and castable metal type, there is no evidence that he had actually printed anything with this technology. He was an inventor and a goldsmith. However, there is one indirect supporter of the claim that Coster might be the inventor. The author of the Cologne Chronicle of 1499 quotes Ulrich Zell, the first printer of Cologne, that printing was performed in Mainz in 1450, but that some type of printing of lower quality had previously occurred in the Netherlands. However, the chronicle does not mention the name of Coster, while it actually credits Gutenberg as the "first inventor of printing" in the very same passage (fol. 312). The first securely dated book by Dutch printers is from 1471, and the Coster connection is today regarded as a mere legend.
The 19th century printer and typefounder Fournier Le Jeune suggested that Gutenberg might not have been using type cast with a reusable matrix, but possibly wooden types that were carved individually. A similar suggestion was made by Nash in 2004. This remains possible, albeit entirely unproven.
It has also been questioned whether Gutenberg used movable types at all. In 2004, Italian professor Bruno Fabbiani claimed that examination of the 42-line Bible revealed an overlapping of letters, suggesting that Gutenberg did not in fact use movable type (individual cast characters) but rather used whole plates made from a system somewhat like a modern typewriter, whereby the letters were stamped successively into the plate and then printed. However, most specialists regard the occasional overlapping of type as caused by paper movement over pieces of type of slightly unequal height.

BIN
src/pages/articles/2017-18-08---The-Birth-of-Movable-Type/movable-type.jpg Normal file
View File

Binary file not shown.
Side by Side

After

Width:  |  Height:  |  Size: 1.8 MiB

BIN
src/pages/articles/2017-19-08---Humane-Typography-in-the-Digital-Age/42-line-bible.jpg Normal file
View File

Binary file not shown.
Side by Side

After

Width:  |  Height:  |  Size: 656 KiB

74
src/pages/articles/2017-19-08---Humane-Typography-in-the-Digital-Age/index.md Normal file
View File

@@ -0,0 +1,74 @@
---
title: Humane Typography in the Digital Age
date: "2017-08-19T22:40:32.169Z"
layout: post
draft: false
path: "/posts/humane-typography-in-the-digital-age/"
category: "Typography"
tags:
- "Design"
- "Typography"
- "Web Development"
description: "An Essay on Typography by Eric Gill takes the reader back to the year 1930. The year when a conflict between two worlds came to its term. The machines of the industrial world finally took over the handicrafts."
---
An Essay on Typography by Eric Gill takes the reader back to the year 1930. The year when a conflict between two worlds came to its term. The machines of the industrial world finally took over the handicrafts.
The typography of this industrial age was no longer handcrafted. Mass production and profit became more important. Quantity mattered more than the quality. The books and printed works in general lost a part of its humanity. The typefaces were not produced by craftsmen anymore. It was the machines printing and tying the books together now. The craftsmen had to let go of their craft and became a cog in the process. An extension of the industrial machine.
But the victory of the industrialism didn’t mean that the craftsmen were completely extinct. The two worlds continued to coexist independently. Each recognising the good in the other — the power of industrialism and the humanity of craftsmanship. This was the second transition that would strip typography of a part of its humanity. We have to go 500 years back in time to meet the first one.
## The first transition
A similar conflict emerged after the invention of the first printing press in Europe. Johannes Gutenberg invented movable type and used it to produce different compositions. His workshop could print up to 240 impressions per hour. Until then, the books were being copied by hand. All the books were handwritten and decorated with hand drawn ornaments and figures. A process of copying a book was long but each book, even a copy, was a work of art.
The first printed books were, at first, perceived as inferior to the handwritten ones. They were smaller and cheaper to produce. Movable type provided the printers with flexibility that allowed them to print books in languages other than Latin. Gill describes the transition to industrialism as something that people needed and wanted. Something similar happened after the first printed books emerged. People wanted books in a language they understood and they wanted books they could take with them. They were hungry for knowledge and printed books satisfied this hunger.
![42-line-bible.jpg](./42-line-bible.jpg)
*The 42–Line Bible, printed by Gutenberg.*
But, through this transition, the book lost a large part of its humanity. The machine took over most of the process but craftsmanship was still a part of it. The typefaces were cut manually by the first punch cutters. The paper was made by hand. The illustrations and ornaments were still being hand drawn. These were the remains of the craftsmanship that went almost extinct in the times of Eric Gill.
## The digital age
The first transition took away a large part of humanity from written communication. Industrialisation, the second transition described by Eric Gill, took away most of what was left. But it’s the third transition that stripped it naked. Typefaces are faceless these days. They’re just fonts on our computers. Hardly anyone knows their stories. Hardly anyone cares. Flicking through thousands of typefaces and finding the “right one” is a matter of minutes.
> In the new computer age the proliferation of typefaces and type manipulations represents a new level of visual pollution threatening our culture. Out of thousands of typefaces, all we need are a few basic ones, and trash the rest.
>
— Massimo Vignelli
Typography is not about typefaces. It’s not about what looks best, it’s about what feels right. What communicates the message best. Typography, in its essence, is about the message. “Typographical design should perform optically what the speaker creates through voice and gesture of his thoughts.”, as El Lissitzky, a famous Russian typographer, put it.
## Loss of humanity through transitions
Each transition took away a part of humanity from written language. Handwritten books being the most humane form and the digital typefaces being the least. Overuse of Helvetica is a good example. Messages are being told in a typeface just because it’s a safe option. It’s always there. Everyone knows it but yet, nobody knows it. Stop someone on the street and ask him what Helvetica is? Ask a designer the same question. Ask him where it came from, when, why and who designed it. Most of them will fail to answer these questions. Most of them used it in their precious projects but they still don’t spot it in the street.
<figure>
<blockquote>
<p>Knowledge of the quality of a typeface is of the greatest importance for the functional, aesthetic and psychological effect.</p>
<footer>
<cite>— Josef Mueller-Brockmann</cite>
</footer>
</blockquote>
</figure>
Typefaces don’t look handmade these days. And that’s all right. They don’t have to. Industrialism took that away from them and we’re fine with it. We’ve traded that part of humanity for a process that produces more books that are easier to read. That can’t be bad. And it isn’t.
> Humane typography will often be comparatively rough and even uncouth; but while a certain uncouthness does not seriously matter in humane works, uncouthness has no excuse whatever in the productions of the machine.
>
> — Eric Gill
We’ve come close to “perfection” in the last five centuries. The letters are crisp and without rough edges. We print our compositions with high–precision printers on a high quality, machine made paper.
![type-through-time.jpg](./type-through-time.jpg)
*Type through 5 centuries.*
We lost a part of ourselves because of this chase after perfection. We forgot about the craftsmanship along the way. And the worst part is that we don’t care. The transition to the digital age made that clear. We choose typefaces like clueless zombies. There’s no meaning in our work. Type sizes, leading, margins… It’s all just a few clicks or lines of code. The message isn’t important anymore. There’s no more “why” behind the “what”.
## Chasing perfection
Human beings aren’t perfect. Perfection is something that will always elude us. There will always be a small part of humanity in everything we do. No matter how small that part, we should make sure that it transcends the limits of the medium. We have to think about the message first. What typeface should we use and why? Does the typeface match the message and what we want to communicate with it? What will be the leading and why? Will there be more typefaces in our design? On what ground will they be combined? What makes our design unique and why? This is the part of humanity that is left in typography. It might be the last part. Are we really going to give it up?
*Originally published by [Matej Latin](http://matejlatin.co.uk/) on [Medium](https://medium.com/design-notes/humane-typography-in-the-digital-age-9bd5c16199bd?ref=webdesignernews.com#.lygo82z0x).*

BIN
src/pages/articles/2017-19-08---Humane-Typography-in-the-Digital-Age/type-through-time.jpg Normal file
View File

Binary file not shown.
Side by Side

After

Width:  |  Height:  |  Size: 115 KiB

89
src/pages/categories.jsx Normal file
View File

@@ -0,0 +1,89 @@
import React from 'react';
import PropTypes from 'prop-types';
import Link from 'gatsby-link';
import Helmet from 'react-helmet';
import kebabCase from 'lodash/kebabCase';
import Sidebar from '../components/Sidebar';
class CategoriesRoute extends React.Component {
render() {
const { title } = this.props.data.site.siteMetadata;
const categories = this.props.data.allMarkdownRemark.group;
return (
<div>
<Helmet title={`All Categories - ${title}`} />
<Sidebar {...this.props} />
<div className="content">
<div className="content__inner">
<div className="page">
<h1 className="page__title">Categories</h1>
<div className="page__body">
<div className="categories">
<ul className="categories__list">
{categories.map(category =>
<li key={category.fieldValue} className="categories__list-item">
<Link to={`/categories/${kebabCase(category.fieldValue)}/`} className="categories__list-item-link">
{category.fieldValue} ({category.totalCount})
</Link>
</li>
)}
</ul>
</div>
</div>
</div>
</div>
</div>
</div>
);
}
}
CategoriesRoute.propTypes = {
data: PropTypes.shape({
site: PropTypes.shape({
siteMetadata: PropTypes.shape({
title: PropTypes.string.isRequired
})
}),
allMarkdownRemark: PropTypes.shape({
group: PropTypes.array.isRequired
})
})
};
export default CategoriesRoute;
export const pageQuery = graphql`
query CategoryesQuery {
site {
siteMetadata {
title
subtitle
copyright
menu {
label
path
}
author {
name
email
telegram
twitter
github
rss
vk
}
}
}
allMarkdownRemark(
limit: 2000
filter: { frontmatter: { layout: { eq: "post" }, draft: { ne: true } } }
) {
group(field: frontmatter___category) {
fieldValue
totalCount
}
}
}
`;

94
src/pages/index.jsx Normal file
View File

@@ -0,0 +1,94 @@
import React from 'react';
import PropTypes from 'prop-types';
import Helmet from 'react-helmet';
import Post from '../components/Post';
import Sidebar from '../components/Sidebar';
class IndexRoute extends React.Component {
render() {
const items = [];
const { title, subtitle } = this.props.data.site.siteMetadata;
const posts = this.props.data.allMarkdownRemark.edges;
posts.forEach((post) => {
items.push(
<Post data={post} key={post.node.fields.slug} />
);
});
return (
<div>
<Helmet>
<title>{title}</title>
<meta name="description" content={subtitle} />
</Helmet>
<Sidebar {...this.props} />
<div className="content">
<div className="content__inner">
{items}
</div>
</div>
</div>
);
}
}
IndexRoute.propTypes = {
data: PropTypes.shape({
site: PropTypes.shape({
siteMetadata: PropTypes.shape({
title: PropTypes.string.isRequired,
subtitle: PropTypes.string.isRequired
})
}),
allMarkdownRemark: PropTypes.shape({
edges: PropTypes.array.isRequired
})
})
};
export default IndexRoute;
export const pageQuery = graphql`
query IndexQuery {
site {
siteMetadata {
title
subtitle
copyright
menu {
label
path
}
author {
name
email
telegram
twitter
github
rss
vk
}
}
}
allMarkdownRemark(
limit: 1000,
filter: { frontmatter: { layout: { eq: "post" }, draft: { ne: true } } },
sort: { order: DESC, fields: [frontmatter___date] }
){
edges {
node {
fields {
slug
categorySlug
}
frontmatter {
title
date
category
description
}
}
}
}
}
`;

BIN
src/pages/pages/2015-05-01---about/1.jpg Normal file
View File

Binary file not shown.
Side by Side

After

Width:  |  Height:  |  Size: 2.7 MiB

13
src/pages/pages/2015-05-01---about/index.md Normal file
View File

@@ -0,0 +1,13 @@
---
title: "About me"
layout: page
path: "/about"
---
Pellentesque habitant morbi tristique senectus et netus et malesuada fames ac turpis egestas. Vestibulum tortor quam, feugiat vitae, ultricies eget, tempor sit amet, ante.
![Donec eu libero sit amet quam egestas semper. Aenean ultricies mi vitae est. Mauris placerat eleifend leo. Quisque sit amet est et sapien ullamcorper pharetra. Vestibulum erat wisi, condimentum sed, commodo vitae, ornare sit amet, wisi.](./1.jpg)
*Donec eu libero sit amet quam egestas semper. Aenean ultricies mi vitae est. Mauris placerat eleifend leo. Quisque sit amet est et sapien ullamcorper pharetra. Vestibulum erat wisi, condimentum sed, commodo vitae, ornare sit amet, wisi.*
Aenean fermentum, elit eget tincidunt condimentum, eros ipsum rutrum orci, sagittis tempus lacus enim ac dui. Donec non enim in turpis pulvinar facilisis. Ut felis. Praesent dapibus, neque id cursus faucibus, tortor neque egestas augue, eu vulputate magna eros eu erat. Aliquam erat volutpat. Nam dui mi, tincidunt quis, accumsan porttitor, facilisis luctus, metus

BIN
src/pages/pages/2015-05-01---contact/1.jpg Normal file
View File

Binary file not shown.
Side by Side

After

Width:  |  Height:  |  Size: 1.1 MiB

31
src/pages/pages/2015-05-01---contact/index.md Normal file
View File

@@ -0,0 +1,31 @@
---
title: "Contact me"
layout: page
path: "/contact"
---
Morbi in sem quis dui placerat ornare. Pellentesque odio nisi, euismod in, pharetra a, ultricies in, diam. Sed arcu. Cras consequat.
Mauris placerat eleifend leo. Quisque sit amet est et sapien ullamcorper pharetra. Vestibulum erat wisi, condimentum sed, commodo vitae, ornare sit amet, wisi. Aenean fermentum, elit eget tincidunt condimentum, eros ipsum rutrum orci, sagittis tempus lacus enim ac dui.
![Donec eu libero sit amet quam egestas semper. Aenean ultricies mi vitae est. Mauris placerat eleifend leo. Quisque sit amet est et sapien ullamcorper pharetra. Vestibulum erat wisi, condimentum sed, commodo vitae, ornare sit amet, wisi.](./1.jpg)
*Donec eu libero sit amet quam egestas semper. Aenean ultricies mi vitae est. Mauris placerat eleifend leo. Quisque sit amet est et sapien ullamcorper pharetra. Vestibulum erat wisi, condimentum sed, commodo vitae, ornare sit amet, wisi.*
## Header Level 2
Praesent dapibus, neque id cursus faucibus, tortor neque egestas augue, eu vulputate magna eros eu erat. Aliquam erat volutpat. Nam dui mi, tincidunt quis, accumsan porttitor, facilisis luctus, metus.
+ **Lorem ipsum** dolor sit amet, consectetuer adipiscing elit.
+ Aliquam tincidunt mauris eu risus.
+ Vestibulum auctor dapibus neque.
### Header Level 3
Phasellus ultrices nulla quis nibh. Quisque a lectus. Donec **consectetuer** ligula vulputate sem tristique cursus. Nam nulla quam, gravida non, commodo a, sodales sit amet, nisi.
Pellentesque fermentum dolor. Aliquam quam lectus, facilisis auctor, ultrices ut, elementum vulputate, nunc.
#### Header Level 4
Vestibulum tortor quam, feugiat vitae, ultricies eget, tempor sit amet, ante. Donec eu libero sit amet quam egestas semper. Aenean ultricies mi vitae est.

BIN
src/pages/photo.jpg Normal file
View File

Binary file not shown.
Side by Side

After

Width:  |  Height:  |  Size: 4.3 KiB

89
src/pages/tags.jsx Normal file
View File

@@ -0,0 +1,89 @@
import React from 'react';
import PropTypes from 'prop-types';
import Link from 'gatsby-link';
import Helmet from 'react-helmet';
import kebabCase from 'lodash/kebabCase';
import Sidebar from '../components/Sidebar';
class TagsRoute extends React.Component {
render() {
const { title } = this.props.data.site.siteMetadata;
const tags = this.props.data.allMarkdownRemark.group;
return (
<div>
<Helmet title={`All Tags - ${title}`} />
<Sidebar {...this.props} />
<div className="content">
<div className="content__inner">
<div className="page">
<h1 className="page__title">Tags</h1>
<div className="page__body">
<div className="tags">
<ul className="tags__list">
{tags.map(tag =>
<li key={tag.fieldValue} className="tags__list-item">
<Link to={`/tags/${kebabCase(tag.fieldValue)}/`} className="tags__list-item-link">
{tag.fieldValue} ({tag.totalCount})
</Link>
</li>
)}
</ul>
</div>
</div>
</div>
</div>
</div>
</div>
);
}
}
TagsRoute.propTypes = {
data: PropTypes.shape({
site: PropTypes.shape({
siteMetadata: PropTypes.shape({
title: PropTypes.string.isRequired
})
}),
allMarkdownRemark: PropTypes.shape({
group: PropTypes.array.isRequired
})
})
};
export default TagsRoute;
export const pageQuery = graphql`
query TagsQuery {
site {
siteMetadata {
title
subtitle
copyright
menu {
label
path
}
author {
name
email
telegram
twitter
github
rss
vk
}
}
}
allMarkdownRemark(
limit: 2000
filter: { frontmatter: { layout: { eq: "post" }, draft: { ne: true } } }
) {
group(field: frontmatter___tags) {
fieldValue
totalCount
}
}
}
`;

80
src/templates/category-template.js Normal file
View File

@@ -0,0 +1,80 @@
import React from 'react';
import PropTypes from 'prop-types';
import Helmet from 'react-helmet';
import Sidebar from '../components/Sidebar';
import CategoryTemplateDetails from '../components/CategoryTemplateDetails';
class CategoryTemplate extends React.Component {
render() {
const { title } = this.props.data.site.siteMetadata;
const { category } = this.props.pathContext;
return (
<div>
<Helmet title={`${category} - ${title}`} />
<Sidebar {...this.props} />
<CategoryTemplateDetails {...this.props} />
</div>
);
}
}
CategoryTemplate.propTypes = {
data: PropTypes.shape({
site: PropTypes.shape({
siteMetadata: PropTypes.shape({
title: PropTypes.string.isRequired
})
})
}),
pathContext: PropTypes.shape({
category: PropTypes.string.isRequired
})
};
export default CategoryTemplate;
export const pageQuery = graphql`
query CategoryPage($category: String) {
site {
siteMetadata {
title
subtitle
copyright
menu {
label
path
}
author {
name
email
telegram
twitter
github
rss
vk
}
}
}
allMarkdownRemark(
limit: 1000,
filter: { frontmatter: { category: { eq: $category }, layout: { eq: "post" }, draft: { ne: true } } },
sort: { order: DESC, fields: [frontmatter___date] }
){
edges {
node {
fields {
slug
categorySlug
}
frontmatter {
title
date
category
description
}
}
}
}
}
`;

76
src/templates/page-template.js Normal file
View File

@@ -0,0 +1,76 @@
import React from 'react';
import PropTypes from 'prop-types';
import Helmet from 'react-helmet';
import PageTemplateDetails from '../components/PageTemplateDetails';
class PageTemplate extends React.Component {
render() {
const { title, subtitle } = this.props.data.site.siteMetadata;
const page = this.props.data.markdownRemark;
let description;
if (page.frontmatter.description !== null) {
description = page.frontmatter.description;
} else {
description = subtitle;
}
return (
<div>
<Helmet>
<title>{`${page.frontmatter.title} - ${title}`}</title>
<meta name="description" content={description} />
</Helmet>
<PageTemplateDetails {...this.props} />
</div>
);
}
}
PageTemplate.propTypes = {
data: PropTypes.shape({
site: PropTypes.shape({
siteMetadata: PropTypes.shape({
title: PropTypes.string.isRequired,
subtitle: PropTypes.string.isRequired
})
}),
markdownRemark: PropTypes.object.isRequired
})
};
export default PageTemplate;
export const pageQuery = graphql`
query PageBySlug($slug: String!) {
site {
siteMetadata {
title
subtitle
copyright
menu {
label
path
}
author {
name
email
telegram
twitter
github
rss
vk
}
}
}
markdownRemark(fields: { slug: { eq: $slug } }) {
id
html
frontmatter {
title
date
description
}
}
}
`;

71
src/templates/post-template.js Normal file
View File

@@ -0,0 +1,71 @@
import React from 'react';
import PropTypes from 'prop-types';
import Helmet from 'react-helmet';
import PostTemplateDetails from '../components/PostTemplateDetails';
class PostTemplate extends React.Component {
render() {
const { title, subtitle } = this.props.data.site.siteMetadata;
const post = this.props.data.markdownRemark;
let description;
if (post.frontmatter.description !== null) {
description = post.frontmatter.description;
} else {
description = subtitle;
}
return (
<div>
<Helmet>
<title>{`${post.frontmatter.title} - ${title}`}</title>
<meta name="description" content={description} />
</Helmet>
<PostTemplateDetails {...this.props} />
</div>
);
}
}
PostTemplate.propTypes = {
data: PropTypes.shape({
site: PropTypes.shape({
siteMetadata: PropTypes.shape({
title: PropTypes.string.isRequired,
subtitle: PropTypes.string.isRequired
})
}),
markdownRemark: PropTypes.object.isRequired
})
};
export default PostTemplate;
export const pageQuery = graphql`
query PostBySlug($slug: String!) {
site {
siteMetadata {
title
subtitle
copyright
author {
name
twitter
}
}
}
markdownRemark(fields: { slug: { eq: $slug } }) {
id
html
fields {
tagSlugs
}
frontmatter {
title
tags
date
description
}
}
}
`;

80
src/templates/tag-template.js Normal file
View File

@@ -0,0 +1,80 @@
import React from 'react';
import PropTypes from 'prop-types';
import Helmet from 'react-helmet';
import Sidebar from '../components/Sidebar';
import TagTemplateDetails from '../components/TagTemplateDetails';
class TagTemplate extends React.Component {
render() {
const { title } = this.props.data.site.siteMetadata;
const { tag } = this.props.pathContext;
return (
<div>
<Helmet title={`All Posts tagget as "${tag}" - ${title}`} />
<Sidebar {...this.props} />
<TagTemplateDetails {...this.props} />
</div>
);
}
}
TagTemplate.propTypes = {
data: PropTypes.shape({
site: PropTypes.shape({
siteMetadata: PropTypes.shape({
title: PropTypes.string.isRequired
})
})
}),
pathContext: PropTypes.shape({
tag: PropTypes.string.isRequired
})
};
export default TagTemplate;
export const pageQuery = graphql`
query TagPage($tag: String) {
site {
siteMetadata {
title
subtitle
copyright
menu {
label
path
}
author {
name
email
telegram
twitter
github
rss
vk
}
}
}
allMarkdownRemark(
limit: 1000,
filter: { frontmatter: { tags: { in: [$tag] }, layout: { eq: "post" }, draft: { ne: true } } },
sort: { order: DESC, fields: [frontmatter___date] }
){
edges {
node {
fields {
slug
categorySlug
}
frontmatter {
title
date
category
description
}
}
}
}
}
`;