mirror of
https://github.com/safing/web
synced 2025-09-02 11:09:03 +00:00
Set up project table cards to show variable content
This commit is contained in:
davegson
parent
4ec8cabca9
commit
94daefc8fa
2 changed files with 84 additions and 58 deletions
|
|
@ -2,8 +2,8 @@
|
||||||
<div class="block shadowthing px-8 py-6 rounded-lg">
|
<div class="block shadowthing px-8 py-6 rounded-lg">
|
||||||
<div class="tabs">
|
<div class="tabs">
|
||||||
<div class="tab relative">
|
<div class="tab relative">
|
||||||
<input class="dropinput" type="checkbox" id="chck1">
|
<input class="dropinput" type="checkbox" id="tablecard-{{ include.state }}-{{ forloop.index }}">
|
||||||
<label style="min-width: 100%; min-height: 115px; display: block;" class="z-10 absolute cursor-pointer" for="chck1">
|
<label style="min-width: 100%; min-height: 115px; display: block;" class="z-10 absolute cursor-pointer" for="tablecard-{{ include.state }}-{{ forloop.index }}">
|
||||||
<img class="absolute right-0" style="margin-right: 1rem; margin-top: 1.2rem;" id="icon" src="{{ site.assets_url }}/icons/arrow.svg" alt="">
|
<img class="absolute right-0" style="margin-right: 1rem; margin-top: 1.2rem;" id="icon" src="{{ site.assets_url }}/icons/arrow.svg" alt="">
|
||||||
</label>
|
</label>
|
||||||
<div class="flex relative ">
|
<div class="flex relative ">
|
||||||
|
|
@ -11,35 +11,51 @@
|
||||||
<div class="absolute right-0 mr-12 transform scale-110">
|
<div class="absolute right-0 mr-12 transform scale-110">
|
||||||
<div class="flex-shrink-0 mt-0">
|
<div class="flex-shrink-0 mt-0">
|
||||||
<div class="flex overflow-hidden">
|
<div class="flex overflow-hidden">
|
||||||
<img class="inline-block h-6 w-6 rounded-full text-white shadow-solid border-2 border-white" src="http://localhost:4000/assets/img/profiles/raphael.png" alt="">
|
{% for member in card.team %}
|
||||||
<img class="-ml-1 inline-block h-6 w-6 rounded-full text-white shadow-solid border-2 border-white" src="http://localhost:4000/assets/img/profiles/daniel.png" alt="">
|
<img class="inline-block h-6 w-6 rounded-full text-white shadow-solid border-2 border-white" src="{{ site.img_url }}profiles/{{ member | downcase }}.png" alt="{{ member }}">
|
||||||
<img class="-ml-1 inline-block h-6 w-6 rounded-full text-white shadow-solid border-2 border-white" src="http://localhost:4000/assets/img/profiles/patrick.png" alt="">
|
{% endfor %}
|
||||||
<!-- <img class="-ml-1 inline-block h-6 w-6 rounded-full text-white shadow-solid border-2 border-white" src="http://localhost:4000/assets/img/profiles/tabitha.png" alt="">
|
|
||||||
<img class="-ml-1 inline-block h-6 w-6 rounded-full text-white shadow-solid border-2 border-white" src="http://localhost:4000/assets/img/profiles/luke.png" alt="">
|
|
||||||
<img class="-ml-1 inline-block h-6 w-6 rounded-full text-white shadow-solid border-2 border-white" src="http://localhost:4000/assets/img/profiles/alex.png" alt="">
|
|
||||||
<img class="-ml-1 inline-block h-6 w-6 rounded-full text-white shadow-solid border-2 border-white" src="http://localhost:4000/assets/img/profiles/martin.png" alt="">
|
|
||||||
<img class="-ml-1 inline-block h-6 w-6 rounded-full text-white shadow-solid border-2 border-white" src="http://localhost:4000/assets/img/profiles/david.png" alt=""> -->
|
|
||||||
</div>
|
</div>
|
||||||
</div>
|
</div>
|
||||||
</div>
|
</div>
|
||||||
</div>
|
</div>
|
||||||
<div>
|
<div>
|
||||||
<div class="flex">
|
<div class="flex">
|
||||||
<span class="inline-flex items-center px-3 py-1 rounded-full text-sm font-medium leading-5 bg-blue-100 text-blue-800 mr-2">
|
{% for tag in card.projects %}
|
||||||
Portmaster
|
{% assign tag_bg_strength = 100 %}
|
||||||
</span>
|
|
||||||
<span class="inline-flex items-center px-3 py-1 rounded-full text-sm font-medium leading-5 bg-green-100 text-green-800 mr-2">
|
{% if tag == 'Portmaster' %}
|
||||||
Spn
|
{% assign tag_color = 'blue' %}
|
||||||
|
{% elsif tag == 'SPN' %}
|
||||||
|
{% assign tag_color = 'green' %}
|
||||||
|
{% elsif tag == 'Website' %}
|
||||||
|
{% assign tag_color = 'pink' %}
|
||||||
|
{% elsif tag == 'Backoffice' %}
|
||||||
|
{% assign tag_color = 'gray' %}
|
||||||
|
{% assign tag_bg_strength = 200 %}
|
||||||
|
{% elsif tag == 'Community' %}
|
||||||
|
{% assign tag_color = 'purple' %}
|
||||||
|
{% elsif tag == 'Marketing' %}
|
||||||
|
{% assign tag_color = 'orange' %}
|
||||||
|
{% endif %}
|
||||||
|
|
||||||
|
<span class="inline-flex items-center px-3 py-1 rounded-full text-sm font-medium leading-5 bg-{{ tag_color }}-{{ tag_bg_strength }} text-{{ tag_color }}-800 mr-2">
|
||||||
|
{{ tag }}
|
||||||
</span>
|
</span>
|
||||||
|
{% endfor %}
|
||||||
</div>
|
</div>
|
||||||
<div class="flex pt-3 items-center">
|
<div class="flex pt-3 items-center">
|
||||||
<div>
|
<div>
|
||||||
|
{% if include.state == 'done' %}
|
||||||
<img style="min-width: 19px;" src="{{ site.assets_url }}icons/tick.svg" alt="">
|
<img style="min-width: 19px;" src="{{ site.assets_url }}icons/tick.svg" alt="">
|
||||||
<!-- cross <img style="min-width: 19px;" src="{{ site.assets_url }}icons/cross.svg" alt=""> -->
|
{% elsif include.state == 'in_progress' %}
|
||||||
<!-- cross <img style="min-width: 19px;" src="{{ site.assets_url }}icons/files.svg" alt=""> -->
|
<img style="min-width: 19px;" src="{{ site.assets_url }}icons/cog.svg" alt="">
|
||||||
<!-- cog <img style="min-width: 19px;" src="{{ site.assets_url }}icons/cog.svg" alt=""> -->
|
{% elsif include.state == 'discarded' %}
|
||||||
|
<img style="min-width: 19px;" src="{{ site.assets_url }}icons/cross.svg" alt="">
|
||||||
|
{% elsif include.state == 'backlog' %}
|
||||||
|
<img style="min-width: 19px;" src="{{ site.assets_url }}icons/files.svg" alt="">
|
||||||
|
{% endif %}
|
||||||
</div>
|
</div>
|
||||||
<h1 class="pl-3 font-bold text-lg">SPN Community Node Support will be releaced</h1>
|
<h1 class="pl-3 font-bold text-lg">{{ card.title }}</h1>
|
||||||
</div>
|
</div>
|
||||||
</div>
|
</div>
|
||||||
</div>
|
</div>
|
||||||
|
|
@ -47,8 +63,8 @@
|
||||||
<div class="block py-3">
|
<div class="block py-3">
|
||||||
<hr>
|
<hr>
|
||||||
<div class="tab relative" id="tabtwo">
|
<div class="tab relative" id="tabtwo">
|
||||||
<input class="dropinput" type="checkbox" id="chck2">
|
<input class="dropinput" type="checkbox" id="tablecard-description-{{ include.state }}-{{ forloop.index }}">
|
||||||
<label style="min-width: 100%; min-height: 115px; display: block;" class="z-10 absolute" for="chck2">
|
<label style="min-width: 100%; min-height: 115px; display: block;" class="z-10 absolute" for="tablecard-description-{{ include.state }}-{{ forloop.index }}">
|
||||||
<img class="absolute right-0" style="margin-right: 1rem; margin-top: 0.5rem;" id="icontwo" src="{{ site.assets_url }}/icons/arrow.svg" alt="">
|
<img class="absolute right-0" style="margin-right: 1rem; margin-top: 0.5rem;" id="icontwo" src="{{ site.assets_url }}/icons/arrow.svg" alt="">
|
||||||
</label>
|
</label>
|
||||||
<div class="flex relative">
|
<div class="flex relative">
|
||||||
|
|
@ -66,11 +82,10 @@
|
||||||
</div>
|
</div>
|
||||||
</div>
|
</div>
|
||||||
<div style="padding-left: 3; padding-right: 1em; padding-top: 0;" class="tab-content text-md">
|
<div style="padding-left: 3; padding-right: 1em; padding-top: 0;" class="tab-content text-md">
|
||||||
<p class="">
|
<p>
|
||||||
All details will be finished to fully support community
|
{% for paragraph in card.description %}
|
||||||
nodes in the network. (This does not include the planned
|
{{ paragraph }}
|
||||||
compensation for running a node.) There will be a website
|
{% endfor %}
|
||||||
to easily get you started.
|
|
||||||
</p>
|
</p>
|
||||||
</div>
|
</div>
|
||||||
</div>
|
</div>
|
||||||
|
|
|
||||||
|
|
@ -26,36 +26,47 @@ layout: page
|
||||||
</div>
|
</div>
|
||||||
</div>
|
</div>
|
||||||
<div class="pt-24">
|
<div class="pt-24">
|
||||||
|
{% if site.data.next.cards.done.size > 0 %}
|
||||||
<div class="pt-12">
|
<div class="pt-12">
|
||||||
<div style="max-width: 750px; margin-top: 3rem; margin: auto;">
|
<div style="max-width: 750px; margin-top: 3rem; margin: auto;">
|
||||||
<h3 >Completed</h3>
|
<h3 >Completed</h3>
|
||||||
<p>This is a list of the tasks we have completed in this month time frame. If you wish to find more about each task, click them have a read.</p>
|
<p>This is a list of the tasks we have completed in this month time frame. If you wish to find more about each task, click them have a read.</p>
|
||||||
</div>
|
</div>
|
||||||
<div class="pt-10 gridwrapper">
|
<div class="pt-10 gridwrapper">
|
||||||
{% include project_tablecard.html %}
|
{% for card in site.data.next.cards.done %}
|
||||||
{% include project_tablecard.html %}
|
{% include project_tablecard.html state = 'done' %}
|
||||||
{% include project_tablecard.html %}
|
{% endfor %}
|
||||||
</div>
|
</div>
|
||||||
</div>
|
</div>
|
||||||
|
{% endif %}
|
||||||
|
|
||||||
|
{% if site.data.next.cards.in_progress.size > 0 %}
|
||||||
<div class="pt-12">
|
<div class="pt-12">
|
||||||
<div style="max-width: 750px; margin-top: 3rem; margin: auto;">
|
<div style="max-width: 750px; margin-top: 3rem; margin: auto;">
|
||||||
<h3 >In Progress</h3>
|
<h3 >In Progress</h3>
|
||||||
<p>This is a list of the tasks we have completed in this month time frame. If you wish to find more about each task, click them have a read.</p>
|
<p>This is a list of the tasks we have completed in this month time frame. If you wish to find more about each task, click them have a read.</p>
|
||||||
</div>
|
</div>
|
||||||
<div class="pt-10">
|
<div class="pt-10">
|
||||||
{% include project_tablecard.html %}
|
{% for card in site.data.next.cards.in_progress %}
|
||||||
|
{% include project_tablecard.html state = 'in_progress' %}
|
||||||
|
{% endfor %}
|
||||||
</div>
|
</div>
|
||||||
</div>
|
</div>
|
||||||
|
{% endif %}
|
||||||
|
|
||||||
|
{% if site.data.next.cards.discarded.size > 0 %}
|
||||||
<div class="pt-12">
|
<div class="pt-12">
|
||||||
<div style="max-width: 750px; margin-top: 3rem; margin: auto;">
|
<div style="max-width: 750px; margin-top: 3rem; margin: auto;">
|
||||||
<h3 >Abandoned</h3>
|
<h3 >Discarded</h3>
|
||||||
<p>This is a list of the tasks we have completed in this month time frame. If you wish to find more about each task, click them have a read.</p>
|
<p>This is a list of the tasks we have completed in this month time frame. If you wish to find more about each task, click them have a read.</p>
|
||||||
</div>
|
</div>
|
||||||
<div class="pt-10">
|
<div class="pt-10">
|
||||||
{% include project_tablecard.html %}
|
{% for card in site.data.next.cards.discarded %}
|
||||||
|
{% include project_tablecard.html state = 'discarded' %}
|
||||||
|
{% endfor %}
|
||||||
</div>
|
</div>
|
||||||
</div>
|
</div>
|
||||||
|
{% endif %}
|
||||||
</div>
|
</div>
|
||||||
</content>
|
</content>
|
||||||
</div>
|
</div>
|
||||||
|
|
|
||||||
Loading…
Add table
Reference in a new issue