mermaid
Version:
Markdownish syntax for generating flowcharts, sequence diagrams and gantt charts.
117 lines (105 loc) • 6.5 kB
HTML
<html>
<head>
<title>gant.css</title>
<meta http-equiv="content-type" content="text/html; charset=UTF-8">
<link rel="stylesheet" media="all" href="../../../doc-style.css" />
<script src="../../../doc-filelist.js"></script>
<script>
var relativeDir = "../../../", thisFile = "Users/knut/Documents/source/mermaid/src/diagrams/gantt/gant.css", defaultSidebar = true;
</script>
<script src="../../../doc-script.js"></script>
<script src="../../../mermaid.js"></script>
<link rel="stylesheet" href="../../../mermaid.css" />
</head>
<body>
<div id="sidebar_wrapper">
<div id="sidebar_switch">
<span class="tree">Files</span>
<span class="headings">Headings</span>
</div>
<div id="tree"></div>
<div id="headings">
<div class="heading h1">
<a href="#gant.css">gant.css</a>
</div>
</div>
</div>
<div id="sidebar-toggle"></div>
<div id="container"><div class="background highlight"></div>
<table cellpadding="0" cellspacing="0">
<tbody>
<tr>
<td class="docs">
<div class="pilwrap" id="gant.css">
<h1>
<a href="#gant.css" name="gant.css" class="pilcrow">¶</a>gant.css
</h1>
</div>
</td>
<td class="code highlight"></td>
</tr>
<tr>
<td class="docs">
<div class="pilwrap">
<a class="pilcrow" href="#section-1" id="section-1">¶</a>
</div>
</td>
<td class="code highlight"><div class="highlight"><pre><span class="o">*</span> <span class="p">{</span>
<span class="k">margin</span><span class="o">:</span> <span class="m">0</span><span class="p">;</span>
<span class="k">padding</span><span class="o">:</span> <span class="m">0</span><span class="p">;</span>
<span class="p">}</span>
<span class="nt">body</span> <span class="p">{</span>
<span class="k">background</span><span class="o">:</span> <span class="m">#fff</span><span class="p">;</span>
<span class="k">font-family</span><span class="o">:</span> <span class="s1">'Open-Sans'</span><span class="o">,</span><span class="k">sans-serif</span><span class="p">;</span>
<span class="p">}</span>
<span class="nf">#container</span><span class="p">{</span>
<span class="k">margin</span><span class="o">:</span> <span class="m">0</span> <span class="k">auto</span><span class="p">;</span>
<span class="k">position</span><span class="o">:</span> <span class="k">relative</span><span class="p">;</span>
<span class="k">width</span><span class="o">:</span><span class="m">800px</span><span class="p">;</span>
<span class="k">overflow</span><span class="o">:</span> <span class="k">visible</span><span class="p">;</span>
<span class="p">}</span>
<span class="nc">.svg</span> <span class="p">{</span>
<span class="k">width</span><span class="o">:</span><span class="m">800px</span><span class="p">;</span>
<span class="k">height</span><span class="o">:</span><span class="m">400px</span><span class="p">;</span>
<span class="k">overflow</span><span class="o">:</span> <span class="k">visible</span><span class="p">;</span>
<span class="k">position</span><span class="o">:</span><span class="k">absolute</span><span class="p">;</span>
<span class="p">}</span>
<span class="nc">.grid</span> <span class="nc">.tick</span> <span class="p">{</span>
<span class="n">stroke</span><span class="o">:</span> <span class="nb">lightgrey</span><span class="p">;</span>
<span class="k">opacity</span><span class="o">:</span> <span class="m">0</span><span class="o">.</span><span class="m">3</span><span class="p">;</span>
<span class="n">shape</span><span class="o">-</span><span class="n">rendering</span><span class="o">:</span> <span class="n">crispEdges</span><span class="p">;</span>
<span class="p">}</span>
<span class="nc">.grid</span> <span class="nt">path</span> <span class="p">{</span>
<span class="n">stroke</span><span class="o">-</span><span class="k">width</span><span class="o">:</span> <span class="m">0</span><span class="p">;</span>
<span class="p">}</span>
<span class="nf">#tag</span> <span class="p">{</span>
<span class="k">color</span><span class="o">:</span> <span class="nb">white</span><span class="p">;</span>
<span class="k">background</span><span class="o">:</span> <span class="m">#FA283D</span><span class="p">;</span>
<span class="k">width</span><span class="o">:</span> <span class="m">150px</span><span class="p">;</span>
<span class="k">position</span><span class="o">:</span> <span class="k">absolute</span><span class="p">;</span>
<span class="k">display</span><span class="o">:</span> <span class="k">none</span><span class="p">;</span>
<span class="k">padding</span><span class="o">:</span><span class="m">3px</span> <span class="m">6px</span><span class="p">;</span>
<span class="k">margin-left</span><span class="o">:</span> <span class="m">-80px</span><span class="p">;</span>
<span class="k">font-size</span><span class="o">:</span> <span class="m">11px</span><span class="p">;</span>
<span class="p">}</span>
<span class="nf">#tag</span><span class="nd">:before</span> <span class="p">{</span>
<span class="k">border</span><span class="o">:</span> <span class="k">solid</span> <span class="k">transparent</span><span class="p">;</span>
<span class="k">content</span><span class="o">:</span> <span class="s1">' '</span><span class="p">;</span>
<span class="k">height</span><span class="o">:</span> <span class="m">0</span><span class="p">;</span>
<span class="k">left</span><span class="o">:</span> <span class="m">50</span><span class="o">%</span><span class="p">;</span>
<span class="k">margin-left</span><span class="o">:</span> <span class="m">-5px</span><span class="p">;</span>
<span class="k">position</span><span class="o">:</span> <span class="k">absolute</span><span class="p">;</span>
<span class="k">width</span><span class="o">:</span> <span class="m">0</span><span class="p">;</span>
<span class="k">border-width</span><span class="o">:</span> <span class="m">10px</span><span class="p">;</span>
<span class="k">border-bottom-color</span><span class="o">:</span> <span class="m">#FA283D</span><span class="p">;</span>
<span class="k">top</span><span class="o">:</span> <span class="m">-20px</span><span class="p">;</span>
<span class="p">}</span>
</pre></div>
</td>
</tr>
</tbody>
</table>
</div>
</body>
</html>