Error stack

by Harm Zeinstra

HTML

<section>
    <h1 id="reset-this-parent" class="header">Error 64</h1>
</section>

<section>
    <h1 class="carret turn" onclick="this.nextElementSibling.classList.toggle('collapsed');this.classList.toggle('turn');">Location</h1>
    <div class="collapsed">
        C:\Users\Harm Zeinstra\workspace\prototyping\TreeCare\backend\src\index.php:5
    </div>
</section>

<section>
    <h1>Message</h1>
    <div>
        require(): Failed opening required 'C:\Users\Harm Zeinstra\workspace\prototyping\TreeCare\backend\src\core\FatalErrorHandler.php\' (include_path='C:\xampp\php\PEAR')
    </div>
</section>

<section>
    <h1>Stack</h1>
    <div>

        require(): Failed opening required 'C:\Users\Harm Zeinstra\workspace\prototyping\TreeCare\backend\src\core\FatalErrorHandler.php\' (include_path='C:\xampp\php\PEAR')<br>
        C:\Users\Harm Zeinstra\workspace\prototyping\TreeCare\backend\src\index.php::5<br>

        <pre><code id="block-1571834267" class="hljs php" lang="php"><table class="hljs-ln"><tbody><tr class=" "><td class="hljs-ln-line hljs-ln-numbers" data-line-number="6"><div class="hljs-ln-n" data-line-number="6"></div></td><td class="hljs-ln-line hljs-ln-code" data-line-number="6">&nbsp;&nbsp;</td></tr><tr class=" "><td class="hljs-ln-line hljs-ln-numbers" data-line-number="7"><div class="hljs-ln-n" data-line-number="7"></div></td><td class="hljs-ln-line hljs-ln-code" data-line-number="7">&nbsp;&nbsp;$server&nbsp;=&nbsp;<span class="hljs-keyword">new</span>&nbsp;\Jacwright\RestServer\RestServer(<span class="hljs-string">'debug'</span>);</td></tr><tr class=" "><td class="hljs-ln-line hljs-ln-numbers" data-line-number="8"><div class="hljs-ln-n" data-line-number="8"></div></td><td class="hljs-ln-line hljs-ln-code" data-line-number="8">&nbsp;&nbsp;</td></tr><tr class=" "><td class="hljs-ln-line hljs-ln-numbers" data-line-number="9"><div class="hljs-ln-n" data-line-number="9"></div></td><td class="hljs-ln-line hljs-ln-code"...

CSS

body {
    font-family: Verdana, Geneva, sans-serif;
    min-height: 100vh;
    background: #20262e;
    color: #eee;
}

section {
    border: 3px solid #080E16;
    border-radius: 7px;
    margin: 10px 0 20px 0;
    padding: 0 0 0 0;
    -moz-box-shadow: 5px -5px 2px 2px #030911;
    -webkit-box-shadow: 5px -5px 2px 2px #030911;
}

section * {
    width: 100%;
    border: 1px solid #080E16;
    margin: 0;
}

section > h1 {
    padding: 5px;
    border-top-left-radius: 7px;
    border-top-right-radius: 7px;
    cursor: pointer;
}
section > .carret::after {
    content: "▲";
}

#reset-this-parent {
  all: initial;
  * {
    all: unset;
  }
}

section > div {
    padding: 15px;
    border-bottom-left-radius: 7px;
    border-bottom-right-radius: 7px;
    overflow: hidden;
}

.collapsed {
    padding: 0;
    visibility: hidden;
    height: 0;
}
.turn::after {
    content: "▼" !important;
}