Skip to content

Instantly share code, notes, and snippets.

@qrobin
Created July 3, 2015 20:15
Show Gist options
  • Star 0 You must be signed in to star a gist
  • Fork 0 You must be signed in to fork a gist
  • Save qrobin/f509f7dacac64138c9e3 to your computer and use it in GitHub Desktop.
Save qrobin/f509f7dacac64138c9e3 to your computer and use it in GitHub Desktop.
BNYErr
<?xml version="1.0" encoding="utf-8"?>
<!-- Generator: Adobe Illustrator 16.0.0, SVG Export Plug-In . SVG Version: 6.00 Build 0) -->
<!DOCTYPE svg PUBLIC "-//W3C//DTD SVG 1.1//EN" "http://www.w3.org/Graphics/SVG/1.1/DTD/svg11.dtd">
<svg class="logo-cont" version="1.1" id="Layer_1" xmlns="http://www.w3.org/2000/svg" xmlns:xlink="http://www.w3.org/1999/xlink" x="0px" y="0px"
width="960px" height="560px" viewBox="0 0 960 560" enable-background="new 0 0 960 560" xml:space="preserve">
<g>
<g>
<g>
<rect x="114.229" y="232.386" fill="none" stroke="#000000" stroke-width="0.4" stroke-miterlimit="10" width="89.984" height="89.953"/>
</g>
</g>
<g>
<g>
<rect x="24.245" y="322.339" fill="none" stroke="#000000" stroke-width="0.4" stroke-miterlimit="10" width="89.984" height="89.953"/>
</g>
</g>
<g>
<g>
<rect x="204.214" y="322.339" fill="none" stroke="#000000" stroke-width="0.4" stroke-miterlimit="10" width="89.984" height="89.953"/>
</g>
</g>
<g>
<g>
<rect x="204.214" y="142.433" fill="none" stroke="#000000" stroke-width="0.4" width="89.984" height="89.953"/>
</g>
</g>
<g>
<g>
<rect class="logic-4" x="24.245" y="142.433" fill="none" stroke="#000000" stroke-width="0.4" stroke-miterlimit="10" width="89.984" height="89.953"/>
</g>
</g>
<g>
<g>
<path class="logic-1" fill="none" stroke="#000000" stroke-width="0.4" stroke-miterlimit="10" d="M379.329,223.812
c4.564-8.43,9.894-15.381,16.773-22.581c6.999-7.344,12.986-12.685,21.175-17.672c9.15-5.589,18.232-8.574,24.703-9.818
c6.068-1.178,12.785-2.396,19.996-2.382c9.188,0.026,15.739,1.375,18.574,2.134c8.492,2.251,14.681,3.495,24.139,9.163
c8.293,4.987,12.257,10.8,19.479,14.648c1.105,0.589,2.117,1.27,4.8,1.414c2.306,0.131,3.306-0.184,3.952-0.432
c1.482-0.589,3.082-1.558,5.211-3.927c1.823-2.029,2.471-4.346,2.87-5.982c0.247-0.969,0.588-2.5,0.588-3.835
c0-3.024-0.259-4.385-0.882-5.642c-1.035-2.146-4.364-5.485-6.105-6.964c-3.129-2.657-9.634-7.671-13.079-9.818
c-4.023-2.5-12.306-7.029-16.609-8.836c-4.235-1.767-12.846-4.935-17.28-5.891c-6.423-1.375-11.938-3.024-26.032-3.024
c-13.738,0-22.737,1.637-30.065,3.77c-8.046,2.33-25.467,10.472-33.137,15.97c-7.093,5.105-20.326,17.358-25.974,24.439
c-4.529,5.681-12.822,17.881-15.951,24.623c-3.705,7.958-9.764,24.714-11.469,33.458c-1.447,7.422-2.94,22.62-2.729,30.199
c0.294,9.869,1.988,29.715,4.494,39.179c1.847,6.99,7.116,20.447,10.516,26.678c3.658,6.729,11.893,19.648,16.751,25.369
c4.658,5.459,14.751,15.616,20.374,19.792c4.987,3.705,21.174,12.593,21.174,12.593s16.315,6.703,21.973,7.946
c5.705,1.243,17.363,1.95,23.162,1.964c5.917,0,17.786-0.76,23.608-1.964c5.211-1.087,15.362-4.687,20.279-6.872
c5.506-2.461,16.093-8.481,21.174-11.859c4.022-2.685,11.74-9.189,14.116-13.666c0.423-0.864,0.788-1.584,0.951-2.593
c0.2-1.178-0.034-2.5-0.376-3.967c-0.316-1.335-1.212-3.586-3.094-6.151c-1.435-2.12-3.939-4.216-5.411-4.83
c-1.271-0.628-2.563-1.034-3.976-1.034c-1.012,0-3.035,0.537-3.978,0.98c-3.141,1.532-8.34,6.77-11.314,8.666
c-4.458,2.867-13.704,8.194-18.563,10.066c-8.164,3.155-16.526,6.218-32.606,6.218c-9.316,0-16.045-1.125-21.244-2.447
c-5.729-1.452-16.88-5.891-22.139-8.836c-6.316-3.548-17.703-13.183-22.855-18.574c-5.635-5.892-14.903-19.938-18.598-27.489
c-2.999-6.113-6.47-19.662-7.951-26.43c-1.2-5.537-2.341-16.953-2.424-22.66c-0.07-5.511,1.412-16.468,2.506-21.848
C371.001,244.285,375.26,231.352,379.329,223.812z"/>
</g>
</g>
<g>
<g>
<path class="logic-2" sketch:type="MSLayerGroup" fill="none" stroke="#000000" stroke-width="0.4" stroke-miterlimit="10" id="path-11" d="M804.129,144.587
c-9.41-2.454-12.021,4.664-12.682,6.382c-0.662,1.718-48.523,194.473-48.523,194.473L695.357,155.06c0,0-2.428-10.8-12.205-10.8
s-11.579,9.817-11.579,9.817l-48.339,191.608l-48.01-193.49c0,0-1.563-10.623-14.336-7.445
c-12.498,3.109-9.409,14.891-9.409,14.891s58.116,236.237,60.064,241.597c0.479,1.473,3.455,9.407,12.277,9.407
c8.821,0,11.027-7.384,11.469-8.345c1.985-4.521,48.156-193.266,48.156-193.266l48.008,193.593c0,0,1.471,8.018,11.616,8.018
c10.145,0,11.175-8.345,11.175-8.345s60.286-243.315,60.58-244.951C815.12,155.714,815.782,147.409,804.129,144.587z"/>
</g>
</g>
<g>
<g>
<path class="logic-3" fill="none" stroke="#000000" stroke-width="0.4" stroke-miterlimit="10" d="M924.915,275.39
c-11.652-15.639-27.537-23.869-38.12-26.275c-6.837-1.554-10.435-0.855-14.924-2.045c-7.714-2.043-10.809-3.354-17.719-10.391
c-5.107-5.2-10.586-13.581-10.586-28.471c0-14.891,7.008-26.071,14.507-32.289c6.801-5.639,10.198-6.618,20.095-6.928
c27.89-0.873,30.698,19.823,34.506,23.672c3.725,3.764,7.641,3.21,10.146,2.455c2.986-0.902,8.032-6.1,9.115-9.328
c0.804-2.391,0.218-8.001-1.028-10.145c-8.225-14.144-22.351-34.334-52.103-34.334c-11.851,0.225-28.917,4.718-40.681,17.971
c-15.659,17.428-19.408,35.737-19.408,49.58c0,20.944,7.046,33.131,17.351,46.471c7.205,9.326,18.307,17.181,35.289,18.98
c9.853,1.044,18.535,3.838,25.218,8.753c12.579,9.258,18.556,23.362,19.482,29.291c4.628,29.619-3.356,58.115-36.393,66.842
c-33.036,8.726-49.381-24.543-52.836-27.952c-2.648-2.613-9.85-3.367-15.216,0.724c-6.396,5.072-4.867,13.295-3.997,15.365
c9.68,23.045,38.892,39.68,62.563,39.68c24.115,0,35.094-8.671,48.376-20.616c12.646-11.372,23.044-33.543,23.044-59.889
C941.6,300.167,934.167,287.807,924.915,275.39z"/>
</g>
</g>
</svg>
var path = document.querySelector('.logic-1');
var length = path.getTotalLength();
// Clear any previous transition
path.style.transition = path.style.WebkitTransition =
'none';
// Set up the starting positions
path.style.strokeDasharray = length + ' ' + length;
path.style.strokeDashoffset = length;
// Trigger a layout so styles are calculated & the browser
// picks up the starting position before animating
path.getBoundingClientRect();
// Define our transition
path.style.transition = path.style.WebkitTransition =
'stroke-dashoffset 4s ease-in-out';
// Go!
path.style.strokeDashoffset = '0';
var path = document.querySelector('.logic-2');
var length = path.getTotalLength();
// Clear any previous transition
path.style.transition = path.style.WebkitTransition =
'none';
// Set up the starting positions
path.style.strokeDasharray = length + ' ' + length;
path.style.strokeDashoffset = length;
// Trigger a layout so styles are calculated & the browser
// picks up the starting position before animating
path.getBoundingClientRect();
// Define our transition
path.style.transition = path.style.WebkitTransition =
'stroke-dashoffset 4s ease-in-out';
// Go!
path.style.strokeDashoffset = '0';
var path = document.querySelector('.logic-3');
var length = path.getTotalLength();
// Clear any previous transition
path.style.transition = path.style.WebkitTransition =
'none';
// Set up the starting positions
path.style.strokeDasharray = length + ' ' + length;
path.style.strokeDashoffset = length;
// Trigger a layout so styles are calculated & the browser
// picks up the starting position before animating
path.getBoundingClientRect();
// Define our transition
path.style.transition = path.style.WebkitTransition =
'stroke-dashoffset 4s ease-in-out';
// Go!
path.style.strokeDashoffset = '0';
var path = document.querySelector('.logic-4');
var length = path.getTotalLength();
// Clear any previous transition
path.style.transition = path.style.WebkitTransition =
'none';
// Set up the starting positions
path.style.strokeDasharray = length + ' ' + length;
path.style.strokeDashoffset = length;
// Trigger a layout so styles are calculated & the browser
// picks up the starting position before animating
path.getBoundingClientRect();
// Define our transition
path.style.transition = path.style.WebkitTransition =
'stroke-dashoffset 4s ease-in-out';
// Go!
path.style.strokeDashoffset = '0';
<script src="//cdnjs.cloudflare.com/ajax/libs/snap.svg/0.3.0/snap.svg-min.js"></script>
Sign up for free to join this conversation on GitHub. Already have an account? Sign in to comment