diff --git a/common/static/common/scripts/app.js b/common/static/common/scripts/app.js index c8449332..fd09c59d 100644 --- a/common/static/common/scripts/app.js +++ b/common/static/common/scripts/app.js @@ -1,99 +1,125 @@ -// Create function btnBack -function btnBack() { - const btnBack = document.querySelectorAll('.js-btn-back'); +(function() { + // Create function agreeWithTerms + function agreeWithTerms() { + const agreeWithTermsInput = document.querySelector('.js-agree-with-terms-input'); - btnBack.forEach(function(item) { - item.addEventListener('click', function(e) { - e.preventDefault(); - window.history.back(); - }); - }); -} - -// Create finction commentForm -function commentForm() { - const commentForm = document.querySelector('.js-comment-form'); - if (!commentForm) { - return; - } - - const commentFormSelect = commentForm.querySelector('select'); - if (!commentFormSelect) { - return; - } - - // Create event comment form select change - commentFormSelect.addEventListener('change', function(e) { - let value = e.target.value; - let verb = 'Comment'; - const activitySubmitButton = document.getElementById('activity-submit'); - activitySubmitButton.classList.remove('btn-success', 'btn-warning'); - - // Hide or show comment form msg on change - if (value == 'AWC') { - verb = 'Set as Awaiting Changes'; - activitySubmitButton.classList.add('btn-warning'); - } else if (value == 'AWR') { - verb = 'Set as Awaiting Review'; - } else if (value == 'APR') { - verb = 'Approve!'; - activitySubmitButton.classList.add('btn-success'); - } - - activitySubmitButton.querySelector('span').textContent = verb; - }); -} - -// Create function copyInstallUrl -function copyInstallUrl() { - function init() { - // Create variables - const btnInstall = document.querySelector('.js-btn-install'); - const btnInstallAction = document.querySelector('.js-btn-install-action'); - const btnInstallGroup = document.querySelector('.js-btn-install-group'); - const btnInstallDrag = document.querySelector('.js-btn-install-drag'); - const btnInstallDragGroup = document.querySelector('.js-btn-install-drag-group'); - - if (btnInstall == null) { + if (!agreeWithTermsInput) { + // Stop function execution if agreeWithTermsInput is not present return; } - // Get data install URL - const btnInstallUrl = btnInstall.getAttribute('data-install-url'); + agreeWithTermsInput.addEventListener('change', function(e) { + const agreeWithTermsBtnSubmit = document.querySelector('.js-agree-with-terms-btn-submit'); - btnInstall.addEventListener('click', function() { - // Hide btnInstallGroup - btnInstallGroup.classList.add('d-none'); - - // Show btnInstallAction - btnInstallAction.classList.add('show'); - }); - - // Drag btnInstallUrl - btnInstallDrag.addEventListener('dragstart', function(e) { - // Set data install URL to be transferred during drag - e.dataTransfer.setData('text/plain', btnInstallUrl); - - // Set drag area active - btnInstallDragGroup.classList.add('opacity-50'); - }); - - // Undrag btnInstallUrl - btnInstallDrag.addEventListener('dragend', function() { - // Set drag area inactive - btnInstallDragGroup.classList.remove('opacity-50'); + // Check if checkbox is checked + if (e.target.checked == true) { + agreeWithTermsBtnSubmit.removeAttribute('disabled'); + } else { + agreeWithTermsBtnSubmit.setAttribute('disabled', true); + } }); } - init(); -} -// Create function init -function init() { - btnBack(); - commentForm(); - copyInstallUrl(); -} + // Create function btnBack + function btnBack() { + const btnBack = document.querySelectorAll('.js-btn-back'); -document.addEventListener('DOMContentLoaded', function() { - init(); -}); + btnBack.forEach(function(item) { + item.addEventListener('click', function(e) { + e.preventDefault(); + window.history.back(); + }); + }); + } + + // Create finction commentForm + function commentForm() { + const commentForm = document.querySelector('.js-comment-form'); + if (!commentForm) { + return; + } + + const commentFormSelect = commentForm.querySelector('select'); + if (!commentFormSelect) { + return; + } + + // Create event comment form select change + commentFormSelect.addEventListener('change', function(e) { + let value = e.target.value; + let verb = 'Comment'; + const activitySubmitButton = document.getElementById('activity-submit'); + activitySubmitButton.classList.remove('btn-primary', 'btn-success', 'btn-warning'); + + // Hide or show comment form msg on change + if (value == 'AWC') { + verb = 'Set as Awaiting Changes'; + activitySubmitButton.classList.add('btn-warning'); + } else if (value == 'AWR') { + verb = 'Set as Awaiting Review'; + } else if (value == 'APR') { + verb = 'Approve!'; + activitySubmitButton.classList.add('btn-success'); + } else { + activitySubmitButton.classList.add('btn-primary'); + } + + activitySubmitButton.querySelector('span').textContent = verb; + }); + } + + // Create function copyInstallUrl + function copyInstallUrl() { + function init() { + // Create variables + const btnInstall = document.querySelector('.js-btn-install'); + const btnInstallAction = document.querySelector('.js-btn-install-action'); + const btnInstallGroup = document.querySelector('.js-btn-install-group'); + const btnInstallDrag = document.querySelector('.js-btn-install-drag'); + const btnInstallDragGroup = document.querySelector('.js-btn-install-drag-group'); + + if (btnInstall == null) { + return; + } + + // Get data install URL + const btnInstallUrl = btnInstall.getAttribute('data-install-url'); + + btnInstall.addEventListener('click', function() { + // Hide btnInstallGroup + btnInstallGroup.classList.add('d-none'); + + // Show btnInstallAction + btnInstallAction.classList.add('show'); + }); + + // Drag btnInstallUrl + btnInstallDrag.addEventListener('dragstart', function(e) { + // Set data install URL to be transferred during drag + e.dataTransfer.setData('text/plain', btnInstallUrl); + + // Set drag area active + btnInstallDragGroup.classList.add('opacity-50'); + }); + + // Undrag btnInstallUrl + btnInstallDrag.addEventListener('dragend', function() { + // Set drag area inactive + btnInstallDragGroup.classList.remove('opacity-50'); + }); + } + + init(); + } + // Create function init + function init() { + agreeWithTerms(); + btnBack(); + commentForm(); + copyInstallUrl(); + } + + document.addEventListener('DOMContentLoaded', function() { + init(); + }); +}()) diff --git a/common/static/common/styles/_button.sass b/common/static/common/styles/_button.sass new file mode 100644 index 00000000..f26799f7 --- /dev/null +++ b/common/static/common/styles/_button.sass @@ -0,0 +1,4 @@ +button, +.btn + &[type=submit] + transition: opacity var(--transition-speed) diff --git a/common/static/common/styles/_extension.sass b/common/static/common/styles/_extension.sass index 49fa6a8a..415fce3f 100644 --- a/common/static/common/styles/_extension.sass +++ b/common/static/common/styles/_extension.sass @@ -80,13 +80,6 @@ .ext-detail-tagline +margin(2, bottom) -.ext-detail-description - +padding(4) - +style-rich-text - - pre - +margin(3, bottom) - .ext-detail-info dd color: var(--color-text) @@ -376,3 +369,7 @@ @extend .dropdown-divider +margin(0, top) + +.dropdown-item + &a + +padding(3, x) diff --git a/common/static/common/styles/_forms.sass b/common/static/common/styles/_forms.sass index 0cf8ddc9..c0070d25 100644 --- a/common/static/common/styles/_forms.sass +++ b/common/static/common/styles/_forms.sass @@ -11,7 +11,12 @@ .form-control &[type="file"] - height: calc(var(--spacer) * 2.5) + // TODO: @web-assets improve component style + height: calc(var(--spacer) * 3.5) + +.invalid-feedback + ul + +padding(3, left) /* Override Tagger's styling. */ .was-validated .form-control:invalid, diff --git a/common/static/common/styles/_notifications.sass b/common/static/common/styles/_notifications.sass new file mode 100644 index 00000000..2cf28acd --- /dev/null +++ b/common/static/common/styles/_notifications.sass @@ -0,0 +1,13 @@ +// TODO: remove style if 'mark as unread' is implemented +// .notifications-item +// &.is-read +// .dropdown-toggle +// color: var(--color-text-secondary) !important +// +// &:hover +// cursor: default + +.notifications-item + .dropdown-item + padding-left: var(--spacer) !important + padding-right: var(--spacer) !important diff --git a/common/static/common/styles/_utilities.sass b/common/static/common/styles/_utilities.sass index 9762587c..b0da3e10 100644 --- a/common/static/common/styles/_utilities.sass +++ b/common/static/common/styles/_utilities.sass @@ -37,6 +37,9 @@ .show opacity: 1 +.style-rich-text + +style-rich-text + .text-accent color: var(--color-accent) diff --git a/common/static/common/styles/main.sass b/common/static/common/styles/main.sass index 03bf4a51..98707cd0 100644 --- a/common/static/common/styles/main.sass +++ b/common/static/common/styles/main.sass @@ -18,6 +18,7 @@ $container-width: map-get($container-max-widths, 'xl') @import '_alert.sass' @import '_badge.sass' @import '_box.sass' +@import '_button.sass' @import '_cards.sass' @import '_code.sass' @import '_comments.sass' @@ -28,6 +29,7 @@ $container-width: map-get($container-max-widths, 'xl') @import '_hero.sass' @import '_list.sass' @import '_navigation_global.sass' +@import '_notifications.sass' @import '_table.sass' @import 'ratings/static/ratings/styles/_review.sass' @import 'ratings/static/ratings/styles/_stars.sass' diff --git a/extensions/templates/extensions/components/blender_version.html b/extensions/templates/extensions/components/blender_version.html index c7830ffe..7e13ba03 100644 --- a/extensions/templates/extensions/components/blender_version.html +++ b/extensions/templates/extensions/components/blender_version.html @@ -4,10 +4,10 @@ href="https://www.blender.org/download/releases/{{ version.blender_version_min|version_without_patch|replace:".,-" }}/" title="{{ version.blender_version_min }}">Blender {{ version.blender_version_min|version_without_patch }} {% if is_editable %} - — - — + diff --git a/extensions/templates/extensions/components/extension_edit_detail_card.html b/extensions/templates/extensions/components/extension_edit_detail_card.html index c6d60f63..a29579f8 100644 --- a/extensions/templates/extensions/components/extension_edit_detail_card.html +++ b/extensions/templates/extensions/components/extension_edit_detail_card.html @@ -76,7 +76,9 @@
{% trans 'Compatibility' %}
-
{% include "extensions/components/blender_version.html" with version=version is_editable=is_editable form=form %}
+
+ {% include "extensions/components/blender_version.html" with version=version is_editable=is_editable form=form %} +
diff --git a/extensions/templates/extensions/detail.html b/extensions/templates/extensions/detail.html index 10660aa2..0a9adcab 100644 --- a/extensions/templates/extensions/detail.html +++ b/extensions/templates/extensions/detail.html @@ -21,7 +21,7 @@ {% block extension_description %} {% if extension.description %}
-
+
{{ extension.description|markdown }}
diff --git a/extensions/templates/extensions/draft_finalise.html b/extensions/templates/extensions/draft_finalise.html index a6cb90a6..2373ad12 100644 --- a/extensions/templates/extensions/draft_finalise.html +++ b/extensions/templates/extensions/draft_finalise.html @@ -45,7 +45,7 @@ {# TODO: fix handling of tags #}
- {% include "common/components/field.html" %} + {% include "common/components/field.html" with placeholder="Enter the text here..." %}
{% endif %} @@ -55,7 +55,7 @@

{% trans 'Initial Version' %}

- {% include "common/components/field.html" with field=form.release_notes %} + {% include "common/components/field.html" with field=form.release_notes placeholder="Add the release notes..." %}
diff --git a/extensions/templates/extensions/manage/components/add_previews.html b/extensions/templates/extensions/manage/components/add_previews.html index bec7c145..02618c6d 100644 --- a/extensions/templates/extensions/manage/components/add_previews.html +++ b/extensions/templates/extensions/manage/components/add_previews.html @@ -17,7 +17,7 @@
- {% include "common/components/field.html" with field=inlineform.caption label='Caption' %} + {% include "common/components/field.html" with field=inlineform.caption label='Caption' placeholder="Describe the preview" %}
{% include "common/components/field.html" with field=inlineform.source label='File' %} diff --git a/extensions/templates/extensions/manage/update.html b/extensions/templates/extensions/manage/update.html index 4397b5e8..313cd16d 100644 --- a/extensions/templates/extensions/manage/update.html +++ b/extensions/templates/extensions/manage/update.html @@ -30,11 +30,11 @@
- {% include "common/components/field.html" with field=form.description label="Description" classes="one two three" placeholder="Describe this extension" %} + {% include "common/components/field.html" with field=form.description label="Description" placeholder="Describe the extension..." %}
- {% include "common/components/field.html" with field=form.support %} + {% include "common/components/field.html" with field=form.support placeholder="https://example.com" %}
diff --git a/extensions/templates/extensions/new_version_finalise.html b/extensions/templates/extensions/new_version_finalise.html index bc16c1ae..13881e18 100644 --- a/extensions/templates/extensions/new_version_finalise.html +++ b/extensions/templates/extensions/new_version_finalise.html @@ -25,7 +25,7 @@
- {% include "common/components/field.html" with field=form.release_notes %} + {% include "common/components/field.html" with field=form.release_notes placeholder="Add the release notes..." %}
{% if form.non_field_errors or form.file.errors %} diff --git a/extensions/templates/extensions/submit.html b/extensions/templates/extensions/submit.html index ef34e00d..93531612 100644 --- a/extensions/templates/extensions/submit.html +++ b/extensions/templates/extensions/submit.html @@ -66,11 +66,11 @@
- {% include "common/components/field.html" with field=form.agreed_with_terms %} + {% include "common/components/field.html" with field=form.agreed_with_terms classes="js-agree-with-terms-input" %}
- +
{% if form.non_field_errors %} diff --git a/notifications/templates/notifications/notification_list.html b/notifications/templates/notifications/notification_list.html index 70920886..73e2d460 100644 --- a/notifications/templates/notifications/notification_list.html +++ b/notifications/templates/notifications/notification_list.html @@ -4,45 +4,64 @@ {% block page_title %}{% blocktranslate %}Notifications{% endblocktranslate %}{% endblock page_title %} {% block content %} -

-{% trans 'Notifications' %} - {% if user|unread_notification_count %} -
- {% csrf_token %} - -
- {% endif %} -

-{% if notification_list %} - {% for notification in notification_list %} -
-
+

{% trans 'Notifications' %}

- {{ notification.action.timestamp | naturaltime_compact }} - - {{ notification.action.actor }} - - - {{ notification.action.verb }} - - {{ notification.action.target }} - - - - {% if not notification.read_at %} -
- {% csrf_token %} - -
+ {% if notification_list %} +
+ {% if user|unread_notification_count %} +
+ {% csrf_token %} + +
{% endif %} - +
+ + + {% for notification in notification_list %} + + + + + + {% endfor %} + +
+ {{ notification.action.timestamp | naturaltime_compact }} + + {# TODO: @back-end add link to action target ID (so that link works as an anchor link) #} + {{ notification.action.actor }} {{ notification.action.verb }} {{ notification.action.target }} + + +
- {% endfor %} -{% else %} -

- {% trans 'You have no notifications' %} -

-{% endif %} + {% else %} +

+ {% trans 'You have no notifications' %} +

+ {% endif %} {% endblock content %} diff --git a/ratings/templates/ratings/rating_form.html b/ratings/templates/ratings/rating_form.html index 3358b2b3..b850db50 100644 --- a/ratings/templates/ratings/rating_form.html +++ b/ratings/templates/ratings/rating_form.html @@ -14,7 +14,7 @@
- {% include "common/components/field.html" with field=form.text focus=True %} + {% include "common/components/field.html" with field=form.text focus=True placeholder="Enter the text here..." %} {% if form.non_field_errors %}
diff --git a/reviewers/templates/reviewers/extensions_review_detail.html b/reviewers/templates/reviewers/extensions_review_detail.html index 442eba08..e391e012 100644 --- a/reviewers/templates/reviewers/extensions_review_detail.html +++ b/reviewers/templates/reviewers/extensions_review_detail.html @@ -145,7 +145,7 @@ {% csrf_token %} {% with form=comment_form|add_form_classes %} - {% include "common/components/field.html" with field=form.message %} + {% include "common/components/field.html" with field=form.message placeholder="Enter the text here..." %}