Skip to content

Instantly share code, notes, and snippets.

@michaelcarwile
Last active May 9, 2021 15:02
Show Gist options
  • Save michaelcarwile/9546f1a228c7215f28ccc378aa9ced82 to your computer and use it in GitHub Desktop.
Save michaelcarwile/9546f1a228c7215f28ccc378aa9ced82 to your computer and use it in GitHub Desktop.
Bootstrap navbar-brand with inline .svg
<a class="navbar-brand">
<svg
class="svg-brand"
viewBox="0 0 450 100"
preserveAspectRatio="xMidYMin"
version="1.1"
xmlns="http://www.w3.org/2000/svg"
xmlns:xlink="http://www.w3.org/1999/xlink">
<defs></defs>
<g class="brand" stroke="none" stroke-width="1" fill="none" fill-rule="evenodd">
<g class="brand-paths" fill="#000000">
<path d="...">
...
</path>
...
</g>
</g>
</svg>
</a>
.navbar-brand {
min-width: 150px; // makes pseudo-responsive, adjust as desired
padding: 10px;
padding-left: 15px;
position: relative;
.brand-paths {
fill: $white;
}
}
Sign up for free to join this conversation on GitHub. Already have an account? Sign in to comment