{% extends "layout.html" %}
{% block headers %}
  <script src="/static/js/jquery-3.6.0.min.js"></script>
  <script src="/static/js/d3.v7.min.js"></script>
  <script src="/static/js/utils.js?cache=1741959850"></script>
  <script src="/static/js/exploratory.js"></script>
  <style>
#data-model-explorer {
    width: 100%;
    height: 400pt;
    margin: 1em 0em 1em 0em;
    border: solid 2pt #333333;
    background: #cccccc;
    border-radius: .5em;
}
.node-column-title {
    fill: #000000;
    font-size: 24px;
    font-family: 'FiraMono';
    transform: translate(0, 30);
}
.active-node {
    fill: #ffff99 !important;
    stroke-width: 0px !important;
}
.node-group { cursor: pointer; }
.node-group-item { font-size: 12pt; font-family: 'FiraMono'; }
.node-group-item-white { fill: #fff; }
.node-group-item-gray { fill: #eee; }
.node-item {
    width: 250px;
    height: 30px;
    fill-opacity: .95;
    rx: .5em;
    ry: .5em;
    stroke-width: 2px;
    stroke: #aaaaaa;
}
.grid-line {
    stroke: #eeeeee;
    stroke-width: 2px;
    stroke-opacity: .1;
}
.highlighted-grid-line {
    stroke: #333333;
    stroke-width: 2px;
    stroke-opacity: 1;
}
</style>
{% endblock %}
{% block submenu %}
<ul>
  <li><a href="/admin/dashboard">Dashboard</a>
  <li><a href="/admin/users">Users</a>
  <li class="active corporate-identity-submenu-active">Exploratory
  <li><a href="/admin/reports">Reports</a>
  {% if may_query %}<li><a href="/admin/sparql">Query</a>{% endif %}
  {% if may_review_quotas %}<li><a href="/admin/quota-requests">Quota requests</a>{% endif %}
</ul>
{% endblock %}
{% block body %}
<h1>Data model explorer<span class="no-select"> &nbsp;<a id="remove-cache" href="#" class="fas fa-sync"></a></span></h1>
<svg id="data-model-explorer"></svg>
{% endblock %}
