WP6
/
expub_compendium
Watch 1
Star 0
Fork 0
Code Issues 0 Pull Requests 0 Releases 0 Wiki Activity
Browse Source

Merge branch 'joel' into main

joel
Simon Bowie 1 year ago
parent
91b53af5f5 449dcdce61
commit
1f35a4e775
No account linked to committer's email address
8 changed files with 645 additions and 562 deletions
Split View Show Diff Stats
  1. +23
    -8
      web/app/static/src/main.css
  2. +175
    -61
      web/app/static/styles/main.css
  3. +2
    -2
      web/app/templates/about.html
  4. +222
    -246
      web/app/templates/base.html
  5. +108
    -108
      web/app/templates/book.html
  6. +2
    -2
      web/app/templates/index.html
  7. +72
    -72
      web/app/templates/resource.html
  8. +41
    -63
      web/app/templates/resources.html

+ 23
- 8
web/app/static/src/main.css View File

@@ -79,9 +79,15 @@ select {
}

.cell {
@apply min-w-[14rem];
@apply max-h-[30vh] lg:max-h-none relative;
@apply overflow-hidden;
}
/*
.cell::after {
content:'';
@apply absolute w-full h-[3rem] left-0 bottom-0;
background-color: red;
} */
.cell.size-1 {
@apply min-w-[30rem];
}
@@ -111,9 +117,18 @@ select {
}

.cell {
@apply cell-margin relative;
@apply cell-margin ;
}

.cell .lead-inner-link {
@apply relative;
}

.cell .lead-inner-link::after {
content: '';
@apply absolute bottom-0 left-0 w-full h-[3rem] ;
background-image: linear-gradient(to bottom, rgba(255,255,255,0), rgba(255,255,255,1));
}

