Add svg for terminal circles

The HTML bullet is a different size in different browsers :(
This commit is contained in:
Seth Vargo
2017-07-21 16:40:26 -04:00
parent b96efb875f
commit 0a7a2271e9
3 changed files with 15 additions and 18 deletions

View File

@@ -0,0 +1,3 @@
<svg xmlns="http://www.w3.org/2000/svg" viewBox="0 0 50 50">
<circle fill="#FFFFFF" cx="25" cy="25" r="25"/>
</svg>

After

Width:  |  Height:  |  Size: 118 B

View File

@@ -261,15 +261,9 @@
}
span.circle {
&:before {
content: '\25CF';
color: $white;
font-family: $font-family-monospace;
font-size: 30px;
line-height: 1;
margin: 0 0 0 -4px;
padding: 0;
height: 100%;
svg {
height: 12px;
width: 12px;
}
}
}

View File

@@ -267,9 +267,9 @@ description: |-
<div class="row">
<div class="col-sm-12">
<div class="terminal">
<span class="circle"></span>
<span class="circle"></span>
<span class="circle"></span>
<span class="circle"><%= inline_svg "terminal-circle.svg" %></span>
<span class="circle"><%= inline_svg "terminal-circle.svg" %></span>
<span class="circle"><%= inline_svg "terminal-circle.svg" %></span>
<div class="terminal-content">
<span>
<span class="text-green">admin@hashicorp.com:</span>
@@ -318,9 +318,9 @@ description: |-
<div class="row">
<div class="col-sm-12">
<div class="terminal">
<span class="circle"></span>
<span class="circle"></span>
<span class="circle"></span>
<span class="circle"><%= inline_svg "terminal-circle.svg" %></span>
<span class="circle"><%= inline_svg "terminal-circle.svg" %></span>
<span class="circle"><%= inline_svg "terminal-circle.svg" %></span>
<div class="terminal-content">
<span>
<span class="text-green">admin@hashicorp.com:</span>
@@ -366,9 +366,9 @@ description: |-
<div class="row">
<div class="col-sm-12">
<div class="terminal">
<span class="circle"></span>
<span class="circle"></span>
<span class="circle"></span>
<span class="circle"><%= inline_svg "terminal-circle.svg" %></span>
<span class="circle"><%= inline_svg "terminal-circle.svg" %></span>
<span class="circle"><%= inline_svg "terminal-circle.svg" %></span>
<div class="terminal-content">
<span>
<span class="text-green">admin@hashicorp.com:</span>