Andal.LND/edx-platform
6
0
Fork 0
Code Issues Pull Requests Actions Packages Projects Releases Wiki Activity

style: UX Refinements on tagging components (#33884)

Browse Source
This commit is contained in:
Chris Chávez
2023-12-13 14:28:27 -05:00
committed by GitHub
parent 8ce5d83423
commit 6763928d60
7 changed files with 34 additions and 25 deletions
Download Patch File Download Diff File Expand all files Collapse all files

2
cms/djangoapps/contentstore/rest_api/v1/views/tests/test_home.py
View File

@@ -100,5 +100,5 @@ class HomePageViewTest(CourseTestCase):
self.assertTrue(response.data['taxonomies_enabled'])
self.assertEqual(
response.data['taxonomy_list_mfe_url'],
f'{settings.COURSE_AUTHORING_MICROFRONTEND_URL}/taxonomy-list'
f'{settings.COURSE_AUTHORING_MICROFRONTEND_URL}/taxonomies'
)

2
cms/djangoapps/contentstore/utils.py
View File

@@ -440,7 +440,7 @@ def get_taxonomy_list_url():
if use_tagging_taxonomy_list_page():
mfe_base_url = settings.COURSE_AUTHORING_MICROFRONTEND_URL
if mfe_base_url:
taxonomy_list_url = f'{mfe_base_url}/taxonomy-list'
taxonomy_list_url = f'{mfe_base_url}/taxonomies'
return taxonomy_list_url

1
cms/static/js/views/pages/container_subviews.js
View File

@@ -465,6 +465,7 @@ function($, _, gettext, BaseView, ViewUtils, XBlockViewUtils, MoveXBlockUtils, H
tagContentElement.ariaExpanded = "false";
tagContentElement.setAttribute('aria-controls', `content-tags-tag-${tag.id}`);
tagContentElement.appendChild(tagIconElement);
tagContentElement.className += ' tagging-label-link';
parentElement.appendChild(tagChildrenElement);
// Render children

16
cms/static/sass/views/_container.scss
View File

@@ -264,6 +264,7 @@
.wrapper-tag-header {
display: flex;
justify-content: space-between;
border: 1px dotted transparent;
.tag-title {
font-weight: bold;
@@ -277,8 +278,8 @@
}
}
.wrapper-tag-header:focus {
border: 1px dotted gray;
.wrapper-tag-header:focus-visible {
border-color: $gray;
}
.action-primary {
@@ -313,11 +314,18 @@
}
}
.tagging-label:hover,
.tagging-label:focus {
.tagging-label-link {
border: 1px dotted transparent;
}
.tagging-label-link:hover {
color: $blue;
}
.tagging-label-link:focus-visible {
border-color: $gray;
}
.icon {
margin-left: 5px;
}

6
cms/templates/js/course-outline.underscore
View File

@@ -201,14 +201,14 @@ if (is_proctored_exam) {
</li>
<% } %>
<% if (xblockInfo.isVertical()) { %>
<li class="nav-item">
<a class="copy-button" href="#" role="button"><%- gettext('Copy to Clipboard') %></a>
</li>
<% if (typeof useTaggingTaxonomyListPage !== "undefined" && useTaggingTaxonomyListPage) { %>
<li class="nav-item">
<a class="manage-tags-button" href="#" role="button"><%- gettext('Manage Tags') %></a>
</li>
<% } %>
<li class="nav-item">
<a class="copy-button" href="#" role="button"><%- gettext('Copy to Clipboard') %></a>
</li>
<% } %>
<% if (xblockInfo.isDuplicable()) { %>
<li class="nav-item">

2
cms/templates/js/tag-list.underscore
View File

@@ -16,7 +16,7 @@
<% for (var i = 0; i < tags.taxonomies.length; i++) {
var taxonomy = tags.taxonomies[i];
%>
<div class="tagging-label tagging-label-tax-<%- taxonomy.id %>" id="tax-<%- taxonomy.id %>" tabindex=0 role="button" aria-controls="content-tags-tax-<%- taxonomy.id %>" aria-expanded=false>
<div class="tagging-label tagging-label-link tagging-label-tax-<%- taxonomy.id %>" id="tax-<%- taxonomy.id %>" tabindex=0 role="button" aria-controls="content-tags-tax-<%- taxonomy.id %>" aria-expanded=false>
<span class="tagging-label-value" id="tax-<%- taxonomy.id %>"><%- taxonomy.value %></span>
<span class="tagging-label-count" id="tax-<%- taxonomy.id %>">(<%- taxonomy.count %>)</span>
<span class="icon fa fa-caret-down" aria-hidden="true" id="tax-<%- taxonomy.id %>"></span>

30
cms/templates/studio_xblock_wrapper.html
View File

@@ -116,6 +116,21 @@ block_is_unit = is_unit(xblock)
<div class="nav-sub">
<ul>
% if not show_inline:
% if can_edit_visibility:
<li class="nav-item">
<a class="access-button" href="#" role="button">${_("Manage Access")}</a>
</li>
% endif
% if can_move:
<li class="nav-item">
<a class="move-button" href="#" role="button">${_("Move")}</a>
</li>
% endif
% if use_tagging:
<li class="nav-item">
<a class="tags-button" href="#" role="button">${_("Manage tags")}</a>
</li>
% endif
% if is_course:
<!--
Only show the "Copy to Clipboard" button for xblocks inside courses since
@@ -130,21 +145,6 @@ block_is_unit = is_unit(xblock)
<a class="duplicate-button" href="#" role="button">${_("Duplicate")}</a>
</li>
% endif
% if use_tagging:
<li class="nav-item">
<a class="tags-button" href="#" role="button">${_("Manage tags")}</a>
</li>
% endif
% if can_move:
<li class="nav-item">
<a class="move-button" href="#" role="button">${_("Move")}</a>
</li>
% endif
% if can_edit_visibility:
<li class="nav-item">
<a class="access-button" href="#" role="button">${_("Manage Access")}</a>
</li>
% endif
% endif
% if can_add:
<!-- If we can add, we can delete. -->