yuriycherniy / micro-shop Goto Github PK

View Code? Open in Web Editor NEW

1.0 1.0 3.0 235 KB

Internet showcase for local retailers (интернет витрина для небольшого бизнеса)

License: MIT License

Python 84.83% HTML 15.17%

micro-shop's People

Contributors

Stargazers

Watchers

Forkers

slavaskvortsov rinswindnormirow rond5137

micro-shop's Issues

Неправильное отображение навбара в браузере Safari и Google Chrome на ios устройстве ipad mini 2.

Навбар на планшете ipad mini2 в браузерах Safari и Google Chrome отображается узкой полоской, не видны паддинги. На других ios устройствах не тестировалось.

Код для правки:

micro-shop/micro_shop/templates/base.html

Lines 52 to 107 in 434995e

    
           <nav class="navbar navbar-expand-lg navbar-dark mb-3" style="background-color: {{ colors.nav }}"> 
        
               <a class="navbar-brand" href="{% url 'main_page_url' %}">{% get_brand %}</a> 
        
               <button class="navbar-toggler" type="button" data-toggle="collapse" data-target="#navbarNavDropdown" 
        
                 aria-controls="navbarNavDropdown" aria-expanded="false" aria-label="Toggle navigation"> 
        
                 <span class="navbar-toggler-icon"></span> 
        
               </button> 
        
               <div class="collapse navbar-collapse" id="navbarNavDropdown"> 
        
                 <ul class="navbar-nav"> 
        
                   {% get_categories as categories %} 
        
                   {% if categories %} 
        
                   <li class="nav-item dropdown active"> 
        
                     <a class="nav-link nav-drop dropdown-toggle" href="#" id="navbarDropdownMenuLink" data-toggle="dropdown" 
        
                       aria-haspopup="true" aria-expanded="false"> 
        
                       Категории 
        
                     </a> 
        
                     <div class="dropdown-menu" aria-labelledby="navbarDropdownMenuLink"> 
        
                       {% for category in categories %} 
        
                       <a class="dropdown-item" href="{% url 'category_item_url' pk=category.pk %}" tabindex="-1" aria-disabled="true">{{ category.title }}</a> 
        
                       {% endfor %} 
        
                     </div> 
        
                     {% endif %} 
        
                   </li> 
        
                   <li class="nav-item active"> 
        
                     <a class="nav-item nav-link active" href="{% url 'item_list_url' %}">Все товары<span 
        
                         class="sr-only">(current)</span></a> 
        
                   </li> 
        
                   {% if user.is_authenticated and user.is_superuser %} 
        
                   <li class="nav-item dropdown"> 
        
                     <a class="nav-link dropdown-toggle" href="#" id="navbarDropdownMenuLink" data-toggle="dropdown" 
        
                       aria-haspopup="true" aria-expanded="false"> 
        
                       Настройки 
        
                     </a> 
        
                     <div class="dropdown-menu" aria-labelledby="navbarDropdownMenuLink"> 
        
                       <a class="dropdown-item" href="{% url 'main_page_editor_url' %}" tabindex="-1" aria-disabled="true">Редактор 
        
                         главной</a> 
        
                       <a class="dropdown-item" href="{% url 'category_list_url' %}" tabindex="-1" aria-disabled="true">Редактор 
        
                         категорий</a> 
        
                       <a class="dropdown-item" href="{% url 'profile_url' user.userprofile.pk %}" tabindex="-1" 
        
                         aria-disabled="true">Профиль</a> 
        
                         <a class="dropdown-item" href="{% url 'color_theme_update_url' %}" tabindex="-1" 
        
                         aria-disabled="true">Цветовая схема</a> 
        
                     </div> 
        
                   </li> 
        
                   {% block create_item_button_disappeared %} 
        
                   <li class="nav-item"> 
        
                     <a class="nav-link" href="{% url 'item_create_url' %}" tabindex="-1" aria-disabled="true">Добавить товар</a> 
        
                   </li> 
        
                   {% endblock %} 
        
                   {% block update_delete_buttons %}{% endblock %} 
        
                   <li class="nav-item"> 
        
                     <a class="nav-link" href="{% url 'archived_items_list' %}" tabindex="-1" aria-disabled="true">Архив</a> 
        
                   </li> 
        
                   {% endif %} 
        
                 </ul> 
        
               </div> 
        
             </nav>

Файл для правки: https://github.com/YuriyCherniy/micro-shop/blob/master/micro_shop/templates/base.html

Переработать карточку товара для мобильной и десктопной версии сайта.

Сейчас для текста описания товара в карточке используется тег h4, что не есть хорошо. Сделано это для того, чтобы карточка выглядела более-менее аккуратно в десктопной версии. Из-за этого в мобильной версии пока приходится мирится с крупным шрифтом.

Необходимо в мобильной версии размер шрифта установить в пределах общепринятых значений. В десктопной версии можно полностью переработать дизайн карточки для удобоваримого отображения товара даже с небольшим количеством текста. Сейчас карточка выглядит на десктопе так:

Шаблон для правки: https://github.com/YuriyCherniy/micro-shop/blob/master/micro_shop/showcase/templates/showcase/item_detail.html

Вынести содержимое тега <style> в отдельный CSS файл.

Необходимо перенести содержимое тега style базового шаблона base.html в отдельный CSS файл.

Шаблон для правки: https://github.com/YuriyCherniy/micro-shop/blob/master/micro_shop/templates/base.html

