Deployed f0743ff to 5.4 with MkDocs 1.1.2 and mike 1.0.0
[GitHub/WoltLab/woltlab.github.io.git] / 5.4 / migration / wcf21 / templates / index.html
index bc2d0b19363691e1ee9cd81c4c8b0fcffcf23bd1..10a4dffd18ebb3b5c036acb25a19567e1ff5b758 100644 (file)
 <h2 id="sidebars">Sidebars<a class="headerlink" href="#sidebars" title="Permanent link">#</a></h2>
 <p>Sidebars are now dynamically populated by the box system, this requires a small change to unify the markup. Additionally the usage of <code>&lt;fieldset&gt;</code> has been deprecated due to browser inconsistencies and bugs and should be replaced with <code>section.box</code>.</p>
 <p>Previous markup used in WoltLab Community Framework 2.1 and earlier:</p>
-<div class="highlight"><pre><span></span><code><span class="p">&lt;</span><span class="nt">fieldset</span><span class="p">&gt;</span>
+<table class="highlighttable"><tr><td class="linenos"><div class="linenodiv"><pre><span></span><span class="normal">1</span>
+<span class="normal">2</span>
+<span class="normal">3</span>
+<span class="normal">4</span>
+<span class="normal">5</span>
+<span class="normal">6</span>
+<span class="normal">7</span></pre></div></td><td class="code"><div class="highlight"><pre><span></span><code><span class="p">&lt;</span><span class="nt">fieldset</span><span class="p">&gt;</span>
     <span class="p">&lt;</span><span class="nt">legend</span><span class="p">&gt;</span><span class="c">&lt;!-- Title --&gt;</span><span class="p">&lt;/</span><span class="nt">legend</span><span class="p">&gt;</span>
 
     <span class="p">&lt;</span><span class="nt">div</span><span class="p">&gt;</span>
     <span class="p">&lt;/</span><span class="nt">div</span><span class="p">&gt;</span>
 <span class="p">&lt;/</span><span class="nt">fieldset</span><span class="p">&gt;</span>
 </code></pre></div>
+</td></tr></table>
 <p>The new markup since WoltLab Suite 3.0:</p>
-<div class="highlight"><pre><span></span><code><span class="p">&lt;</span><span class="nt">section</span> <span class="na">class</span><span class="o">=</span><span class="s">&quot;box&quot;</span><span class="p">&gt;</span>
+<table class="highlighttable"><tr><td class="linenos"><div class="linenodiv"><pre><span></span><span class="normal">1</span>
+<span class="normal">2</span>
+<span class="normal">3</span>
+<span class="normal">4</span>
+<span class="normal">5</span>
+<span class="normal">6</span>
+<span class="normal">7</span></pre></div></td><td class="code"><div class="highlight"><pre><span></span><code><span class="p">&lt;</span><span class="nt">section</span> <span class="na">class</span><span class="o">=</span><span class="s">&quot;box&quot;</span><span class="p">&gt;</span>
     <span class="p">&lt;</span><span class="nt">h2</span> <span class="na">class</span><span class="o">=</span><span class="s">&quot;boxTitle&quot;</span><span class="p">&gt;</span><span class="c">&lt;!-- Title --&gt;</span><span class="p">&lt;/</span><span class="nt">h2</span><span class="p">&gt;</span>
 
     <span class="p">&lt;</span><span class="nt">div</span> <span class="na">class</span><span class="o">=</span><span class="s">&quot;boxContent&quot;</span><span class="p">&gt;</span>
     <span class="p">&lt;/</span><span class="nt">div</span><span class="p">&gt;</span>
 <span class="p">&lt;/</span><span class="nt">section</span><span class="p">&gt;</span>
 </code></pre></div>
+</td></tr></table>
 <h2 id="forms">Forms<a class="headerlink" href="#forms" title="Permanent link">#</a></h2>
 <p>The input tag for session ids <code>SID_INPUT_TAG</code> has been deprecated and no longer yields any content, it can be safely removed. In previous versions forms have been wrapped in <code>&lt;div class="container containerPadding marginTop"&gt;…&lt;/div&gt;</code> which no longer has any effect and should be removed.</p>
 <p>If you're using the preview feature for WYSIWYG-powered input fields, you need to alter the preview button include instruction:</p>
