diff --git a/docs/state-machine.png b/docs/state-machine.png new file mode 100644 index 0000000..e8cbe58 Binary files /dev/null and b/docs/state-machine.png differ diff --git a/make_post_sell/static/css/common.css b/make_post_sell/static/css/common.css index 6a6ceb3..8ec9509 100644 --- a/make_post_sell/static/css/common.css +++ b/make_post_sell/static/css/common.css @@ -7,6 +7,22 @@ * * * * * * */ +/* Preload hover background images to prevent flash */ +body::after { + content: ""; + position: absolute; + width: 0; + height: 0; + overflow: hidden; + z-index: -1; + background-image: + url("/static/img/trans-blue.png"), + url("/static/img/trans-green.png"), + url("/static/img/trans-red.png"), + url("/static/img/trans-blue2.png"), + url("/static/img/trans-green2.png"), + url("/static/img/trans-red2.png"); +} body { margin: 0px; @@ -411,6 +427,28 @@ input.mps-button-red { box-sizing: border-box; } +/* Red cancel button */ +.mps-cancel-button-red { + background: var(--red-color); + color: white; + border-color: var(--red-color); +} + +[data-theme="dark"] .mps-cancel-button-red { + background-color: #2d3748; + background-image: url("/static/img/trans-red.png"); + border: 2px solid var(--red-color); + color: var(--red-color); + font-weight: bold; +} + +[data-theme="dark"] .mps-cancel-button-red:hover { + background-color: #2d3748; + background-image: url("/static/img/trans-red2.png"); + color: #ffffff; + border: 2px solid var(--red-color); +} + .comment-actions { margin-bottom: 42px; display: grid; @@ -438,6 +476,92 @@ input.mps-button-red { box-sizing: border-box; } +/* Light mode color styling */ +.reply-link { + background: var(--green-color); + color: white; + border-color: var(--green-color); +} + +.delete-link { + background: var(--red-color); + color: white; + border-color: var(--red-color); +} + +.mps-comment-form-button { + background: var(--green-color); + color: white; + border-color: var(--green-color); +} + +[data-theme="dark"] .reply-link, +[data-theme="dark"] .edit-link, +[data-theme="dark"] .moderate-link { + background-color: #2d3748; + background-image: url("/static/img/trans-blue.png"); + border: 2px solid var(--blue-color); + color: var(--blue-color); + font-weight: bold; +} + +[data-theme="dark"] .reply-link:hover, +[data-theme="dark"] .edit-link:hover, +[data-theme="dark"] .moderate-link:hover { + background-color: #2d3748; + background-image: url("/static/img/trans-blue2.png"); + color: #ffffff; + border: 2px solid var(--blue-color); +} + +/* Reply button - green */ +[data-theme="dark"] .reply-link { + background-color: #2d3748; + background-image: url("/static/img/trans-green.png"); + border: 2px solid var(--green-color); + color: var(--green-color); + font-weight: bold; +} + +[data-theme="dark"] .reply-link:hover { + background-color: #2d3748; + background-image: url("/static/img/trans-green2.png"); + color: #ffffff; + border: 2px solid var(--green-color); +} + +/* Delete button - red */ +[data-theme="dark"] .delete-link { + background-color: #2d3748; + background-image: url("/static/img/trans-red.png"); + border: 2px solid var(--red-color); + color: var(--red-color); + font-weight: bold; +} + +[data-theme="dark"] .delete-link:hover { + background-color: #2d3748; + background-image: url("/static/img/trans-red2.png"); + color: #ffffff; + border: 2px solid var(--red-color); +} + +/* Post comment button - green */ +[data-theme="dark"] .mps-comment-form-button { + background-color: #2d3748; + background-image: url("/static/img/trans-green.png"); + border: 2px solid var(--green-color); + color: var(--green-color); + font-weight: bold; +} + +[data-theme="dark"] .mps-comment-form-button:hover { + background-color: #2d3748; + background-image: url("/static/img/trans-green2.png"); + color: #ffffff; + border: 2px solid var(--green-color); +} + .payment-toggle-button { display: inline-block; padding: 6px 12px; @@ -1339,27 +1463,31 @@ div.message-ribbon { /* Flash message styling for dark mode */ [data-theme="dark"] .alert-danger, [data-theme="dark"] .alert-error { - color: #ff6b6b; - background-color: #2d1f20; - border-color: #ff6b6b; + color: var(--red-color); + background-color: #2d3748; + background-image: url("/static/img/trans-red2.png"); + border-color: var(--red-color); } [data-theme="dark"] .alert-warning { color: #ffd93d; - background-color: #2d2a1f; + background-color: #2d3748; + background-image: url("/static/img/trans-red2.png"); border-color: #ffd93d; } [data-theme="dark"] .alert-info, [data-theme="dark"] .alert-notice { color: var(--blue-color); - background-color: #1f252d; + background-color: #2d3748; + background-image: url("/static/img/trans-blue2.png"); border-color: var(--blue-color); } [data-theme="dark"] .alert-success { color: var(--green-color); - background-color: #1f2d1f; + background-color: #2d3748; + background-image: url("/static/img/trans-green2.png"); border-color: var(--green-color); } @@ -1715,6 +1843,25 @@ img.crypto-button-icon { margin-bottom: 20px; } +[data-theme="dark"] .original-comment-box { + background-color: #2d3748; + background-image: url("/static/img/trans-blue.png"); + border-left: 4px solid var(--blue-color); + color: var(--text-primary); +} + +/* Comment reply styling */ +.comment-reply { + margin-left: 0px; + margin-bottom: 20px; + border-left: 2px solid #ddd; + padding-left: 10px; +} + +[data-theme="dark"] .comment-reply { + border-left: 2px solid var(--blue-color); +} + .start-button-icon { font-size: 20px; } diff --git a/make_post_sell/templates/comments/edit_comment.j2 b/make_post_sell/templates/comments/edit_comment.j2 index 2d8b847..7e47907 100644 --- a/make_post_sell/templates/comments/edit_comment.j2 +++ b/make_post_sell/templates/comments/edit_comment.j2 @@ -3,7 +3,7 @@ {% block title %}Edit Comment{% endblock %} {% block content %} -
Comments & Reviews ({{ product.public_comment_count }})
- + {% endif %} + + + {% if not request.user.authenticated %} +Sign in to leave a comment.
+ {% endif %} + + {% if comments %} {% for comment in comments %} {{ render_comment(comment, shop, request) }} {% endfor %} @@ -78,20 +87,20 @@+
{{ error_msg }}
{% endif %} - {% else %} -Sign in to leave a comment.
{% endif %}Account Actions
{% if request.is_saas_domain %} My Shops @@ -129,8 +130,11 @@ Crypto Payment PreferencesShipping Addresses +
{% endif %} + Back to Shop +