Actions

Difference between revisions of "Test"

From ThornsWiki
(→‎TEST ACCORDION)
Line 95: Line 95:
 
===TEST ACCORDION===
 
===TEST ACCORDION===
  
−
<div class="accordion">
+
<div class="accordion vertical">
−
  <input name="accordion-1" class="accordion__input" type="checkbox" id="accordion-1-item-1">
+
    <ul>
−
  <input name="accordion-1" class="accordion__input" type="checkbox" id="accordion-1-item-2">
+
        <li>
−
  <input name="accordion-1" class="accordion__input" type="checkbox" id="accordion-1-item-3">
+
            <input type="checkbox" id="checkbox-1" name="checkbox-accordion" />
−
 
+
            <label for="checkbox-1">Title&nbsp;One</label>
−
  <div class="accordion__item">
+
            <div class="content">
−
    <div class="accordion__header">
+
                <h3>This is an example accordion item</h3>
−
      <label class="accordion__opener accordion__opener--open" for="accordion-1-item-1">Open</label>
+
                <p>Lorem ipsum dolor sit amet, consectetur adipiscing elit. Suspendisse nec posuere lorem. Pellentesque hendrerit, lorem luctus porttitor vestibulum, eros sapien mattis libero, euismod congue neque nisi at ipsum. Mauris semper ipsum sit amet metus semper malesuada. Donec vel est justo, ac porta diam.</p>
−
      <label class="accordion__opener accordion__opener--close" for="accordion-1-item-1">Close</label>
+
                <p>In ut est in orci commodo blandit. Cras rhoncus ultricies augue. Proin quam odio, venenatis ut tempus tristique, aliquet in velit. Pellentesque volutpat facilisis orci, ut congue mi rhoncus at. Nullam vehicula dignissim neque, sed rhoncus magna ultricies et.</p>
−
      <div class="accordion__title">Section 1</div>
+
            </div>
−
    </div>
+
        </li>
−
    <div class="accordion__content">
+
        <li>
−
      <p>...</p>
+
            <input type="checkbox" id="checkbox-2" name="checkbox-accordion" />
−
    </div>
+
            <label for="checkbox-2">Title&nbsp;Two</label>
−
  </div>
+
            <div class="content">
−
 
+
                <h3>Totally another one right here</h3>
−
  <div class="accordion__item">
+
                <p>Lorem ipsum dolor sit amet, consectetur adipiscing elit. Suspendisse nec posuere lorem. Pellentesque hendrerit, lorem luctus porttitor vestibulum, eros sapien mattis libero, euismod congue neque nisi at ipsum. Mauris semper ipsum sit amet metus semper malesuada. Donec vel est justo, ac porta diam.</p>
−
    <div class="accordion__header">
+
                <p>In ut est in orci commodo blandit. Cras rhoncus ultricies augue. Proin quam odio, venenatis ut tempus tristique, aliquet in velit. Pellentesque volutpat facilisis orci, ut congue mi rhoncus at. Nullam vehicula dignissim neque, sed rhoncus magna ultricies et.</p>
−
      <label class="accordion__opener accordion__opener--open" for="accordion-1-item-2">Open</label>
+
            </div>
−
      <label class="accordion__opener accordion__opener--close" for="accordion-1-item-2">Close</label>
+
        </li>
−
    <div class="accordion__title">Section 2</div>
+
        <li>
−
    </div>
+
            <input type="checkbox" id="checkbox-3" name="checkbox-accordion" />
−
    <div class="accordion__content">
+
            <label for="checkbox-3">Title&nbsp;Three</label>
−
      <p>...</p>
+
            <div class="content">
−
    </div>
+
                <h3>I think I can go on forever</h3>
−
  </div>
+
                <p>Lorem ipsum dolor sit amet, consectetur adipiscing elit. Suspendisse nec posuere lorem. Pellentesque hendrerit, lorem luctus porttitor vestibulum, eros sapien mattis libero, euismod congue neque nisi at ipsum. Mauris semper ipsum sit amet metus semper malesuada. Donec vel est justo, ac porta diam.</p>
−
 
+
                <p>In ut est in orci commodo blandit. Cras rhoncus ultricies augue. Proin quam odio, venenatis ut tempus tristique, aliquet in velit. Pellentesque volutpat facilisis orci, ut congue mi rhoncus at. Nullam vehicula dignissim neque, sed rhoncus magna ultricies et.</p>
−
  <div class="accordion__item">
+
            </div>
−
    <div class="accordion__header">
+
        </li>
−
      <label class="accordion__opener accordion__opener--open" for="accordion-1-item-3">Open</label>
+
        <li>
−
      <label class="accordion__opener accordion__opener--close" for="accordion-1-item-3">Close</label>
+
            <input type="checkbox" id="checkbox-4" name="checkbox-accordion" />
−
      <div class="accordion__title">Section 3</div>
+
            <label for="checkbox-4">Title&nbsp;Four</label>
−
    </div>
+
            <div class="content">