-<div class="highlight"><pre><span></span><code><span class="cp">{</span><span class="nf">include</span> <span class="na">file</span><span class="o">=</span><span class="s1">&#39;messageFormPreviewButton&#39;</span> <span class="na">previewMessageObjectType</span><span class="o">=</span><span class="s1">&#39;com.example.foo.bar&#39;</span> <span class="na">previewMessageObjectID</span><span class="o">=</span><span class="m">0</span><span class="cp">}</span><span class="x"></span>
+<table class="highlighttable"><tr><td class="linenos"><div class="linenodiv"><pre><span></span><span class="normal">1</span></pre></div></td><td class="code"><div class="highlight"><pre><span></span><code><span class="cp">{</span><span class="nf">include</span> <span class="na">file</span><span class="o">=</span><span class="s1">&#39;messageFormPreviewButton&#39;</span> <span class="na">previewMessageObjectType</span><span class="o">=</span><span class="s1">&#39;com.example.foo.bar&#39;</span> <span class="na">previewMessageObjectID</span><span class="o">=</span><span class="m">0</span><span class="cp">}</span><span class="x"></span>
 </code></pre></div>
+</td></tr></table>
 <p><em>The message object id should be non-zero when editing.</em></p>
 <h2 id="icons">Icons<a class="headerlink" href="#icons" title="Permanent link">#</a></h2>
 <p>The old <code>.icon-&lt;iconName&gt;</code> classes have been removed, you are required to use the official <code>.fa-&lt;iconName&gt;</code> class names from FontAwesome. This does not affect the generic classes <code>.icon</code> (indicates an icon) and <code>.icon&lt;size&gt;</code> (e.g. <code>.icon16</code> that sets the dimensions), these are still required and have not been deprecated.</p>
 <p>Before:</p>
-<div class="highlight"><pre><span></span><code><span class="p">&lt;</span><span class="nt">span</span> <span class="na">class</span><span class="o">=</span><span class="s">&quot;icon icon16 icon-list&quot;</span><span class="p">&gt;</span>
+<table class="highlighttable"><tr><td class="linenos"><div class="linenodiv"><pre><span></span><span class="normal">1</span></pre></div></td><td class="code"><div class="highlight"><pre><span></span><code><span class="p">&lt;</span><span class="nt">span</span> <span class="na">class</span><span class="o">=</span><span class="s">&quot;icon icon16 icon-list&quot;</span><span class="p">&gt;</span>
 </code></pre></div>
+</td></tr></table>
 <p>Now:</p>
-<div class="highlight"><pre><span></span><code><span class="p">&lt;</span><span class="nt">span</span> <span class="na">class</span><span class="o">=</span><span class="s">&quot;icon icon16 fa-list&quot;</span><span class="p">&gt;</span>
+<table class="highlighttable"><tr><td class="linenos"><div class="linenodiv"><pre><span></span><span class="normal">1</span></pre></div></td><td class="code"><div class="highlight"><pre><span></span><code><span class="p">&lt;</span><span class="nt">span</span> <span class="na">class</span><span class="o">=</span><span class="s">&quot;icon icon16 fa-list&quot;</span><span class="p">&gt;</span>
 </code></pre></div>
+</td></tr></table>
 <h3 id="changed-icon-names">Changed Icon Names<a class="headerlink" href="#changed-icon-names" title="Permanent link">#</a></h3>
 <p>Quite a few icon names have been renamed, the official wiki lists the <a href="https://github.com/FortAwesome/Font-Awesome/wiki/Upgrading-from-3.2.1-to-4">new icon names</a> in FontAwesome 4.</p>
 <h2 id="changed-classes">Changed Classes<a class="headerlink" href="#changed-classes" title="Permanent link">#</a></h2>
 </ul>
 <h2 id="simple-example">Simple Example<a class="headerlink" href="#simple-example" title="Permanent link">#</a></h2>
 <p>The code below includes only the absolute minimum required to display a page, the content title is already included in the output.</p>
-<div class="highlight"><pre><span></span><code><span class="cp">{</span><span class="nf">include</span> <span class="na">file</span><span class="o">=</span><span class="s1">&#39;header&#39;</span><span class="cp">}</span><span class="x"></span>
+<table class="highlighttable"><tr><td class="linenos"><div class="linenodiv"><pre><span></span><span class="normal">1</span>
+<span class="normal">2</span>
+<span class="normal">3</span>
+<span class="normal">4</span>
+<span class="normal">5</span>
+<span class="normal">6</span>
+<span class="normal">7</span></pre></div></td><td class="code"><div class="highlight"><pre><span></span><code><span class="cp">{</span><span class="nf">include</span> <span class="na">file</span><span class="o">=</span><span class="s1">&#39;header&#39;</span><span class="cp">}</span><span class="x"></span>
 
 <span class="x">&lt;div class=&quot;section&quot;&gt;</span>
 <span class="x">    Hello World!</span>
 
 <span class="cp">{</span><span class="nf">include</span> <span class="na">file</span><span class="o">=</span><span class="s1">&#39;footer&#39;</span><span class="cp">}</span><span class="x"></span>
 </code></pre></div>
+</td></tr></table>
 <h2 id="full-example">Full Example<a class="headerlink" href="#full-example" title="Permanent link">#</a></h2>
-<div class="highlight"><pre><span></span><code><span class="cp">{</span><span class="c">*</span>
+<table class="highlighttable"><tr><td class="linenos"><div class="linenodiv"><pre><span></span><span class="normal"> 1</span>
+<span class="normal"> 2</span>
+<span class="normal"> 3</span>
+<span class="normal"> 4</span>
+<span class="normal"> 5</span>
+<span class="normal"> 6</span>
+<span class="normal"> 7</span>
+<span class="normal"> 8</span>
+<span class="normal"> 9</span>
+<span class="normal">10</span>
+<span class="normal">11</span>
+<span class="normal">12</span>
+<span class="normal">13</span>
+<span class="normal">14</span>
+<span class="normal">15</span>
+<span class="normal">16</span>
+<span class="normal">17</span>
+<span class="normal">18</span>
+<span class="normal">19</span>
+<span class="normal">20</span>
+<span class="normal">21</span>
+<span class="normal">22</span>
+<span class="normal">23</span>
+<span class="normal">24</span>
+<span class="normal">25</span>
+<span class="normal">26</span>
+<span class="normal">27</span>
+<span class="normal">28</span>
+<span class="normal">29</span>
+<span class="normal">30</span>
+<span class="normal">31</span>
+<span class="normal">32</span>
+<span class="normal">33</span>
+<span class="normal">34</span>
+<span class="normal">35</span>
+<span class="normal">36</span>
+<span class="normal">37</span>
+<span class="normal">38</span>
+<span class="normal">39</span>
+<span class="normal">40</span>
+<span class="normal">41</span>
+<span class="normal">42</span>
+<span class="normal">43</span>
+<span class="normal">44</span>
+<span class="normal">45</span>
+<span class="normal">46</span>
+<span class="normal">47</span>
+<span class="normal">48</span>
+<span class="normal">49</span>
+<span class="normal">50</span>
+<span class="normal">51</span>
+<span class="normal">52</span>
+<span class="normal">53</span>
+<span class="normal">54</span>
+<span class="normal">55</span>
+<span class="normal">56</span>
+<span class="normal">57</span>
+<span class="normal">58</span>
+<span class="normal">59</span>
+<span class="normal">60</span>
+<span class="normal">61</span>
+<span class="normal">62</span>
+<span class="normal">63</span>
+<span class="normal">64</span>
+<span class="normal">65</span>
+<span class="normal">66</span>
+<span class="normal">67</span>
+<span class="normal">68</span>
+<span class="normal">69</span>
+<span class="normal">70</span>
+<span class="normal">71</span></pre></div></td><td class="code"><div class="highlight"><pre><span></span><code><span class="cp">{</span><span class="c">*</span>
 <span class="c">    The page title is automatically set using the page definition, avoid setting it if you can!</span>
 <span class="c">    If you really need to modify the title, you can still reference the original title with:</span>
 <span class="c">    {$__wcf-&gt;getActivePage()-&gt;getTitle()}</span>
 <span class="cp">{</span><span class="c">* do not include `&lt;/body&gt;&lt;/html&gt;` here, the footer template is the last bit of code! *</span><span class="cp">}</span><span class="x"></span>
 <span class="cp">{</span><span class="nf">include</span> <span class="na">file</span><span class="o">=</span><span class="s1">&#39;footer&#39;</span><span class="cp">}</span><span class="x"></span>
 </code></pre></div>
+</td></tr></table>
 <h3 id="content-header">Content Header<a class="headerlink" href="#content-header" title="Permanent link">#</a></h3>
 <p>There are two different methods to set the content header, one sets only the actual values, but leaves the outer HTML untouched, that is generated by the <code>header</code> template. This is the recommended approach and you should avoid using the alternative method whenever possible.</p>
 <h4 id="recommended-approach">Recommended Approach<a class="headerlink" href="#recommended-approach" title="Permanent link">#</a></h4>
-<div class="highlight"><pre><span></span><code><span class="cp">{</span><span class="c">* This is automatically set using the page data and should not be set manually! *</span><span class="cp">}</span><span class="x"></span>
+<table class="highlighttable"><tr><td class="linenos"><div class="linenodiv"><pre><span></span><span class="normal">1</span>
+<span class="normal">2</span>
+<span class="normal">3</span>
+<span class="normal">4</span>
+<span class="normal">5</span>
+<span class="normal">6</span></pre></div></td><td class="code"><div class="highlight"><pre><span></span><code><span class="cp">{</span><span class="c">* This is automatically set using the page data and should not be set manually! *</span><span class="cp">}</span><span class="x"></span>
 <span class="cp">{</span><span class="nf">capture</span> <span class="na">assign</span><span class="o">=</span><span class="s1">&#39;contentTitle&#39;</span><span class="cp">}</span><span class="x">Custom Content Title</span><span class="cp">{</span><span class="nf">/capture</span><span class="cp">}</span><span class="x"></span>
 
 <span class="cp">{</span><span class="nf">capture</span> <span class="na">assign</span><span class="o">=</span><span class="s1">&#39;contentDescription&#39;</span><span class="cp">}</span><span class="x">Optional description that is displayed right after the title.</span><span class="cp">{</span><span class="nf">/capture</span><span class="cp">}</span><span class="x"></span>
 
 <span class="cp">{</span><span class="nf">capture</span> <span class="na">assign</span><span class="o">=</span><span class="s1">&#39;contentHeaderNavigation&#39;</span><span class="cp">}</span><span class="x">List of navigation buttons displayed right next to the title.</span><span class="cp">{</span><span class="nf">/capture</span><span class="cp">}</span><span class="x"></span>
 </code></pre></div>
+</td></tr></table>
 <h4 id="alternative">Alternative<a class="headerlink" href="#alternative" title="Permanent link">#</a></h4>
-<div class="highlight"><pre><span></span><code><span class="cp">{</span><span class="nf">capture</span> <span class="na">assign</span><span class="o">=</span><span class="s1">&#39;contentHeader&#39;</span><span class="cp">}</span><span class="x"></span>
+<table class="highlighttable"><tr><td class="linenos"><div class="linenodiv"><pre><span></span><span class="normal"> 1</span>
+<span class="normal"> 2</span>
+<span class="normal"> 3</span>
+<span class="normal"> 4</span>
+<span class="normal"> 5</span>
+<span class="normal"> 6</span>
+<span class="normal"> 7</span>
+<span class="normal"> 8</span>
+<span class="normal"> 9</span>
+<span class="normal">10</span>
+<span class="normal">11</span>
+<span class="normal">12</span>
+<span class="normal">13</span>
+<span class="normal">14</span>
+<span class="normal">15</span></pre></div></td><td class="code"><div class="highlight"><pre><span></span><code><span class="cp">{</span><span class="nf">capture</span> <span class="na">assign</span><span class="o">=</span><span class="s1">&#39;contentHeader&#39;</span><span class="cp">}</span><span class="x"></span>
 <span class="x">    &lt;header class=&quot;contentHeader&quot;&gt;</span>
 <span class="x">        &lt;div class=&quot;contentHeaderTitle&quot;&gt;</span>
 <span class="x">            &lt;h1 class=&quot;contentTitle&quot;&gt;Custom Content Title&lt;/h1&gt;</span>
 <span class="x">    &lt;/header&gt;</span>
 <span class="cp">{</span><span class="nf">/capture</span><span class="cp">}</span><span class="x"></span>
 </code></pre></div>
+</td></tr></table>