page styling for all pages #173

This commit is contained in:
SvyatoslavArtymovych 2023-06-21 15:22:54 +03:00
parent b6754ae94e
commit 17d98a5619
19 changed files with 3766 additions and 68 deletions

File diff suppressed because one or more lines are too long

View File

@ -171,7 +171,7 @@
{% endif %} {% endif %}
<div class="flex justify-between item-center mb-5"> <div class="flex justify-between item-center mb-5">
<h1 class="text-20 hidden md:inline font-extrabold dark:text-white"> <h1 class="text-[2rem] hidden md:inline font-extrabold dark:text-white">
{{book.label}} {{book.label}}
</h1> </h1>
<div class="ml-auto flex"> <div class="ml-auto flex">

View File

@ -22,8 +22,8 @@
<!-- prettier-ignore --> <!-- prettier-ignore -->
<div class="flex flex-col w-full"> <div class="flex flex-col w-full">
{% if current_user.is_authenticated and books.total>0 %} {% if current_user.is_authenticated and books.total>0 %}
<div class="flex justify-between mt-1"> <div class="flex justify-between items-center mt-1">
<h1 class=" text-lg font-extrabold dark:text-white ml-4">Fav books</h1> <h1 class=" text-[2rem] font-extrabold dark:text-white ml-4">Fav books</h1>
{% if current_user.is_authenticated %} {% if current_user.is_authenticated %}
{% include 'book/components/header_buttons.html' %} {% include 'book/components/header_buttons.html' %}
{% endif %} {% endif %}

View File

@ -22,12 +22,12 @@
<!-- prettier-ignore --> <!-- prettier-ignore -->
<div class="flex flex-col w-full"> <div class="flex flex-col w-full">
{% if current_user.is_authenticated and interpretations.total %} {% if current_user.is_authenticated and interpretations.total %}
<div class="flex justify-between mt-1"> <div class="flex justify-between items-center mt-1">
<h1 class=" text-lg font-extrabold dark:text-white ml-4">My contributions</h1> <h1 class="text-[2rem] font-extrabold dark:text-white ml-4">My contributions</h1>
{% if current_user.is_authenticated %} {% if current_user.is_authenticated %}
{% include 'book/components/header_buttons.html' %} {% include 'book/components/header_buttons.html' %}
{% endif %} {% endif %}
</div> </div>
{% endif %} {% endif %}

View File

