Created
September 13, 2017 06:50
-
-
Save electricg/4a39a852b0d3d32cb24c487784844653 to your computer and use it in GitHub Desktop.
JS Bin // source http://jsbin.com/wuyolo
This file contains bidirectional Unicode text that may be interpreted or compiled differently than what appears below. To review, open the file in an editor that reveals hidden Unicode characters.
Learn more about bidirectional Unicode characters
<!DOCTYPE html> | |
<html> | |
<head> | |
<meta charset="utf-8"> | |
<meta name="viewport" content="width=device-width"> | |
<title>JS Bin</title> | |
<style id="jsbin-css"> | |
body { | |
background: pink; | |
margin: 0; | |
padding: 0; | |
} | |
svg { | |
/* display: block; */ | |
background: #f90; | |
margin: 0; | |
padding: 0; | |
color: green; | |
vertical-align: middle; | |
} | |
.byrdie { | |
height: 24px; | |
width: 155px; | |
} | |
.mydomaine { | |
height: 25px; | |
width: 259px; | |
} | |
.whowhatwear { | |
height: 24px; | |
width: 329px; | |
stroke-width: 0; | |
} | |
.shop { | |
height: 27px; | |
stroke-width: 0; | |
} | |
.shop--border { | |
stroke-width: 1; | |
} | |
.shop-whowhatwear2 { | |
height: 27px; | |
stroke-width: 0; | |
} | |
</style> | |
</head> | |
<body> | |
<svg xmlns="http://www.w3.org/2000/svg" style="display:none;width:0;height:0;visibility:hidden;"> | |
<symbol id="byrdie" viewBox="0 0 155 24"><title>byrdie</title><path fill="currentColor" d="M6.022 18.963h.768c1.78 0 4.792.09 4.792-2.42 0-2.75-2.98-2.48-4.946-2.48h-.614v4.9zm0-9.314h.675c1.598 0 3.257-.273 3.257-2.21 0-2.086-1.874-2.207-3.502-2.207h-.43V9.65zM0 23.5V.697h8.602c4.117 0 6.882 1.572 6.882 5.927 0 2.057-.676 3.72-2.55 4.658v.06c3.318.424 4.73 2.632 4.73 5.807 0 4.777-4.147 6.35-8.386 6.35H0zM25.008.697h7.22l4.332 6.2 4.332-6.2h7.22L39.57 12.552V23.5h-6.02V12.552L25.007.697M65.347 10.92h.584c1.967 0 4.178-.364 4.178-2.844s-2.21-2.843-4.177-2.843h-.583v5.686zm13.24 12.58h-7.496l-5.682-8.77h-.06v8.77h-6.023V.697h9.002c4.577 0 8.05 2.147 8.05 7.016 0 3.145-1.783 5.867-5.07 6.442l7.28 9.345zM96.07 18.48h1.35c3.596 0 6.668-1.936 6.668-6.382 0-4.082-2.734-6.38-6.605-6.38H96.07V18.48zM90.048.697h8.54c6.452 0 11.767 4.99 11.767 11.4 0 6.413-5.346 11.403-11.766 11.403h-8.542V.697zM122.368.697h6.022V23.5h-6.022zM147.56 5.717v3.81h6.79v5.02h-6.79v3.933h7.16v5.02h-13.18V.697h13.18v5.02h-7.16" /></symbol> | |
<symbol id="mydomaine" viewBox="0 0 259 25"><title>mydomaine</title><path fill="currentColor" d="M67.576 19.855c3.775 0 6.85-3.11 6.85-6.925 0-3.816-3.075-6.926-6.85-6.926H63.77v13.85h3.806zm-8.37 4.616V1.39h8.37c6.302 0 11.414 5.168 11.414 11.54 0 6.37-5.112 11.54-11.414 11.54h-8.37zm32.57-11.54c0 3.816 3.076 6.925 6.85 6.925 3.774 0 6.85-3.11 6.85-6.925 0-3.816-3.076-6.926-6.85-6.926-3.774 0-6.85 3.11-6.85 6.926zm6.85 11.54c-6.3 0-11.417-5.17-11.417-11.54 0-6.37 5.115-11.54 11.417-11.54 6.3 0 11.414 5.168 11.414 11.54 0 6.37-5.113 11.54-11.416 11.54h.003zM122.19 1.39h1.154l8.25 9.016 8.22-9.017H141l1.735 23.08h-4.567l-1.005-13.356-5.57 6.093-5.572-6.087-1.03 13.352h-4.566l1.766-23.08V1.39zm47.12 14.62l-3.378-6.278-3.38 6.286h6.76l-.003-.008zm2.497 4.62h-11.75l-2.07 3.84h-5.208L165.932.128l13.18 24.344h-5.206l-2.1-3.846v.005zM189.77 1.39h4.566v23.065h-4.567V1.39zm18.564 0h1.218l14.003 13.48V1.39h4.567v23.08h-1.25l-13.97-13.48v13.48h-4.568V1.39zm33.793 0h16.74v4.614h-12.176v6.926h9.135v4.615h-9.134v2.31h12.178v4.616h-16.74V1.39zM18.646 22.273l-1.31-14.825-6.458 6.776-6.495-6.78-1.188 14.83-1.583-.026 1.32-19 7.898 8.762 7.924-8.814 1.414 19.05-1.522.027zM20.04.986h-1.138l-8.06 8.626L2.88.986H1.74L0 23.69h4.5l1.006-13.175 5.337 5.836 5.385-5.84L17.27 23.69h4.5L20.046.994 20.04.986zM41.79 15.31v7.37h-1.995v-7.37L32 2.5h2.17l6.616 10.838L47.524 2.51H49.7l-7.908 12.813-.004-.014zm4.92-14.25l-5.922 9.545-5.89-9.544-5.647.017 9.047 14.743v8.374h4.98v-8.38L52.383 1.07l-5.678-.015.003.006zm-8.563 12.353l.005.008-.005-.007z" /></symbol> | |
<symbol id="whowhatwear" viewBox="0 0 329 24"><title>whowhatwear</title><path fill="currentColor" d="M33.258.758l-9.13 22.425h-1.844L16.646 11.67l-5.672 11.513H9.128L0 .758h6.444l4.16 10.578L15.707.358h1.845l5.1 10.978L26.814.758h6.444zM58.67 22.782h-5.773v-8.81H44.81v8.81h-5.773V.758h5.773v8.04h8.087V.76h5.773v22.024-.002zM89.015 11.77c0 6.51-5.37 11.413-11.982 11.413-6.612 0-11.913-4.904-11.913-11.413 0-6.474 5.3-11.41 11.913-11.41s11.982 4.936 11.982 11.41zm-17.99 0c0 3.737 2.485 6.14 6.042 6.14 3.422 0 6.04-2.403 6.04-6.14 0-3.67-2.618-6.14-6.04-6.14-3.557 0-6.04 2.47-6.04 6.14h-.002zM135.913.758l-9.127 22.425h-1.847L119.3 11.67l-5.67 11.513h-1.847L102.656.758h6.443l4.16 10.578 5.1-10.978h1.84l5.1 10.978L129.47.758h6.443zm25.41 22.024h-5.77v-8.81h-8.09v8.81h-5.77V.758h5.77v8.04h8.09V.76h5.77v22.024-.002zm19.454-4.138h-6.034l-1.767 4.14h-6.208l9.73-22.427h2.816l9.436 22.426h-6.21l-1.763-4.14zm-3-9.71l-1.948 5.104h3.86l-1.92-5.104h.007zm118.497 9.71h-6.034l-1.767 4.14h-6.208l9.73-22.427h2.816l9.44 22.426h-6.21l-1.76-4.14h-.006zm-3-9.71l-1.948 5.104h3.86l-1.913-5.104zM208.858 5.93h-6.645v16.853h-5.772V5.93h-6.64V.76h19.067v5.17h-.01zM255.69.758l-9.127 22.425h-1.847l-5.638-11.513-5.67 11.513h-1.848L222.432.758h6.444l4.16 10.578L238.14.358h1.844l5.1 10.978L249.248.758h6.443zm21.15 5.172h-9.6v3.037h6.85v4.806h-6.842v3.837h10v5.173h-15.77V.76h15.37v5.17h-.007zm45.595 16.852l-5-6.84h-2.385v6.84h-5.77V.758h8.69c4.866 0 8.557 2.904 8.557 7.575 0 2.77-1.343 4.973-3.49 6.273l5.84 8.176h-6.443zm-7.385-11.846H318c1.61 0 2.65-1.036 2.65-2.603 0-1.534-1.04-2.568-2.65-2.568h-2.955v5.17h.005z" /></symbol> | |
<symbol id="shop" viewBox="0 0 112 27" xmlns="http://www.w3.org/2000/svg"><title>shop</title><g fill="currentColor" stroke="currentColor"><path d="M.613 22.25l.325-.43c.246-.285.497-.393.783-.142.357.32 2.998 2.752 6.603 2.752 3.25 0 5.997-2.18 5.997-4.79 0-3.184-2.606-4.614-6.925-6.078C3.255 12.095.51 10.628.51 6.516.51 3.833 2.65.19 8.217.19c3.534 0 6.138 1.82 6.138 1.82.143.107.394.36.143.753-.108.143-.212.32-.286.464-.216.286-.428.394-.785.18-.108-.072-2.498-1.682-5.246-1.682-4.39 0-6.033 2.717-6.033 4.756 0 3.04 2.322 4.362 5.925 5.543 4.892 1.682 7.998 3.398 7.998 7.545 0 3.575-3.677 6.365-7.78 6.365-4.25 0-7.106-2.502-7.57-2.93-.213-.18-.39-.36-.11-.753M21.492 1.01c0-.25.216-.466.463-.466h.75c.286 0 .465.217.465.466v10.976h16.026V1.01c0-.25.216-.466.462-.466h.75c.282 0 .455.217.455.466v24.1c0 .25-.195.466-.476.466h-.757c-.25 0-.465-.217-.465-.466V13.488H23.14V25.11c0 .25-.18.466-.465.466h-.746c-.25 0-.464-.217-.464-.466V1.01M59.5 24.36c6.245 0 11.314-5.005 11.314-11.266 0-6.256-5.07-11.332-11.315-11.332-6.247 0-11.28 5.076-11.28 11.332 0 6.26 5.04 11.266 11.29 11.266h-.01zm0-24.173c7.172 0 12.884 5.757 12.884 12.91 0 7.186-5.71 12.836-12.885 12.836-7.138 0-12.848-5.65-12.848-12.837 0-7.15 5.71-12.91 12.847-12.91zM86.227 15.026c3.497 0 6.46-2.896 6.46-6.508 0-3.504-2.963-6.292-6.496-6.292h-6.353v12.8h6.39zM78.16 1.008c0-.25.217-.464.463-.464h7.656c4.418 0 8.066 3.612 8.066 8.01 0 4.464-3.648 8.104-8.04 8.104H79.82v8.428c0 .247-.217.462-.572.462h-.644c-.26 0-.476-.217-.476-.466V1.006l.033.002z" /><path d="M109.958.83c.07-.177.25-.286.463-.286h.5c.323 0 .54.217.43.5l-7.888 24.21c-.072.216-.286.324-.465.324h-.54c-.282 0-.498-.182-.39-.503L109.94.83" /></g></symbol> | |
<symbol id="shop-whowhatwear" viewBox="0 0 370 27" xmlns="http://www.w3.org/2000/svg"><title>shop whowhatwear</title><g fill="currentColor"><use xlink:href="#shop" transform="translate(-189, 0)" stroke="currentColor" /><use xlink:href="#whowhatwear" transform="translate(60, 0)" /></g></symbol> | |
</svg> | |
<svg viewBox="0 0 112 27" class="shop" xmlns="http://www.w3.org/2000/svg"> | |
<use xlink:href="#shop" /> | |
</svg> | |
<svg viewBox="0 0 112 27" class="shop shop--border" xmlns="http://www.w3.org/2000/svg"> | |
<use xlink:href="#shop" /> | |
</svg> | |
<svg class="byrdie" xmlns="http://www.w3.org/2000/svg"> | |
<use xlink:href="#byrdie" /> | |
</svg> | |
<svg class="mydomaine" xmlns="http://www.w3.org/2000/svg"> | |
<use xlink:href="#mydomaine" /> | |
</svg> | |
<svg class="whowhatwear" xmlns="http://www.w3.org/2000/svg"> | |
<use xlink:href="#whowhatwear" /> | |
</svg> | |
<svg viewBox="0 0 490 27" class="shop-whowhatwear2" xmlns="http://www.w3.org/2000/svg"> | |
<use xlink:href="#shop-whowhatwear" /> | |
</svg> | |
<script id="jsbin-source-css" type="text/css">body { | |
background: pink; | |
margin: 0; | |
padding: 0; | |
} | |
svg { | |
/* display: block; */ | |
background: #f90; | |
margin: 0; | |
padding: 0; | |
color: green; | |
vertical-align: middle; | |
} | |
.byrdie { | |
height: 24px; | |
width: 155px; | |
} | |
.mydomaine { | |
height: 25px; | |
width: 259px; | |
} | |
.whowhatwear { | |
height: 24px; | |
width: 329px; | |
stroke-width: 0; | |
} | |
.shop { | |
height: 27px; | |
stroke-width: 0; | |
} | |
.shop--border { | |
stroke-width: 1; | |
} | |
.shop-whowhatwear2 { | |
height: 27px; | |
stroke-width: 0; | |
}</script> | |
</body> | |
</html> |
This file contains bidirectional Unicode text that may be interpreted or compiled differently than what appears below. To review, open the file in an editor that reveals hidden Unicode characters.
Learn more about bidirectional Unicode characters
body { | |
background: pink; | |
margin: 0; | |
padding: 0; | |
} | |
svg { | |
/* display: block; */ | |
background: #f90; | |
margin: 0; | |
padding: 0; | |
color: green; | |
vertical-align: middle; | |
} | |
.byrdie { | |
height: 24px; | |
width: 155px; | |
} | |
.mydomaine { | |
height: 25px; | |
width: 259px; | |
} | |
.whowhatwear { | |
height: 24px; | |
width: 329px; | |
stroke-width: 0; | |
} | |
.shop { | |
height: 27px; | |
stroke-width: 0; | |
} | |
.shop--border { | |
stroke-width: 1; | |
} | |
.shop-whowhatwear2 { | |
height: 27px; | |
stroke-width: 0; | |
} |
Sign up for free
to join this conversation on GitHub.
Already have an account?
Sign in to comment