1{% extends "basic/layout.html" %} 2 3{% block css %} 4 <link href="https://cdn.jsdelivr.net/npm/[email protected]/dist/css/bootstrap.min.css" rel="stylesheet" integrity="sha384-4bw+/aepP/YC94hEpVNVgiZdgIC5+VKNBQNGCHeKRQN+PtmoHDEXuppvnDJzQIu9" crossorigin="anonymous"> 5 {{ css() }} 6{% endblock %} 7 8{% block extrahead %} 9<script> 10 (() => { 11 const mq = window.matchMedia('(prefers-color-scheme: dark)'); 12 const update = (m) => document.documentElement.setAttribute('data-bs-theme', m.matches ? 'dark' : 'light'); 13 mq.addEventListener('change', (e) => update(e)); 14 update(mq); 15 })(); 16</script> 17{% endblock %} 18 19{% block body_tag %} 20 <body class="d-flex flex-column h-100"> 21{% endblock %} 22 23{% block relbar1 %}{% endblock %} 24{% block relbar2 %}{% endblock %} 25 26{% block header %} 27 <nav class="navbar navbar-expand-lg navbar-dark bg-dark-subtle" data-bs-theme="dark"> 28 <div class="container"> 29 <div class="d-flex flex-row"> 30 <a class="navbar-brand" href="https://www.mesa3d.org/"> 31 <img class="d-inline-block align-bottom" src="{{ pathto('_static/logo.svg', 1) }}" alt="" width="30" height="30"> 32 Mesa 3D 33 </a> 34 </div> 35 36 <button id="navbar-button" class="d-none navbar-toggler" type="button" data-bs-toggle="collapse" data-bs-target="#navbarSupportedContent" aria-controls="navbarSupportedContent" aria-expanded="false" aria-label="Toggle navigation"> 37 <span class="navbar-toggler-icon"></span> 38 </button> 39 40 <div class="navbar-collapse" id="navbarSupportedContent"> 41 <ul class="navbar-nav ms-auto"> 42 43 <li class="nav-item"> 44 <a class="nav-link" href="https://www.mesa3d.org/" title="Home">Home</a> 45 </li> 46 47 <li class="nav-item"> 48 <a class="nav-link" href="https://www.mesa3d.org/news/" title="News">News</a> 49 </li> 50 51 <li class="nav-item"> 52 <a class="nav-link{% if pagename == 'download' %} active{% endif %}" href="{{ pathto('download') }}" title="">Getting Started</a> 53 </li> 54 55 <li class="nav-item"> 56 <a class="nav-link active" href="{{ pathto(root_doc) }}" title="">Documentation</a> 57 </li> 58 59 </ul> 60 </div> 61 </div> 62 <script> 63 document.getElementById('navbar-button').classList.remove('d-none'); 64 document.getElementById('navbarSupportedContent').classList.add('collapse'); 65 </script> 66 </nav> 67{% endblock %} 68 69{% block content %} 70 <div class="container my-3"> 71 <div class="row"> 72 <main class="body col-12 col-lg-9 order-1 order-lg-2" role="main"> 73 {% block body %}{% endblock %} 74 </main> 75 76 {% block navigation %} 77 <nav id="menu" class="rounded col-12 col-lg-3 order-2 order-lg-1 bg-dark-subtle pb-3"> 78 <div class="my-3" role="search"> 79 <form id="search-form" action="{{ pathto('search') }}" method="get"> 80 <div class="form-group"> 81 <input class="form-control" type="text" name="q" placeholder="Search docs" /> 82 <input type="hidden" name="check_keywords" value="yes" /> 83 <input type="hidden" name="area" value="default" /> 84 </div> 85 </form> 86 </div> 87 88 {% block menu %} 89 {% set toctree = toctree(maxdepth=4, collapse=True, includehidden=True, titles_only=False) %} 90 {% if toctree %} 91 {{ toctree }} 92 {% else %} 93 {{ toc }} 94 {% endif %} 95 {% endblock %} 96 </nav> 97 {% endblock %} 98 </div> 99 </div> 100{% endblock %} 101 102{% block footer %} 103 <footer class="footer py-3 bg-body-tertiary text-muted"> 104 <div class="container"> 105 <div class="row"> 106 107 <div class="col-12 col-lg-3"> 108 <h6 class="text-body">Documentation</h6> 109 <ul class="list-unstyled"> 110 <li><a href="https://docs.mesa3d.org/license.html">License</a></li> 111 <li><a href="https://docs.mesa3d.org/faq.html">FAQ</a></li> 112 <li><a href="https://docs.mesa3d.org/download.html">Getting Started</a></li> 113 </ul> 114 </div> 115 116 <div class="col-12 col-lg-3"> 117 <h6 class="text-body">Community</h6> 118 <ul class="list-unstyled"> 119 <li><a href="https://gitlab.freedesktop.org/mesa">GitLab</a></li> 120 <li><a href="https://docs.mesa3d.org/lists.html">Mailing Lists</a></li> 121 <li><a href="https://docs.mesa3d.org/bugs.html">Report a Bug</a></li> 122 </ul> 123 </div> 124 125 <div class="col-12 col-lg-3"> 126 <h6 class="text-body">More</h6> 127 <ul class="list-unstyled"> 128 <li><a href="https://www.mesa3d.org/website/">About Mesa3D.org</a></li> 129 <li><a href="https://docs.mesa3d.org/thanks.html">Acknowledgements</a></li> 130 <li><a href="https://dri.freedesktop.org/wiki/">Mesa / DRI Wiki</a></li> 131 </ul> 132 </div> 133 134 <div class="col-12 col-lg-3"> 135 <p>Hosted by <a href="https://www.freedesktop.org/">Freedesktop.org</a></p> 136 <p><a href="https://gitlab.freedesktop.org/mesa/mesa/-/blob/main/docs/{{ pagename }}{{ page_source_suffix }}">Edit this page</a></p> 137 </div> 138 139 </div> 140 </div> 141 </footer> 142 <script src="https://cdn.jsdelivr.net/npm/[email protected]/dist/js/bootstrap.bundle.min.js" integrity="sha384-HwwvtgBNo3bZJJLYd8oVXjrBZt8cqVSpeBNS5n7C8IVInixGAoxmnlMuBnhbgrkm" crossorigin="anonymous"></script> 143 <script> 144 (() => { 145 const collapseElementList = document.querySelectorAll('#menu > .caption + ul'); 146 // Add Bootstrap collapse components to the expandable menu-captions 147 [...collapseElementList].forEach(collapseEl => { 148 // disable transition if we need toggling 149 const toggle = collapseEl.classList.contains('current'); 150 if (toggle) 151 collapseEl.style.transition = "none"; 152 else 153 collapseEl.previousElementSibling.classList.add('collapsed'); 154 155 // enable collapse 156 collapseEl.classList.add('collapse'); 157 collapseEl.previousElementSibling.classList.add('collapse-icon'); 158 const collapse = new bootstrap.Collapse(collapseEl, { 159 toggle: toggle 160 }); 161 162 // disable transition-override again 163 if (toggle) { 164 collapseEl.addEventListener('shown.bs.collapse', event => { 165 collapseEl.style.removeProperty('transition'); 166 }, {once : true}) 167 } 168 169 // collapse on click on previous element 170 collapseEl.previousElementSibling.addEventListener('click', (event) => { 171 collapse.toggle(); 172 collapseEl.previousElementSibling.classList.toggle('collapsed'); 173 }); 174 }); 175 })(); 176 </script> 177{% endblock %} 178