@ -49,10 +49,11 @@
<!-- prettier-ignore --> <!-- prettier-ignore -->
{% if current_user.is_authenticated and books.total %} {% if current_user.is_authenticated and books.total %}
<div class="flex flex-col w-full"> <div class="flex flex-col w-full">
<div class="flex justify-between mt-1"> <div class="flex justify-between items-center mt-1">
<h1 class="text-lg font-extrabold dark:text-white ml-4">My library</h1> <h1 class="text-[2rem] font-extrabold dark:text-white ml-4">My library</h1>
{% if current_user.is_authenticated %} {% include {% if current_user.is_authenticated %}
'book/components/header_buttons.html' %} {% endif %} {% include 'book/components/header_buttons.html' %}
{% endif %}
</div> </div>
</div> </div>
{% endif %} {% for book in books if not book.is_deleted %} {% include {% endif %} {% for book in books if not book.is_deleted %} {% include

View File

@ -76,19 +76,16 @@
<!-- prettier-ignore --> <!-- prettier-ignore -->
{% if not current_user.is_authenticated %} {% if not current_user.is_authenticated %}
<button <button
id="connectWalletBtn" id="connectWalletBtn"
type="button" type="button"
class="md:flex hidden 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 text-center"> class="md:flex hidden 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 text-center">
Connect wallet Connect wallet
</button> </button>
<a {% endif %}
href="https://join.status.im/b/{{request.base_url}}"
class="md:hidden flex 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 text-center" <!-- prettier-ignore -->
> {% if current_user.is_authenticated %}
Connect wallet
</a>
{% endif %} {% if current_user.is_authenticated %}
<div class="md:flex hidden"> <div class="md:flex hidden">
<div class="items-center md:ml-3 hidden md:flex"> <div class="items-center md:ml-3 hidden md:flex">
<!-- prettier-ignore --> <!-- prettier-ignore -->

View File

@ -3,21 +3,19 @@
<!-- prettier-ignore --> <!-- prettier-ignore -->
{% extends 'base.html' %} {% extends 'base.html' %}
{% block content %} {% block content %}
<div class="border-b pt-1 border-gray-200 dark:border-gray-700"> <div class="border-b pt-4 border-gray-200 dark:border-gray-700">
<!-- prettier-ignore --> <!-- prettier-ignore -->
<h1 class="hidden md:inline font-extrabold text-lg dark:text-white ml-4 mt-5">Open Common Law</h1> <h1 class="hidden md:inline font-extrabold text-[2rem] dark:text-white ml-4 mt-5">Open Common Law</h1>
<div class="flex justify-between"> <div class="flex justify-between items-center mt-5">
<p <p
class="hidden md:block text-sm ml-4 w-1/2 text-gray-500 text-center md:text-left dark:text-gray-400"> class="hidden md:block text-base ml-4 w-2/3 text-gray-500 text-center md:text-left dark:text-gray-400">
An open-source law hosting platform that allows online communities to An open-source law hosting platform that allows online communities to
easily create, collaborate, and publish their own body of law. easily create, collaborate, and publish their own body of law.
</p> </p>
<div class="flex"> <!-- prettier-ignore -->
<!-- prettier-ignore --> {% if current_user.is_authenticated %}
{% if current_user.is_authenticated %}
{% include 'book/components/header_buttons.html' %} {% include 'book/components/header_buttons.html' %}
{% endif %} {% endif %}
</div>
</div> </div>
<!-- prettier-ignore --> <!-- prettier-ignore -->
<ul class="flex md:flex-wrap -mb-px text-xs md:text-sm font-medium text-center" id="myTab" data-tabs-toggle="#myTabContent" role="tablist"> <ul class="flex md:flex-wrap -mb-px text-xs md:text-sm font-medium text-center" id="myTab" data-tabs-toggle="#myTabContent" role="tablist">

View File

@ -3,18 +3,18 @@
<!-- prettier-ignore --> <!-- prettier-ignore -->
{% extends 'base.html' %} {% extends 'base.html' %}
{% block content %} {% block content %}
<div class="border-b pt-1 border-gray-200 dark:border-gray-700"> <div class="border-b pt-4 border-gray-200 dark:border-gray-700">
<!-- prettier-ignore --> <!-- prettier-ignore -->
<h1 class="hidden md:inline font-extrabold text-lg dark:text-white ml-4 mt-5">Open Common Law</h1> <h1 class="hidden md:inline font-extrabold text-[2rem] dark:text-white ml-4 mt-5">Open Common Law</h1>
<div class="flex justify-between"> <div class="flex justify-between items-center mt-5">
<p <p
class="hidden md:block text-sm ml-4 w-1/2 text-gray-500 text-center md:text-left dark:text-gray-400"> class="hidden md:block text-base ml-4 w-2/3 text-gray-500 text-center md:text-left dark:text-gray-400">
An open-source law hosting platform that allows online communities to easily An open-source law hosting platform that allows online communities to easily
create, collaborate, and publish their own body of law. create, collaborate, and publish their own body of law.
</p> </p>
{% if current_user.is_authenticated %} {% if current_user.is_authenticated %}
{% include 'book/components/header_buttons.html' %} {% include 'book/components/header_buttons.html' %}
{% endif %} {% endif %}
</div> </div>
<!-- prettier-ignore --> <!-- prettier-ignore -->
<ul class="flex md:flex-wrap -mb-px text-xs md:text-sm font-medium text-center" id="myTab" data-tabs-toggle="#myTabContent" role="tablist"> <ul class="flex md:flex-wrap -mb-px text-xs md:text-sm font-medium text-center" id="myTab" data-tabs-toggle="#myTabContent" role="tablist">

View File

@ -5,11 +5,11 @@
{% block right_sidebar %} {% block right_sidebar %}
{% endblock %} {% endblock %}
{% block content %} {% block content %}
<div class="border-b border-gray-200 dark:border-gray-700"> <div class="pt-5 border-b border-gray-200 dark:border-gray-700">
<!-- prettier-ignore --> <!-- prettier-ignore -->
<h1 class="hidden md:inline font-extrabold text-lg dark:text-white ml-4 mt-5">Search results</h1> <h1 class="hidden md:inline font-extrabold text-[2rem] dark:text-white ml-4 mt-5">Search results</h1>
<!-- prettier-ignore --> <!-- prettier-ignore -->
<p class="hidden md:block text-sm ml-4 w-1/2 text-gray-500 text-center md:text-left dark:text-gray-400"> Search result for {{query}} </p> <p class="hidden md:block text-sm mt-5 ml-4 w-1/2 text-gray-500 text-center md:text-left dark:text-gray-400"> Search result for <span class="font-bold dark:text-white">{{query}}</span> </p>
<!-- prettier-ignore --> <!-- prettier-ignore -->
<p class="hidden md:block text-sm ml-4 w-1/2 text-gray-500 text-center md:text-left dark:text-gray-400"> Showing {{count}} results </p> <p class="hidden md:block text-sm ml-4 w-1/2 text-gray-500 text-center md:text-left dark:text-gray-400"> Showing {{count}} results </p>
<!-- prettier-ignore --> <!-- prettier-ignore -->

View File

@ -5,11 +5,11 @@
{% block right_sidebar %} {% block right_sidebar %}
{% endblock %} {% endblock %}
{% block content %} {% block content %}
<div class="border-b border-gray-200 dark:border-gray-700"> <div class="pt-5 border-b border-gray-200 dark:border-gray-700">
<!-- prettier-ignore --> <!-- prettier-ignore -->
<h1 class="hidden md:inline font-extrabold text-lg dark:text-white ml-4 mt-5">Search results</h1> <h1 class="hidden md:inline font-extrabold text-[2rem] dark:text-white ml-4">Search results</h1>
<!-- prettier-ignore --> <!-- prettier-ignore -->
<p class="hidden md:block text-sm ml-4 w-1/2 text-gray-500 text-center md:text-left dark:text-gray-400"> Search result for {{query}} </p> <p class="hidden md:block text-sm mt-5 ml-4 w-1/2 text-gray-500 text-center md:text-left dark:text-gray-400"> Search result for <span class="font-bold dark:text-white">{{query}}</span> </p>
<!-- prettier-ignore --> <!-- prettier-ignore -->
<p class="hidden md:block text-sm ml-4 w-1/2 text-gray-500 text-center md:text-left dark:text-gray-400"> Showing {{count}} results </p> <p class="hidden md:block text-sm ml-4 w-1/2 text-gray-500 text-center md:text-left dark:text-gray-400"> Showing {{count}} results </p>
<!-- prettier-ignore --> <!-- prettier-ignore -->

View File

@ -5,11 +5,11 @@
{% block right_sidebar %} {% block right_sidebar %}
{% endblock %} {% endblock %}
{% block content %} {% block content %}
<div class="pt-10 md:pt-0 border-b border-gray-200 dark:border-gray-700"> <div class="!pt-5 md:pt-0 border-b border-gray-200 dark:border-gray-700">
<!-- prettier-ignore --> <!-- prettier-ignore -->
<h1 class="hidden md:inline font-extrabold text-lg dark:text-white ml-4 mt-5">Search results</h1> <h1 class="hidden md:inline font-extrabold text-[2rem] dark:text-white ml-4 mt-5">Search results</h1>
<!-- prettier-ignore --> <!-- prettier-ignore -->
<p class="hidden md:block text-sm ml-4 w-1/2 text-gray-500 text-center md:text-left dark:text-gray-400"> Search result for {{query}} </p> <p class="hidden md:block text-sm mt-5 ml-4 w-1/2 text-gray-500 text-center md:text-left dark:text-gray-400"> Search result for <span class="font-bold dark:text-white">{{query}}</span> </p>
<!-- prettier-ignore --> <!-- prettier-ignore -->
<p class="hidden md:block text-sm ml-4 w-1/2 text-gray-500 text-center md:text-left dark:text-gray-400"> Showing {{count}} results </p> <p class="hidden md:block text-sm ml-4 w-1/2 text-gray-500 text-center md:text-left dark:text-gray-400"> Showing {{count}} results </p>
<!-- prettier-ignore --> <!-- prettier-ignore -->
@ -48,8 +48,8 @@
<h1 class="hidden md:inline font-extrabold text-lg dark:text-white ml-4 mt-5">No {{query}} in any tag, try another search query.</h1> <h1 class="hidden md:inline font-extrabold text-lg dark:text-white ml-4 mt-5">No {{query}} in any tag, try another search query.</h1>
{% else %} {% else %}
{% for tag in tags %} {% for tag in tags %}
<dl class="bg-white dark:bg-gray-900 w-full p-5 text-gray-900 divide-y divide-gray-200 dark:text-white dark:divide-gray-700 m-3 border-2 border-gray-200 border-solid rounded-lg dark:border-gray-700"> <dl class="bg-white dark:bg-gray-900 w-full p-5 text-gray-900 divide-y my-1 divide-gray-200 dark:text-white dark:divide-gray-700 border-2 border-gray-200 border-solid rounded-lg dark:border-gray-700">
<dt><a class="flex flex-col" href="{{url_for('search.tag_search_interpretations',tag_name=tag.name)}}">{{tag.name}}</a></dt> <dt><a class="flex flex-col" href="{{url_for('search.tag_search_interpretations',tag_name=tag.name)}}">{{tag.name}}</a></dt>
</dl> </dl>
{% endfor %} {% endfor %}
<!-- prettier-ignore --> <!-- prettier-ignore -->

View File

@ -5,11 +5,11 @@
{% block right_sidebar %} {% block right_sidebar %}
{% endblock %} {% endblock %}
{% block content %} {% block content %}
<div class="border-b border-gray-200 dark:border-gray-700"> <div class="pt-5 border-b border-gray-200 dark:border-gray-700">
<!-- prettier-ignore --> <!-- prettier-ignore -->
<h1 class="hidden md:inline font-extrabold text-lg dark:text-white ml-4 mt-5">Search results</h1> <h1 class="hidden md:inline font-extrabold text-[2rem] dark:text-white ml-4 mt-5">Search results</h1>
<!-- prettier-ignore --> <!-- prettier-ignore -->
<p class="hidden md:block text-sm ml-4 w-1/2 text-gray-500 text-center md:text-left dark:text-gray-400"> Search result for {{query}} </p> <p class="hidden md:block text-sm mt-5 ml-4 w-1/2 text-gray-500 text-center md:text-left dark:text-gray-400"> Search result for <span class="font-bold dark:text-white">{{query}}</span> </p>
<!-- prettier-ignore --> <!-- prettier-ignore -->
<p class="hidden md:block text-sm ml-4 w-1/2 text-gray-500 text-center md:text-left dark:text-gray-400"> Showing {{count}} results </p> <p class="hidden md:block text-sm ml-4 w-1/2 text-gray-500 text-center md:text-left dark:text-gray-400"> Showing {{count}} results </p>
<!-- prettier-ignore --> <!-- prettier-ignore -->

View File

@ -5,11 +5,11 @@
{% block right_sidebar %} {% block right_sidebar %}
{% endblock %} {% endblock %}
{% block content %} {% block content %}
<div class="border-b border-gray-200 dark:border-gray-700"> <div class="pt-5 border-b border-gray-200 dark:border-gray-700">
<!-- prettier-ignore --> <!-- prettier-ignore -->
<h1 class="hidden md:inline font-extrabold text-lg dark:text-white ml-4 mt-5">Tag search results</h1> <h1 class="hidden md:inline font-extrabold text-[2rem] dark:text-white ml-4 mt-5">Tag search results</h1>
<!-- prettier-ignore --> <!-- prettier-ignore -->
<p class="hidden md:block text-sm ml-4 w-1/2 text-gray-500 text-center md:text-left dark:text-gray-400">Tag search result for {{tag_name}} </p> <p class="hidden md:block text-sm mt-5 ml-4 w-1/2 text-gray-500 text-center md:text-left dark:text-gray-400">Tag search result for <span class="font-bold dark:text-white">{{tag_name}}</span> </p>
<!-- prettier-ignore --> <!-- prettier-ignore -->
<p class="hidden md:block text-sm ml-4 w-1/2 text-gray-500 text-center md:text-left dark:text-gray-400"> Showing {{count}} results </p> <p class="hidden md:block text-sm ml-4 w-1/2 text-gray-500 text-center md:text-left dark:text-gray-400"> Showing {{count}} results </p>
<!-- prettier-ignore --> <!-- prettier-ignore -->

View File

@ -5,11 +5,11 @@
{% block right_sidebar %} {% block right_sidebar %}
{% endblock %} {% endblock %}
{% block content %} {% block content %}
<div class="border-b border-gray-200 dark:border-gray-700"> <div class="pt-5 border-b border-gray-200 dark:border-gray-700">
<!-- prettier-ignore --> <!-- prettier-ignore -->
<h1 class="hidden md:inline font-extrabold text-lg dark:text-white ml-4 mt-5">Tag search results</h1> <h1 class="hidden md:inline font-extrabold text-[2rem] dark:text-white ml-4 mt-5">Tag search results</h1>
<!-- prettier-ignore --> <!-- prettier-ignore -->
<p class="hidden md:block text-sm ml-4 w-1/2 text-gray-500 text-center md:text-left dark:text-gray-400"> Tag search result for {{tag_name}} </p> <p class="hidden md:block text-sm mt-5 ml-4 w-1/2 text-gray-500 text-center md:text-left dark:text-gray-400"> Tag search result for <span class="font-bold dark:text-white">{{tag_name}}</span> </p>
<!-- prettier-ignore --> <!-- prettier-ignore -->
<p class="hidden md:block text-sm ml-4 w-1/2 text-gray-500 text-center md:text-left dark:text-gray-400"> Showing {{count}} results </p> <p class="hidden md:block text-sm ml-4 w-1/2 text-gray-500 text-center md:text-left dark:text-gray-400"> Showing {{count}} results </p>
<!-- prettier-ignore --> <!-- prettier-ignore -->

View File

@ -7,7 +7,18 @@
<svg class="w-5 h-5 text-gray-500 dark:text-gray-400" aria-hidden="true" fill="currentColor" viewBox="0 0 20 20" xmlns="http://www.w3.org/2000/svg"><path fill-rule="evenodd" d="M8 4a4 4 0 100 8 4 4 0 000-8zM2 8a6 6 0 1110.89 3.476l4.817 4.817a1 1 0 01-1.414 1.414l-4.816-4.816A6 6 0 012 8z" clip-rule="evenodd"></path></svg> <svg class="w-5 h-5 text-gray-500 dark:text-gray-400" aria-hidden="true" fill="currentColor" viewBox="0 0 20 20" xmlns="http://www.w3.org/2000/svg"><path fill-rule="evenodd" d="M8 4a4 4 0 100 8 4 4 0 000-8zM2 8a6 6 0 1110.89 3.476l4.817 4.817a1 1 0 01-1.414 1.414l-4.816-4.816A6 6 0 012 8z" clip-rule="evenodd"></path></svg>
</div> </div>
<!-- prettier-ignore --> <!-- prettier-ignore -->
<input required minlength="1" autocomplete="off" name="search_query" {% if search_query %}value={{ search_query }}{% endif %} type="text" id="mainSearchInput" class="block p-2 pl-10 text-sm text-gray-900 border border-gray-300 rounded-lg w-80 bg-gray-50 focus:ring-blue-500 focus:border-blue-500 dark:bg-gray-700 dark:border-gray-600 dark:placeholder-gray-400 dark:text-white dark:focus:ring-blue-500 dark:focus:border-blue-500" /> <input
required
minlength="1"
autocomplete="off"
name="search_query"
{% if search_query %}
value='{{ search_query }}'
{% endif %}
type="text"
id="mainSearchInput"
class="block p-2 pl-10 text-sm text-gray-900 border border-gray-300 rounded-lg w-80 bg-gray-50 focus:ring-blue-500 focus:border-blue-500 dark:bg-gray-700 dark:border-gray-600 dark:placeholder-gray-400 dark:text-white dark:focus:ring-blue-500 dark:focus:border-blue-500"
/>
</div> </div>
<!-- prettier-ignore --> <!-- prettier-ignore -->
<button type="submit" id="global-search-button" class="md:flex p-3 text-xs text-white bg-blue-700 hover:bg-blue-800 focus:ring-4 focus:outline-none focus:ring-blue-300 ml-2 font-medium rounded-lg text-center hidden items-center mr-2 dark:bg-blue-600 dark:hover:bg-blue-700 dark:focus:ring-blue-800">Search</button> <button type="submit" id="global-search-button" class="md:flex p-3 text-xs text-white bg-blue-700 hover:bg-blue-800 focus:ring-4 focus:outline-none focus:ring-blue-300 ml-2 font-medium rounded-lg text-center hidden items-center mr-2 dark:bg-blue-600 dark:hover:bg-blue-700 dark:focus:ring-blue-800">Search</button>

View File

@ -61,6 +61,14 @@
</a> </a>
</li> </li>
{% endif %} {% endif %}
<li>
<a
href="https://join.status.im/b/https://{{config.SERVER_NAME}}{{request.path}}"
class="md:hidden flex justify-center 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"
>
<span>Connect wallet</span>
</a>
</li>
<li> <li>
<a href="{{ url_for('search.search_interpretations',q='')}}" class="flex items-center p-2 text-gray-900 rounded-lg dark:text-white hover:bg-gray-100 dark:hover:bg-gray-700"> <a href="{{ url_for('search.search_interpretations',q='')}}" class="flex items-center p-2 text-gray-900 rounded-lg dark:text-white hover:bg-gray-100 dark:hover:bg-gray-700">
<!-- prettier-ignore --> <!-- prettier-ignore -->

View File

@ -34,6 +34,7 @@ def search_interpretations():
), ),
page=pagination, page=pagination,
count=count, count=count,
search_query=q,
) )
@ -87,6 +88,7 @@ def search_books():
books=books.paginate(page=pagination.page, per_page=pagination.per_page), books=books.paginate(page=pagination.page, per_page=pagination.per_page),
page=pagination, page=pagination,
count=count, count=count,
search_query=q,
) )
@ -119,6 +121,7 @@ def search_users():
users=users.paginate(page=pagination.page, per_page=pagination.per_page), users=users.paginate(page=pagination.page, per_page=pagination.per_page),
page=pagination, page=pagination,
count=count, count=count,
search_query=q,
) )
@ -142,6 +145,7 @@ def search_tags():
tags=tags.paginate(page=pagination.page, per_page=pagination.per_page), tags=tags.paginate(page=pagination.page, per_page=pagination.per_page),
page=pagination, page=pagination,
count=count, count=count,
search_query=q,
) )

View File

@ -13,6 +13,7 @@ class BaseConfig(BaseSettings):
ENV: str = "base" ENV: str = "base"
APP_NAME: str = "Open Law" APP_NAME: str = "Open Law"
SERVER_NAME: str = "open-law.net"
SECRET_KEY: str SECRET_KEY: str
SQLALCHEMY_TRACK_MODIFICATIONS: bool = False SQLALCHEMY_TRACK_MODIFICATIONS: bool = False
WTF_CSRF_ENABLED: bool = False WTF_CSRF_ENABLED: bool = False

View File

@ -2,6 +2,7 @@
# NOTE: This file will not be placed under version control. # NOTE: This file will not be placed under version control.
APP_NAME=Open Law APP_NAME=Open Law
SERVER_NAME=127.0.0.1:5006
SECRET_KEY=set_here_secret SECRET_KEY=set_here_secret
# Database # Database