(discuss) when wallet is not connected, show voting arrows but inactive/or trigger a message saying 'Connect your wallet to contribute!' #204

This commit is contained in:
SvyatoslavArtymovych 2023-06-22 09:38:21 +03:00
parent 5fc4ce967f
commit aa6601c261
4 changed files with 54 additions and 6 deletions

View File

@ -0,0 +1,23 @@
<!-- prettier-ignore-->
<div id="connect_wallet_alert_modal" tabindex="-1" aria-hidden="true" class="fixed top-0 left-0 right-0 z-[150] hidden w-full p-4 overflow-x-hidden overflow-y-auto md:inset-0 h-[calc(100%-1rem)] max-h-full">
<div class="relative w-full max-w-2xl max-h-full">
<!-- Modal header -->
<div class="relative bg-white rounded-lg shadow dark:bg-gray-700">
<div class="flex items-start justify-between p-4 border-b rounded-t dark:border-gray-600">
<h3 class="text-xl font-semibold text-gray-900 dark:text-white">Connect your wallet to contribute!</h3>
</div>
<!-- Modal body -->
<!-- Modal footer -->
<div class="flex items-center p-6 space-x-2 border-t border-gray-200 rounded-b dark:border-gray-600">
<button
id="connectWalletBtn"
type="button"
data-is-mobile="true"
class="flex justify-center w-full md:w-auto text-white bg-gradient-to-r from-cyan-500 to-blue-500 hover:bg-gradient-to-bl focus:ring-4 focus:outline-none focus:ring-cyan-300 dark:focus:ring-cyan-800 font-medium rounded-lg text-sm px-5 py-2.5">
Connect wallet
</button>
</div>
</div>
</div>
</div>

View File

@ -86,6 +86,7 @@
{% if current_user.is_authenticated %}
{% include 'book/modals/add_book_modal.html' %}
{% endif %}
{% include 'auth/connect_wallet_alert_modal.html' %}
<!-- prettier-ignore -->
<script src="{{ url_for('static', filename='js/main.js') }}" type="text/javascript" defer></script>

View File

@ -9,6 +9,10 @@
{% endif %}
" xmlns="http://www.w3.org/2000/svg" fill="none" viewBox="0 0 24 24" stroke-width="1.5" stroke="currentColor" > <path stroke-linecap="round" stroke-linejoin="round" d="M4.5 10.5L12 3m0 0l7.5 7.5M12 3v18" /> </svg>
</div>
{% elif not current_user.is_authenticated %}
<button class="cursor-pointer" data-modal-target="connect_wallet_alert_modal" data-modal-toggle="connect_wallet_alert_modal">
<svg class="w-6 h-6 select-none " xmlns="http://www.w3.org/2000/svg" fill="none" viewBox="0 0 24 24" stroke-width="1.5" stroke="currentColor" > <path stroke-linecap="round" stroke-linejoin="round" d="M4.5 10.5L12 3m0 0l7.5 7.5M12 3v18" /> </svg>
</button>
{% endif %}
<span class="vote-count text-3xl select-none {% if interpretation.vote_count < 0 %} text-red-500 {% elif interpretation.vote_count > 0 %} text-green-500 {% endif %} " >
@ -23,6 +27,10 @@
{% endif %}
" xmlns="http://www.w3.org/2000/svg" fill="none" viewBox="0 0 24 24" stroke-width="1.5" stroke="currentColor"> <path stroke-linecap="round" stroke-linejoin="round" d="M19.5 13.5L12 21m0 0l-7.5-7.5M12 21V3" /> </svg>
</div>
{% elif not current_user.is_authenticated %}
<button class="cursor-pointer" data-modal-target="connect_wallet_alert_modal" data-modal-toggle="connect_wallet_alert_modal">
<svg class="w-6 h-6 select-none " xmlns="http://www.w3.org/2000/svg" fill="none" viewBox="0 0 24 24" stroke-width="1.5" stroke="currentColor"> <path stroke-linecap="round" stroke-linejoin="round" d="M19.5 13.5L12 21m0 0l-7.5-7.5M12 21V3" /> </svg>
</button>
{% endif %}
{% if show_control_btns %}