Код для переноса:

micro-shop/micro_shop/templates/base.html

Lines 19 to 47 in 5a20836

    
           <style> 
        
             html, 
        
             body { 
        
               height: 100%; 
        
             } 
        
             body { 
        
               display: flex; 
        
               flex-direction: column; 
        
             } 
        
             .content { 
        
               flex: 1 0 auto; 
        
             } 
        
             .footer { 
        
               flex-shrink: 0; 
        
             } 
        
             footer { 
        
               background-color: {{ colors.footer }}; 
        
             } 
        
             .nav-item, 
        
             .nav-drop, 
        
             .navbar-brand { 
        
               color: #ffffff !important 
        
             } 
        
           </style>

Recommend Projects

React

A declarative, efficient, and flexible JavaScript library for building user interfaces.
Vue.js

🖖 Vue.js is a progressive, incrementally-adoptable JavaScript framework for building UI on the web.
Typescript

TypeScript is a superset of JavaScript that compiles to clean JavaScript output.
TensorFlow

An Open Source Machine Learning Framework for Everyone
Django

The Web framework for perfectionists with deadlines.
Laravel

A PHP framework for web artisans
D3

Bring data to life with SVG, Canvas and HTML. 📊📈🎉

Recommend Topics

javascript

JavaScript (JS) is a lightweight interpreted programming language with first-class functions.
web

Some thing interesting about web. New door for the world.
server

A server is a program made to process requests and deliver data to clients.
Machine learning

Machine learning is a way of modeling and interpreting data that allows a piece of software to respond intelligently.
Visualization

Some thing interesting about visualization, use data art
Game

Some thing interesting about game, make everyone happy.

Recommend Org

Facebook

We are working to build community through open source technology. NB: members must have two-factor auth.
Microsoft

Open source projects and samples from Microsoft.
Google

Google ❤️ Open Source for everyone.
Alibaba

Alibaba Open Source for everyone
D3

Data-Driven Documents codes.
Tencent

China tencent open source team.

	<nav class="navbar navbar-expand-lg navbar-dark mb-3" style="background-color: {{ colors.nav }}">
	<a class="navbar-brand" href="{% url 'main_page_url' %}">{% get_brand %}</a>
	<button class="navbar-toggler" type="button" data-toggle="collapse" data-target="#navbarNavDropdown"
	aria-controls="navbarNavDropdown" aria-expanded="false" aria-label="Toggle navigation">
	<span class="navbar-toggler-icon"></span>
	</button>
	<div class="collapse navbar-collapse" id="navbarNavDropdown">
	<ul class="navbar-nav">
	{% get_categories as categories %}
	{% if categories %}
	<li class="nav-item dropdown active">
	<a class="nav-link nav-drop dropdown-toggle" href="#" id="navbarDropdownMenuLink" data-toggle="dropdown"
	aria-haspopup="true" aria-expanded="false">
	Категории
	</a>
	<div class="dropdown-menu" aria-labelledby="navbarDropdownMenuLink">
	{% for category in categories %}
	<a class="dropdown-item" href="{% url 'category_item_url' pk=category.pk %}" tabindex="-1" aria-disabled="true">{{ category.title }}</a>
	{% endfor %}
	</div>
	{% endif %}
	</li>
	<li class="nav-item active">
	<a class="nav-item nav-link active" href="{% url 'item_list_url' %}">Все товары<span
	class="sr-only">(current)</span></a>
	</li>
	{% if user.is_authenticated and user.is_superuser %}
	<li class="nav-item dropdown">
	<a class="nav-link dropdown-toggle" href="#" id="navbarDropdownMenuLink" data-toggle="dropdown"
	aria-haspopup="true" aria-expanded="false">
	Настройки
	</a>
	<div class="dropdown-menu" aria-labelledby="navbarDropdownMenuLink">
	<a class="dropdown-item" href="{% url 'main_page_editor_url' %}" tabindex="-1" aria-disabled="true">Редактор
	главной</a>
	<a class="dropdown-item" href="{% url 'category_list_url' %}" tabindex="-1" aria-disabled="true">Редактор
	категорий</a>
	<a class="dropdown-item" href="{% url 'profile_url' user.userprofile.pk %}" tabindex="-1"
	aria-disabled="true">Профиль</a>
	<a class="dropdown-item" href="{% url 'color_theme_update_url' %}" tabindex="-1"
	aria-disabled="true">Цветовая схема</a>
	</div>
	</li>
	{% block create_item_button_disappeared %}
	<li class="nav-item">
	<a class="nav-link" href="{% url 'item_create_url' %}" tabindex="-1" aria-disabled="true">Добавить товар</a>
	</li>
	{% endblock %}
	{% block update_delete_buttons %}{% endblock %}
	<li class="nav-item">
	<a class="nav-link" href="{% url 'archived_items_list' %}" tabindex="-1" aria-disabled="true">Архив</a>
	</li>
	{% endif %}
	</ul>
	</div>
	</nav>

	<style>
	html,
	body {
	height: 100%;
	}

	body {
	display: flex;
	flex-direction: column;
	}

	.content {
	flex: 1 0 auto;
	}

	.footer {
	flex-shrink: 0;
	}

	footer {
	background-color: {{ colors.footer }};
	}

	.nav-item,
	.nav-drop,
	.navbar-brand {
	color: #ffffff !important
	}
	</style>