Animated

  • CSS
    • style.css
  • Images
  • HTML
    • PAGES
      • file name
      • file name
      • file name
    • file name
    • file name
  • index.html
  • components.html 
    <ul class="file-tree">
        <li class="file-tree-folder">CSS
            <ul>
                <li>style.css</li>
            </ul>
        </li>
        <li class="file-tree-folder empty">Images</li>
        <li class="file-tree-folder">HTML
            <ul>
                <li class="file-tree-folder">PAGES
                    <ul>
                        <li>file name </li>
                        <li>file name </li>
                        <li>file name </li>
                    </ul>
                </li>
                <li>file name </li>
                <li>file name </li>
            </ul>
        </li>
        <li>index.html </li>
        <li>components.html </li>
    </ul>

Basic

  • Parent Node
    • img
    • css
      • style.css
    • js
      • script.js
    • index.html 
<ul id="myUL">
    <li>
        <span class="caret">Parent Node</span>
        <ul class="nested active">
            <li>
                <span class="caret caret-down">img</span>
                <ul class="nested">
                </ul>
            </li>
            <li>
                <span class="caret caret-down">css</span>
                <ul class="nested">
                    <li>style.css</li>
                </ul>
            </li>
            <li>
                <span class="caret caret-down">js</span>
                <ul class="nested">
                    <li>script.js</li>
                </ul>
            </li>
            <li>
                <li>index.html</li>
            </li>
        </ul>
    </li>
</ul>

Copyright © 2021 DesignReset, All rights reserved.

Coded with