−
    <div class="accordion__content">
+
                <h3>I was wrong, I'm done</h3>
−
      <p>...</p>
+
                <p>Lorem ipsum dolor sit amet, consectetur adipiscing elit. Suspendisse nec posuere lorem. Pellentesque hendrerit, lorem luctus porttitor vestibulum, eros sapien mattis libero, euismod congue neque nisi at ipsum. Mauris semper ipsum sit amet metus semper malesuada. Donec vel est justo, ac porta diam.</p>
−
    </div>
+
                <p>In ut est in orci commodo blandit. Cras rhoncus ultricies augue. Proin quam odio, venenatis ut tempus tristique, aliquet in velit. Pellentesque volutpat facilisis orci, ut congue mi rhoncus at. Nullam vehicula dignissim neque, sed rhoncus magna ultricies et.</p>
−
  </div>
+
            </div>
 +
        </li>
 +
    </ul>
 
</div>
 
</div>
−
__NOTOC__
 

Revision as of 22:23, 13 January 2019

NavFrame Modification: Works

Hello world.

'NavFrame Modification: Works


v · d · e
Standard MediaWiki Navbox Template "autocollapse" state
Above test
Test 1
  • Test 1
  • Test 1
  • Test 1
  • Test 1
Test 2
  • Test 2
  • Test 2
  • Test 2
  • Test 2
Below test

v · d · e
Standard MediaWiki Navbox Template "uncollapsed" state
Above test
Test 1
  • Test 1
  • Test 1
  • Test 1
  • Test 1
Test 2
  • Test 2
  • Test 2
  • Test 2
  • Test 2
Below test


TEST ACCORDION

  • <input type="checkbox" id="checkbox-1" name="checkbox-accordion" /> <label for="checkbox-1">Title One</label>

    This is an example accordion item

    Lorem ipsum dolor sit amet, consectetur adipiscing elit. Suspendisse nec posuere lorem. Pellentesque hendrerit, lorem luctus porttitor vestibulum, eros sapien mattis libero, euismod congue neque nisi at ipsum. Mauris semper ipsum sit amet metus semper malesuada. Donec vel est justo, ac porta diam.

    In ut est in orci commodo blandit. Cras rhoncus ultricies augue. Proin quam odio, venenatis ut tempus tristique, aliquet in velit. Pellentesque volutpat facilisis orci, ut congue mi rhoncus at. Nullam vehicula dignissim neque, sed rhoncus magna ultricies et.

  • <input type="checkbox" id="checkbox-2" name="checkbox-accordion" /> <label for="checkbox-2">Title Two</label>

    Totally another one right here

    Lorem ipsum dolor sit amet, consectetur adipiscing elit. Suspendisse nec posuere lorem. Pellentesque hendrerit, lorem luctus porttitor vestibulum, eros sapien mattis libero, euismod congue neque nisi at ipsum. Mauris semper ipsum sit amet metus semper malesuada. Donec vel est justo, ac porta diam.

    In ut est in orci commodo blandit. Cras rhoncus ultricies augue. Proin quam odio, venenatis ut tempus tristique, aliquet in velit. Pellentesque volutpat facilisis orci, ut congue mi rhoncus at. Nullam vehicula dignissim neque, sed rhoncus magna ultricies et.

  • <input type="checkbox" id="checkbox-3" name="checkbox-accordion" /> <label for="checkbox-3">Title Three</label>

    I think I can go on forever

    Lorem ipsum dolor sit amet, consectetur adipiscing elit. Suspendisse nec posuere lorem. Pellentesque hendrerit, lorem luctus porttitor vestibulum, eros sapien mattis libero, euismod congue neque nisi at ipsum. Mauris semper ipsum sit amet metus semper malesuada. Donec vel est justo, ac porta diam.

    In ut est in orci commodo blandit. Cras rhoncus ultricies augue. Proin quam odio, venenatis ut tempus tristique, aliquet in velit. Pellentesque volutpat facilisis orci, ut congue mi rhoncus at. Nullam vehicula dignissim neque, sed rhoncus magna ultricies et.

  • <input type="checkbox" id="checkbox-4" name="checkbox-accordion" /> <label for="checkbox-4">Title Four</label>

    I was wrong, I'm done

    Lorem ipsum dolor sit amet, consectetur adipiscing elit. Suspendisse nec posuere lorem. Pellentesque hendrerit, lorem luctus porttitor vestibulum, eros sapien mattis libero, euismod congue neque nisi at ipsum. Mauris semper ipsum sit amet metus semper malesuada. Donec vel est justo, ac porta diam.

    In ut est in orci commodo blandit. Cras rhoncus ultricies augue. Proin quam odio, venenatis ut tempus tristique, aliquet in velit. Pellentesque volutpat facilisis orci, ut congue mi rhoncus at. Nullam vehicula dignissim neque, sed rhoncus magna ultricies et.

Retrieved from "http://wiki.anaxasdiaries.com/index.php?title=Test&oldid=8102"