From f55a87dca459032313eb1249a5dfdcaf712d7ac1 Mon Sep 17 00:00:00 2001 From: Nathan Chapman Date: Tue, 5 Apr 2022 10:04:24 -0600 Subject: [PATCH] UI cleanup and fixes --- .../dashboard/product_create_form.html | 8 +- src/dashboard/views.py | 5 +- src/static/images/site_logo.svg | 28 +----- src/static/styles/main.css | 89 +++++++++++++++++-- src/storefront/cart.py | 8 +- src/storefront/forms.py | 12 +-- .../templates/storefront/cart_detail.html | 17 ++-- .../templates/storefront/customer_detail.html | 3 + .../templates/storefront/order_form.html | 5 +- .../templates/storefront/product_detail.html | 7 +- src/storefront/views.py | 2 +- src/templates/base.html | 55 ++++++------ 12 files changed, 150 insertions(+), 89 deletions(-) diff --git a/src/dashboard/templates/dashboard/product_create_form.html b/src/dashboard/templates/dashboard/product_create_form.html index 93af236..4716353 100644 --- a/src/dashboard/templates/dashboard/product_create_form.html +++ b/src/dashboard/templates/dashboard/product_create_form.html @@ -2,9 +2,11 @@ {% block content %}
-

Create product

-
-
+
+

Create product

+
+
+ {% csrf_token %} {{form.as_p}}

