Plain is headed towards 1.0! Subscribe for development updates →

 1{% if toolbar.should_render() %}
 2<script src="{{ asset('toolbar/toolbar.js') }}"></script>
 3<div id="plaintoolbar" class="text-sm py-1.5 text-stone-300 bg-stone-950 fixed bottom-4 max-w-full drop-shadow-md z-30 mx-4 rounded-2xl hidden lg:flex lg:flex-col -translate-x-1/2 left-1/2">
 4    <div class="flex justify-between px-4 mx-auto space-x-4">
 5        <div class="flex items-center">
 6            <svg class="w-4 h-4 width="237" height="237" viewBox="0 0 237 237" fill="none" xmlns="http://www.w3.org/2000/svg">
 7                <path d="M163.316 15.876C172.248 15.876 180.501 20.641 184.967 28.376L229.783 106C234.249 113.735 234.249 123.265 229.783 131L184.967 208.624C180.501 216.359 172.248 221.124 163.316 221.124L73.6837 221.124C64.7521 221.124 56.4989 216.359 52.0331 208.624L7.21686 131C2.75105 123.265 2.75105 113.735 7.21687 106L52.0331 28.376C56.4989 20.6409 64.7521 15.876 73.6837 15.876L163.316 15.876Z" fill="#8B8276"/>
 8                <circle cx="118.5" cy="118.5" r="64.5" fill="#CDC8C2"/>
 9            </svg>
10            <code class="ml-2 text-xs whitespace-nowrap text-mono">{{ toolbar.version }}</code>
11
12            {% if request.impersonator is defined %}
13            <div class="flex items-center ml-1 font-light">
14                Impersonating&nbsp;<span class="font-medium">{{ request.user }}</span>
15                </span>
16                <a href="{{ url('staff:impersonate:stop') }}" title="Stop impersonating" class="flex items-center px-1 ml-1 text-red-300 hover:text-white">
17                    <svg xmlns="http://www.w3.org/2000/svg" width="16" height="16" fill="currentColor" class="w-4 h-4 bi bi-x-octagon-fill" viewBox="0 0 16 16">
18                        <path d="M11.46.146A.5.5 0 0 0 11.107 0H4.893a.5.5 0 0 0-.353.146L.146 4.54A.5.5 0 0 0 0 4.893v6.214a.5.5 0 0 0 .146.353l4.394 4.394a.5.5 0 0 0 .353.146h6.214a.5.5 0 0 0 .353-.146l4.394-4.394a.5.5 0 0 0 .146-.353V4.893a.5.5 0 0 0-.146-.353L11.46.146zm-6.106 4.5L8 7.293l2.646-2.647a.5.5 0 0 1 .708.708L8.707 8l2.647 2.646a.5.5 0 0 1-.708.708L8 8.707l-2.646 2.647a.5.5 0 0 1-.708-.708L7.293 8 4.646 5.354a.5.5 0 1 1 .708-.708z"/>
19                    </svg>
20                </a>
21            </div>
22            {% endif %}
23        </div>
24        <div class="flex items-center space-x-4">
25            {% include "querystats/toolbar.html" %}
26
27            <div class="flex items-center space-x-3 transition-all">
28                {% include "toolbar/links.html" %}
29                <button data-plaintoolbar-expand class="hover:text-orange-500" type="button">
30                    <svg xmlns="http://www.w3.org/2000/svg" width="16" height="16" fill="currentColor" class="w-4 h-4" viewBox="0 0 16 16">
31                        <path fill-rule="evenodd" d="M3.646 9.146a.5.5 0 0 1 .708 0L8 12.793l3.646-3.647a.5.5 0 0 1 .708.708l-4 4a.5.5 0 0 1-.708 0l-4-4a.5.5 0 0 1 0-.708zm0-2.292a.5.5 0 0 0 .708 0L8 3.207l3.646 3.647a.5.5 0 0 0 .708-.708l-4-4a.5.5 0 0 0-.708 0l-4 4a.5.5 0 0 0 0 .708z"/>
32                    </svg>
33                </button>
34            </div>
35        </div>
36    </div>
37    <div id="plaintoolbar-details" class="hidden p-4 text-sm">
38        <table>
39            <tbody>
40            {% for k, v in toolbar.metadata.items() %}
41            <tr>
42                <td class="pr-2 font-medium whitespace-nowrap">{{ k }}</td>
43                <td class="whitespace-nowrap">{{ v }}</td>
44            </tr>
45            {% endfor %}
46            </tbody>
47        </table>
48
49        {% if object|default(false) %}
50        <div class="font-mono" title="PK: {{ object.pk|default('unknown') }}">
51            {{ object.__repr__() }}
52        </div>
53        {% endif %}
54
55        <button data-plaintoolbar-hide class="hover:text-red-500" type="button">
56            Hide for 1 hour
57            <svg xmlns="http://www.w3.org/2000/svg" width="16" height="16" fill="currentColor" class="w-4 h-4 bi bi-x-circle-fill" viewBox="0 0 16 16">
58                <path d="M16 8A8 8 0 1 1 0 8a8 8 0 0 1 16 0zM5.354 4.646a.5.5 0 1 0-.708.708L7.293 8l-2.647 2.646a.5.5 0 0 0 .708.708L8 8.707l2.646 2.647a.5.5 0 0 0 .708-.708L8.707 8l2.647-2.646a.5.5 0 0 0-.708-.708L8 7.293 5.354 4.646z"/>
59            </svg>
60        </button>
61    </div>
62</div>
63{% endif %}