initial commit
This commit is contained in:
Mahdi Dibaiee
@@ -0,0 +1,2 @@
|
|||||||
|
_site
|
||||||
|
.sass-cache
|
||||||
+11
@@ -0,0 +1,11 @@
|
|||||||
|
# Site settings
|
||||||
|
title: Mahdi Dibaiee
|
||||||
|
email: mdibaiee@aol.com
|
||||||
|
description: Mahdi Dibaiee's personal blog on programming
|
||||||
|
baseurl: "/portfolio" # the subpath of your site, e.g. /blog/
|
||||||
|
url: "http://dibaiee.ir" # the base hostname & protocol for your site
|
||||||
|
twitter_username: mdibaiee
|
||||||
|
github_username: mdibaiee
|
||||||
|
|
||||||
|
# Build settings
|
||||||
|
markdown: kramdown
|
||||||
@@ -0,0 +1 @@
|
|||||||
|
<span class="image-caption">{{ include.text }}</span>
|
||||||
@@ -0,0 +1,55 @@
|
|||||||
|
<footer class="site-footer">
|
||||||
|
|
||||||
|
<div class="wrapper">
|
||||||
|
|
||||||
|
<h2 class="footer-heading">{{ site.title }}</h2>
|
||||||
|
|
||||||
|
<div class="footer-col-wrapper">
|
||||||
|
<div class="footer-col footer-col-1">
|
||||||
|
<ul class="contact-list">
|
||||||
|
<li>{{ site.title }}</li>
|
||||||
|
<li><a href="mailto:{{ site.email }}">{{ site.email }}</a></li>
|
||||||
|
</ul>
|
||||||
|
</div>
|
||||||
|
|
||||||
|
<div class="footer-col footer-col-2">
|
||||||
|
<ul class="social-media-list">
|
||||||
|
{% if site.github_username %}
|
||||||
|
<li>
|
||||||
|
<a href="https://github.com/{{ site.github_username }}">
|
||||||
|
<span class="icon icon--github">
|
||||||
|
<svg viewBox="0 0 16 16">
|
||||||
|
<path fill="#828282" d="M7.999,0.431c-4.285,0-7.76,3.474-7.76,7.761 c0,3.428,2.223,6.337,5.307,7.363c0.388,0.071,0.53-0.168,0.53-0.374c0-0.184-0.007-0.672-0.01-1.32 c-2.159,0.469-2.614-1.04-2.614-1.04c-0.353-0.896-0.862-1.135-0.862-1.135c-0.705-0.481,0.053-0.472,0.053-0.472 c0.779,0.055,1.189,0.8,1.189,0.8c0.692,1.186,1.816,0.843,2.258,0.645c0.071-0.502,0.271-0.843,0.493-1.037 C4.86,11.425,3.049,10.76,3.049,7.786c0-0.847,0.302-1.54,0.799-2.082C3.768,5.507,3.501,4.718,3.924,3.65 c0,0,0.652-0.209,2.134,0.796C6.677,4.273,7.34,4.187,8,4.184c0.659,0.003,1.323,0.089,1.943,0.261 c1.482-1.004,2.132-0.796,2.132-0.796c0.423,1.068,0.157,1.857,0.077,2.054c0.497,0.542,0.798,1.235,0.798,2.082 c0,2.981-1.814,3.637-3.543,3.829c0.279,0.24,0.527,0.713,0.527,1.437c0,1.037-0.01,1.874-0.01,2.129 c0,0.208,0.14,0.449,0.534,0.373c3.081-1.028,5.302-3.935,5.302-7.362C15.76,3.906,12.285,0.431,7.999,0.431z"/>
|
||||||
|
</svg>
|
||||||
|
</span>
|
||||||
|
|
||||||
|
<span class="username">{{ site.github_username }}</span>
|
||||||
|
</a>
|
||||||
|
</li>
|
||||||
|
{% endif %}
|
||||||
|
|
||||||
|
{% if site.twitter_username %}
|
||||||
|
<li>
|
||||||
|
<a href="https://twitter.com/{{ site.twitter_username }}">
|
||||||
|
<span class="icon icon--twitter">
|
||||||
|
<svg viewBox="0 0 16 16">
|
||||||
|
<path fill="#828282" d="M15.969,3.058c-0.586,0.26-1.217,0.436-1.878,0.515c0.675-0.405,1.194-1.045,1.438-1.809
|
||||||
|
c-0.632,0.375-1.332,0.647-2.076,0.793c-0.596-0.636-1.446-1.033-2.387-1.033c-1.806,0-3.27,1.464-3.27,3.27 c0,0.256,0.029,0.506,0.085,0.745C5.163,5.404,2.753,4.102,1.14,2.124C0.859,2.607,0.698,3.168,0.698,3.767 c0,1.134,0.577,2.135,1.455,2.722C1.616,6.472,1.112,6.325,0.671,6.08c0,0.014,0,0.027,0,0.041c0,1.584,1.127,2.906,2.623,3.206 C3.02,9.402,2.731,9.442,2.433,9.442c-0.211,0-0.416-0.021-0.615-0.059c0.416,1.299,1.624,2.245,3.055,2.271 c-1.119,0.877-2.529,1.4-4.061,1.4c-0.264,0-0.524-0.015-0.78-0.046c1.447,0.928,3.166,1.469,5.013,1.469 c6.015,0,9.304-4.983,9.304-9.304c0-0.142-0.003-0.283-0.009-0.423C14.976,4.29,15.531,3.714,15.969,3.058z"/>
|
||||||
|
</svg>
|
||||||
|
</span>
|
||||||
|
|
||||||
|
<span class="username">{{ site.twitter_username }}</span>
|
||||||
|
</a>
|
||||||
|
</li>
|
||||||
|
{% endif %}
|
||||||
|
</ul>
|
||||||
|
</div>
|
||||||
|
|
||||||
|
<div class="footer-col footer-col-3">
|
||||||
|
<p class="text">{{ site.description }}</p>
|
||||||
|
</div>
|
||||||
|
</div>
|
||||||
|
|
||||||
|
</div>
|
||||||
|
|
||||||
|
</footer>
|
||||||
@@ -0,0 +1,15 @@
|
|||||||
|
<head>
|
||||||
|
<meta charset="utf-8">
|
||||||
|
<meta http-equiv="X-UA-Compatible" content="IE=edge">
|
||||||
|
<meta name="viewport" content="width=device-width, initial-scale=1">
|
||||||
|
|
||||||
|
<title>{% if page.title %}{{ page.title }}{% else %}{{ site.title }}{% endif %}</title>
|
||||||
|
<meta name="description" content="{% if page.excerpt %}{{ page.excerpt | strip_html | strip_newlines | truncate: 160 }}{% else %}{{ site.description }}{% endif %}">
|
||||||
|
|
||||||
|
<link rel="stylesheet" href="{{ "/css/main.css" | prepend: site.baseurl }}">
|
||||||
|
<link rel="canonical" href="{{ page.url | replace:'index.html','' | prepend: site.baseurl | prepend: site.url }}">
|
||||||
|
<link rel="alternate" type="application/rss+xml" title="{{ site.title }}" href="{{ "/feed.xml" | prepend: site.baseurl | prepend: site.url }}" />
|
||||||
|
|
||||||
|
<!--<script src="//dibaiee.disqus.com/embed.js"></script>-->
|
||||||
|
<!--<script src="//dibaiee.disqus.com/count.js"></script>-->
|
||||||
|
</head>
|
||||||
@@ -0,0 +1,261 @@
|
|||||||
|
<header class="site-header">
|
||||||
|
|
||||||
|
<h1>
|
||||||
|
<a class='site-title' href='{{ site.baseurl }}/'>
|
||||||
|
{{ site.title }}
|
||||||
|
</a>
|
||||||
|
</h1>
|
||||||
|
|
||||||
|
<!-- <img src='http://gravatar.com/avatar/0c861f36ff63edadc0d3dc8d26328e5c?s=170'> -->
|
||||||
|
<a href='{{ site.baseurl }}/'>
|
||||||
|
<!-- <img src='/portfolio/img/mahdi.svg' width='200'> -->
|
||||||
|
<svg
|
||||||
|
xmlns:dc="http://purl.org/dc/elements/1.1/"
|
||||||
|
xmlns:cc="http://creativecommons.org/ns#"
|
||||||
|
xmlns:rdf="http://www.w3.org/1999/02/22-rdf-syntax-ns#"
|
||||||
|
xmlns:svg="http://www.w3.org/2000/svg"
|
||||||
|
xmlns="http://www.w3.org/2000/svg"
|
||||||
|
version="1.1"
|
||||||
|
width="200"
|
||||||
|
viewBox="0 0 230 340"
|
||||||
|
id="mahdi">
|
||||||
|
<defs
|
||||||
|
id="defs4" />
|
||||||
|
<metadata
|
||||||
|
id="metadata7">
|
||||||
|
<rdf:RDF>
|
||||||
|
<cc:Work
|
||||||
|
rdf:about="">
|
||||||
|
<dc:format>image/svg+xml</dc:format>
|
||||||
|
<dc:type
|
||||||
|
rdf:resource="http://purl.org/dc/dcmitype/StillImage" />
|
||||||
|
<dc:title></dc:title>
|
||||||
|
</cc:Work>
|
||||||
|
</rdf:RDF>
|
||||||
|
</metadata>
|
||||||
|
<g
|
||||||
|
transform="translate(0,-712.36218)"
|
||||||
|
id="layer1">
|
||||||
|
<g
|
||||||
|
transform="translate(-771.90978,168.56301)"
|
||||||
|
id="g6619"
|
||||||
|
style="fill:none;stroke:#000000;stroke-opacity:1">
|
||||||
|
<path
|
||||||
|
d="m 783.96279,629.19019 c 0,0 -21.80199,-44.78997 -4.497,-63.75982 16.92331,-18.55144 29.77331,-20.65965 52.32696,-18.3084 32.89691,3.42954 60.47772,-2.68281 80.26013,1.49589 37.55084,7.93199 65.92259,31.31049 68.42598,37.15512 2.50339,5.84462 5.42401,44.66963 7.09293,48.42689 1.66893,3.75726 15.43761,22.96103 2.50339,42.58227 -12.93418,19.62124 -14.18587,15.02904 -15.02034,18.36883 -0.83446,3.33978 -4.58954,102.28094 23.36497,160.72719 27.95449,58.44627 -176.48895,0.41747 -162.72031,-20.03872 13.76864,-20.45618 13.35141,-42.58226 9.59633,-44.66963 -3.75509,-2.08737 -20.86158,2.08737 -26.28559,-6.2621 -5.42401,-8.34946 -11.68248,-28.38818 -15.02034,-33.81533 -3.33785,-5.42715 -19.60988,-41.74732 -17.52372,-49.67932 2.08615,-7.93199 3.75508,-10.8543 0.41723,-15.44651 -3.33786,-4.5922 -12.51695,-13.77661 -10.01356,-19.62124 2.50339,-5.84462 9.59633,-12.94167 9.17909,-16.28145 -0.41723,-3.33979 0,-16.28146 -2.08615,-20.87367 z"
|
||||||
|
id="path4346"
|
||||||
|
style="fill:none;stroke:#000000;stroke-width:1px;stroke-linecap:butt;stroke-linejoin:miter;stroke-opacity:1" />
|
||||||
|
<path
|
||||||
|
d="m 798.77451,625.85041 c 0,0 -5.00678,-3.966 -10.22218,-2.50484 -5.21539,1.46115 -4.17231,2.50484 -4.17231,2.50484"
|
||||||
|
id="path4348"
|
||||||
|
style="fill:none;stroke:#000000;stroke-width:1px;stroke-linecap:butt;stroke-linejoin:miter;stroke-opacity:1" />
|
||||||
|
<path
|
||||||
|
d="m 814.00346,616.45726 c 0,0 15.22895,-30.05807 46.52132,-26.50955"
|
||||||
|
id="path4350"
|
||||||
|
style="fill:none;stroke:#000000;stroke-width:1px;stroke-linecap:butt;stroke-linejoin:miter;stroke-opacity:1" />
|
||||||
|
<path
|
||||||
|
d="m 834.44781,633.57366 c 0,0 0.41723,-15.02903 7.09293,-17.32513 6.67571,-2.29611 19.60989,0.41747 28.37175,3.54851 5.84124,1.25243 -20.44435,6.78395 -23.62574,8.34947 -2.78295,1.36946 -10.37863,5.63589 -11.83894,5.42715 z"
|
||||||
|
id="path4352"
|
||||||
|
style="fill:none;stroke:#000000;stroke-width:1px;stroke-linecap:butt;stroke-linejoin:miter;stroke-opacity:1" />
|
||||||
|
<path
|
||||||
|
d="m 870.44376,616.25968 c 0,0 -15.63645,-12.98872 -30.09279,-2.36158"
|
||||||
|
id="path4354"
|
||||||
|
style="fill:none;stroke:#000000;stroke-width:1px;stroke-linecap:butt;stroke-linejoin:miter;stroke-opacity:1" />
|
||||||
|
<path
|
||||||
|
d="m 870.44376,616.25968 c 0,0 -15.63645,-12.98872 -30.09279,-2.36158"
|
||||||
|
id="path4356"
|
||||||
|
style="fill:none;stroke:#000000;stroke-width:1px;stroke-linecap:butt;stroke-linejoin:miter;stroke-opacity:1" />
|
||||||
|
<path
|
||||||
|
d="m 799.63721,725.7782 c 0,0 1.47513,-12.10312 36.28835,-14.75991"
|
||||||
|
id="path4358"
|
||||||
|
style="fill:none;stroke:#000000;stroke-width:1px;stroke-linecap:butt;stroke-linejoin:miter;stroke-opacity:1" />
|
||||||
|
<path
|
||||||
|
d="m 798.75212,709.6899 c 0,0 7.08066,-1.47599 8.5558,-3.54237 1.47514,-2.06639 27.43753,1.62358 31.86294,1.91878"
|
||||||
|
id="path4360"
|
||||||
|
style="fill:none;stroke:#000000;stroke-width:1px;stroke-linecap:butt;stroke-linejoin:miter;stroke-opacity:1" />
|
||||||
|
<path
|
||||||
|
d="m 798.16207,710.28029 c 0,0 -4.2779,1.476 -1.32762,12.39833"
|
||||||
|
id="path4362"
|
||||||
|
style="fill:none;stroke:#000000;stroke-width:1px;stroke-linecap:butt;stroke-linejoin:miter;stroke-opacity:1" />
|
||||||
|
<path
|
||||||
|
d="m 837.99076,713.08468 c -2.36022,4.13278 -30.02427,21.33765 -33.26958,21.04246 -3.2453,-0.2952 -6.26408,-1.55938 -5.67403,-3.33057"
|
||||||
|
id="path4366"
|
||||||
|
style="fill:none;stroke:#000000;stroke-width:1px;stroke-linecap:butt;stroke-linejoin:miter;stroke-opacity:1" />
|
||||||
|
<path
|
||||||
|
d="m 809.96316,656.99703 c 0,0 15.93148,5.90396 14.16131,15.6455"
|
||||||
|
id="path4374"
|
||||||
|
style="fill:none;stroke:#000000;stroke-width:1px;stroke-linecap:butt;stroke-linejoin:miter;stroke-opacity:1" />
|
||||||
|
<path
|
||||||
|
d="m 804.9477,686.51684 c 0,0 15.63645,-0.29519 17.40661,-5.60876"
|
||||||
|
id="path4376"
|
||||||
|
style="fill:none;stroke:#000000;stroke-width:1px;stroke-linecap:butt;stroke-linejoin:miter;stroke-opacity:1" />
|
||||||
|
<path
|
||||||
|
d="m 829.72999,790.13139 c 0,0 37.46846,-12.98871 40.71377,-18.89268 3.24529,-5.90396 55.46512,-16.53109 66.0861,-47.2317"
|
||||||
|
id="path4378"
|
||||||
|
style="fill:none;stroke:#000000;stroke-width:1px;stroke-linecap:butt;stroke-linejoin:miter;stroke-opacity:1" />
|
||||||
|
<path
|
||||||
|
d="m 955.41161,693.0112 c 0,0 9.7359,6.19916 18.58672,0.8856"
|
||||||
|
id="path4380"
|
||||||
|
style="fill:none;stroke:#000000;stroke-width:1px;stroke-linecap:butt;stroke-linejoin:miter;stroke-opacity:1" />
|
||||||
|
<path
|
||||||
|
d="m 957.77182,696.25838 c 0,0 4.13039,2.95198 7.96574,18.00709"
|
||||||
|
id="path4382"
|
||||||
|
style="fill:none;stroke:#000000;stroke-width:1px;stroke-linecap:butt;stroke-linejoin:miter;stroke-opacity:1" />
|
||||||
|
<path
|
||||||
|
d="m 785.77093,624.82043 c 0,0 5.01546,-41.91814 38.05851,-52.25007 33.04306,-10.33194 51.9248,-2.06639 56.94027,-7.37996 5.01546,-5.31357 -9.14585,8.56075 -1.47514,20.36868 7.67071,11.80792 7.67071,11.80792 7.67071,11.80792 0,0 30.38781,16.5311 32.15797,21.25427 1.77017,4.72317 5.31049,29.51982 8.85082,34.83338 3.54033,5.31357 2.36022,16.5311 11.21104,15.6455 8.85082,-0.88559 5.01546,-16.53109 12.39114,-26.86303 7.37569,-10.33194 14.16131,-18.00709 21.24197,-15.6455 7.08065,2.36158 14.45633,6.19916 16.52152,10.92233"
|
||||||
|
id="path4384"
|
||||||
|
style="fill:none;stroke:#000000;stroke-width:1px;stroke-linecap:butt;stroke-linejoin:miter;stroke-opacity:1" />
|
||||||
|
<path
|
||||||
|
d="m 804.35764,630.42919 c 0,0 -4.13038,12.98873 -16.52152,21.54947"
|
||||||
|
id="path4391"
|
||||||
|
style="fill:none;stroke:#000000;stroke-width:1px;stroke-linecap:butt;stroke-linejoin:miter;stroke-opacity:1" />
|
||||||
|
<path
|
||||||
|
d="m 796.98196,674.11852 c 0,0 7.08065,-7.67515 12.68617,-0.2952 5.60552,7.37996 -17.70163,2.65679 -12.68617,0.2952 z"
|
||||||
|
id="path4397"
|
||||||
|
style="fill:none;stroke:#000000;stroke-width:1px;stroke-linecap:butt;stroke-linejoin:miter;stroke-opacity:1" />
|
||||||
|
<path
|
||||||
|
d="m 833.56534,638.69475 c 0,0 17.70164,4.72317 28.0276,-4.42798"
|
||||||
|
id="path4399"
|
||||||
|
style="fill:none;stroke:#000000;stroke-width:1px;stroke-linecap:butt;stroke-linejoin:miter;stroke-opacity:1" />
|
||||||
|
<path
|
||||||
|
d="m 822.05928,584.96868 c 0,0 -20.35688,13.28392 -25.07732,19.18788"
|
||||||
|
id="path4403"
|
||||||
|
style="fill:none;stroke:#000000;stroke-width:1px;stroke-linecap:butt;stroke-linejoin:miter;stroke-opacity:1" />
|
||||||
|
<path
|
||||||
|
d="m 819.31564,591.16613 c 0,0 -16.22649,9.74153 -18.58671,12.39832"
|
||||||
|
id="path4405"
|
||||||
|
style="fill:none;stroke:#000000;stroke-width:1px;stroke-linecap:butt;stroke-linejoin:miter;stroke-opacity:1" />
|
||||||
|
<path
|
||||||
|
d="m 930.62932,872.4917 c 0.29502,-2.36158 0.29502,-41.03256 -19.4718,-55.20207"
|
||||||
|
id="path4407"
|
||||||
|
style="fill:none;stroke:#000000;stroke-width:1px;stroke-linecap:butt;stroke-linejoin:miter;stroke-opacity:1" />
|
||||||
|
<path
|
||||||
|
d="m 852.44709,789.541 c 0,0 7.67071,21.54947 30.97786,20.07348"
|
||||||
|
id="path4409"
|
||||||
|
style="fill:none;stroke:#000000;stroke-width:1px;stroke-linecap:butt;stroke-linejoin:miter;stroke-opacity:1" />
|
||||||
|
<path
|
||||||
|
d="m 965.44254,652.86426 c 0,0 20.35688,0 10.62098,14.7599"
|
||||||
|
id="path4411"
|
||||||
|
style="fill:none;stroke:#000000;stroke-width:1px;stroke-linecap:butt;stroke-linejoin:miter;stroke-opacity:1" />
|
||||||
|
<path
|
||||||
|
d="m 988.15964,651.09307 c 0,-1.47599 -5.60552,-25.68225 -21.24197,-15.6455"
|
||||||
|
id="path4413"
|
||||||
|
style="fill:none;stroke:#000000;stroke-width:1px;stroke-linecap:butt;stroke-linejoin:miter;stroke-opacity:1" />
|
||||||
|
<path
|
||||||
|
d="m 964.85248,641.05633 c 0,0 2.06519,4.42797 -1.47514,4.72317"
|
||||||
|
id="path4415"
|
||||||
|
style="fill:none;stroke:#000000;stroke-width:1px;stroke-linecap:butt;stroke-linejoin:miter;stroke-opacity:1" />
|
||||||
|
<path
|
||||||
|
d="m 962.49226,654.63545 c 0,0 2.95028,10.33193 11.50607,12.69352"
|
||||||
|
id="path4417"
|
||||||
|
style="fill:none;stroke:#000000;stroke-width:1px;stroke-linecap:butt;stroke-linejoin:miter;stroke-opacity:1" />
|
||||||
|
<path
|
||||||
|
d="m 792.70407,714.26547 0,-11.06993 c 0,0 0.73757,8.56074 0.73757,7.82275 0,-0.738 2.06518,-12.25072 2.06518,-12.25072 0,0 -0.14751,10.77473 -0.14751,10.03673 0,-0.73799 4.2779,-12.39832 4.2779,-12.39832 l -1.18011,10.03674 3.54033,-10.62713 c 0,0 0.59005,9.15114 0.73756,8.56074 0.14752,-0.5904 1.18011,-9.59394 2.0652,-8.56074 0.88507,1.03319 0.44254,6.78955 1.1801,6.34676 0.73757,-0.4428 1.62265,-7.67516 2.06519,-6.49436 0.44255,1.18079 6.63812,7.37995 6.63812,7.37995 l -3.39282,-7.97035 7.22817,7.97035 -1.32762,-5.01837 7.67071,5.16597 0,-4.57557 4.72043,4.28037 0.73757,-3.68998 6.04807,6.49436 1.03259,-5.90396 7.22817,6.64196 -1.18011,-5.60877 5.90054,10.03675"
|
||||||
|
id="path4419"
|
||||||
|
style="fill:none;stroke:#000000;stroke-width:1px;stroke-linecap:butt;stroke-linejoin:miter;stroke-opacity:1" />
|
||||||
|
<path
|
||||||
|
d="m 793.29412,720.90743 -1.18011,-6.34676 1.91768,2.65679 -1.18011,-9.74155"
|
||||||
|
id="path4421"
|
||||||
|
style="fill:none;stroke:#000000;stroke-width:1px;stroke-linecap:butt;stroke-linejoin:miter;stroke-opacity:1" />
|
||||||
|
<path
|
||||||
|
d="m 820.43663,734.92934 c 0,0.5904 0.88508,8.26555 0.59005,7.37996 -0.29502,-0.8856 -2.95027,-7.08476 -2.95027,-6.19916 0,0.88559 0.44254,5.46116 0.44254,5.46116 0,0 -4.27789,-6.78956 -3.98287,-5.75636 0.29503,1.03319 2.95028,8.41314 2.95028,8.41314 0,0 -3.68784,-7.52755 -3.83536,-6.78955 -0.14751,0.73799 1.62265,6.78955 1.62265,6.78955 0,0 -6.93314,-5.90396 -6.04806,-4.72317 0.88509,1.1808 5.75304,6.05157 5.75304,6.05157"
|
||||||
|
id="path4423"
|
||||||
|
style="fill:none;stroke:#000000;stroke-width:1px;stroke-linecap:butt;stroke-linejoin:miter;stroke-opacity:1" />
|
||||||
|
<path
|
||||||
|
d="m 868.96861,761.34958 -5.458,9.88913 c 0,0 1.0326,-9.29874 0.44254,-7.67515 -0.59005,1.62359 -5.458,12.10313 -5.458,12.10313"
|
||||||
|
id="path4425"
|
||||||
|
style="fill:none;stroke:#000000;stroke-width:1px;stroke-linecap:butt;stroke-linejoin:miter;stroke-opacity:1" />
|
||||||
|
<path
|
||||||
|
d="m 854.95482,769.17233 c 0,2.06638 1.0326,9.59394 1.0326,9.59394 l -6.19557,-6.19916 2.80275,7.23235 -11.06352,-6.19916 6.34309,7.23235 -13.27623,-5.75636 6.63812,8.11795 c 0,0 -9.88342,-6.34676 -9.44088,-5.60877 0.44254,0.738 6.19558,8.56075 5.31049,8.11795 -0.88508,-0.44279 -10.32595,-6.64196 -9.7359,-6.05156 0.59005,0.5904 6.04806,9.44635 5.458,9.15115 -0.59005,-0.29521 -11.06352,-8.11796 -10.47346,-7.67516 0.59005,0.4428 4.86795,7.97036 3.83535,7.37995 -1.03259,-0.59039 -6.4906,-6.05156 -6.4906,-6.05156 l 8.26076,6.34677 -6.63811,-8.70835 7.5232,8.11795 -1.91768,-8.41315 4.86795,8.41315 -2.65524,-9.00355 5.31049,8.11796 -3.54033,-9.44635"
|
||||||
|
id="path4427"
|
||||||
|
style="fill:none;stroke:#000000;stroke-width:1px;stroke-linecap:butt;stroke-linejoin:miter;stroke-opacity:1" />
|
||||||
|
<path
|
||||||
|
d="m 836.07308,776.99508 5.16298,7.37996"
|
||||||
|
id="path4429"
|
||||||
|
style="fill:none;stroke:#000000;stroke-width:1px;stroke-linecap:butt;stroke-linejoin:miter;stroke-opacity:1" />
|
||||||
|
<path
|
||||||
|
d="m 838.72832,775.66669 c 0.14751,0.59039 5.75303,8.41314 5.75303,8.41314 l -2.50773,-10.03673 5.01546,7.37995 -1.32762,-7.97035 5.60552,6.49436 -0.88508,-5.75636 5.458,5.31356 2.95027,-1.91879 c 0,0 -2.06518,-5.46116 -1.91767,-4.57557 0.14751,0.8856 3.98287,4.87077 3.98287,4.87077 l 0.29502,-5.31356 3.54033,1.91878 -0.44254,-7.52755 c 0,0 3.39281,1.32839 3.98287,0.4428 0.59006,-0.8856 1.62265,-2.95198 1.62265,-2.95198"
|
||||||
|
id="path4431"
|
||||||
|
style="fill:none;stroke:#000000;stroke-width:1px;stroke-linecap:butt;stroke-linejoin:miter;stroke-opacity:1" />
|
||||||
|
<path
|
||||||
|
d="m 817.63387,777.58547 c 0,0 4.42541,5.46117 4.72044,4.72317 0.29502,-0.73799 1.18011,-5.60876 1.18011,-5.60876 l 3.68784,3.24718 0.73756,-5.46117 2.50774,3.39478 4.57292,-2.36158 c 0,0 2.50773,3.68997 3.2453,3.83757 0.73757,0.1476 5.458,-1.62359 5.458,-1.62359 l 1.18011,3.39478 c 0,0 -5.60551,3.39479 -6.4906,2.80438 -0.88508,-0.59039 -4.13038,-3.68997 -3.83535,-2.50918 0.29503,1.18079 0.29503,3.83758 0.29503,3.83758 0,0 -3.68785,-4.57558 -3.68785,-3.98518 0,0.5904 -0.14751,5.16597 -0.14751,5.16597 0,0 -4.27789,-5.01837 -4.27789,-3.98518 0,1.0332 1.03259,4.42798 1.03259,4.42798 l -3.98287,-3.83758"
|
||||||
|
id="path4433"
|
||||||
|
style="fill:none;stroke:#000000;stroke-width:1px;stroke-linecap:butt;stroke-linejoin:miter;stroke-opacity:1" />
|
||||||
|
<path
|
||||||
|
d="m 793.29412,721.05503 c -0.29503,-0.73799 -1.77016,-11.95552 -1.77016,-11.95552 0,0 2.80276,12.39832 2.80276,11.06993 0,-1.3284 -1.18011,-13.72672 -1.18011,-13.72672 0,0 1.77016,7.97035 1.77016,7.08475 0,-0.88559 -0.29503,-12.98871 -0.29503,-12.98871 l 0.14752,9.59393 c 0,0 1.47513,-12.10312 1.47513,-11.21752 0,0.88559 0,10.18434 0,10.18434 0,0 1.91768,-10.47954 1.91768,-9.74155 0,0.738 1.18011,7.97035 1.18011,7.97035 0,0 1.32762,-11.21753 1.47514,-10.33193 0.14751,0.88559 0.88508,7.37995 0.88508,7.37995"
|
||||||
|
id="path4435"
|
||||||
|
style="fill:none;stroke:#000000;stroke-width:1px;stroke-linecap:butt;stroke-linejoin:miter;stroke-opacity:1" />
|
||||||
|
<path
|
||||||
|
d="m 801.7024,695.81559 1.47514,8.41314 1.62265,-7.23235"
|
||||||
|
id="path4437"
|
||||||
|
style="fill:none;stroke:#000000;stroke-width:1px;stroke-linecap:butt;stroke-linejoin:miter;stroke-opacity:1" />
|
||||||
|
<path
|
||||||
|
d="m 805.09521,704.96673 c 0,0 1.47514,-11.06993 1.47514,-10.47954 0,0.5904 1.77016,9.44634 1.77016,9.44634 l 1.32762,-10.92233 -0.29502,9.00355 1.1801,-5.31357 0.29503,5.60876 0.88509,-3.98517 0.29502,4.42797 2.0652,-8.11795"
|
||||||
|
id="path4439"
|
||||||
|
style="fill:none;stroke:#000000;stroke-width:1px;stroke-linecap:butt;stroke-linejoin:miter;stroke-opacity:1" />
|
||||||
|
<path
|
||||||
|
d="m 814.97863,702.01475 0.29502,-5.75637"
|
||||||
|
id="path4441"
|
||||||
|
style="fill:none;stroke:#000000;stroke-width:1px;stroke-linecap:butt;stroke-linejoin:miter;stroke-opacity:1" />
|
||||||
|
<path
|
||||||
|
d="m 819.55155,702.90034 -1.91768,-7.23235"
|
||||||
|
id="path4443"
|
||||||
|
style="fill:none;stroke:#000000;stroke-width:1px;stroke-linecap:butt;stroke-linejoin:miter;stroke-opacity:1" />
|
||||||
|
<path
|
||||||
|
d="m 822.05928,704.22873 c 0,-0.59039 -1.47513,-6.93715 -1.47513,-6.93715 l 5.458,7.67515 -2.80276,-7.37996 4.42541,5.90397 -1.32763,-6.64196 3.54033,7.23235 1.47514,-5.90396 1.62265,6.93716 0,-5.46117 5.01547,5.31357 -2.36022,-5.01837 4.27789,4.28037 -0.88508,-5.46116 1.18011,6.34676 1.32762,-3.68998 1.62265,5.90396 -0.14751,-4.87077 c 0,0 4.42541,-1.47599 4.13038,-0.59039 -0.29503,0.88559 -3.2453,6.19916 -3.2453,6.19916 l 3.68784,-3.39478 -1.18011,3.83758 c 0,0 4.72044,-1.62359 4.2779,-0.738 -0.44255,0.88559 -0.29503,2.95199 -0.29503,2.95199"
|
||||||
|
id="path4445"
|
||||||
|
style="fill:none;stroke:#000000;stroke-width:1px;stroke-linecap:butt;stroke-linejoin:miter;stroke-opacity:1" />
|
||||||
|
<path
|
||||||
|
d="m 793.88417,720.31704 1.18012,3.24717 -1.62265,-0.29519 1.32762,3.54237 c 0,0 -2.95027,-1.32839 -2.06519,-0.44279 0.88508,0.88559 2.2127,3.39478 2.2127,3.39478"
|
||||||
|
id="path4447"
|
||||||
|
style="fill:none;stroke:#000000;stroke-width:1px;stroke-linecap:butt;stroke-linejoin:miter;stroke-opacity:1" />
|
||||||
|
<path
|
||||||
|
d="m 794.76926,725.3354 -0.44254,-5.60876 -2.0652,1.91879 c 0,0 1.62265,3.24718 1.62265,3.83757 0,0.5904 1.32763,3.54238 1.32763,3.54238 l -2.50773,-4.87077"
|
||||||
|
id="path4449"
|
||||||
|
style="fill:none;stroke:#000000;stroke-width:1px;stroke-linecap:butt;stroke-linejoin:miter;stroke-opacity:1" />
|
||||||
|
<path
|
||||||
|
d="m 810.99576,738.02892 2.2127,6.19916 c 0,0 -1.03259,-8.85594 -0.59005,-7.97035 0.44254,0.8856 2.36022,6.64196 2.36022,5.75637 0,-0.8856 -0.29503,-7.08476 0.14751,-6.34676 0.44254,0.73799 1.77016,7.08475 2.21271,5.90396 0.44253,-1.18079 0,-7.52755 0.44253,-6.19916 0.44255,1.32839 1.62265,5.31357 1.62265,5.31357 l 1.32763,-5.16597"
|
||||||
|
id="path4451"
|
||||||
|
style="fill:none;stroke:#000000;stroke-width:1px;stroke-linecap:butt;stroke-linejoin:miter;stroke-opacity:1" />
|
||||||
|
<path
|
||||||
|
d="m 818.17578,780.10677 3.65078,6.67957 c 0,0 -2.29478,-8.45384 -1.66894,-7.72326 0.62585,0.73058 4.90248,9.39315 5.00678,8.97568 0.10431,-0.41747 -2.08615,-9.81062 -2.08615,-9.81062 0,0 5.84124,9.18441 5.73693,8.66257 -0.10431,-0.52185 -4.58955,-10.2281 -4.48524,-9.81062 0.10431,0.41747 8.03171,8.76694 8.03171,8.76694 l -2.81631,-8.76694 c 0,0 5.63262,9.70625 5.3197,9.18441 -0.31292,-0.52184 -1.87754,-10.33246 -1.87754,-10.33246 0,0 6.46709,9.81062 6.46709,9.39314 0,-0.41747 -1.56462,-10.01936 -1.56462,-10.01936 0,0 7.51017,9.28879 6.88432,8.34947 -0.62585,-0.93932 -1.56462,-9.18441 -1.56462,-9.18441 l 4.90247,7.09705 0.73016,-7.30579"
|
||||||
|
id="path4453"
|
||||||
|
style="fill:none;stroke:#000000;stroke-width:1px;stroke-linecap:butt;stroke-linejoin:miter;stroke-opacity:1" />
|
||||||
|
<path
|
||||||
|
d="m 851.24138,780.83735 -0.52154,-8.03636 4.06801,5.84462 -0.93878,-5.63589 5.63263,4.69658 -0.20861,-7.41015 5.00678,3.65289 0.41722,-6.2621 c 0,0 2.29478,4.69657 3.54647,3.23542 1.2517,-1.46116 2.6077,-5.63589 2.6077,-5.63589"
|
||||||
|
id="path4455"
|
||||||
|
style="fill:none;stroke:#000000;stroke-width:1px;stroke-linecap:butt;stroke-linejoin:miter;stroke-opacity:1" />
|
||||||
|
<path
|
||||||
|
d="m 958.00004,583.86218 c 1.5,2 7.5,14.5 7.5,18"
|
||||||
|
id="path5713"
|
||||||
|
style="fill:none;stroke:#000000;stroke-width:1px;stroke-linecap:butt;stroke-linejoin:miter;stroke-opacity:1" />
|
||||||
|
<path
|
||||||
|
d="m 895.50004,576.36218 c -1,2.5 4,12.5 8,14.5"
|
||||||
|
id="path5715"
|
||||||
|
style="fill:none;stroke:#000000;stroke-width:1px;stroke-linecap:butt;stroke-linejoin:miter;stroke-opacity:1" />
|
||||||
|
<path
|
||||||
|
d="m 911.50004,560.86218 18,-2"
|
||||||
|
id="path5717"
|
||||||
|
style="fill:none;stroke:#000000;stroke-width:1px;stroke-linecap:butt;stroke-linejoin:miter;stroke-opacity:1" />
|
||||||
|
<path
|
||||||
|
d="m 855.95274,560.56942 c 0,0 14.8493,1.06066 16.9706,-0.70711"
|
||||||
|
id="path5719"
|
||||||
|
style="fill:none;stroke:#000000;stroke-width:1px;stroke-linecap:butt;stroke-linejoin:miter;stroke-opacity:1" />
|
||||||
|
</g>
|
||||||
|
</g>
|
||||||
|
</svg>
|
||||||
|
|
||||||
|
</a>
|
||||||
|
|
||||||
|
<nav>
|
||||||
|
<a href='https://twitter.com/{{ site.twitter_username }}'>Twitter</a>
|
||||||
|
<a href='https://github.com/{{ site.github_username }}'>GitHub</a>
|
||||||
|
<a href='mailto:{{ site.email }}'>Email</a>
|
||||||
|
<a href="{{ "/feed.xml" | prepend: site.baseurl | prepend: site.url }}">RSS</a>
|
||||||
|
{% for page in site.pages %}
|
||||||
|
{% if page.title %}
|
||||||
|
<a href="{{ page.url | prepend: site.baseurl }}">{{ page.title }}</a>
|
||||||
|
{% endif %}
|
||||||
|
{% endfor %}
|
||||||
|
</nav>
|
||||||
|
|
||||||
|
</header>
|
||||||
@@ -0,0 +1,20 @@
|
|||||||
|
<!DOCTYPE html>
|
||||||
|
<html>
|
||||||
|
|
||||||
|
{% include head.html %}
|
||||||
|
|
||||||
|
<body>
|
||||||
|
|
||||||
|
{% include header.html %}
|
||||||
|
|
||||||
|
<div class="page-content">
|
||||||
|
<div class="wrapper">
|
||||||
|
{{ content }}
|
||||||
|
</div>
|
||||||
|
</div>
|
||||||
|
|
||||||
|
<!-- {% include footer.html %} -->
|
||||||
|
|
||||||
|
</body>
|
||||||
|
|
||||||
|
</html>
|
||||||
@@ -0,0 +1,14 @@
|
|||||||
|
---
|
||||||
|
layout: default
|
||||||
|
---
|
||||||
|
<div class="post">
|
||||||
|
|
||||||
|
<div class="post-header">
|
||||||
|
<h1 class="post-title">{{ page.title }}</h1>
|
||||||
|
</div>
|
||||||
|
|
||||||
|
<article class="post-content">
|
||||||
|
{{ content }}
|
||||||
|
</article>
|
||||||
|
|
||||||
|
</div>
|
||||||
@@ -0,0 +1,25 @@
|
|||||||
|
---
|
||||||
|
layout: default
|
||||||
|
---
|
||||||
|
<div class="post">
|
||||||
|
|
||||||
|
<div class="post-header">
|
||||||
|
<h1 class="post-title">{{ page.title }}</h1>
|
||||||
|
<p class="post-meta">{{ page.date | date: "%b %-d, %Y" }}{% if page.author %} • {{ page.author }}{% endif %}{% if page.meta %} • {{ page.meta }}{% endif %}</p>
|
||||||
|
</div>
|
||||||
|
|
||||||
|
<article class="post-content">
|
||||||
|
{{ content }}
|
||||||
|
</article>
|
||||||
|
|
||||||
|
<div id="disqus_thread"></div>
|
||||||
|
<script type="text/javascript">
|
||||||
|
var disqus_shortname = 'dibaiee';
|
||||||
|
|
||||||
|
(function() {
|
||||||
|
var dsq = document.createElement('script'); dsq.type = 'text/javascript'; dsq.async = true;
|
||||||
|
dsq.src = '//' + disqus_shortname + '.disqus.com/embed.js';
|
||||||
|
(document.getElementsByTagName('head')[0] || document.getElementsByTagName('body')[0]).appendChild(dsq);
|
||||||
|
})();
|
||||||
|
</script>
|
||||||
|
</div>
|
||||||
@@ -0,0 +1,49 @@
|
|||||||
|
---
|
||||||
|
layout: post
|
||||||
|
title: "Let's Begin"
|
||||||
|
date: 2015-03-09 17:13:46
|
||||||
|
permalink: beginning
|
||||||
|
categories: self
|
||||||
|
---
|
||||||
|
|
||||||
|
So, I've decided to write about what I do and what I love.
|
||||||
|
|
||||||
|
It's possible that you find anything here, so don't be surprised, but most of it
|
||||||
|
is going to be about my programming journey, what I learn, what I do, and my opinions.
|
||||||
|
|
||||||
|
I like Medium, but I want a place in which I dictate, so here's my personal blog.
|
||||||
|
|
||||||
|
|
||||||
|
{% highlight javascript linenos %}
|
||||||
|
const SECOND = 1000;
|
||||||
|
let style = document.querySelector('style');
|
||||||
|
|
||||||
|
setInterval(() => {
|
||||||
|
const now = Date.now(),
|
||||||
|
birth = new Date(2015, 2, 9).getTime(),
|
||||||
|
color = `#(now - birth).toString(16).slice(0, 6)`,
|
||||||
|
|
||||||
|
style.textContent = `#mahdi path {
|
||||||
|
stroke: ${color} !important;
|
||||||
|
}`;
|
||||||
|
}, SECOND);
|
||||||
|
{% endhighlight %}
|
||||||
|
|
||||||
|
<style></style>
|
||||||
|
|
||||||
|
<script type="application/javascript;version=1.8">
|
||||||
|
|
||||||
|
var SECOND = 1000;
|
||||||
|
var style = document.querySelector('style');
|
||||||
|
|
||||||
|
setInterval(function() {
|
||||||
|
var now = Date.now(),
|
||||||
|
birth = new Date(2015, 2, 9).getTime(),
|
||||||
|
color = '#' + (now - birth).toString(16).slice(0, 6);
|
||||||
|
|
||||||
|
style.textContent = '#mahdi path {\
|
||||||
|
stroke: ' + color + ' !important; \
|
||||||
|
}';
|
||||||
|
}, SECOND)
|
||||||
|
</script>
|
||||||
|
|
||||||
@@ -0,0 +1,143 @@
|
|||||||
|
---
|
||||||
|
layout: post
|
||||||
|
title: "CSS Filters are awesome!"
|
||||||
|
date: 2015-03-28 17:13:46
|
||||||
|
permalink: css-filters
|
||||||
|
categories: css
|
||||||
|
---
|
||||||
|
|
||||||
|
I've been working on the [CSS Filter Editor widget](https://bugzilla.mozilla.org/show_bug.cgi?id=1055181) in Firefox Developer Tools in the past few weeks, it should land soon. Thanks to [Patrick Brosset](https://medium.com/@patrickbrosset) for mentoring me and [Tim Nguyen](https://github.com/nt1m) for his great contributions.
|
||||||
|
|
||||||
|
Here is an [online version](http://mdibaiee.github.io/CSS-Filter-Tooltip/) to use as a playground (The component used in Firefox is a more complete version of this), you can use this throughout the article to test things. It doesn't seem to work in Chrome, I can't figure out why (no error in console), use Firefox for now. Alternatively you can use [David Walsh's demo](http://davidwalsh.name/demo/css-filters.php), although it doesn't have as much flexibility.
|
||||||
|
|
||||||
|
CSS Filters are supported by most modern browsers ([Can I Use CSS Filters](http://caniuse.com/#feat=css-filters)), if your browser doesn't support this, please change your browser (I recommend [Firefox](https://www.mozilla.org/en-US/firefox/new/)).
|
||||||
|
|
||||||
|
I don't like long-bla-bla-articles, so let's get to it.
|
||||||
|
|
||||||
|
#Introduction
|
||||||
|
|
||||||
|
CSS Filters introduce a few useful effects and some image adjusting functions, namely blur, drop-shadow, contrast, brightness, [and a few others](https://developer.mozilla.org/en-US/docs/Web/CSS/filter) which can be really useful if used properly.
|
||||||
|
|
||||||
|
A simple demo showing blur, contrast and brightness combined (hover over image):
|
||||||
|
|
||||||
|
<iframe width="100%" height="300" src="//jsfiddle.net/mdibaiee/2h9odv4q/12/embedded/result,css" allowfullscreen="allowfullscreen" frameborder="0"></iframe>
|
||||||
|
|
||||||
|
I group filters by the type of value they take, let's explain them briefly:
|
||||||
|
|
||||||
|
##Length
|
||||||
|
These filters accept a length value (px, em, cm, [etc](http://www.w3.org/Style/Examples/007/units)). blur is the only member of this family.
|
||||||
|
|
||||||
|
##Percentage
|
||||||
|
These filters accept percentage values, but if you omit the percentage sign, the value is multiplied by 100, e.g. `contrast(2)` is another way of writing `contrast(200%)`. Negative values have the same effect as zero.
|
||||||
|
|
||||||
|
Most filters explain themselves, I'm not going to repeat \`Adjusts ${x} level\` like a parrot.
|
||||||
|
|
||||||
|
* brightness
|
||||||
|
* contrast
|
||||||
|
* grayscale
|
||||||
|
* invert
|
||||||
|
* opacity
|
||||||
|
* saturate
|
||||||
|
* sepia
|
||||||
|
|
||||||
|
###invert
|
||||||
|
I first understood how cool this filter can be after I saw Tim Nguyen using this in theme switching. Yeah you can't invert everything and "Yay, I have a new theme", but you can use invert on some elements and it works flawlessly, believe me.
|
||||||
|
|
||||||
|
<iframe width="100%" height="100" src="//jsfiddle.net/mdibaiee/373dnby8/embedded/result,css" allowfullscreen="allowfullscreen" frameborder="0"></iframe>
|
||||||
|
|
||||||
|
###opacity
|
||||||
|
You might wonder why do we have this function, as we already have an opacity property in CSS, that's because the opacity property is not hardware accelerated, but the filter property is hardware accelerated in most browsers, which includes this function.
|
||||||
|
|
||||||
|
##Angle
|
||||||
|
hue-rotate is the only function to accept an angle value (degree / radian).
|
||||||
|
|
||||||
|
###hue-rotate
|
||||||
|
If you're familiar with [Hue](https://en.wikipedia.org/wiki/Hue) you probably know that it's measured by angles. The hue-rotate rotates the hue circle of an image relative to it's current hue value (360 and 0 have the same results).
|
||||||
|
<iframe width="100%" height="300" src="//jsfiddle.net/mdibaiee/tuqod0jb/5/embedded/result,css" allowfullscreen="allowfullscreen" frameborder="0"></iframe>
|
||||||
|
|
||||||
|
##Special
|
||||||
|
These filter's don't fit in any of the groups above, they have special/mixed values.
|
||||||
|
|
||||||
|
###drop-shadow
|
||||||
|
The drop-shadow filter accepts a *shadow-list*, four length values, and one color. box-shadow and text-shadow also accept shadow lists.
|
||||||
|
|
||||||
|
You're probably familiar with shadow lists already: `drop-shadow(x y radius spread color)`. Unfortunaly spread doesn't work in either Chrome or Firefox as of this writing — It is treated as an error.
|
||||||
|
|
||||||
|
drop-shadow is pretty cool, as it doensn't have the limitations of box-shadow and text-shadow. box-shadow applies a shadow to the outer shape, but drop-shadow applies a shadow to elements independant to their shape, they might be triangles, PNG's with transparent background or just anything.
|
||||||
|
|
||||||
|
drop-shadow clones the element's image, moves it to the offset defined, applies blur and changes it's color, putting it under the original element. Couldn't do it better:
|
||||||
|
|
||||||
|
|
||||||
|
|
||||||
|
Here is an example, a PNG image with transparent background and a CSS triangle made using the border hack:
|
||||||
|
|
||||||
|
<iframe width="100%" height="150" src="//jsfiddle.net/mdibaiee/qp7otqe5/3/embedded/result,css" allowfullscreen="allowfullscreen" frameborder="0"></iframe>
|
||||||
|
|
||||||
|
###url
|
||||||
|
With the url function we have the power of CSS and SVG Filters in one place. You can reference an SVG element by linking to it with a hash of the filter element's ID:
|
||||||
|
|
||||||
|
{% highlight css %}
|
||||||
|
filter: url(/example.svg#filter)
|
||||||
|
{% endhighlight %}
|
||||||
|
|
||||||
|
If you want to know more about SVG Filters, I recommend [MDN's tutorial on SVG Filters](https://developer.mozilla.org/en-US/docs/Web/SVG/Tutorial/Filter_effects).
|
||||||
|
|
||||||
|
###Custom
|
||||||
|
Now those filters are pretty cool, but what if I told you this is [going to be] done with CSS?
|
||||||
|
|
||||||
|
|
||||||
|
|
||||||
|
{% include caption.html text='Source: http://www.adobe.com/devnet/archive/html5/articles/css-shaders.html' %}
|
||||||
|
|
||||||
|
Custom Filters allows usage of vertex and fragment shaders which run directly in the GPU. Custom filters' specs is subject to change, so there's no implementation yet. For more info on this topic follow the links below:
|
||||||
|
|
||||||
|
* [Getting started with CSS custom filters](http://alteredqualia.com/css-shaders/article/#shaders)
|
||||||
|
* [Introducing CSS shaders: Cinematic effects for the web](http://www.adobe.com/devnet/archive/html5/articles/css-shaders.html)
|
||||||
|
* [CSS shaders specifications](http://dev.w3.org/fxtf/custom/)
|
||||||
|
|
||||||
|
#Gotchas
|
||||||
|
|
||||||
|
You now have a basic understanding of filters, good. Here are a few gotchas you'd better know.
|
||||||
|
|
||||||
|
##Order matters
|
||||||
|
The order in which filters are applied matters. Take this example:
|
||||||
|
|
||||||
|
{% highlight css %}
|
||||||
|
filter: blur(10px) contrast(2);
|
||||||
|
{% endhighlight %}
|
||||||
|
|
||||||
|
Hey, browser, please blur the element, then double the contrast of the blurred element. (blurred parts have their contrast affected)
|
||||||
|
|
||||||
|
{% highlight css %}
|
||||||
|
filter: contrast(2) blur(10px);
|
||||||
|
{% endhighlight %}
|
||||||
|
|
||||||
|
Hey browser, please double the contrast of my element, then blur it out. (high contrast image is blurred normally)
|
||||||
|
|
||||||
|
Here is the actual comparison:
|
||||||
|
<iframe width="100%" height="300" src="//jsfiddle.net/mdibaiee/z7hb98uf/1/embedded/result,css" allowfullscreen="allowfullscreen" frameborder="0"></iframe>
|
||||||
|
|
||||||
|
##Inheritance
|
||||||
|
|
||||||
|
Okay, you now know the order of filters matters, the filter property is not actually *inherited*, but when you apply a filter on a parent element, of course it's children are affected too, but what if the children have their own css filters? Ah-ha! CSS properties are applied bottom-up, which means childrens' filters are applied first.
|
||||||
|
|
||||||
|
<iframe width="100%" height="300" src="//jsfiddle.net/mdibaiee/2h9odv4q/13/embedded/result,css" allowfullscreen="allowfullscreen" frameborder="0"></iframe>
|
||||||
|
|
||||||
|
##Implementation
|
||||||
|
|
||||||
|
I said using the url function we have "the power of CSS and SVG filters in one place", but the CSS filters are actually implemented using SVG filters! You know, the functions are actually referencing to an svg generated in the browser. Here is the list of [CSS Filter equivalents](http://www.w3.org/TR/filter-effects/#ShorthandEquivalents).
|
||||||
|
|
||||||
|
-----
|
||||||
|
|
||||||
|
That's it, you can subscribe to my [RSS]({{ "/feed.xml" | prepend: site.baseurl | prepend: site.url }}) or follow me on [Twitter](https://twitter.com/{{ site.twitter_username }}) to get more articles like this.
|
||||||
|
|
||||||
|
<style>
|
||||||
|
#mahdi {
|
||||||
|
transition: filter 1s ease;
|
||||||
|
-webkit-transition: filter 1s ease;
|
||||||
|
}
|
||||||
|
#mahdi:hover {
|
||||||
|
filter: blur(3px);
|
||||||
|
-webkit-filter: blur(3px);
|
||||||
|
}
|
||||||
|
</style>
|
||||||
@@ -0,0 +1,227 @@
|
|||||||
|
/**
|
||||||
|
* Reset some basic elements
|
||||||
|
*/
|
||||||
|
body, h1, h2, h3, h4, h5, h6,
|
||||||
|
p, blockquote, pre, hr,
|
||||||
|
dl, dd, ol, ul, figure {
|
||||||
|
margin: 0;
|
||||||
|
padding: 0;
|
||||||
|
}
|
||||||
|
|
||||||
|
|
||||||
|
|
||||||
|
/**
|
||||||
|
* Basic styling
|
||||||
|
*/
|
||||||
|
body {
|
||||||
|
font-family: $base-font-family;
|
||||||
|
font-size: $base-font-size;
|
||||||
|
line-height: $base-line-height;
|
||||||
|
font-weight: 300;
|
||||||
|
color: $text-color;
|
||||||
|
background-color: $background-color;
|
||||||
|
-webkit-text-size-adjust: 100%;
|
||||||
|
}
|
||||||
|
|
||||||
|
* {
|
||||||
|
box-sizing: border-box;
|
||||||
|
}
|
||||||
|
|
||||||
|
|
||||||
|
|
||||||
|
/**
|
||||||
|
* Set `margin-bottom` to maintain vertical rhythm
|
||||||
|
*/
|
||||||
|
h1, h2, h3, h4, h5, h6,
|
||||||
|
p, blockquote, pre,
|
||||||
|
ul, ol, dl, figure,
|
||||||
|
%vertical-rhythm {
|
||||||
|
margin-bottom: $spacing-unit / 2;
|
||||||
|
}
|
||||||
|
|
||||||
|
|
||||||
|
|
||||||
|
/**
|
||||||
|
* Images
|
||||||
|
*/
|
||||||
|
img {
|
||||||
|
max-width: 100%;
|
||||||
|
vertical-align: middle;
|
||||||
|
}
|
||||||
|
|
||||||
|
|
||||||
|
|
||||||
|
/**
|
||||||
|
* Figures
|
||||||
|
*/
|
||||||
|
figure > img {
|
||||||
|
display: block;
|
||||||
|
}
|
||||||
|
|
||||||
|
figcaption {
|
||||||
|
font-size: $small-font-size;
|
||||||
|
}
|
||||||
|
|
||||||
|
|
||||||
|
|
||||||
|
/**
|
||||||
|
* Lists
|
||||||
|
*/
|
||||||
|
ul, ol {
|
||||||
|
margin-left: $spacing-unit;
|
||||||
|
}
|
||||||
|
|
||||||
|
li {
|
||||||
|
> ul,
|
||||||
|
> ol {
|
||||||
|
margin-bottom: 0;
|
||||||
|
}
|
||||||
|
}
|
||||||
|
|
||||||
|
|
||||||
|
|
||||||
|
/**
|
||||||
|
* Headings
|
||||||
|
*/
|
||||||
|
h1, h2, h3, h4, h5, h6 {
|
||||||
|
font-weight: 300;
|
||||||
|
}
|
||||||
|
|
||||||
|
|
||||||
|
|
||||||
|
/**
|
||||||
|
* Links
|
||||||
|
*/
|
||||||
|
a {
|
||||||
|
color: $brand-color;
|
||||||
|
text-decoration: none;
|
||||||
|
|
||||||
|
&:visited {
|
||||||
|
color: darken($brand-color, 15%);
|
||||||
|
}
|
||||||
|
|
||||||
|
&:hover {
|
||||||
|
color: $text-color;
|
||||||
|
// text-decoration: underline;
|
||||||
|
border-bottom: 1px solid $text-color;
|
||||||
|
}
|
||||||
|
}
|
||||||
|
|
||||||
|
|
||||||
|
|
||||||
|
/**
|
||||||
|
* Blockquotes
|
||||||
|
*/
|
||||||
|
blockquote {
|
||||||
|
color: $grey-color;
|
||||||
|
border-left: 4px solid $grey-color-light;
|
||||||
|
padding-left: $spacing-unit / 2;
|
||||||
|
font-size: 18px;
|
||||||
|
letter-spacing: -1px;
|
||||||
|
font-style: italic;
|
||||||
|
|
||||||
|
> :last-child {
|
||||||
|
margin-bottom: 0;
|
||||||
|
}
|
||||||
|
}
|
||||||
|
|
||||||
|
|
||||||
|
|
||||||
|
/**
|
||||||
|
* Code formatting
|
||||||
|
*/
|
||||||
|
pre,
|
||||||
|
code {
|
||||||
|
font-size: 15px;
|
||||||
|
border: 1px solid $grey-color-light;
|
||||||
|
border-radius: 3px;
|
||||||
|
background-color: #eef;
|
||||||
|
}
|
||||||
|
|
||||||
|
code {
|
||||||
|
padding: 1px 5px;
|
||||||
|
}
|
||||||
|
|
||||||
|
pre {
|
||||||
|
padding: 8px 12px;
|
||||||
|
overflow-x: scroll;
|
||||||
|
|
||||||
|
> code {
|
||||||
|
border: 0;
|
||||||
|
padding-right: 0;
|
||||||
|
padding-left: 0;
|
||||||
|
}
|
||||||
|
}
|
||||||
|
|
||||||
|
|
||||||
|
|
||||||
|
/**
|
||||||
|
* Wrapper
|
||||||
|
*/
|
||||||
|
.wrapper {
|
||||||
|
max-width: -webkit-calc(#{$content-width} - (#{$spacing-unit} * 2));
|
||||||
|
max-width: calc(#{$content-width} - (#{$spacing-unit} * 2));
|
||||||
|
margin-right: auto;
|
||||||
|
margin-left: auto;
|
||||||
|
padding-right: $spacing-unit;
|
||||||
|
padding-left: $spacing-unit;
|
||||||
|
@extend %clearfix;
|
||||||
|
|
||||||
|
@include media-query($on-laptop) {
|
||||||
|
max-width: -webkit-calc(#{$content-width} - (#{$spacing-unit}));
|
||||||
|
max-width: calc(#{$content-width} - (#{$spacing-unit}));
|
||||||
|
padding-right: $spacing-unit / 2;
|
||||||
|
padding-left: $spacing-unit / 2;
|
||||||
|
}
|
||||||
|
}
|
||||||
|
|
||||||
|
|
||||||
|
|
||||||
|
/**
|
||||||
|
* Clearfix
|
||||||
|
*/
|
||||||
|
%clearfix {
|
||||||
|
|
||||||
|
&:after {
|
||||||
|
content: "";
|
||||||
|
display: table;
|
||||||
|
clear: both;
|
||||||
|
}
|
||||||
|
}
|
||||||
|
|
||||||
|
|
||||||
|
|
||||||
|
/**
|
||||||
|
* Icons
|
||||||
|
*/
|
||||||
|
.icon {
|
||||||
|
|
||||||
|
> svg {
|
||||||
|
display: inline-block;
|
||||||
|
width: 16px;
|
||||||
|
height: 16px;
|
||||||
|
vertical-align: middle;
|
||||||
|
|
||||||
|
path {
|
||||||
|
fill: $grey-color;
|
||||||
|
}
|
||||||
|
}
|
||||||
|
}
|
||||||
|
|
||||||
|
@font-face {
|
||||||
|
font-family: 'Damion';
|
||||||
|
src: url(fonts/Damion_gdi.woff);
|
||||||
|
}
|
||||||
|
|
||||||
|
@font-face {
|
||||||
|
font-family: 'Ubuntu';
|
||||||
|
src: url(fonts/Ubuntu_gdi.woff);
|
||||||
|
}
|
||||||
|
@font-face {
|
||||||
|
font-family: 'Ubuntu Light';
|
||||||
|
src: url(fonts/Ubuntu-Light_gdi.woff);
|
||||||
|
}
|
||||||
|
@font-face {
|
||||||
|
font-family: 'Ubuntu Mono';
|
||||||
|
src: url(fonts/UbuntuMono-Regular_gdi.woff);
|
||||||
|
}
|
||||||
@@ -0,0 +1,94 @@
|
|||||||
|
body {
|
||||||
|
background: #FFF7EC;
|
||||||
|
height: auto;
|
||||||
|
padding-bottom: 5rem;
|
||||||
|
}
|
||||||
|
|
||||||
|
header {
|
||||||
|
width: 100%;
|
||||||
|
text-align: center;
|
||||||
|
padding-top: $spacing-unit;
|
||||||
|
|
||||||
|
img {
|
||||||
|
// border-radius: 50%;
|
||||||
|
margin: $spacing-unit auto;
|
||||||
|
// border: 1px solid #F5DFC3;
|
||||||
|
}
|
||||||
|
h1 {
|
||||||
|
font-size: 4rem;
|
||||||
|
font-family: 'Damion';
|
||||||
|
}
|
||||||
|
h1 a, & > a {
|
||||||
|
text-decoration: none;
|
||||||
|
color: $text-color !important;
|
||||||
|
|
||||||
|
&:hover {
|
||||||
|
border: none;
|
||||||
|
}
|
||||||
|
}
|
||||||
|
|
||||||
|
nav {
|
||||||
|
margin-top: 1rem;
|
||||||
|
margin-bottom: 3rem;
|
||||||
|
}
|
||||||
|
nav a {
|
||||||
|
margin: 0 1rem;
|
||||||
|
}
|
||||||
|
|
||||||
|
a:visited {
|
||||||
|
color: $brand-color;
|
||||||
|
}
|
||||||
|
}
|
||||||
|
|
||||||
|
.page-heading {
|
||||||
|
text-align: center;
|
||||||
|
font-style: italic;
|
||||||
|
margin-bottom: 3rem;
|
||||||
|
}
|
||||||
|
|
||||||
|
.post-list, .post-header {
|
||||||
|
list-style: none;
|
||||||
|
margin-left: 0;
|
||||||
|
margin-bottom: 5rem;
|
||||||
|
|
||||||
|
h2, h1 {
|
||||||
|
text-align: center;
|
||||||
|
}
|
||||||
|
.post-meta {
|
||||||
|
font-size: $small-font-size;
|
||||||
|
display: block;
|
||||||
|
text-align: center;
|
||||||
|
margin-bottom: 2rem;
|
||||||
|
}
|
||||||
|
}
|
||||||
|
|
||||||
|
article p img {
|
||||||
|
margin: 2rem auto;
|
||||||
|
display: block;
|
||||||
|
}
|
||||||
|
|
||||||
|
.post-list h2 {
|
||||||
|
font-size: 1.5rem;
|
||||||
|
}
|
||||||
|
|
||||||
|
.post article h2 {
|
||||||
|
font-size: 1.3rem;
|
||||||
|
}
|
||||||
|
|
||||||
|
article .image-caption {
|
||||||
|
display: block;
|
||||||
|
text-align: center;
|
||||||
|
font-size: 10pt;
|
||||||
|
color: $grey-color;
|
||||||
|
margin-top: -1.5rem;
|
||||||
|
}
|
||||||
|
|
||||||
|
.rss-subscribe {
|
||||||
|
text-align: center;
|
||||||
|
}
|
||||||
|
|
||||||
|
hr {
|
||||||
|
border: none;
|
||||||
|
border-top: 1px solid lighten($grey-color, 20%);
|
||||||
|
margin: 1.5rem 0;
|
||||||
|
}
|
||||||
@@ -0,0 +1,83 @@
|
|||||||
|
/* Tomorrow Light */
|
||||||
|
|
||||||
|
/* For use with Jekyll and Pygments */
|
||||||
|
|
||||||
|
/* ----------------------------------------------------------*/
|
||||||
|
|
||||||
|
pre, code {
|
||||||
|
font-family: 'Ubuntu Mono';
|
||||||
|
font-size: 11pt;
|
||||||
|
overflow-x: auto;
|
||||||
|
}
|
||||||
|
|
||||||
|
code {background: #fff; padding: 2px 4px; border-radius: 3px; border: 1px solid #ccc;};
|
||||||
|
|
||||||
|
.highlight pre {padding: 8px 10px;}
|
||||||
|
|
||||||
|
.highlight pre,
|
||||||
|
.highlight code,
|
||||||
|
.highlight .hll { background-color: #fff; border-radius: 3px; }
|
||||||
|
.highlight .c { color: #8e908c } /* Comment */
|
||||||
|
.highlight .err { color: #c82829 } /* Error */
|
||||||
|
.highlight .k { color: #8959a8 } /* Keyword */
|
||||||
|
.highlight .l { color: #f5871f } /* Literal */
|
||||||
|
.highlight .n { color: #4d4d4c } /* Name */
|
||||||
|
.highlight .o { color: #3e999f } /* Operator */
|
||||||
|
.highlight .p { color: #4d4d4c } /* Punctuation */
|
||||||
|
.highlight .cm { color: #8e908c } /* Comment.Multiline */
|
||||||
|
.highlight .cp { color: #8e908c } /* Comment.Preproc */
|
||||||
|
.highlight .c1 { color: #8e908c } /* Comment.Single */
|
||||||
|
.highlight .cs { color: #8e908c } /* Comment.Special */
|
||||||
|
.highlight .gd { color: #c82829 } /* Generic.Deleted */
|
||||||
|
.highlight .ge { font-style: italic } /* Generic.Emph */
|
||||||
|
.highlight .gh { color: #4d4d4c; font-weight: bold } /* Generic.Heading */
|
||||||
|
.highlight .gi { color: #718c00 } /* Generic.Inserted */
|
||||||
|
.highlight .gp { color: #8e908c; font-weight: bold } /* Generic.Prompt */
|
||||||
|
.highlight .gs { font-weight: bold } /* Generic.Strong */
|
||||||
|
.highlight .gu { color: #3e999f; font-weight: bold } /* Generic.Subheading */
|
||||||
|
.highlight .kc { color: #8959a8 } /* Keyword.Constant */
|
||||||
|
.highlight .kd { color: #8959a8 } /* Keyword.Declaration */
|
||||||
|
.highlight .kn { color: #3e999f } /* Keyword.Namespace */
|
||||||
|
.highlight .kp { color: #8959a8 } /* Keyword.Pseudo */
|
||||||
|
.highlight .kr { color: #8959a8 } /* Keyword.Reserved */
|
||||||
|
.highlight .kt { color: #eab700 } /* Keyword.Type */
|
||||||
|
.highlight .ld { color: #718c00 } /* Literal.Date */
|
||||||
|
.highlight .m { color: #f5871f } /* Literal.Number */
|
||||||
|
.highlight .s { color: #718c00 } /* Literal.String */
|
||||||
|
.highlight .na { color: #4271ae } /* Name.Attribute */
|
||||||
|
.highlight .nb { color: #4d4d4c } /* Name.Builtin */
|
||||||
|
.highlight .nc { color: #eab700 } /* Name.Class */
|
||||||
|
.highlight .no { color: #c82829 } /* Name.Constant */
|
||||||
|
.highlight .nd { color: #3e999f } /* Name.Decorator */
|
||||||
|
.highlight .ni { color: #4d4d4c } /* Name.Entity */
|
||||||
|
.highlight .ne { color: #c82829 } /* Name.Exception */
|
||||||
|
.highlight .nf { color: #4271ae } /* Name.Function */
|
||||||
|
.highlight .nl { color: #4d4d4c } /* Name.Label */
|
||||||
|
.highlight .nn { color: #eab700 } /* Name.Namespace */
|
||||||
|
.highlight .nx { color: #4271ae } /* Name.Other */
|
||||||
|
.highlight .py { color: #4d4d4c } /* Name.Property */
|
||||||
|
.highlight .nt { color: #3e999f } /* Name.Tag */
|
||||||
|
.highlight .nv { color: #c82829 } /* Name.Variable */
|
||||||
|
.highlight .ow { color: #3e999f } /* Operator.Word */
|
||||||
|
.highlight .w { color: #4d4d4c } /* Text.Whitespace */
|
||||||
|
.highlight .mf { color: #f5871f } /* Literal.Number.Float */
|
||||||
|
.highlight .mh { color: #f5871f } /* Literal.Number.Hex */
|
||||||
|
.highlight .mi { color: #f5871f } /* Literal.Number.Integer */
|
||||||
|
.highlight .mo { color: #f5871f } /* Literal.Number.Oct */
|
||||||
|
.highlight .sb { color: #718c00 } /* Literal.String.Backtick */
|
||||||
|
.highlight .sc { color: #4d4d4c } /* Literal.String.Char */
|
||||||
|
.highlight .sd { color: #8e908c } /* Literal.String.Doc */
|
||||||
|
.highlight .s2 { color: #718c00 } /* Literal.String.Double */
|
||||||
|
.highlight .se { color: #f5871f } /* Literal.String.Escape */
|
||||||
|
.highlight .sh { color: #718c00 } /* Literal.String.Heredoc */
|
||||||
|
.highlight .si { color: #f5871f } /* Literal.String.Interpol */
|
||||||
|
.highlight .sx { color: #718c00 } /* Literal.String.Other */
|
||||||
|
.highlight .sr { color: #718c00 } /* Literal.String.Regex */
|
||||||
|
.highlight .s1 { color: #718c00 } /* Literal.String.Single */
|
||||||
|
.highlight .ss { color: #718c00 } /* Literal.String.Symbol */
|
||||||
|
.highlight .bp { color: #4d4d4c } /* Name.Builtin.Pseudo */
|
||||||
|
.highlight .vc { color: #c82829 } /* Name.Variable.Class */
|
||||||
|
.highlight .vg { color: #c82829 } /* Name.Variable.Global */
|
||||||
|
.highlight .vi { color: #c82829 } /* Name.Variable.Instance */
|
||||||
|
.highlight .il { color: #f5871f } /* Literal.Number.Integer.Long */
|
||||||
|
.highlight .lineno {user-select: none; -moz-user-select: none; -webkit-user-select: none;}
|
||||||
@@ -0,0 +1,67 @@
|
|||||||
|
/* Monokai */
|
||||||
|
|
||||||
|
/* For use with Jekyll and Pygments */
|
||||||
|
|
||||||
|
/* ----------------------------------------------------------*/
|
||||||
|
|
||||||
|
.highlight pre,
|
||||||
|
.highlight code,
|
||||||
|
.highlight .hll { background-color: #49483e; border: 1px solid #ccc; padding: 6px 10px; border-radius: 3px; }
|
||||||
|
.highlight .c { color: #75715e } /* Comment */
|
||||||
|
.highlight .err { color: #960050; background-color: #1e0010 } /* Error */
|
||||||
|
.highlight .k { color: #66d9ef } /* Keyword */
|
||||||
|
.highlight .l { color: #ae81ff } /* Literal */
|
||||||
|
.highlight .n { color: #f8f8f2 } /* Name */
|
||||||
|
.highlight .o { color: #f92672 } /* Operator */
|
||||||
|
.highlight .p { color: #f8f8f2 } /* Punctuation */
|
||||||
|
.highlight .cm { color: #75715e } /* Comment.Multiline */
|
||||||
|
.highlight .cp { color: #75715e } /* Comment.Preproc */
|
||||||
|
.highlight .c1 { color: #75715e } /* Comment.Single */
|
||||||
|
.highlight .cs { color: #75715e } /* Comment.Special */
|
||||||
|
.highlight .ge { font-style: italic } /* Generic.Emph */
|
||||||
|
.highlight .gs { font-weight: bold } /* Generic.Strong */
|
||||||
|
.highlight .kc { color: #66d9ef } /* Keyword.Constant */
|
||||||
|
.highlight .kd { color: #66d9ef } /* Keyword.Declaration */
|
||||||
|
.highlight .kn { color: #f92672 } /* Keyword.Namespace */
|
||||||
|
.highlight .kp { color: #66d9ef } /* Keyword.Pseudo */
|
||||||
|
.highlight .kr { color: #66d9ef } /* Keyword.Reserved */
|
||||||
|
.highlight .kt { color: #66d9ef } /* Keyword.Type */
|
||||||
|
.highlight .ld { color: #e6db74 } /* Literal.Date */
|
||||||
|
.highlight .m { color: #ae81ff } /* Literal.Number */
|
||||||
|
.highlight .s { color: #e6db74 } /* Literal.String */
|
||||||
|
.highlight .na { color: #a6e22e } /* Name.Attribute */
|
||||||
|
.highlight .nb { color: #f8f8f2 } /* Name.Builtin */
|
||||||
|
.highlight .nc { color: #a6e22e } /* Name.Class */
|
||||||
|
.highlight .no { color: #66d9ef } /* Name.Constant */
|
||||||
|
.highlight .nd { color: #a6e22e } /* Name.Decorator */
|
||||||
|
.highlight .ni { color: #f8f8f2 } /* Name.Entity */
|
||||||
|
.highlight .ne { color: #a6e22e } /* Name.Exception */
|
||||||
|
.highlight .nf { color: #a6e22e } /* Name.Function */
|
||||||
|
.highlight .nl { color: #f8f8f2 } /* Name.Label */
|
||||||
|
.highlight .nn { color: #f8f8f2 } /* Name.Namespace */
|
||||||
|
.highlight .nx { color: #a6e22e } /* Name.Other */
|
||||||
|
.highlight .py { color: #f8f8f2 } /* Name.Property */
|
||||||
|
.highlight .nt { color: #f92672 } /* Name.Tag */
|
||||||
|
.highlight .nv { color: #f8f8f2 } /* Name.Variable */
|
||||||
|
.highlight .ow { color: #f92672 } /* Operator.Word */
|
||||||
|
.highlight .w { color: #f8f8f2 } /* Text.Whitespace */
|
||||||
|
.highlight .mf { color: #ae81ff } /* Literal.Number.Float */
|
||||||
|
.highlight .mh { color: #ae81ff } /* Literal.Number.Hex */
|
||||||
|
.highlight .mi { color: #ae81ff } /* Literal.Number.Integer */
|
||||||
|
.highlight .mo { color: #ae81ff } /* Literal.Number.Oct */
|
||||||
|
.highlight .sb { color: #e6db74 } /* Literal.String.Backtick */
|
||||||
|
.highlight .sc { color: #e6db74 } /* Literal.String.Char */
|
||||||
|
.highlight .sd { color: #e6db74 } /* Literal.String.Doc */
|
||||||
|
.highlight .s2 { color: #e6db74 } /* Literal.String.Double */
|
||||||
|
.highlight .se { color: #ae81ff } /* Literal.String.Escape */
|
||||||
|
.highlight .sh { color: #e6db74 } /* Literal.String.Heredoc */
|
||||||
|
.highlight .si { color: #e6db74 } /* Literal.String.Interpol */
|
||||||
|
.highlight .sx { color: #e6db74 } /* Literal.String.Other */
|
||||||
|
.highlight .sr { color: #e6db74 } /* Literal.String.Regex */
|
||||||
|
.highlight .s1 { color: #e6db74 } /* Literal.String.Single */
|
||||||
|
.highlight .ss { color: #e6db74 } /* Literal.String.Symbol */
|
||||||
|
.highlight .bp { color: #f8f8f2 } /* Name.Builtin.Pseudo */
|
||||||
|
.highlight .vc { color: #f8f8f2 } /* Name.Variable.Class */
|
||||||
|
.highlight .vg { color: #f8f8f2 } /* Name.Variable.Global */
|
||||||
|
.highlight .vi { color: #f8f8f2 } /* Name.Variable.Instance */
|
||||||
|
.highlight .il { color: #ae81ff } /* Literal.Number.Integer.Long */
|
||||||
@@ -0,0 +1,15 @@
|
|||||||
|
---
|
||||||
|
layout: page
|
||||||
|
title: About
|
||||||
|
permalink: /about/
|
||||||
|
---
|
||||||
|
|
||||||
|
Yo,
|
||||||
|
|
||||||
|
I'm Mahdi Dibaiee, a programmer.
|
||||||
|
|
||||||
|
I like hunting bugs in the wild (aka open-source). I study algorithms, data-structures, design patterns, anything I find useful, trying to expand my knowledge at any time, in any situation.
|
||||||
|
|
||||||
|
I train [code katas](http://codewars.com/users/mdibaiee) almost everyday to sharpen my skills and I'm a member of the [Mozillians clan](https://mozillians.org/en-US/u/Mahdi/).
|
||||||
|
|
||||||
|
Also, I love Parkour and Music.
|
||||||
Binary file not shown.
Binary file not shown.
Binary file not shown.
Binary file not shown.
@@ -0,0 +1,52 @@
|
|||||||
|
---
|
||||||
|
# Only the main Sass file needs front matter (the dashes are enough)
|
||||||
|
---
|
||||||
|
@charset "utf-8";
|
||||||
|
|
||||||
|
|
||||||
|
|
||||||
|
// Our variables
|
||||||
|
$base-font-family: 'Ubuntu Light', sans-serif;
|
||||||
|
$base-font-size: 12pt;
|
||||||
|
$small-font-size: $base-font-size * 0.875;
|
||||||
|
$base-line-height: 1.5;
|
||||||
|
|
||||||
|
$spacing-unit: 30px;
|
||||||
|
|
||||||
|
$text-color: #303030;
|
||||||
|
$background-color: #FFFCF8;
|
||||||
|
$brand-color: #2a7ae2;
|
||||||
|
|
||||||
|
$grey-color: #828282;
|
||||||
|
$grey-color-light: lighten($grey-color, 40%);
|
||||||
|
$grey-color-dark: darken($grey-color, 25%);
|
||||||
|
|
||||||
|
// Width of the content area
|
||||||
|
$content-width: 800px;
|
||||||
|
|
||||||
|
$on-palm: 600px;
|
||||||
|
$on-laptop: 800px;
|
||||||
|
|
||||||
|
|
||||||
|
|
||||||
|
// Using media queries with like this:
|
||||||
|
// @include media-query($on-palm) {
|
||||||
|
// .wrapper {
|
||||||
|
// padding-right: $spacing-unit / 2;
|
||||||
|
// padding-left: $spacing-unit / 2;
|
||||||
|
// }
|
||||||
|
// }
|
||||||
|
@mixin media-query($device) {
|
||||||
|
@media screen and (max-width: $device) {
|
||||||
|
@content;
|
||||||
|
}
|
||||||
|
}
|
||||||
|
|
||||||
|
|
||||||
|
|
||||||
|
// Import partials from `sass_dir` (defaults to `_sass`)
|
||||||
|
@import
|
||||||
|
"base",
|
||||||
|
"layout",
|
||||||
|
"syntax-highlighting"
|
||||||
|
;
|
||||||
@@ -0,0 +1,30 @@
|
|||||||
|
---
|
||||||
|
layout: null
|
||||||
|
---
|
||||||
|
<?xml version="1.0" encoding="UTF-8"?>
|
||||||
|
<rss version="2.0" xmlns:atom="http://www.w3.org/2005/Atom">
|
||||||
|
<channel>
|
||||||
|
<title>{{ site.title | xml_escape }}</title>
|
||||||
|
<description>{{ site.description | xml_escape }}</description>
|
||||||
|
<link>{{ site.url }}{{ site.baseurl }}/</link>
|
||||||
|
<atom:link href="{{ "/feed.xml" | prepend: site.baseurl | prepend: site.url }}" rel="self" type="application/rss+xml"/>
|
||||||
|
<pubDate>{{ site.time | date_to_rfc822 }}</pubDate>
|
||||||
|
<lastBuildDate>{{ site.time | date_to_rfc822 }}</lastBuildDate>
|
||||||
|
<generator>Jekyll v{{ jekyll.version }}</generator>
|
||||||
|
{% for post in site.posts limit:10 %}
|
||||||
|
<item>
|
||||||
|
<title>{{ post.title | xml_escape }}</title>
|
||||||
|
<description>{{ post.content | xml_escape }}</description>
|
||||||
|
<pubDate>{{ post.date | date_to_rfc822 }}</pubDate>
|
||||||
|
<link>{{ post.url | prepend: site.baseurl | prepend: site.url }}</link>
|
||||||
|
<guid isPermaLink="true">{{ post.url | prepend: site.baseurl | prepend: site.url }}</guid>
|
||||||
|
{% for tag in post.tags %}
|
||||||
|
<category>{{ tag | xml_escape }}</category>
|
||||||
|
{% endfor %}
|
||||||
|
{% for cat in post.categories %}
|
||||||
|
<category>{{ cat | xml_escape }}</category>
|
||||||
|
{% endfor %}
|
||||||
|
</item>
|
||||||
|
{% endfor %}
|
||||||
|
</channel>
|
||||||
|
</rss>
|
||||||
Vendored
BIN
Binary file not shown.
Binary file not shown.
|
After Width: | Height: | Size: 85 KiB |
Binary file not shown.
|
After Width: | Height: | Size: 21 KiB |
+238
@@ -0,0 +1,238 @@
|
|||||||
|
<?xml version="1.0" encoding="UTF-8" standalone="no"?>
|
||||||
|
<!-- Created with Inkscape (http://www.inkscape.org/) -->
|
||||||
|
|
||||||
|
<svg
|
||||||
|
xmlns:dc="http://purl.org/dc/elements/1.1/"
|
||||||
|
xmlns:cc="http://creativecommons.org/ns#"
|
||||||
|
xmlns:rdf="http://www.w3.org/1999/02/22-rdf-syntax-ns#"
|
||||||
|
xmlns:svg="http://www.w3.org/2000/svg"
|
||||||
|
xmlns="http://www.w3.org/2000/svg"
|
||||||
|
version="1.1"
|
||||||
|
width="230"
|
||||||
|
height="340"
|
||||||
|
viewBox="0 0 230 340"
|
||||||
|
id="svg2">
|
||||||
|
<defs
|
||||||
|
id="defs4" />
|
||||||
|
<metadata
|
||||||
|
id="metadata7">
|
||||||
|
<rdf:RDF>
|
||||||
|
<cc:Work
|
||||||
|
rdf:about="">
|
||||||
|
<dc:format>image/svg+xml</dc:format>
|
||||||
|
<dc:type
|
||||||
|
rdf:resource="http://purl.org/dc/dcmitype/StillImage" />
|
||||||
|
<dc:title></dc:title>
|
||||||
|
</cc:Work>
|
||||||
|
</rdf:RDF>
|
||||||
|
</metadata>
|
||||||
|
<g
|
||||||
|
transform="translate(0,-712.36218)"
|
||||||
|
id="layer1">
|
||||||
|
<g
|
||||||
|
transform="translate(-771.90978,168.56301)"
|
||||||
|
id="g6619"
|
||||||
|
style="fill:none;stroke:#000000;stroke-opacity:1">
|
||||||
|
<path
|
||||||
|
d="m 783.96279,629.19019 c 0,0 -21.80199,-44.78997 -4.497,-63.75982 16.92331,-18.55144 29.77331,-20.65965 52.32696,-18.3084 32.89691,3.42954 60.47772,-2.68281 80.26013,1.49589 37.55084,7.93199 65.92259,31.31049 68.42598,37.15512 2.50339,5.84462 5.42401,44.66963 7.09293,48.42689 1.66893,3.75726 15.43761,22.96103 2.50339,42.58227 -12.93418,19.62124 -14.18587,15.02904 -15.02034,18.36883 -0.83446,3.33978 -4.58954,102.28094 23.36497,160.72719 27.95449,58.44627 -176.48895,0.41747 -162.72031,-20.03872 13.76864,-20.45618 13.35141,-42.58226 9.59633,-44.66963 -3.75509,-2.08737 -20.86158,2.08737 -26.28559,-6.2621 -5.42401,-8.34946 -11.68248,-28.38818 -15.02034,-33.81533 -3.33785,-5.42715 -19.60988,-41.74732 -17.52372,-49.67932 2.08615,-7.93199 3.75508,-10.8543 0.41723,-15.44651 -3.33786,-4.5922 -12.51695,-13.77661 -10.01356,-19.62124 2.50339,-5.84462 9.59633,-12.94167 9.17909,-16.28145 -0.41723,-3.33979 0,-16.28146 -2.08615,-20.87367 z"
|
||||||
|
id="path4346"
|
||||||
|
style="fill:none;stroke:#000000;stroke-width:1px;stroke-linecap:butt;stroke-linejoin:miter;stroke-opacity:1" />
|
||||||
|
<path
|
||||||
|
d="m 798.77451,625.85041 c 0,0 -5.00678,-3.966 -10.22218,-2.50484 -5.21539,1.46115 -4.17231,2.50484 -4.17231,2.50484"
|
||||||
|
id="path4348"
|
||||||
|
style="fill:none;stroke:#000000;stroke-width:1px;stroke-linecap:butt;stroke-linejoin:miter;stroke-opacity:1" />
|
||||||
|
<path
|
||||||
|
d="m 814.00346,616.45726 c 0,0 15.22895,-30.05807 46.52132,-26.50955"
|
||||||
|
id="path4350"
|
||||||
|
style="fill:none;stroke:#000000;stroke-width:1px;stroke-linecap:butt;stroke-linejoin:miter;stroke-opacity:1" />
|
||||||
|
<path
|
||||||
|
d="m 834.44781,633.57366 c 0,0 0.41723,-15.02903 7.09293,-17.32513 6.67571,-2.29611 19.60989,0.41747 28.37175,3.54851 5.84124,1.25243 -20.44435,6.78395 -23.62574,8.34947 -2.78295,1.36946 -10.37863,5.63589 -11.83894,5.42715 z"
|
||||||
|
id="path4352"
|
||||||
|
style="fill:none;stroke:#000000;stroke-width:1px;stroke-linecap:butt;stroke-linejoin:miter;stroke-opacity:1" />
|
||||||
|
<path
|
||||||
|
d="m 870.44376,616.25968 c 0,0 -15.63645,-12.98872 -30.09279,-2.36158"
|
||||||
|
id="path4354"
|
||||||
|
style="fill:none;stroke:#000000;stroke-width:1px;stroke-linecap:butt;stroke-linejoin:miter;stroke-opacity:1" />
|
||||||
|
<path
|
||||||
|
d="m 870.44376,616.25968 c 0,0 -15.63645,-12.98872 -30.09279,-2.36158"
|
||||||
|
id="path4356"
|
||||||
|
style="fill:none;stroke:#000000;stroke-width:1px;stroke-linecap:butt;stroke-linejoin:miter;stroke-opacity:1" />
|
||||||
|
<path
|
||||||
|
d="m 799.63721,725.7782 c 0,0 1.47513,-12.10312 36.28835,-14.75991"
|
||||||
|
id="path4358"
|
||||||
|
style="fill:none;stroke:#000000;stroke-width:1px;stroke-linecap:butt;stroke-linejoin:miter;stroke-opacity:1" />
|
||||||
|
<path
|
||||||
|
d="m 798.75212,709.6899 c 0,0 7.08066,-1.47599 8.5558,-3.54237 1.47514,-2.06639 27.43753,1.62358 31.86294,1.91878"
|
||||||
|
id="path4360"
|
||||||
|
style="fill:none;stroke:#000000;stroke-width:1px;stroke-linecap:butt;stroke-linejoin:miter;stroke-opacity:1" />
|
||||||
|
<path
|
||||||
|
d="m 798.16207,710.28029 c 0,0 -4.2779,1.476 -1.32762,12.39833"
|
||||||
|
id="path4362"
|
||||||
|
style="fill:none;stroke:#000000;stroke-width:1px;stroke-linecap:butt;stroke-linejoin:miter;stroke-opacity:1" />
|
||||||
|
<path
|
||||||
|
d="m 837.99076,713.08468 c -2.36022,4.13278 -30.02427,21.33765 -33.26958,21.04246 -3.2453,-0.2952 -6.26408,-1.55938 -5.67403,-3.33057"
|
||||||
|
id="path4366"
|
||||||
|
style="fill:none;stroke:#000000;stroke-width:1px;stroke-linecap:butt;stroke-linejoin:miter;stroke-opacity:1" />
|
||||||
|
<path
|
||||||
|
d="m 809.96316,656.99703 c 0,0 15.93148,5.90396 14.16131,15.6455"
|
||||||
|
id="path4374"
|
||||||
|
style="fill:none;stroke:#000000;stroke-width:1px;stroke-linecap:butt;stroke-linejoin:miter;stroke-opacity:1" />
|
||||||
|
<path
|
||||||
|
d="m 804.9477,686.51684 c 0,0 15.63645,-0.29519 17.40661,-5.60876"
|
||||||
|
id="path4376"
|
||||||
|
style="fill:none;stroke:#000000;stroke-width:1px;stroke-linecap:butt;stroke-linejoin:miter;stroke-opacity:1" />
|
||||||
|
<path
|
||||||
|
d="m 829.72999,790.13139 c 0,0 37.46846,-12.98871 40.71377,-18.89268 3.24529,-5.90396 55.46512,-16.53109 66.0861,-47.2317"
|
||||||
|
id="path4378"
|
||||||
|
style="fill:none;stroke:#000000;stroke-width:1px;stroke-linecap:butt;stroke-linejoin:miter;stroke-opacity:1" />
|
||||||
|
<path
|
||||||
|
d="m 955.41161,693.0112 c 0,0 9.7359,6.19916 18.58672,0.8856"
|
||||||
|
id="path4380"
|
||||||
|
style="fill:none;stroke:#000000;stroke-width:1px;stroke-linecap:butt;stroke-linejoin:miter;stroke-opacity:1" />
|
||||||
|
<path
|
||||||
|
d="m 957.77182,696.25838 c 0,0 4.13039,2.95198 7.96574,18.00709"
|
||||||
|
id="path4382"
|
||||||
|
style="fill:none;stroke:#000000;stroke-width:1px;stroke-linecap:butt;stroke-linejoin:miter;stroke-opacity:1" />
|
||||||
|
<path
|
||||||
|
d="m 785.77093,624.82043 c 0,0 5.01546,-41.91814 38.05851,-52.25007 33.04306,-10.33194 51.9248,-2.06639 56.94027,-7.37996 5.01546,-5.31357 -9.14585,8.56075 -1.47514,20.36868 7.67071,11.80792 7.67071,11.80792 7.67071,11.80792 0,0 30.38781,16.5311 32.15797,21.25427 1.77017,4.72317 5.31049,29.51982 8.85082,34.83338 3.54033,5.31357 2.36022,16.5311 11.21104,15.6455 8.85082,-0.88559 5.01546,-16.53109 12.39114,-26.86303 7.37569,-10.33194 14.16131,-18.00709 21.24197,-15.6455 7.08065,2.36158 14.45633,6.19916 16.52152,10.92233"
|
||||||
|
id="path4384"
|
||||||
|
style="fill:none;stroke:#000000;stroke-width:1px;stroke-linecap:butt;stroke-linejoin:miter;stroke-opacity:1" />
|
||||||
|
<path
|
||||||
|
d="m 804.35764,630.42919 c 0,0 -4.13038,12.98873 -16.52152,21.54947"
|
||||||
|
id="path4391"
|
||||||
|
style="fill:none;stroke:#000000;stroke-width:1px;stroke-linecap:butt;stroke-linejoin:miter;stroke-opacity:1" />
|
||||||
|
<path
|
||||||
|
d="m 796.98196,674.11852 c 0,0 7.08065,-7.67515 12.68617,-0.2952 5.60552,7.37996 -17.70163,2.65679 -12.68617,0.2952 z"
|
||||||
|
id="path4397"
|
||||||
|
style="fill:none;stroke:#000000;stroke-width:1px;stroke-linecap:butt;stroke-linejoin:miter;stroke-opacity:1" />
|
||||||
|
<path
|
||||||
|
d="m 833.56534,638.69475 c 0,0 17.70164,4.72317 28.0276,-4.42798"
|
||||||
|
id="path4399"
|
||||||
|
style="fill:none;stroke:#000000;stroke-width:1px;stroke-linecap:butt;stroke-linejoin:miter;stroke-opacity:1" />
|
||||||
|
<path
|
||||||
|
d="m 822.05928,584.96868 c 0,0 -20.35688,13.28392 -25.07732,19.18788"
|
||||||
|
id="path4403"
|
||||||
|
style="fill:none;stroke:#000000;stroke-width:1px;stroke-linecap:butt;stroke-linejoin:miter;stroke-opacity:1" />
|
||||||
|
<path
|
||||||
|
d="m 819.31564,591.16613 c 0,0 -16.22649,9.74153 -18.58671,12.39832"
|
||||||
|
id="path4405"
|
||||||
|
style="fill:none;stroke:#000000;stroke-width:1px;stroke-linecap:butt;stroke-linejoin:miter;stroke-opacity:1" />
|
||||||
|
<path
|
||||||
|
d="m 930.62932,872.4917 c 0.29502,-2.36158 0.29502,-41.03256 -19.4718,-55.20207"
|
||||||
|
id="path4407"
|
||||||
|
style="fill:none;stroke:#000000;stroke-width:1px;stroke-linecap:butt;stroke-linejoin:miter;stroke-opacity:1" />
|
||||||
|
<path
|
||||||
|
d="m 852.44709,789.541 c 0,0 7.67071,21.54947 30.97786,20.07348"
|
||||||
|
id="path4409"
|
||||||
|
style="fill:none;stroke:#000000;stroke-width:1px;stroke-linecap:butt;stroke-linejoin:miter;stroke-opacity:1" />
|
||||||
|
<path
|
||||||
|
d="m 965.44254,652.86426 c 0,0 20.35688,0 10.62098,14.7599"
|
||||||
|
id="path4411"
|
||||||
|
style="fill:none;stroke:#000000;stroke-width:1px;stroke-linecap:butt;stroke-linejoin:miter;stroke-opacity:1" />
|
||||||
|
<path
|
||||||
|
d="m 988.15964,651.09307 c 0,-1.47599 -5.60552,-25.68225 -21.24197,-15.6455"
|
||||||
|
id="path4413"
|
||||||
|
style="fill:none;stroke:#000000;stroke-width:1px;stroke-linecap:butt;stroke-linejoin:miter;stroke-opacity:1" />
|
||||||
|
<path
|
||||||
|
d="m 964.85248,641.05633 c 0,0 2.06519,4.42797 -1.47514,4.72317"
|
||||||
|
id="path4415"
|
||||||
|
style="fill:none;stroke:#000000;stroke-width:1px;stroke-linecap:butt;stroke-linejoin:miter;stroke-opacity:1" />
|
||||||
|
<path
|
||||||
|
d="m 962.49226,654.63545 c 0,0 2.95028,10.33193 11.50607,12.69352"
|
||||||
|
id="path4417"
|
||||||
|
style="fill:none;stroke:#000000;stroke-width:1px;stroke-linecap:butt;stroke-linejoin:miter;stroke-opacity:1" />
|
||||||
|
<path
|
||||||
|
d="m 792.70407,714.26547 0,-11.06993 c 0,0 0.73757,8.56074 0.73757,7.82275 0,-0.738 2.06518,-12.25072 2.06518,-12.25072 0,0 -0.14751,10.77473 -0.14751,10.03673 0,-0.73799 4.2779,-12.39832 4.2779,-12.39832 l -1.18011,10.03674 3.54033,-10.62713 c 0,0 0.59005,9.15114 0.73756,8.56074 0.14752,-0.5904 1.18011,-9.59394 2.0652,-8.56074 0.88507,1.03319 0.44254,6.78955 1.1801,6.34676 0.73757,-0.4428 1.62265,-7.67516 2.06519,-6.49436 0.44255,1.18079 6.63812,7.37995 6.63812,7.37995 l -3.39282,-7.97035 7.22817,7.97035 -1.32762,-5.01837 7.67071,5.16597 0,-4.57557 4.72043,4.28037 0.73757,-3.68998 6.04807,6.49436 1.03259,-5.90396 7.22817,6.64196 -1.18011,-5.60877 5.90054,10.03675"
|
||||||
|
id="path4419"
|
||||||
|
style="fill:none;stroke:#000000;stroke-width:1px;stroke-linecap:butt;stroke-linejoin:miter;stroke-opacity:1" />
|
||||||
|
<path
|
||||||
|
d="m 793.29412,720.90743 -1.18011,-6.34676 1.91768,2.65679 -1.18011,-9.74155"
|
||||||
|
id="path4421"
|
||||||
|
style="fill:none;stroke:#000000;stroke-width:1px;stroke-linecap:butt;stroke-linejoin:miter;stroke-opacity:1" />
|
||||||
|
<path
|
||||||
|
d="m 820.43663,734.92934 c 0,0.5904 0.88508,8.26555 0.59005,7.37996 -0.29502,-0.8856 -2.95027,-7.08476 -2.95027,-6.19916 0,0.88559 0.44254,5.46116 0.44254,5.46116 0,0 -4.27789,-6.78956 -3.98287,-5.75636 0.29503,1.03319 2.95028,8.41314 2.95028,8.41314 0,0 -3.68784,-7.52755 -3.83536,-6.78955 -0.14751,0.73799 1.62265,6.78955 1.62265,6.78955 0,0 -6.93314,-5.90396 -6.04806,-4.72317 0.88509,1.1808 5.75304,6.05157 5.75304,6.05157"
|
||||||
|
id="path4423"
|
||||||
|
style="fill:none;stroke:#000000;stroke-width:1px;stroke-linecap:butt;stroke-linejoin:miter;stroke-opacity:1" />
|
||||||
|
<path
|
||||||
|
d="m 868.96861,761.34958 -5.458,9.88913 c 0,0 1.0326,-9.29874 0.44254,-7.67515 -0.59005,1.62359 -5.458,12.10313 -5.458,12.10313"
|
||||||
|
id="path4425"
|
||||||
|
style="fill:none;stroke:#000000;stroke-width:1px;stroke-linecap:butt;stroke-linejoin:miter;stroke-opacity:1" />
|
||||||
|
<path
|
||||||
|
d="m 854.95482,769.17233 c 0,2.06638 1.0326,9.59394 1.0326,9.59394 l -6.19557,-6.19916 2.80275,7.23235 -11.06352,-6.19916 6.34309,7.23235 -13.27623,-5.75636 6.63812,8.11795 c 0,0 -9.88342,-6.34676 -9.44088,-5.60877 0.44254,0.738 6.19558,8.56075 5.31049,8.11795 -0.88508,-0.44279 -10.32595,-6.64196 -9.7359,-6.05156 0.59005,0.5904 6.04806,9.44635 5.458,9.15115 -0.59005,-0.29521 -11.06352,-8.11796 -10.47346,-7.67516 0.59005,0.4428 4.86795,7.97036 3.83535,7.37995 -1.03259,-0.59039 -6.4906,-6.05156 -6.4906,-6.05156 l 8.26076,6.34677 -6.63811,-8.70835 7.5232,8.11795 -1.91768,-8.41315 4.86795,8.41315 -2.65524,-9.00355 5.31049,8.11796 -3.54033,-9.44635"
|
||||||
|
id="path4427"
|
||||||
|
style="fill:none;stroke:#000000;stroke-width:1px;stroke-linecap:butt;stroke-linejoin:miter;stroke-opacity:1" />
|
||||||
|
<path
|
||||||
|
d="m 836.07308,776.99508 5.16298,7.37996"
|
||||||
|
id="path4429"
|
||||||
|
style="fill:none;stroke:#000000;stroke-width:1px;stroke-linecap:butt;stroke-linejoin:miter;stroke-opacity:1" />
|
||||||
|
<path
|
||||||
|
d="m 838.72832,775.66669 c 0.14751,0.59039 5.75303,8.41314 5.75303,8.41314 l -2.50773,-10.03673 5.01546,7.37995 -1.32762,-7.97035 5.60552,6.49436 -0.88508,-5.75636 5.458,5.31356 2.95027,-1.91879 c 0,0 -2.06518,-5.46116 -1.91767,-4.57557 0.14751,0.8856 3.98287,4.87077 3.98287,4.87077 l 0.29502,-5.31356 3.54033,1.91878 -0.44254,-7.52755 c 0,0 3.39281,1.32839 3.98287,0.4428 0.59006,-0.8856 1.62265,-2.95198 1.62265,-2.95198"
|
||||||
|
id="path4431"
|
||||||
|
style="fill:none;stroke:#000000;stroke-width:1px;stroke-linecap:butt;stroke-linejoin:miter;stroke-opacity:1" />
|
||||||
|
<path
|
||||||
|
d="m 817.63387,777.58547 c 0,0 4.42541,5.46117 4.72044,4.72317 0.29502,-0.73799 1.18011,-5.60876 1.18011,-5.60876 l 3.68784,3.24718 0.73756,-5.46117 2.50774,3.39478 4.57292,-2.36158 c 0,0 2.50773,3.68997 3.2453,3.83757 0.73757,0.1476 5.458,-1.62359 5.458,-1.62359 l 1.18011,3.39478 c 0,0 -5.60551,3.39479 -6.4906,2.80438 -0.88508,-0.59039 -4.13038,-3.68997 -3.83535,-2.50918 0.29503,1.18079 0.29503,3.83758 0.29503,3.83758 0,0 -3.68785,-4.57558 -3.68785,-3.98518 0,0.5904 -0.14751,5.16597 -0.14751,5.16597 0,0 -4.27789,-5.01837 -4.27789,-3.98518 0,1.0332 1.03259,4.42798 1.03259,4.42798 l -3.98287,-3.83758"
|
||||||
|
id="path4433"
|
||||||
|
style="fill:none;stroke:#000000;stroke-width:1px;stroke-linecap:butt;stroke-linejoin:miter;stroke-opacity:1" />
|
||||||
|
<path
|
||||||
|
d="m 793.29412,721.05503 c -0.29503,-0.73799 -1.77016,-11.95552 -1.77016,-11.95552 0,0 2.80276,12.39832 2.80276,11.06993 0,-1.3284 -1.18011,-13.72672 -1.18011,-13.72672 0,0 1.77016,7.97035 1.77016,7.08475 0,-0.88559 -0.29503,-12.98871 -0.29503,-12.98871 l 0.14752,9.59393 c 0,0 1.47513,-12.10312 1.47513,-11.21752 0,0.88559 0,10.18434 0,10.18434 0,0 1.91768,-10.47954 1.91768,-9.74155 0,0.738 1.18011,7.97035 1.18011,7.97035 0,0 1.32762,-11.21753 1.47514,-10.33193 0.14751,0.88559 0.88508,7.37995 0.88508,7.37995"
|
||||||
|
id="path4435"
|
||||||
|
style="fill:none;stroke:#000000;stroke-width:1px;stroke-linecap:butt;stroke-linejoin:miter;stroke-opacity:1" />
|
||||||
|
<path
|
||||||
|
d="m 801.7024,695.81559 1.47514,8.41314 1.62265,-7.23235"
|
||||||
|
id="path4437"
|
||||||
|
style="fill:none;stroke:#000000;stroke-width:1px;stroke-linecap:butt;stroke-linejoin:miter;stroke-opacity:1" />
|
||||||
|
<path
|
||||||
|
d="m 805.09521,704.96673 c 0,0 1.47514,-11.06993 1.47514,-10.47954 0,0.5904 1.77016,9.44634 1.77016,9.44634 l 1.32762,-10.92233 -0.29502,9.00355 1.1801,-5.31357 0.29503,5.60876 0.88509,-3.98517 0.29502,4.42797 2.0652,-8.11795"
|
||||||
|
id="path4439"
|
||||||
|
style="fill:none;stroke:#000000;stroke-width:1px;stroke-linecap:butt;stroke-linejoin:miter;stroke-opacity:1" />
|
||||||
|
<path
|
||||||
|
d="m 814.97863,702.01475 0.29502,-5.75637"
|
||||||
|
id="path4441"
|
||||||
|
style="fill:none;stroke:#000000;stroke-width:1px;stroke-linecap:butt;stroke-linejoin:miter;stroke-opacity:1" />
|
||||||
|
<path
|
||||||
|
d="m 819.55155,702.90034 -1.91768,-7.23235"
|
||||||
|
id="path4443"
|
||||||
|
style="fill:none;stroke:#000000;stroke-width:1px;stroke-linecap:butt;stroke-linejoin:miter;stroke-opacity:1" />
|
||||||
|
<path
|
||||||
|
d="m 822.05928,704.22873 c 0,-0.59039 -1.47513,-6.93715 -1.47513,-6.93715 l 5.458,7.67515 -2.80276,-7.37996 4.42541,5.90397 -1.32763,-6.64196 3.54033,7.23235 1.47514,-5.90396 1.62265,6.93716 0,-5.46117 5.01547,5.31357 -2.36022,-5.01837 4.27789,4.28037 -0.88508,-5.46116 1.18011,6.34676 1.32762,-3.68998 1.62265,5.90396 -0.14751,-4.87077 c 0,0 4.42541,-1.47599 4.13038,-0.59039 -0.29503,0.88559 -3.2453,6.19916 -3.2453,6.19916 l 3.68784,-3.39478 -1.18011,3.83758 c 0,0 4.72044,-1.62359 4.2779,-0.738 -0.44255,0.88559 -0.29503,2.95199 -0.29503,2.95199"
|
||||||
|
id="path4445"
|
||||||
|
style="fill:none;stroke:#000000;stroke-width:1px;stroke-linecap:butt;stroke-linejoin:miter;stroke-opacity:1" />
|
||||||
|
<path
|
||||||
|
d="m 793.88417,720.31704 1.18012,3.24717 -1.62265,-0.29519 1.32762,3.54237 c 0,0 -2.95027,-1.32839 -2.06519,-0.44279 0.88508,0.88559 2.2127,3.39478 2.2127,3.39478"
|
||||||
|
id="path4447"
|
||||||
|
style="fill:none;stroke:#000000;stroke-width:1px;stroke-linecap:butt;stroke-linejoin:miter;stroke-opacity:1" />
|
||||||
|
<path
|
||||||
|
d="m 794.76926,725.3354 -0.44254,-5.60876 -2.0652,1.91879 c 0,0 1.62265,3.24718 1.62265,3.83757 0,0.5904 1.32763,3.54238 1.32763,3.54238 l -2.50773,-4.87077"
|
||||||
|
id="path4449"
|
||||||
|
style="fill:none;stroke:#000000;stroke-width:1px;stroke-linecap:butt;stroke-linejoin:miter;stroke-opacity:1" />
|
||||||
|
<path
|
||||||
|
d="m 810.99576,738.02892 2.2127,6.19916 c 0,0 -1.03259,-8.85594 -0.59005,-7.97035 0.44254,0.8856 2.36022,6.64196 2.36022,5.75637 0,-0.8856 -0.29503,-7.08476 0.14751,-6.34676 0.44254,0.73799 1.77016,7.08475 2.21271,5.90396 0.44253,-1.18079 0,-7.52755 0.44253,-6.19916 0.44255,1.32839 1.62265,5.31357 1.62265,5.31357 l 1.32763,-5.16597"
|
||||||
|
id="path4451"
|
||||||
|
style="fill:none;stroke:#000000;stroke-width:1px;stroke-linecap:butt;stroke-linejoin:miter;stroke-opacity:1" />
|
||||||
|
<path
|
||||||
|
d="m 818.17578,780.10677 3.65078,6.67957 c 0,0 -2.29478,-8.45384 -1.66894,-7.72326 0.62585,0.73058 4.90248,9.39315 5.00678,8.97568 0.10431,-0.41747 -2.08615,-9.81062 -2.08615,-9.81062 0,0 5.84124,9.18441 5.73693,8.66257 -0.10431,-0.52185 -4.58955,-10.2281 -4.48524,-9.81062 0.10431,0.41747 8.03171,8.76694 8.03171,8.76694 l -2.81631,-8.76694 c 0,0 5.63262,9.70625 5.3197,9.18441 -0.31292,-0.52184 -1.87754,-10.33246 -1.87754,-10.33246 0,0 6.46709,9.81062 6.46709,9.39314 0,-0.41747 -1.56462,-10.01936 -1.56462,-10.01936 0,0 7.51017,9.28879 6.88432,8.34947 -0.62585,-0.93932 -1.56462,-9.18441 -1.56462,-9.18441 l 4.90247,7.09705 0.73016,-7.30579"
|
||||||
|
id="path4453"
|
||||||
|
style="fill:none;stroke:#000000;stroke-width:1px;stroke-linecap:butt;stroke-linejoin:miter;stroke-opacity:1" />
|
||||||
|
<path
|
||||||
|
d="m 851.24138,780.83735 -0.52154,-8.03636 4.06801,5.84462 -0.93878,-5.63589 5.63263,4.69658 -0.20861,-7.41015 5.00678,3.65289 0.41722,-6.2621 c 0,0 2.29478,4.69657 3.54647,3.23542 1.2517,-1.46116 2.6077,-5.63589 2.6077,-5.63589"
|
||||||
|
id="path4455"
|
||||||
|
style="fill:none;stroke:#000000;stroke-width:1px;stroke-linecap:butt;stroke-linejoin:miter;stroke-opacity:1" />
|
||||||
|
<path
|
||||||
|
d="m 958.00004,583.86218 c 1.5,2 7.5,14.5 7.5,18"
|
||||||
|
id="path5713"
|
||||||
|
style="fill:none;stroke:#000000;stroke-width:1px;stroke-linecap:butt;stroke-linejoin:miter;stroke-opacity:1" />
|
||||||
|
<path
|
||||||
|
d="m 895.50004,576.36218 c -1,2.5 4,12.5 8,14.5"
|
||||||
|
id="path5715"
|
||||||
|
style="fill:none;stroke:#000000;stroke-width:1px;stroke-linecap:butt;stroke-linejoin:miter;stroke-opacity:1" />
|
||||||
|
<path
|
||||||
|
d="m 911.50004,560.86218 18,-2"
|
||||||
|
id="path5717"
|
||||||
|
style="fill:none;stroke:#000000;stroke-width:1px;stroke-linecap:butt;stroke-linejoin:miter;stroke-opacity:1" />
|
||||||
|
<path
|
||||||
|
d="m 855.95274,560.56942 c 0,0 14.8493,1.06066 16.9706,-0.70711"
|
||||||
|
id="path5719"
|
||||||
|
style="fill:none;stroke:#000000;stroke-width:1px;stroke-linecap:butt;stroke-linejoin:miter;stroke-opacity:1" />
|
||||||
|
</g>
|
||||||
|
</g>
|
||||||
|
</svg>
|
||||||
|
After Width: | Height: | Size: 19 KiB |
BIN
Binary file not shown.
|
After Width: | Height: | Size: 67 KiB |
Binary file not shown.
|
After Width: | Height: | Size: 4.2 KiB |
+25
@@ -0,0 +1,25 @@
|
|||||||
|
---
|
||||||
|
layout: default
|
||||||
|
---
|
||||||
|
|
||||||
|
<div class="home">
|
||||||
|
|
||||||
|
<h1 class="page-heading">…</h1>
|
||||||
|
|
||||||
|
<ul class="post-list">
|
||||||
|
{% for post in site.posts %}
|
||||||
|
<li>
|
||||||
|
<h2>
|
||||||
|
<a class="post-link" href="{{ post.url | prepend: site.baseurl }}">{{ post.title }}</a>
|
||||||
|
<span class="post-meta">{{ post.date | date: "%b %-d, %Y" }}</span>
|
||||||
|
</h2>
|
||||||
|
<article class='post-content'>
|
||||||
|
{{ post.excerpt }}
|
||||||
|
</article>
|
||||||
|
</li>
|
||||||
|
{% endfor %}
|
||||||
|
</ul>
|
||||||
|
|
||||||
|
<p class="rss-subscribe">subscribe <a href="{{ "/feed.xml" | prepend: site.baseurl }}">via RSS</a></p>
|
||||||
|
|
||||||
|
</div>
|
||||||
Reference in New Issue
Block a user