diff --git a/src/dashboard/views.py b/src/dashboard/views.py index 5525621..7a5a50b 100644 --- a/src/dashboard/views.py +++ b/src/dashboard/views.py @@ -116,9 +116,10 @@ class OrderListView(LoginRequiredMixin, ListView): def get_queryset(self): query = self.request.GET.get('status') - if query: + if query == 'unfulfilled': object_list = Order.objects.filter( - status=query + Q(status=OrderStatus.UNFULFILLED) | + Q(status=OrderStatus.PARTIALLY_FULFILLED) ).order_by( '-created_at' ).select_related( diff --git a/src/static/images/site_logo.svg b/src/static/images/site_logo.svg index fe1303e..dc5c8d2 100644 --- a/src/static/images/site_logo.svg +++ b/src/static/images/site_logo.svg @@ -1,27 +1 @@ - - - - - - - - - - - - - - - - - - - - - - Port Townsend Roasting Company - - - - - + \ No newline at end of file diff --git a/src/static/styles/main.css b/src/static/styles/main.css index 4d4d669..3dffd95 100644 --- a/src/static/styles/main.css +++ b/src/static/styles/main.css @@ -202,12 +202,23 @@ img { max-width: 100%; } +.fair_trade--small { + max-width: 4rem; + vertical-align: middle; +} + .product__item { display: grid; grid-template-columns: 2fr 1fr; gap: 0 2rem; } +@media (max-width: 876px) { + .product__item { + grid-template-columns: 1fr; + } +} + .product__list-item button { grid-column: 1/3; align-self: end; @@ -222,17 +233,17 @@ img { .product__form { display: grid; - grid-template-columns: 1fr 3fr; + grid-template-columns: 1fr 1fr 1fr; gap: 1rem; } .product__form input[type=submit] { - grid-column: 2; + /*grid-column: 2;*/ justify-self: end; } -.site__logo { - height: 3rem; +.site-logo { + height: 4rem; vertical-align: middle; } @@ -257,10 +268,55 @@ nav a { text-decoration: none; } +nav a:not(:last-child) { + margin-right: 2rem; +} + nav { margin-bottom: 4rem; } +.has-menu { + position: relative; +} + +.has-menu a { + text-transform: lowercase; + font-variant: small-caps; + font-weight: bold; + text-decoration: none; +} + +.has-menu:hover .dropdown-menu { + display: unset; +} + +[role="menu"] { + list-style: none; + margin: 0; + padding: 0; +} + +[role="menuitem"] { + cursor: pointer; + position: relative; +} +[role="menuitem"]:not(:last-child) { + margin-bottom: 0.5rem; + +} + +.dropdown-menu { + background-color: var(--bg-color); + border: var(--default-border); + padding: 0.5rem; + position: absolute; + top: 100%; + right: 0; + z-index: 1000; + display: none; +} + .site__copyright { text-align: center; } @@ -270,20 +326,31 @@ nav { grid-template-columns: 1fr 2fr; gap: 2rem; } + .keep_calm__img { max-width: 250px; } +@media (max-width: 564px) { + .keep_calm { + grid-template-columns: 1fr; + } + .keep_calm figure { + text-align: center; + } +} + .site__cart { display: flex; align-items: center; background-color: var(--yellow-color); - padding: 0.25rem 1rem; + padding: 0 1rem; text-decoration: none; border-radius: 0.2rem; color: var(--fg-color); cursor: pointer; + margin-left: 2rem; } @@ -337,6 +404,13 @@ nav { gap: 8rem; } +@media (max-width: 911px) { + .product__list { + grid-template-columns: 1fr; + gap: 4rem; + } +} + .product__list-item { text-decoration: none; display: grid; @@ -384,6 +458,7 @@ footer { + .object__header { display: flex; align-items: baseline; @@ -437,6 +512,10 @@ footer { gap: 2rem; } +.fair-trade-stamp { + text-align: center; +} + .user__emails { margin-bottom: 4rem; diff --git a/src/storefront/cart.py b/src/storefront/cart.py index 08ce2dd..906e10e 100644 --- a/src/storefront/cart.py +++ b/src/storefront/cart.py @@ -23,12 +23,12 @@ class Cart: cart = self.session[settings.CART_SESSION_ID] = {} self.cart = cart - def add(self, product, quantity=1, roast='', update_quantity=False): + def add(self, product, quantity=1, grind='', update_quantity=False): product_id = str(product.id) if product_id not in self.cart: self.cart[product_id] = { 'quantity': 0, - 'roast': roast, + 'grind': grind, 'price': str(product.price) } @@ -68,7 +68,7 @@ class Cart: def clear(self): del self.session[settings.CART_SESSION_ID] - del self.session[self.coupon_code] + del self.session['coupon_code'] self.session.modified = True def build_order_params(self): @@ -94,7 +94,7 @@ class Cart: bulk_list = [OrderLine( order=order, product=item['product'], - customer_note=item['roast'], + customer_note=item['grind'], unit_price=item['price'], quantity=item['quantity'], tax_rate=2, diff --git a/src/storefront/forms.py b/src/storefront/forms.py index 0582874..15fbc92 100644 --- a/src/storefront/forms.py +++ b/src/storefront/forms.py @@ -19,7 +19,7 @@ class AddToCartForm(forms.Form): AEROPRESS = 'AeroPress' PERCOLATOR = 'Percolator' OTHER = 'Other' - ROAST_CHOICES = [ + GRIND_CHOICES = [ (WHOLE, 'Whole Beans'), (ESPRESSO, 'Espresso'), (CONE_DRIP, 'Cone Drip'), @@ -31,11 +31,11 @@ class AddToCartForm(forms.Form): (OTHER, 'Other (enter below)') ] - quantity = forms.IntegerField(min_value=1, initial=1) - roast = forms.ChoiceField(choices=ROAST_CHOICES) + quantity = forms.IntegerField(min_value=1, max_value=20, initial=1) + grind = forms.ChoiceField(choices=GRIND_CHOICES) class UpdateCartItemForm(forms.Form): - quantity = forms.IntegerField(min_value=1, initial=1) + quantity = forms.IntegerField(min_value=1, max_value=20, initial=1) update = forms.BooleanField(required=False, initial=True, widget=forms.HiddenInput) @@ -49,7 +49,7 @@ class AddToSubscriptionForm(forms.Form): AEROPRESS = 'AeroPress' PERCOLATOR = 'Percolator' OTHER = 'Other' - ROAST_CHOICES = [ + GRIND_CHOICES = [ (WHOLE, 'Whole Beans'), (ESPRESSO, 'Espresso'), (CONE_DRIP, 'Cone Drip'), @@ -71,7 +71,7 @@ class AddToSubscriptionForm(forms.Form): ] quantity = forms.IntegerField(min_value=1, initial=1) - roast = forms.ChoiceField(choices=ROAST_CHOICES) + grind = forms.ChoiceField(choices=GRIND_CHOICES) schedule = forms.ChoiceField(choices=SCHEDULE_CHOICES) diff --git a/src/storefront/templates/storefront/cart_detail.html b/src/storefront/templates/storefront/cart_detail.html index 1aae45d..4d98dde 100644 --- a/src/storefront/templates/storefront/cart_detail.html +++ b/src/storefront/templates/storefront/cart_detail.html @@ -13,21 +13,24 @@ {{product.productphoto_set.first.image}}

-

{{product.name}}
${{item.price}}

-

{{item.roast}}

-

- Remove from cart -

+

{{product.name}}

+

${{item.price}}

+

Grind: {{item.grind}}

{% csrf_token %} {{ item.update_quantity_form }} +

+ Remove from cart +

{% endwith %} {% empty %} -

No items in cart yet.

+
+

No items in cart yet.

+
{% endfor %}
@@ -52,7 +55,7 @@ Cart total: ${{cart.get_total_price_after_discount|floatformat:"2"}}

- Continue Shopping or Proceed to Checkout + Continue Shopping{% if cart|length > 0 %} or Proceed to Checkout{% endif %}

diff --git a/src/storefront/templates/storefront/customer_detail.html b/src/storefront/templates/storefront/customer_detail.html index 6069a1e..c79c217 100644 --- a/src/storefront/templates/storefront/customer_detail.html +++ b/src/storefront/templates/storefront/customer_detail.html @@ -51,6 +51,9 @@
{% with order_list=customer.orders.all %} +
+

Your orders

+
Order # diff --git a/src/storefront/templates/storefront/order_form.html b/src/storefront/templates/storefront/order_form.html index 0fc9f7a..72b37a9 100644 --- a/src/storefront/templates/storefront/order_form.html +++ b/src/storefront/templates/storefront/order_form.html @@ -34,9 +34,10 @@ {{product.productphoto_set.first.image}}
-

{{product.name}}
${{item.price}}

+

{{product.name}}

+

${{item.price}}

Quantity: {{item.quantity}}

-

Grind options: {{item.roast}}

+

Grind options: {{item.grind}}

{% endwith %}
diff --git a/src/storefront/templates/storefront/product_detail.html b/src/storefront/templates/storefront/product_detail.html index 724e8e3..7a9e22f 100644 --- a/src/storefront/templates/storefront/product_detail.html +++ b/src/storefront/templates/storefront/product_detail.html @@ -13,21 +13,16 @@

{{product.name}}

{{product.description}}

+

${{product.price}}

{{product.weight.oz}} oz

{% csrf_token %} -

One-time purchase

{{ form.as_p }}

-

-
-

Subscribe and save 10%

-
- Subscriptions
{% endblock %} diff --git a/src/storefront/views.py b/src/storefront/views.py index bff7fb3..6e93ba0 100644 --- a/src/storefront/views.py +++ b/src/storefront/views.py @@ -62,7 +62,7 @@ class CartAddProductView(SingleObjectMixin, FormView): if form.is_valid(): cart.add( product=self.get_object(), - roast=form.cleaned_data['roast'], + grind=form.cleaned_data['grind'], quantity=form.cleaned_data['quantity'] ) return self.form_valid(form) diff --git a/src/templates/base.html b/src/templates/base.html index 7abba39..70d3d32 100644 --- a/src/templates/base.html +++ b/src/templates/base.html @@ -25,34 +25,37 @@
- - {% if user.is_authenticated %} - - Hi {{user.first_name}} {{user.last_name}}! - - {% if user.is_staff %} - Dashboard + + +
+ {% if user.is_authenticated %} +
+ Account ▼ + +
+ {% else %} + + Log In | Sign Up + {% endif %} - Log Out - {% else %} - - Log In | Sign Up - - {% endif %} + + {{cart|length}} + Shopping cart + +
-
{% block content %}