View File

@ -79,15 +79,31 @@
<div class="flex flex-row pb-3 md:p-3 md:w-full">
<div class="vote-block flex flex-col mt-5 ml-1 mr-2 md:m-5 md:mr-8 md:justify-center items-center">
<div class="vote-button cursor-pointer" data-vote-for="comment" data-entity-id="{{ comment.id }}" data-positive="true">
<svg class="w-6 h-6 select-none {% if comment.current_user_vote %} stroke-green-500 {% endif %} " xmlns="http://www.w3.org/2000/svg" fill="none" viewBox="0 0 24 24" stroke-width="1.5" stroke="currentColor" > <path stroke-linecap="round" stroke-linejoin="round" d="M4.5 10.5L12 3m0 0l7.5 7.5M12 3v18" /> </svg>
</div>
{% if current_user.is_authenticated %}
<div class="vote-button cursor-pointer" data-vote-for="comment" data-entity-id="{{ comment.id }}" data-positive="true">
<svg class="w-6 h-6 select-none {% if comment.current_user_vote %} stroke-green-500 {% endif %} " xmlns="http://www.w3.org/2000/svg" fill="none" viewBox="0 0 24 24" stroke-width="1.5" stroke="currentColor" > <path stroke-linecap="round" stroke-linejoin="round" d="M4.5 10.5L12 3m0 0l7.5 7.5M12 3v18" /> </svg>
</div>
{% elif not current_user.is_authenticated %}
<button class="cursor-pointer" data-modal-target="connect_wallet_alert_modal" data-modal-toggle="connect_wallet_alert_modal">
<svg class="w-6 h-6 select-none " xmlns="http://www.w3.org/2000/svg" fill="none" viewBox="0 0 24 24" stroke-width="1.5" stroke="currentColor" > <path stroke-linecap="round" stroke-linejoin="round" d="M4.5 10.5L12 3m0 0l7.5 7.5M12 3v18" /> </svg>
</button>
{% endif %}
<span class="vote-count text-3xl select-none {% if comment.vote_count < 0 %} text-red-500 {% elif comment.vote_count > 0 %} text-green-500 {% endif %} " >
{{ comment.vote_count }}
</span>
<div class="vote-button cursor-pointer" data-vote-for="comment" data-entity-id="{{ comment.id }}" data-positive="false">
<svg class="w-6 h-6 select-none {% if comment.current_user_vote == False %} stroke-red-500 {% endif %} " xmlns="http://www.w3.org/2000/svg" fill="none" viewBox="0 0 24 24" stroke-width="1.5" stroke="currentColor"> <path stroke-linecap="round" stroke-linejoin="round" d="M19.5 13.5L12 21m0 0l-7.5-7.5M12 21V3" /> </svg>
</div>
{% if not hide_vote_btns and current_user.is_authenticated %}
<div class="vote-button cursor-pointer" data-vote-for="comment" data-entity-id="{{ comment.id }}" data-positive="false">
<svg class="w-6 h-6 select-none {% if comment.current_user_vote == False %} stroke-red-500 {% endif %} " xmlns="http://www.w3.org/2000/svg" fill="none" viewBox="0 0 24 24" stroke-width="1.5" stroke="currentColor"> <path stroke-linecap="round" stroke-linejoin="round" d="M19.5 13.5L12 21m0 0l-7.5-7.5M12 21V3" /> </svg>
</div>
{% elif not current_user.is_authenticated %}
<button class="cursor-pointer" data-modal-target="connect_wallet_alert_modal" data-modal-toggle="connect_wallet_alert_modal">
<svg class="w-6 h-6 select-none " xmlns="http://www.w3.org/2000/svg" fill="none" viewBox="0 0 24 24" stroke-width="1.5" stroke="currentColor"> <path stroke-linecap="round" stroke-linejoin="round" d="M19.5 13.5L12 21m0 0l-7.5-7.5M12 21V3" /> </svg>
</button>
{% endif %}
{% if access_to_approve_comment %}