.cell::before {
content: '';
@@ -166,7 +181,7 @@ select {
}

.facts > * {
@apply max-w-[65ch];
@apply lg:max-w-[65ch];
}

a:hover {
@@ -186,19 +201,19 @@ h3 {
}

.huge-title {
@apply text-4xl lg:text-5xl;
@apply text-2xl lg:text-5xl;
}
.big-title {
@apply text-3xl lg:text-4xl;
@apply text-lg lg:text-4xl;
}
.medium-title {
@apply text-2xl lg:text-3xl;
@apply text-xl lg:text-3xl;
}
.small-title {
@apply text-xl lg:text-2xl;
@apply text-lg lg:text-2xl;
}
.big-text {
@apply text-xl ;
@apply text-base lg:text-xl ;
}
.small-text {
@apply text-base;

+ 175
- 61
web/app/static/styles/main.css View File

@@ -552,29 +552,34 @@ video {
.z-\[60\] {
z-index: 60;
}
.col-span-2 {
grid-column: span 2 / span 2;
}
.row-start-1 {
grid-row-start: 1;
}
.float-right {
float: right;
}
.m-16 {
margin: 4rem;
.-m-4 {
margin: -1rem;
}
.m-4 {
margin: 1rem;
.m-1 {
margin: 0.25rem;
}
.mx-2 {
margin-left: 0.5rem;
margin-right: 0.5rem;
}
.mx-4 {
margin-left: 1rem;
margin-right: 1rem;
}
.my-8 {
margin-top: 2rem;
margin-bottom: 2rem;
}
.my-4 {
margin-top: 1rem;
margin-bottom: 1rem;
}
.mb-2 {
margin-bottom: 0.5rem;
}
@@ -599,9 +604,6 @@ video {
.mr-2 {
margin-right: 0.5rem;
}
.mr-auto {
margin-right: auto;
}
.mt-16 {
margin-top: 4rem;
}
@@ -632,12 +634,6 @@ video {
.h-14 {
height: 3.5rem;
}
.h-20 {
height: 5rem;
}
.h-40 {
height: 10rem;
}
.h-5 {
height: 1.25rem;
}
@@ -657,11 +653,8 @@ video {
.w-10 {
width: 2.5rem;
}
.w-20 {
width: 5rem;
}
.w-40 {
width: 10rem;
.w-14 {
width: 3.5rem;
}
.w-48 {
width: 12rem;
@@ -669,17 +662,11 @@ video {
.w-5 {
width: 1.25rem;
}
.w-\[20rem\] {
width: 20rem;
}
.w-\[25rem\] {
width: 25rem;
}
.w-\[35rem\] {
width: 35rem;
.w-\[12rem\] {
width: 12rem;
}
.w-\[4rem\] {
width: 4rem;
.w-\[4\.5rem\] {
width: 4.5rem;
}
.w-\[calc\(100\%-2rem\)\] {
width: calc(100% - 2rem);
@@ -691,9 +678,6 @@ video {
.w-full {
width: 100%;
}
.w-\[20\] {
width: 20;
}
.min-w-\[5rem\] {
min-width: 5rem;
}
@@ -723,12 +707,15 @@ video {
.grid-rows-1 {
grid-template-rows: repeat(1, minmax(0, 1fr));
}
.flex-wrap {
flex-wrap: wrap;
.flex-col {
flex-direction: column;
}
.content-start {
align-content: flex-start;
}
.items-start {
align-items: flex-start;
}
.items-center {
align-items: center;
}
@@ -747,9 +734,15 @@ video {
.gap-4 {
gap: 1rem;
}
.gap-6 {
gap: 1.5rem;
}
.gap-8 {
gap: 2rem;
}
.overflow-hidden {
overflow: hidden;
}
.overflow-x-auto {
overflow-x: auto;
}
@@ -779,9 +772,6 @@ video {
.border-l-2 {
border-left-width: 2px;
}
.border-r-2 {
border-right-width: 2px;
}
.border-black {
--tw-border-opacity: 1;
border-color: rgb(0 0 0 / var(--tw-border-opacity));
@@ -790,6 +780,9 @@ video {
--tw-bg-opacity: 1;
background-color: rgb(0 0 0 / var(--tw-bg-opacity));
}
.bg-purple-700\/50 {
background-color: rgb(126 34 206 / 0.5);
}
.bg-red-400 {
--tw-bg-opacity: 1;
background-color: rgb(248 113 113 / var(--tw-bg-opacity));
@@ -808,9 +801,6 @@ video {
.p-4 {
padding: 1rem;
}
.p-8 {
padding: 2rem;
}
.px-2 {
padding-left: 0.5rem;
padding-right: 0.5rem;
@@ -823,9 +813,9 @@ video {
padding-left: 2rem;
padding-right: 2rem;
}
.py-1 {
padding-top: 0.25rem;
padding-bottom: 0.25rem;
.py-2 {
padding-top: 0.5rem;
padding-bottom: 0.5rem;
}
.py-3 {
padding-top: 0.75rem;
@@ -846,6 +836,9 @@ video {
.pl-1 {
padding-left: 0.25rem;
}
.pr-4 {
padding-right: 1rem;
}
.pr-40 {
padding-right: 10rem;
}
@@ -859,6 +852,10 @@ video {
font-size: 1.1rem;
line-height: 1.22;
}
.text-lg {
font-size: 1.24rem;
line-height: 1.1;
}
.text-sm {
font-size: 0.95rem;
line-height: 1.35;
@@ -881,6 +878,9 @@ video {
--tw-text-opacity: 1;
color: rgb(255 255 255 / var(--tw-text-opacity));
}
.opacity-40 {
opacity: 0.4;
}
.grayscale {
--tw-grayscale: grayscale(100%);
filter: var(--tw-blur) var(--tw-brightness) var(--tw-contrast) var(--tw-grayscale) var(--tw-hue-rotate) var(--tw-invert) var(--tw-saturate) var(--tw-sepia) var(--tw-drop-shadow);
@@ -970,9 +970,26 @@ select {
}

.cell {
min-width: 14rem;
position: relative;
max-height: 30vh;
}

@media (min-width: 1024px) {

.cell {
max-height: none;
}
}

.cell {
overflow: hidden;
}
/*
.cell::after {
content:'';
@apply absolute w-full h-[3rem] left-0 bottom-0;
background-color: red;
} */
.cell.size-1 {
min-width: 30rem;
}
@@ -1032,10 +1049,22 @@ select {
}

.cell {
position: relative;
padding: 1rem;
}

.cell .lead-inner-link {
position: relative;
}

.cell .lead-inner-link::after {
content: '';
position: absolute;
bottom: 0px;
left: 0px;
height: 3rem;
width: 100%;
background-image: linear-gradient(to bottom, rgba(255,255,255,0), rgba(255,255,255,1));
}

.cell::before {
content: '';
@@ -1099,8 +1128,11 @@ select {
.facts h3 {
}

.facts > * {
max-width: 65ch;
@media (min-width: 1024px) {

.facts > * {
max-width: 65ch;
}
}

a:hover {
@@ -1127,7 +1159,7 @@ h3 {
}

.huge-title {
font-size: 3rem;
font-size: 1.85rem;
line-height: 1;
}

@@ -1139,8 +1171,8 @@ h3 {
}
}
.big-title {
font-size: 2rem;
line-height: 1;
font-size: 1.24rem;
line-height: 1.1;
}
@media (min-width: 1024px) {

@@ -1150,8 +1182,8 @@ h3 {
}
}
.medium-title {
font-size: 1.85rem;
line-height: 1;
font-size: 1.5rem;
line-height: 1.1;
}
@media (min-width: 1024px) {

@@ -1161,7 +1193,7 @@ h3 {
}
}
.small-title {
font-size: 1.5rem;
font-size: 1.24rem;
line-height: 1.1;
}
@media (min-width: 1024px) {
@@ -1172,8 +1204,15 @@ h3 {
}
}
.big-text {
font-size: 1.5rem;
line-height: 1.1;
font-size: 1.1rem;
line-height: 1.22;
}
@media (min-width: 1024px) {

.big-text {
font-size: 1.5rem;
line-height: 1.1;
}
}
.small-text {
font-size: 1.1rem;
@@ -1423,10 +1462,39 @@ a.menuitem:hover {

@media (min-width: 1024px) {

.lg\:static {
position: static;
}

.lg\:col-span-2 {
grid-column: span 2 / span 2;
}

.lg\:row-span-3 {
grid-row: span 3 / span 3;
}

.lg\:float-right {
float: right;
}

.lg\:m-0 {
margin: 0px;
}

.lg\:m-16 {
margin: 4rem;
}

.lg\:m-4 {
margin: 1rem;
}

.lg\:my-8 {
margin-top: 2rem;
margin-bottom: 2rem;
}

.lg\:ml-\[13rem\] {
margin-left: 13rem;
}
@@ -1447,10 +1515,30 @@ a.menuitem:hover {
display: none;
}

.lg\:h-20 {
height: 5rem;
}

.lg\:h-40 {
height: 10rem;
}

.lg\:w-20 {
width: 5rem;
}

.lg\:w-40 {
width: 10rem;
}

.lg\:w-\[12rem\] {
width: 12rem;
}

.lg\:w-\[25rem\] {
width: 25rem;
}

.lg\:w-\[30rem\] {
width: 30rem;
}
@@ -1463,10 +1551,6 @@ a.menuitem:hover {
width: 35rem;
}

.lg\:w-\[25rem\] {
width: 25rem;
}

.lg\:max-w-\[30rem\] {
max-width: 30rem;
}
@@ -1491,6 +1575,22 @@ a.menuitem:hover {
grid-template-rows: auto auto auto;
}

.lg\:flex-row {
flex-direction: row;
}

.lg\:flex-wrap {
flex-wrap: wrap;
}

.lg\:items-center {
align-items: center;
}

.lg\:gap-4 {
gap: 1rem;
}

.lg\:border-r-2 {
border-right-width: 2px;
}
@@ -1504,9 +1604,23 @@ a.menuitem:hover {
padding: 0px;
}

.lg\:py-0 {
padding-top: 0px;
padding-bottom: 0px;
}

.lg\:pr-8 {
padding-right: 2rem;
}

.lg\:text-xl {
font-size: 1.5rem;
line-height: 1.1;
}

.lg\:opacity-100 {
opacity: 1;
}
}

.sr-only{

+ 2
- 2
web/app/templates/about.html View File

@@ -2,7 +2,7 @@

{% block content %}

<div id="about" class="cell-margin text max-w-[65ch]">
<div class="cell-margin text max-w-[65ch] lg:m-16 text-lg lg:text-xl">
{{ about_text|safe }}
</div>

@@ -10,4 +10,4 @@
{{ colophon_text | safe }}
</div>

{% endblock %}
{% endblock %}

+ 222
- 246
web/app/templates/base.html View File

@@ -14,84 +14,74 @@

{% macro view_switch() %}

<div class="flex">
<a
href="{{ url_for(request.endpoint) }}?view=regular{% for key in request.args %}{% if key != 'view' %}&{{ key }}={{ request.args.get(key) }}{% endif %}{% endfor %}"
class="block link flex p-3 gap-2 {% if view != 'list' %} active {% endif %}"
>
<div class="w-5 h-5 inline-block">
<svg width="100%" height="100%" viewBox="0 0 46 36" fill="none" xmlns="http://www.w3.org/2000/svg">
<rect width="21" height="36" fill="black" />
<rect x="27" width="19" height="14" fill="black" />
<rect x="27" y="21" width="19" height="15" fill="black" />
</svg>
</div>
Expanded
</a>
<a
href="{{ url_for(request.endpoint) }}?view=list{% for key in request.args %}{% if key != 'view' %}&{{ key }}={{ request.args.get(key) }}{% endif %}{% endfor %}"
class="block link flex p-3 gap-2 {% if view == 'list' %} active {% endif %}"
>
<div class="w-5 h-5 inline-block ">
<svg width="100%" height="100%" viewBox="0 0 38 36" fill="none" xmlns="http://www.w3.org/2000/svg">
<path d="M0 2H38" stroke="black" stroke-width="2.5" />
<path d="M0 13H38" stroke="black" stroke-width="2.5" />
<path d="M0 24H38" stroke="black" stroke-width="2.5" />
<path d="M0 35H38" stroke="black" stroke-width="2.5" />
</svg>
</div>
List
</a>
</div>
<div class="flex">
<a href="{{ url_for(request.endpoint) }}?view=regular{% for key in request.args %}{% if key != 'view' %}&{{ key }}={{ request.args.get(key) }}{% endif %}{% endfor %}"
class="block link flex p-3 gap-2 {% if view != 'list' %} active {% endif %}">

<div class="w-5 h-5 inline-block">
<svg width="100%" height="100%" viewBox="0 0 46 36" fill="none" xmlns="http://www.w3.org/2000/svg">
<rect width="21" height="36" fill="black" />
<rect x="27" width="19" height="14" fill="black" />
<rect x="27" y="21" width="19" height="15" fill="black" />
</svg>
</div>

Expanded
</a>
<a href="{{ url_for(request.endpoint) }}?view=list{% for key in request.args %}{% if key != 'view' %}&{{ key }}={{ request.args.get(key) }}{% endif %}{% endfor %}"
class="block link flex p-3 gap-2 {% if view == 'list' %} active {% endif %}">
<div class="w-5 h-5 inline-block ">
<svg width="100%" height="100%" viewBox="0 0 38 36" fill="none" xmlns="http://www.w3.org/2000/svg">
<path d="M0 2H38" stroke="black" stroke-width="2.5" />
<path d="M0 13H38" stroke="black" stroke-width="2.5" />
<path d="M0 24H38" stroke="black" stroke-width="2.5" />
<path d="M0 35H38" stroke="black" stroke-width="2.5" />
</svg>

</div>

List
</a>
</div>

{% endmacro %}

{% macro menu(type) %}
<a
class="block menuitem w-48 "
href="{{ url_for('main.index') }}{% if view == 'list' %}?view=list{% endif %}"
@click="menuOpen = false"
><span>Experimental Publishing Compendium <span class="ml-3 inline-block -rotate-12 italic text-[#f52d2d]" style="text-shadow: 0 0 0.4rem white">beta</span></span>
</a>
<a class="block menuitem w-48 " href="{{ url_for('main.index') }}{% if view == 'list' %}?view=list{% endif %}"
@click="menuOpen = false"><span>Experimental Publishing Compendium <span
class="ml-3 inline-block -rotate-12 italic text-[#f52d2d]"
style="text-shadow: 0 0 0.4rem white">beta</span></span>
</a>

<a href="{{ url_for('tool.get_tools') }}{% if view == 'list' %}?view=list{% endif %}"
class="{{ 'active' if request.path == url_for('tool.get_tools') }} menuitem tool medium-title {% if type=='top' %} hidden lg:block {% else %} block {% endif %}"
@click="menuOpen = false"
>
Tools
</a>
<a href="{{ url_for('tool.get_tools') }}{% if view == 'list' %}?view=list{% endif %}"
class="{{ 'active' if request.path == url_for('tool.get_tools') }} menuitem tool medium-title {% if type=='top' %} hidden lg:block {% else %} block {% endif %}"
@click="menuOpen = false">
Tools

<a href="{{ url_for('practice.get_practices') }}{% if view == 'list' %}?view=list{% endif %}"
class="{{ 'active' if request.path == url_for('practice.get_practices') }} menuitem practice medium-title {% if type=='top' %} hidden lg:block {% else %} block {% endif %}"
@click="menuOpen = false"
>
Practices
</a>
</a>

<a href="{{ url_for('book.get_books') }}{% if view == 'list' %}?view=list{% endif %}"
class="{{ 'active' if request.path == url_for('book.get_books') }} menuitem medium-title book block {% if type=='top' %} hidden lg:block {% else %} block {% endif %} "
@click="menuOpen = false"
>
Books
</a>
<a href="{{ url_for('practice.get_practices') }}{% if view == 'list' %}?view=list{% endif %}"
class="{{ 'active' if request.path == url_for('practice.get_practices') }} menuitem practice medium-title {% if type=='top' %} hidden lg:block {% else %} block {% endif %}"
@click="menuOpen = false">
Practices

<a href="{{ url_for('main.about') }}{% if view == 'list' %}?view=list{% endif %}"
class="{{ 'active' if request.path == url_for('main.about') }} menuitem mr-auto {% if type=='top' %} hidden lg:block {% else %} block {% endif %}"
@click="menuOpen = false"
>
About / <br> Contact
</a>
</a>

<a href="{{ url_for('book.get_books') }}{% if view == 'list' %}?view=list{% endif %}"
class="{{ 'active' if request.path == url_for('book.get_books') }} menuitem medium-title book block {% if type=='top' %} hidden lg:block {% else %} block {% endif %} "
@click="menuOpen = false">
Books

<!-- <div class="ml-auto mr-2">
</a>

<a href="{{ url_for('main.about') }}{% if view == 'list' %}?view=list{% endif %}"
class="ml-auto {{ 'active' if request.path == url_for('main.about') }} menuitem {% if type=='top' %} hidden lg:block {% else %} block {% endif %}"
@click="menuOpen = false">
About / <br> Contact

</a>

<!-- <div class="ml-auto mr-2">
{% if current_user.is_authenticated %}
<a href="{{ url_for('create.create_resource') }}" class="block link">
Add resource
@@ -117,67 +107,69 @@
{% endif %}
</div> -->

<form action="{{ url_for('search.basic_search') }}" class="hidden lg:block">
<label id="search-label" for="siteSearch" class="sr-only">Search</label>
<input type="text" name="query" class="text-center h-full text-base border-l-2 border-black pl-1" aria-labelledby="search-label"
placeholder="Search">
<input class="hidden" type="submit" value="Enter search" hidden />
</form>
<form action="{{ url_for('search.basic_search') }}" class="hidden lg:block">
<label id="search-label" for="siteSearch" class="sr-only">Search</label>
<input type="text" name="query" class="text-center h-full text-base border-l-2 border-black pl-1" aria-labelledby="search-label"
placeholder="Search" hx-get="{{ url_for('search.basic_search') }}"
hx-trigger="keyup changed delay:500ms, search" hx-target="main" hx-select="main">
<input class="hidden" type="submit" hidden />
</form>

{% endmacro %}

{% macro relationships_links(resource) %}

{% if resource.tools %}
<div class="">
<div class="px-4 mt-16 lg:mt-0">
Tools
</div>
{% for tool in resource.tools %}
<div class="cell">
{{ resource_lead(tool,size=2) }}
</div>
{% endfor %}
{% if resource.tools %}
<div class="">
<div class="px-4 mt-16 lg:mt-0">
Tools
</div>
{% endif %}
{% if resource.books %}
<div class="">
<div class="px-4 mt-16 lg:mt-0">
Books
</div>
{% for book in resource.books %}
<div class="cell">
{{ resource_lead(book,size=2) }}
</div>
{% endfor %}
{% for tool in resource.tools %}
<div class="cell">
{{ resource_lead(tool,size=2) }}
</div>
{% endif %}
{% if resource.practices %}
<div class="">
<div class="px-4 mt-16 lg:mt-0">
Practices
</div>
{% for practice in resource.practices %}
<div class="cell">
{{ resource_lead(practice,size=2) }}
</div>
{% endfor %}
{% endfor %}

</div>
{% endif %}
{% if resource.books %}
<div class="">
<div class="px-4 mt-16 lg:mt-0">
Books
</div>
{% endif %}

{% for book in resource.books %}
<div class="cell">
{{ resource_lead(book,size=2) }}
</div>
{% endfor %}
</div>
{% endif %}
{% if resource.practices %}
<div class="">
<div class="px-4 mt-16 lg:mt-0">
Practices
</div>

{% for practice in resource.practices %}
<div class="cell">
{{ resource_lead(practice,size=2) }}
</div>
{% endfor %}
</div>
{% endif %}

{% endmacro %}

{% macro resource_list(resource, loop, show_number=true) %}
<div class="border-b-2 border-black">
<a class="flex gap-4 h-full py-1 hover:opacity-60 transition-opacity cursor-pointer size-{{ size }}" {% if
<a class="flex gap-6 h-full py-2 hover:opacity-60 transition-opacity cursor-pointer size-{{ size }}" {% if
resource['type']=='book' %} href="{{ url_for('book.show_book', book_id=resource['id']) }}" {% endif %} {% if
resource['type']=='tool' %} href="{{ url_for('tool.show_tool', tool_id=resource['id']) }}" {% endif %} {% if
resource['type']=='practice' %} href="{{ url_for('practice.show_practice', practice_id=resource['id']) }}" {% endif
%} hx-target="#modal-content" hx-select="main" hx-swap="innerHTML" @click="openModal()">
resource['type']=='practice' %} href="{{ url_for('practice.show_practice', practice_id=resource['id']) }}" {%
endif %} hx-target="#modal-content" hx-select="main" hx-swap="innerHTML" @click="openModal()">

<div class="w-[4rem] shrink-0 lg:w-[12rem] text-center ">
<div class="w-[4.5rem] shrink-0 lg:w-[12rem] text-center ">
{% if show_number %}
{{loop.index}} / {{count}}
{% else %}
@@ -186,12 +178,14 @@
</div>


<div>
<span class="{{ resource.type }}">
<div class="">
<span class="{{ resource.type }} lg:text-xl pr-4">
{{ resource.name }}
</span>
{% if resource['year'] %}
<div class="">
{{ resource['year'] }}{% if resource['author'] %}, {{ resource['author'] }}{% endif%}
</div>
{% endif %}
</div>
</a>
@@ -199,126 +193,113 @@
{% endmacro %}

{% macro resource_with_related(resource, loop, show_number=true) %}
<div class="w-full border-b-2 border-black fade-right">
<div class="content w-full py-8 overflow-x-auto">
<div class="grid lg:grid-rows-[auto,auto,auto] grid-flow-col w-fit pr-40 " >
<div class="w-[4rem] shrink-0 lg:w-[12rem] text-center px-2 py-4 ">
{% if show_number %}
<p>{{loop.index}} / {{count}}</p>
{% else %}
<p class="capitalize">{{ resource['type'] }}</p>
{% endif %}
<div class="w-full border-b-2 border-black fade-right">
<div class="content w-full py-8 overflow-x-auto">
<div class="grid lg:grid-rows-[auto,auto,auto] grid-flow-col w-fit pr-40 ">
<div class="w-[4.5rem] shrink-0 lg:w-[12rem] text-center px-2 py-4 ">
{% if show_number %}
<p>{{loop.index}} / {{count}}</p>
{% else %}
<p class="capitalize">{{ resource['type'] }}</p>
{% endif %}
</div>
<div class="cell w-[12rem] lg:w-[32rem] row-start-1 lg:row-span-3">
{{ resource_lead(resource) }}
</div>

{% if resource.tools %}
<div class="grid lg:grid-rows-1 grid-flow-col w-fit h-fit ">
<div class="related">
Related<br>Tools
</div>
<div class="cell w-[20rem] lg:w-[32rem] row-start-1 lg:row-span-3">
{{ resource_lead(resource) }}
{% for tool in resource.tools %}
<div class="cell w-[12rem] lg:w-[30rem]">
{{ resource_lead(tool,size=2) }}
</div>
{% if resource.tools %}
<div class="grid lg:grid-rows-1 grid-flow-col w-fit h-fit">
<div class="related">
Related<br>Tools
</div>
{% for tool in resource.tools %}
<div class="cell w-[20rem] lg:w-[30rem]">
{{ resource_lead(tool,size=2) }}
</div>
{% endfor %}
{% endfor %}
</div>
{% endif %}

{% if resource.books %}
<div class="grid grid-rows-1 grid-flow-col w-fit h-fit">
<div class="related">
Related<br>Books
</div>
{% endif %}
{% if resource.books %}
<div class="grid grid-rows-1 grid-flow-col w-fit h-fit">
<div class="related">
Related<br>Books
</div>
{% for book in resource.books %}
<div class="cell w-[20] lg:w-[35rem]">
{{ resource_lead(book,size=2) }}
</div>
{% endfor %}
{% for book in resource.books %}
<div class="cell w-[12rem] lg:w-[35rem]">
{{ resource_lead(book,size=2) }}
</div>
{% endif %}
{% if resource.practices %}
<div class="grid grid-rows-1 grid-flow-col w-fit h-fit">
<div class="related">
Related<br>Practices
</div>
{% for practice in resource.practices %}
<div class="cell w-[20rem] lg:w-[25rem]">
{{ resource_lead(practice,size=2) }}
</div>
{% endfor %}
{% endfor %}
</div>
{% endif %}

{% if resource.practices %}
<div class="grid grid-rows-1 grid-flow-col w-fit h-fit">
<div class="related">
Related<br>Practices
</div>
{% endif %}
{% for practice in resource.practices %}
<div class="cell w-[12rem] lg:w-[25rem]">
{{ resource_lead(practice,size=2) }}
</div>
{% endfor %}
</div>
{% endif %}

</div>
</div>
</div>
{% endmacro %}

{% macro popup_link(title,url) %}
<a href="{{ url }}" class="nav-link">
{{ title }}
</a>
<a href="{{ url }}" class="nav-link">
{{ title }}
</a>
{% endmacro %}

{% macro resource_lead(resource,size=1) %}
<a
class="block h-full hover:opacity-60 transition-opacity cursor-pointer size-{{ size }}"

{% if resource['type'] == 'book' %}
href="{{ url_for('book.show_book', book_id=resource['id']) }}"
{% endif %}
{% if resource['type'] == 'tool' %}
href="{{ url_for('tool.show_tool', tool_id=resource['id']) }}"
{% endif %}
{% if resource['type'] == 'practice' %}
href="{{ url_for('practice.show_practice', practice_id=resource['id']) }}"
{% endif %}
hx-target="#modal-content"
hx-select="main"
hx-swap="innerHTML"
<a class="block lead-inner-link overflow-hidden h-full hover:opacity-60 transition-opacity cursor-pointer size-{{ size }}"
{% if resource['type']=='book' %} href="{{ url_for('book.show_book', book_id=resource['id']) }}" {% endif %} {% if
resource['type']=='tool' %} href="{{ url_for('tool.show_tool', tool_id=resource['id']) }}" {% endif %} {% if
resource['type']=='practice' %} href="{{ url_for('practice.show_practice', practice_id=resource['id']) }}" {% endif
%} hx-target="#modal-content" hx-select="main" hx-swap="innerHTML" @click="openModal()">

{% if (resource.type == 'book') and (resource.references) %}
<img class="w-14 h-14 lg:w-20 lg:h-20 object-contain lg:float-right absolute opacity-40 lg:opacity-100 lg:static top-0 right-0 m-1 lg:m-4 grayscale rotate-[15deg]"
src="{{resource.references}}" alt="cover for {{ resource.name }}">
{% endif %}

@click="openModal()"
>
<h2 class="{{ resource['type'] }} {% if size==1 %} big-title {% else %} small-title {% endif %} mb-2">{{
resource['name'] }}</h2>

{% if (resource.type == 'book') and (resource.references) %}
<img class="w-20 h-20 object-contain float-right m-4 grayscale rotate-[15deg]" src="{{resource.references}}" alt="cover for {{ resource.name }}">
{% endif %}
<h2 class="{{ resource['type'] }} {% if size==1 %} big-title {% else %} small-title {% endif %} mb-2">{{ resource['name'] }}</h2>
{% if resource['year'] %}
<div class="text-sm">
{{ resource['year'] }}{% if resource['author'] %}, {{ resource['author'] }}{% endif%}
</div>
{% endif %}
{% if resource['year'] %}
<div class="text-sm">
{{ resource['year'] }}{% if resource['author'] %}, {{ resource['author'] }}{% endif%}
</div>
{% endif %}

<div class="{% if size==1 %} big-text {% else %} small-text {% endif %} mb-[1em]">
{{ resource['description'] | truncate(150) | safe }}
</div>
<div class="{% if size==1 %} big-text {% else %} small-text {% endif %} mb-[1em]">
{{ resource['description'] | truncate(150) | safe }}
</div>

</a>
{% if current_user.is_authenticated %}
<div class="">
{% if resource['type'] == 'tool' %}
<a href="{{ url_for('tool.edit_tool', tool_id=resource['id']) }}">
<span class="absolute top-0 left-0 text-xs">Edit</span>
</a>
{% elif resource['type'] == 'practice' %}
<a href="{{ url_for('practice.edit_practice', practice_id=resource['id']) }}">
<span class="absolute top-0 left-0 text-xs">Edit</span>
</a>
{% elif resource['type'] == 'book' %}
<a href="{{ url_for('book.edit_book', book_id=resource['id']) }}">
<span class="absolute top-0 left-0 text-xs">Edit</span>
</a>
{% endif %}
</div>
{% endif %}
</a>
{% if current_user.is_authenticated %}
<div class="">
{% if resource['type'] == 'tool' %}
<a href="{{ url_for('tool.edit_tool', tool_id=resource['id']) }}">
<span class="absolute top-0 left-0 text-xs">Edit</span>
</a>
{% elif resource['type'] == 'practice' %}
<a href="{{ url_for('practice.edit_practice', practice_id=resource['id']) }}">
<span class="absolute top-0 left-0 text-xs">Edit</span>
</a>
{% elif resource['type'] == 'book' %}
<a href="{{ url_for('book.edit_book', book_id=resource['id']) }}">
<span class="absolute top-0 left-0 text-xs">Edit</span>
</a>
{% endif %}
</div>
{% endif %}
{% endmacro %}


@@ -330,7 +311,7 @@
<meta charset="utf-8">
<meta http-equiv="X-UA-Compatible" content="IE=edge">
<meta name="viewport" content="width=device-width, initial-scale=1">
<title>Experimental Publishing Compendium</title>
<script src="{{ url_for('static',filename='js/alpine.min.js') }}" defer></script>
<script src="{{ url_for('static',filename='js/htmx.min.js') }}"></script>
@@ -385,16 +366,8 @@
</head>


<body
class="text-base overflow-y-scroll"
x-data="base()"
hx-boost="true"
hx-select="#all"
hx-target="#all"
hx-swap="outerHTML"
hx-indicator="body"
>
<body class="text-base overflow-y-scroll" x-data="base()" hx-boost="true" hx-select="#all" hx-target="#all"
hx-swap="outerHTML" hx-indicator="body">
<div id="loading" class="loading pointer-events-none ">
<!-- <div class="bg-white fixed top-0 left-0 w-full h-screen z-20"></div> -->
<div class="bg fixed top-0 left-0 w-full h-screen z-30"></div>
@@ -408,9 +381,9 @@
<div id="all">
<header class="sticky top-0 z-10 bg-white border-b-[2px] border-black flex justify-between w-full">
<nav class=" lg:flex justify-center items-stretch w-full ">
{{ menu('top') }}
</nav>
<div class="burger h-14 cursor-pointer block lg:hidden p-4" @click="menuOpen = true">
<svg width="100%" height="100%" viewBox="0 0 20 18" fill="none" xmlns="http://www.w3.org/2000/svg">
@@ -422,24 +395,24 @@
</div>
</header>

<menu
class="fixed top-0 right-0 z-20 p-8 bg-white w-[calc(100%-2rem)] max-w-[30rem] h-screen"
x-show="menuOpen"
style="box-shadow: 0 0 2rem rgb(0,0,0,0.2);"
@click.outside = "menuOpen = false"
>
<div x-transition.opacity x-show="menuOpen" class="fixed z-20 top-0 left-0 w-full h-screen bg-purple-700/50">
</div>
<menu x-transition.opacity class="fixed top-0 right-0 z-20 bg-white w-[calc(100%-2rem)] max-w-[30rem] h-screen"
x-show="menuOpen" style="box-shadow: 0 0 2rem rgb(0,0,0,0.2);" @click.outside="menuOpen = false">
{{ menu('side') }}
</menu>


<!-- Begin page content -->
<main>
{% with messages = get_flashed_messages() %}
{% if messages %}
<div class="alert alert-danger">
{{ messages[0] }}
</div>
<div class="alert alert-danger">
{{ messages[0] }}
</div>
{% endif %}
{% endwith %}
{% block content %}
@@ -447,13 +420,14 @@
</main>
</div>

<div id="modal" x-show="modalOpen" class="modal h-screen w-full fixed top-0 z-50 p-4 bg overscroll-none">
<div id="modal" x-show="modalOpen" class="modal h-screen w-full fixed top-0 z-50 p-4 bg overscroll-none">
<div class="cross cursor-pointer absolute top-10 right-10 w-10 h-10" @click="hideOverlay()">
<svg width="100%" height="100%" viewBox="0 0 20 20" fill="none" xmlns="http://www.w3.org/2000/svg">
<path d="M2 2L18 18M18 2L2 18" stroke="black" stroke-width="1"></path>
</svg>
</div>
<div id="modal-content" @click.outside="hideOverlay()" x-ref="modal" class="content w-full overflow-y-auto h-full bg-white " >
<div id="modal-content" @click.outside="hideOverlay()" x-ref="modal"
class="content w-full overflow-y-auto h-full bg-white ">

</div>
</div>
@@ -461,11 +435,13 @@
<!-- Sticky footer-->
<footer class="std-margin mt-20 text-sm">
<div class="container">
<span class="">© 2022–{{ moment().format('YYYY') }} <a href="https://copim.ac.uk/">COPIM</a> and licensed under a <a href="https://creativecommons.org/licenses/by/4.0/">Creative Commons Attribution 4.0 International License (CC BY 4.0)</a>.</span>
<span class="">© 2022–{{ moment().format('YYYY') }} <a href="https://copim.ac.uk/">COPIM</a> and licensed
under a <a href="https://creativecommons.org/licenses/by/4.0/">Creative Commons Attribution 4.0
International License (CC BY 4.0)</a>.</span>
</div>
</footer>
<!-- JavaScript -->
<script src="{{ url_for('static',filename='js/main.js') }}"></script>
</body>

</html>
</html>

+ 108
- 108
web/app/templates/book.html View File

@@ -2,135 +2,135 @@

{% block content %}

<div class="cell-margin grid mt-16 lg:grid-cols-2">
<div class="left">
<div class="mb-2">Book</div>
<div class="border-r-2 border-black pr-8">
{% if resource.references %}
<div class="float-right">
<img class="w-40 h-40 object-contain m-16 rotate-[15deg]" src={{ resource.references }} alt="cover for {{ resource['Title'] }}">
<div class="cell-margin grid mt-16 lg:grid-cols-2">

<div class="left">
<div class="mb-2">Book</div>
<div class="lg:border-r-2 border-black pr-8">
{% if resource.references %}
<div class="float-right">
<img class="w-14 h-14 lg:w-40 lg:h-40 object-contain lg:m-16 rotate-[15deg]" src={{ resource.references
}} alt="cover for {{ resource['Title'] }}">
</div>
{% endif %}

<h2 class="book huge-title mb-2 max-w-[30rem]">{% block title %} {{ resource.name }} {% endblock %}</h2>

{% if resource['Year'] %}
{{ resource['Year'] }}
{% endif %}
{% if resource['Authors'] %}
<div class="">
{% if resource['Authors']|length > 1 %}
<div class="">
{% for author in resource['Authors'] %}
{{ author }}</br>
{% endfor %}
</div>
{% else %}
<div>
{% for author in resource['Authors'] %}
{{ author }}
{% endfor %}
</div>
{% endif %}
<h2 class="book huge-title mb-2 max-w-[30rem]">{% block title %} {{ resource.name }} {% endblock %}</h2>
{% if resource['Year'] %}
{{ resource['Year'] }}
{% endif %}
{% if resource['Authors'] %}
</div>
{% endif %}
<div class="">
{% if current_user.is_authenticated %}
<div class="">
{% if resource['Authors']|length > 1 %}
<a href="{{ url_for('book.edit_book', book_id=resource['id']) }}">
<span class="badge bg-dark">Edit</span>
</a>
</div>
{% endif %}

<div class="facts ">

{% if resource['typology'] %}
<div class="">
{% for author in resource['Authors'] %}
{{ author }}</br>
{% endfor %}
</div>
{% else %}
<div>
{% for author in resource['Authors'] %}
{{ author }}
{% endfor %}
<h3>Typology category</h3>
<a href="/books?typology={{ resource['typology'] }}">{{ resource['typology'] }}</a>
</div>
{% endif %}
</div>
{% endif %}
<div class="">
{% if current_user.is_authenticated %}
{% if resource['bookUrl'] %}
<div class="">
<a href="{{ url_for('book.edit_book', book_id=resource['id']) }}">
<span class="badge bg-dark">Edit</span>
</a>
<h3>URL</h3>
<a target="_blank" href="{{ resource['bookUrl'] }}">{{ resource['bookUrl'] }}</a>
</div>
{% endif %}
<div class="facts ">
{% if resource['typology'] %}
<div class="">
<h3>Typology category</h3>
<a href="/books?typology={{ resource['typology'] }}">{{ resource['typology'] }}</a>
</div>
{% endif %}
{% if resource['bookUrl'] %}
<div class="">
<h3>URL</h3>
<a target="_blank" href="{{ resource['bookUrl'] }}">{{ resource['bookUrl'] }}</a>
</div>
{% endif %}
<!-- fields for books from isbntools -->
{% if resource['ISBN-13'] %}
<div class="">
<h3>
ISBN-13
</h3>
<div>
{{ resource['ISBN-13'] }}
</div>
<!-- fields for books from isbntools -->
{% if resource['ISBN-13'] %}
<div class="">
<h3>
ISBN-13
</h3>
<div>
{{ resource['ISBN-13'] }}
</div>
{% endif %}
{% if resource['Publisher'] %}
<div class="">
<h3>
Publisher
</h3>
<div>
{{ resource['Publisher'] }}
</div>
</div>
{% endif %}
{% if resource['Publisher'] %}
<div class="">
<h3>
Publisher
</h3>
<div>
{{ resource['Publisher'] }}
</div>
{% endif %}
<!-- fields for books from database -->
{% if resource['name'] %}
<!-- <div class="">
</div>
{% endif %}
<!-- fields for books from database -->
{% if resource['name'] %}
<!-- <div class="">
<h3>Title</h3>
<div class="">{{ resource['name'] }}</div>
</div> -->
{% endif %}
{% if resource['author'] %}
<div class="">
<h3>Author</h3>
<div class="">{{ resource['author'] }}</div>
</div>
{% endif %}
{% if resource['year'] %}
<div class="">
<h3>Publication year</h3>
<div>
{{ resource['year'] }}
</div>
</div>
{% endif %}
{% if resource['desc'] %}
<div class="col-span-2">
<h3>Publisher's description</h3>
<div class="">{{ resource['desc'] }}</div>
{% endif %}
{% if resource['author'] %}
<div class="">
<h3>Author</h3>
<div class="">{{ resource['author'] }}</div>
</div>
{% endif %}
{% if resource['year'] %}
<div class="">
<h3>Publication year</h3>
<div>
{{ resource['year'] }}
</div>
{% endif %}
{% if resource['description'] %}
<div class="col-span-2">
<h3>
Experimental aspects:
</h3>
<div>
{{ resource['description']|safe }}
</div>
</div>
{% endif %}
{% if resource['desc'] %}
<div class="lg:col-span-2">
<h3>Publisher's description</h3>
<div class="">{{ resource['desc'] }}</div>
</div>
{% endif %}

{% if resource['description'] %}
<div class="lg:col-span-2">
<h3>
Experimental aspects:
</h3>
<div>
{{ resource['description']|safe }}
</div>
{% endif %}
</div>
{% endif %}
</div>
</div>
</div>
<div class="right p-4 pr-8 lg:p-0">
<div class="grid lg:grid-cols-2">
{{ relationships_links(resource) }}
</div>
</div>
<div class="right p-4 pr-8 lg:p-0">
<div class="grid lg:grid-cols-2">
{{ relationships_links(resource) }}
</div>
</div>

{% endblock %}
</div>

{% endblock %}

+ 2
- 2
web/app/templates/index.html View File

@@ -4,12 +4,12 @@
<div class="">

<div class="border-b-2 border-black grid gap-8 lg:grid-cols-[52rem,30rem] content-start">
<div class="mx-2 lg:ml-[13rem] text my-8 meta max-w-[30rem]">
<div class="mx-4 lg:ml-[13rem] text my-4 lg:my-8 meta max-w-[30rem]">
{{ text|safe }}
</div>
</div>

<div class="flex gap-4 items-center min-h-[2rem] mb-8 mb-8 border-b-2 border-black ">
<div class="flex gap-4 items-center min-h-[2rem] mb-8 border-b-2 border-black ">
{{ view_switch() }}
</div>


+ 72
- 72
web/app/templates/resource.html View File

@@ -9,27 +9,27 @@
<div class="mb-4 capitalize">{{ resource['type'] }}</div>
<div class="lg:border-r-2 lg:border-black lg:pr-8">
<h2 class="block-margin huge-title {{ resource['type'] }}">
{% block title %}
{% block title %}
{% autoescape false %}
{{ resource['name'] | replace(" ","<br>") }}
{{ resource['name'] | replace(" ","<br>") }}
{% endautoescape %}
{% endblock %}
</h2>
{% if current_user.is_authenticated %}
{% if resource['type'] == 'tool' %}
<div class="row text-center py-3">
<a href="{{ url_for('tool.edit_tool', tool_id=resource['id']) }}">
<span class="">Edit</span>
</a>
</div>
{% elif resource['type'] == 'practice' %}
<div class="row text-center py-3">
<a href="{{ url_for('practice.edit_practice', practice_id=resource['id']) }}">
<span class="">Edit</span>
</a>
</div>
{% endif %}
{% if resource['type'] == 'tool' %}
<div class="row text-center py-3">
<a href="{{ url_for('tool.edit_tool', tool_id=resource['id']) }}">
<span class="">Edit</span>
</a>
</div>
{% elif resource['type'] == 'practice' %}
<div class="row text-center py-3">
<a href="{{ url_for('practice.edit_practice', practice_id=resource['id']) }}">
<span class="">Edit</span>
</a>
</div>
{% endif %}
{% endif %}
<div class="facts">
{% if resource['description'] %}
@@ -40,92 +40,92 @@
{% endif %}
<!-- fields for tools -->
{% if resource['developer'] %}
<div class="">
<h3>Developer</h3>
{% if resource['developerUrl'] %}
<a href="{{ resource['developerUrl'] }}">{{ resource['developer'] }}</a>
{% else %}
{{ resource['developer'] }}
{% endif %}
</div>
<div class="">
<h3>Developer</h3>
{% if resource['developerUrl'] %}
<a href="{{ resource['developerUrl'] }}">{{ resource['developer'] }}</a>
{% else %}
{{ resource['developer'] }}
{% endif %}
</div>
{% endif %}
{% if resource['license'] %}
<div class="">
<h3>Software license</h3>
{{ resource['license'] }}
</div>
<div class="">
<h3>Software license</h3>
{{ resource['license'] }}
</div>
{% endif %}
{% if resource['scriptingLanguage'] %}
<div class="">
<h3>Software language(s)</h3>
{{ resource['scriptingLanguage'] }}
</div>
<div class="">
<h3>Software language(s)</h3>
{{ resource['scriptingLanguage'] }}
</div>
{% endif %}
{% if resource['projectUrl'] %}
<div class="">
<h3>Project page</h3>
<a href="{{ resource['projectUrl'] }}">{{ resource['projectUrl'] }}</a>
</div>
<div class="">
<h3>Project page</h3>
<a href="{{ resource['projectUrl'] }}">{{ resource['projectUrl'] }}</a>
</div>
{% endif %}
{% if resource['repositoryUrl'] %}
<div class="">
<h3>Code repository</h3>
<a href="{{ resource['repositoryUrl'] }}">{{ resource['repositoryUrl'] }}</a>
</div>
<div class="">
<h3>Code repository</h3>
<a href="{{ resource['repositoryUrl'] }}">{{ resource['repositoryUrl'] }}</a>
</div>
{% endif %}
{% if resource['ingestFormats'] %}
<div class="">
<h3>Import / ingest formats</h3>
{{ resource['ingestFormats'] }}
</div>
<div class="">
<h3>Import / ingest formats</h3>
{{ resource['ingestFormats'] }}
</div>
{% endif %}
{% if resource['outputFormats'] %}
<div class="">
<h3>Output formats</h3>
{{ resource['outputFormats'] }}
</div>
<div class="">
<h3>Output formats</h3>
{{ resource['outputFormats'] }}
</div>
{% endif %}
{% if resource['status'] %}
<div class="">
<h3>Platform status</h3>
{{ resource['status'] }}
</div>
<div class="">
<h3>Platform status</h3>
{{ resource['status'] }}
</div>
{% endif %}
<!-- fields for practices -->
{% if resource['longDescription'] %}
<div class="col-span-2">
<h3>Full description</h3>
{{ resource['longDescription']|safe }}
</div>
<div class="lg:col-span-2">
<h3>Full description</h3>
{{ resource['longDescription']|safe }}
</div>
{% endif %}
{% if resource['experimental'] %}
<div class="col-span-2">
<h3>Experimental uses</h3>
{{ resource['experimental']|safe }}
</div>
<div class="lg:col-span-2">
<h3>Experimental uses</h3>
{{ resource['experimental']|safe }}
</div>
{% endif %}
{% if resource['considerations'] %}
<div class="col-span-2">
<h3>Considerations</h3>
<p>{{ resource['considerations']|safe }}</p>
</div>
<div class="lg:col-span-2">
<h3>Considerations</h3>
<p>{{ resource['considerations']|safe }}</p>
</div>
{% endif %}
{% if resource['references'] %}
<div class="col-span-2">
<h3> Further reading </h3>
<p>{{ resource['references']|safe }}</p>
</div>
<div class="lg:col-span-2">
<h3> Further reading </h3>
<p>{{ resource['references']|safe }}</p>
</div>
{% endif %}
</div>
</div>
</div>
<div class="right p-4 pr-8 lg:p-0 ">
<div class="grid lg:grid-cols-2">
{{ relationships_links(resource) }}
</div>
</div>
</div>
{% endblock %}
{% endblock %}

+ 41
- 63
web/app/templates/resources.html View File

@@ -20,75 +20,53 @@


{% macro filter_dropdown(id, filter, plural='') %}
<select
name="{{ id }}"
>
<option
value=""
{% if request.args.get(id, '' )=='' %} selected {% endif %}
>
{% if plural != '' %}
{{ plural }}
{% else %}
<span class="capitalize bg-red-400">{{ id }}s</span>
{% endif%}
</option>
{% for thing in filter %}
<option
value="{{ thing[0] }}"
{% if request.args.get(id)==thing[0]|string %} selected {% endif %}
>
{{ thing[1] }}
</option>
{% endfor %}
</select>
<select name="{{ id }}">
<option value="" {% if request.args.get(id, '' )=='' %} selected {% endif %}>
{% if plural != '' %}
{{ plural }}
{% else %}
<span class="capitalize bg-red-400">{{ id }}s</span>
{% endif%}
</option>
{% for thing in filter %}
<option value="{{ thing[0] }}" {% if request.args.get(id)==thing[0]|string %} selected {% endif %}>
{{ thing[1] }}
</option>
{% endfor %}
</select>
{% endmacro%}

{% macro filter_dropdown_nokey(id, filter, plural='') %}
<select
name="{{ id }}"
>
<option
value=""
{% if request.args.get(id, '' ) == '' %} selected {% endif %}
>
{% if plural != '' %}
{{ plural }}
{% else %}
<span class="capitalize">{{ id }}s</span>
{% endif%}
</option>
{% for thing in filter %}
<option
value="{{ thing }}"
{% if request.args.get(id)==thing|string %} selected {% endif %}
>
{{ thing }}
</option>
{% endfor %}
</select>
<select name="{{ id }}">
<option value="" {% if request.args.get(id, '' )=='' %} selected {% endif %}>
{% if plural != '' %}
{{ plural }}
{% else %}
<span class="capitalize">{{ id }}s</span>
{% endif%}
</option>
{% for thing in filter %}
<option value="{{ thing }}" {% if request.args.get(id)==thing|string %} selected {% endif %}>
{{ thing }}
</option>
{% endfor %}
</select>
{% endmacro%}

<div class="border-b-2 border-black grid lg:grid-cols-[52rem,30rem] content-start">
<div class="mx-2 lg:ml-[13rem] text my-8 meta lg:max-w-[30rem]">
{{ intro_text|safe }}
</div>
</div>

<form
action="{{ url_for(request.endpoint )}}"
method="GET"
<div class="border-b-2 border-black grid lg:grid-cols-[52rem,30rem] content-start">
<div class="mx-4 lg:ml-[13rem] text my-4 lg:my-8 meta lg:max-w-[30rem]">
{{ intro_text|safe }}
</div>
</div>

hx-trigger="change"
hx-push-url="true"
<form action="{{ url_for(request.endpoint )}}" method="GET" hx-trigger="change" hx-push-url="true">
<input type="hidden" name="view" value="{{ view }}">
<div
class="flex p-4 lg:p-0 flex-col items-start lg:items-center lg:flex-row lg:flex-wrap gap-2 lg:gap-4 min-h-[2rem] mb-8 border-b-2 border-black ">

>
<input type="hidden" name="view" value="{{ view }}">
<div class="flex flex-wrap gap-4 items-center min-h-[2rem] mb-8 border-b-2 border-black ">
{{ view_switch() }}
<div class="-m-4 mb-4 lg:m-0">
{{ view_switch() }}
</div>
{% if practices_filter%}
{{ filter_dropdown('practice', practices_filter, 'Practices') }}
@@ -125,6 +103,6 @@
{% endif %}
</div>

</form>
</form>

{% endblock %}

Write Preview
Loading…
Cancel
Save