Added syntax highlighting to protokollsyntax examples

protokollsystem/proto3#172

static/css/pygments-manni.css

+.highlight .hll { background-color: #ffffcc }
+.highlight  { background: #f0f3f3; }
+.highlight .c { color: #0099FF; font-style: italic } /* Comment */
+.highlight .err { color: #AA0000; background-color: #FFAAAA } /* Error */
+.highlight .k { color: #006699; font-weight: bold } /* Keyword */
+.highlight .o { color: #555555 } /* Operator */
+.highlight .ch { color: #0099FF; font-style: italic } /* Comment.Hashbang */
+.highlight .cm { color: #0099FF; font-style: italic } /* Comment.Multiline */
+.highlight .cp { color: #009999 } /* Comment.Preproc */
+.highlight .cpf { color: #0099FF; font-style: italic } /* Comment.PreprocFile */
+.highlight .c1 { color: #0099FF; font-style: italic } /* Comment.Single */
+.highlight .cs { color: #0099FF; font-weight: bold; font-style: italic } /* Comment.Special */
+.highlight .gd { background-color: #FFCCCC; border: 1px solid #CC0000 } /* Generic.Deleted */
+.highlight .ge { font-style: italic } /* Generic.Emph */
+.highlight .gr { color: #FF0000 } /* Generic.Error */
+.highlight .gh { color: #003300; font-weight: bold } /* Generic.Heading */
+.highlight .gi { background-color: #CCFFCC; border: 1px solid #00CC00 } /* Generic.Inserted */
+.highlight .go { color: #AAAAAA } /* Generic.Output */
+.highlight .gp { color: #000099; font-weight: bold } /* Generic.Prompt */
+.highlight .gs { font-weight: bold } /* Generic.Strong */
+.highlight .gu { color: #003300; font-weight: bold } /* Generic.Subheading */
+.highlight .gt { color: #99CC66 } /* Generic.Traceback */
+.highlight .kc { color: #006699; font-weight: bold } /* Keyword.Constant */
+.highlight .kd { color: #006699; font-weight: bold } /* Keyword.Declaration */
+.highlight .kn { color: #006699; font-weight: bold } /* Keyword.Namespace */
+.highlight .kp { color: #006699 } /* Keyword.Pseudo */
+.highlight .kr { color: #006699; font-weight: bold } /* Keyword.Reserved */
+.highlight .kt { color: #007788; font-weight: bold } /* Keyword.Type */
+.highlight .m { color: #FF6600 } /* Literal.Number */
+.highlight .s { color: #CC3300 } /* Literal.String */
+.highlight .na { color: #330099 } /* Name.Attribute */
+.highlight .nb { color: #336666 } /* Name.Builtin */
+.highlight .nc { color: #00AA88; font-weight: bold } /* Name.Class */
+.highlight .no { color: #336600 } /* Name.Constant */
+.highlight .nd { color: #9999FF } /* Name.Decorator */
+.highlight .ni { color: #999999; font-weight: bold } /* Name.Entity */
+.highlight .ne { color: #CC0000; font-weight: bold } /* Name.Exception */
+.highlight .nf { color: #CC00FF } /* Name.Function */
+.highlight .nl { color: #9999FF } /* Name.Label */
+.highlight .nn { color: #00CCFF; font-weight: bold } /* Name.Namespace */
+.highlight .nt { color: #330099; font-weight: bold } /* Name.Tag */
+.highlight .nv { color: #003333 } /* Name.Variable */
+.highlight .ow { color: #000000; font-weight: bold } /* Operator.Word */
+.highlight .w { color: #bbbbbb } /* Text.Whitespace */
+.highlight .mb { color: #FF6600 } /* Literal.Number.Bin */
+.highlight .mf { color: #FF6600 } /* Literal.Number.Float */
+.highlight .mh { color: #FF6600 } /* Literal.Number.Hex */
+.highlight .mi { color: #FF6600 } /* Literal.Number.Integer */
+.highlight .mo { color: #FF6600 } /* Literal.Number.Oct */
+.highlight .sa { color: #CC3300 } /* Literal.String.Affix */
+.highlight .sb { color: #CC3300 } /* Literal.String.Backtick */
+.highlight .sc { color: #CC3300 } /* Literal.String.Char */
+.highlight .dl { color: #CC3300 } /* Literal.String.Delimiter */
+.highlight .sd { color: #CC3300; font-style: italic } /* Literal.String.Doc */
+.highlight .s2 { color: #CC3300 } /* Literal.String.Double */
+.highlight .se { color: #CC3300; font-weight: bold } /* Literal.String.Escape */
+.highlight .sh { color: #CC3300 } /* Literal.String.Heredoc */
+.highlight .si { color: #AA0000 } /* Literal.String.Interpol */
+.highlight .sx { color: #CC3300 } /* Literal.String.Other */
+.highlight .sr { color: #33AAAA } /* Literal.String.Regex */
+.highlight .s1 { color: #CC3300 } /* Literal.String.Single */
+.highlight .ss { color: #FFCC33 } /* Literal.String.Symbol */
+.highlight .bp { color: #336666 } /* Name.Builtin.Pseudo */
+.highlight .fm { color: #CC00FF } /* Name.Function.Magic */
+.highlight .vc { color: #003333 } /* Name.Variable.Class */
+.highlight .vg { color: #003333 } /* Name.Variable.Global */
+.highlight .vi { color: #003333 } /* Name.Variable.Instance */
+.highlight .vm { color: #003333 } /* Name.Variable.Magic */
+.highlight .il { color: #FF6600 } /* Literal.Number.Integer.Long */

templates/documentation-base.html

 {% extends "layout.html" %}
-{% from "macros.html" import render_table %}
+{% block additional_js %}
+<link rel="stylesheet" href="{{url_for('static', filename='css/pygments-manni.css')}}" />
+{% endblock %}
 {% set navigation_bar = [
     ('sessionmanagement_documentation', '/documentation/sessionmanagement', 'Sitzungsverwaltung', [
         ('plan_sessionmanagement_documentation', '/documentation/sessionmanagement/plan', 'Planung'),

templates/documentation-sessionmanagement-write.html

@@ -67,17 +67,15 @@
         <div class="panel-heading">
             <h5 class="panel-title"><a data-toggle="collapse" href="#example_example_protocoll">Beispiel - Ausschnitt eines Protokolls</a></h5>
         </div>
-        <div id="example_example_protocoll" class="panel-body panel-collapse collapse">
-			<p>
-				<code>#Datum;14.03.2018</code><br/>
-				<code>#Beginn;17:00</code><br/>
-				<code>#Ende;</code>
-			</p>
-			<p>...</p>
-			<p><code>[todo;Diese Aufage ist noch offen;5;erledigt]</code></p>
-			<p>...</p>
-			<p><code>[beschluss;Die Sitzung genehmigt das Protokoll einstimmig]</code></p>
-		</div>
+        <figure id="example_example_protocoll" class="panel-body panel-collapse collapse">
+			<pre class="highlight"><code><span class="nc">#Datum</span>;<span class="mi">14.03.2018</span>
+<span class="nc">#Beginn</span>;<span class="mi">17:00</span>
+<span class="nc">#Ende</span>;<span class="mi"></span>
+<span class="cl">...</span>
+<span class="nt">[todo</span>;<span class="s1">Diese Aufage ist noch offen</span>;<span class="kr">id</span> <span class="mi">5</span>;<span class="kt">erledigt</span><span class="nt">]</span>
+<span class="cl">...</span>
+<span class="nt">[beschluss</span>;<span class="s1">Die Sitzung genehmigt das Protokoll einstimmig</span><span class="nt">]</span></code></pre>
+		</figure>
 	</div>
 	
 	<h4 id="session_end">Nach der Sitzung</h4>

templates/documentation-syntax-internal.html

@@ -18,16 +18,16 @@
         <div class="panel-heading">
             <h5 class="panel-title"><a data-toggle="collapse" href="#example_internal">Beispiel - Interner Bereich</a></h5>
         </div>
-		<figure id="example_internal" class="panel-body panel-collapse collapse highlight">
-			<pre><code>{TOP Tagesordnungspunkt
-	Dieser Punkt ist öffentlich.
-	{{config.PRIVATE_KEYWORDS[0]}}: {
-		Dieser Punkt ist intern.
-		Dieser auch, wir diskutieren Kritik an einem namentlich genannten Professor und seiner Vorlesung.
-		Hier entwickeln wir eine Strategie.
+		<figure id="example_internal" class="panel-body panel-collapse collapse">
+			<pre class="highlight"><code>{<span class="kr">TOP</span> <span class="sx">Tagesordnungspunkt</span>
+	<span class="nv">Dieser Punkt ist öffentlich.</span>
+	<span class="kr">{{config.PRIVATE_KEYWORDS[0]}}</span><span class="o">:</span> {
+		<span class="nv">Dieser Punkt ist intern.</span>
+		<span class="nv">Dieser auch, wir diskutieren Kritik an einem namentlich genannten Professor und seiner Vorlesung.</span>
+		<span class="nv">Hier entwickeln wir eine Strategie.</span>
 	}
-	Dieser ist wieder öffentlich.
-	Es wurde die Krtik an einer Vorlesung kritsiert.
+	<span class="nv">Dieser ist wieder öffentlich.</span>
+	<span class="nv">Es wurde die Krtik an einer Vorlesung kritsiert.</span>
 }</code></pre>
 		</figure>
 	</div>