mirror of
https://github.com/discourse/discourse.git
synced 2024-11-23 02:50:00 +08:00
UX: Improve tag info style (#15177)
This commit is contained in:
Kris
GitHub
parent
643f82d8d6
commit
b01ded9c89
|
|
@ -31,7 +31,7 @@
|
|||
|
||||
{{#if tag}}
|
||||
{{#if showToggleInfo}}
|
||||
{{d-button icon="wrench" class="btn-default" ariaLabel="tagging.info" action=toggleInfo id="show-tag-info"}}
|
||||
{{d-button icon=(if currentUser.staff "wrench" "info-circle") class="btn-default" ariaLabel="tagging.info" action=toggleInfo id="show-tag-info"}}
|
||||
{{/if}}
|
||||
{{/if}}
|
||||
|
||||
|
|
|
|||
|
|
@ -17,24 +17,11 @@
|
|||
<div class="tag-name-wrapper">
|
||||
{{discourse-tag tagInfo.name tagName="div" size="large"}}
|
||||
{{#if canAdminTag}}
|
||||
<a href {{action "edit"}} id="edit-tag" title={{i18n "tagging.edit_tag"}}>{{d-icon "pencil-alt"}}</a>
|
||||
{{d-button action=(action "edit") class="btn-flat edit-tag" title=(i18n "tagging.edit_tag") icon="pencil-alt" }}
|
||||
{{/if}}
|
||||
</div>
|
||||
{{#if canAdminTag}}
|
||||
<div class="tag-description-wrapper">
|
||||
{{tagInfo.description}}
|
||||
</div>
|
||||
{{/if}}
|
||||
{{/if}}
|
||||
|
||||
{{#if canAdminTag}}
|
||||
{{plugin-outlet name="tag-custom-settings" args=(hash tag=tagInfo) connectorTagName="" tagName="section"}}
|
||||
|
||||
<div class="tag-actions">
|
||||
{{d-button class="btn-default" action=(action "toggleEditControls") icon="cog" label="tagging.edit_synonyms" id="edit-synonyms"}}
|
||||
{{#if deleteAction}}
|
||||
{{d-button class="btn-danger delete-tag" action=(action "deleteTag") icon="far-trash-alt" label="tagging.delete_tag" id="delete-tag"}}
|
||||
{{/if}}
|
||||
<div class="tag-description-wrapper">
|
||||
{{tagInfo.description}}
|
||||
</div>
|
||||
{{/if}}
|
||||
</div>
|
||||
|
|
@ -53,7 +40,10 @@
|
|||
{{#if tagInfo.category_restricted}}
|
||||
{{i18n "tagging.category_restricted"}}
|
||||
{{else}}
|
||||
{{html-safe (i18n "tagging.default_info" basePath=(base-path))}}
|
||||
{{html-safe (i18n "tagging.default_info")}}
|
||||
{{#if canAdminTag}}
|
||||
{{html-safe (i18n "tagging.staff_info" basePath=(base-path))}}
|
||||
{{/if}}
|
||||
{{/if}}
|
||||
{{/if}}
|
||||
</div>
|
||||
|
|
@ -81,20 +71,31 @@
|
|||
{{#if editSynonymsMode}}
|
||||
<section class="add-synonyms field">
|
||||
<label for="add-synonyms">{{i18n "tagging.add_synonyms_label"}}</label>
|
||||
{{tag-chooser
|
||||
id="add-synonyms"
|
||||
tags=newSynonyms
|
||||
blockedTags=(array tagInfo.name)
|
||||
everyTag=true
|
||||
excludeSynonyms=true
|
||||
excludeHasSynonyms=true
|
||||
unlimitedTagCount=true}}
|
||||
<div>
|
||||
{{tag-chooser
|
||||
id="add-synonyms"
|
||||
tags=newSynonyms
|
||||
blockedTags=(array tagInfo.name)
|
||||
everyTag=true
|
||||
excludeSynonyms=true
|
||||
excludeHasSynonyms=true
|
||||
unlimitedTagCount=true}}
|
||||
{{d-button
|
||||
class="ok"
|
||||
action=(action "addSynonyms")
|
||||
disabled=addSynonymsDisabled
|
||||
icon="check"}}
|
||||
</div>
|
||||
</section>
|
||||
{{d-button
|
||||
class="btn-default"
|
||||
action=(action "addSynonyms")
|
||||
disabled=addSynonymsDisabled
|
||||
label="tagging.add_synonyms"}}
|
||||
{{/if}}
|
||||
{{#if canAdminTag}}
|
||||
{{plugin-outlet name="tag-custom-settings" args=(hash tag=tagInfo) connectorTagName="" tagName="section"}}
|
||||
<div class="tag-actions">
|
||||
{{d-button class="btn-default" action=(action "toggleEditControls") icon="cog" label="tagging.edit_synonyms" id="edit-synonyms"}}
|
||||
{{#if deleteAction}}
|
||||
{{d-button class="btn-danger delete-tag" action=(action "deleteTag") icon="far-trash-alt" label="tagging.delete_tag" id="delete-tag"}}
|
||||
{{/if}}
|
||||
</div>
|
||||
{{/if}}
|
||||
{{/if}}
|
||||
{{#if loading}}
|
||||
|
|
|
|||
|
|
@ -441,7 +441,7 @@ acceptance("Tag info", function (needs) {
|
|||
await click("#show-tag-info");
|
||||
assert.ok(exists(".tag-info .tag-name"), "show tag");
|
||||
|
||||
await click("#edit-tag");
|
||||
await click(".edit-tag");
|
||||
assert.strictEqual(
|
||||
query("#edit-name").value,
|
||||
"happy-monkey",
|
||||
|
|
@ -470,7 +470,7 @@ acceptance("Tag info", function (needs) {
|
|||
assert.strictEqual(count("#show-tag-info"), 1);
|
||||
|
||||
await click("#show-tag-info");
|
||||
assert.ok(exists("#edit-tag"), "can rename tag");
|
||||
assert.ok(exists(".edit-tag"), "can rename tag");
|
||||
assert.ok(exists("#edit-synonyms"), "can edit synonyms");
|
||||
assert.ok(exists("#delete-tag"), "can delete tag");
|
||||
|
||||
|
|
|
|||
|
|
@ -340,51 +340,83 @@ section.tag-info {
|
|||
|
||||
.edit-tag-wrapper {
|
||||
display: flex;
|
||||
|
||||
input {
|
||||
flex-wrap: wrap;
|
||||
margin-bottom: 1em;
|
||||
#edit-name {
|
||||
flex: 1 1 auto;
|
||||
margin-right: 0.5em;
|
||||
}
|
||||
#edit-description {
|
||||
flex: 10 1 auto;
|
||||
}
|
||||
.edit-controls {
|
||||
width: 100%;
|
||||
}
|
||||
}
|
||||
.tag-name-wrapper,
|
||||
|
||||
.tag-name-wrapper {
|
||||
display: flex;
|
||||
font-size: var(--font-up-4);
|
||||
align-items: baseline;
|
||||
button {
|
||||
font-size: var(--font-down-1);
|
||||
.d-icon {
|
||||
color: var(--primary-high);
|
||||
}
|
||||
.discourse-no-touch & {
|
||||
&:hover {
|
||||
background: transparent;
|
||||
}
|
||||
}
|
||||
}
|
||||
}
|
||||
|
||||
.tag-description-wrapper {
|
||||
display: flex;
|
||||
}
|
||||
.tag-name-wrapper a {
|
||||
color: var(--primary-high);
|
||||
margin-left: 0.5em;
|
||||
font-size: var(--font-up-1);
|
||||
}
|
||||
|
||||
.tag-name-wrapper a {
|
||||
font-size: var(--font-up-3);
|
||||
}
|
||||
|
||||
.tag-name .discourse-tag {
|
||||
display: block;
|
||||
.tag-box {
|
||||
display: flex;
|
||||
align-items: center;
|
||||
margin-bottom: 0.25em;
|
||||
a {
|
||||
margin-left: 0.5em;
|
||||
}
|
||||
}
|
||||
|
||||
.tag-description-wrapper {
|
||||
margin-bottom: 1em;
|
||||
}
|
||||
|
||||
.synonyms-list,
|
||||
.add-synonyms,
|
||||
.tag-associations {
|
||||
margin-top: 1em;
|
||||
@include clearfix;
|
||||
margin-bottom: 1em;
|
||||
}
|
||||
|
||||
.synonyms-list {
|
||||
margin: 2em 0 0;
|
||||
.tag-actions {
|
||||
margin-top: 2em;
|
||||
}
|
||||
|
||||
.add-synonyms {
|
||||
margin-top: 1em;
|
||||
div {
|
||||
display: flex;
|
||||
}
|
||||
.ok {
|
||||
margin-left: 0.5em;
|
||||
display: none;
|
||||
}
|
||||
.has-selection + .ok {
|
||||
display: flex;
|
||||
}
|
||||
}
|
||||
|
||||
.tag-list {
|
||||
margin: 1em 0 0 0;
|
||||
margin: 0.5em 0 1em;
|
||||
padding: 0;
|
||||
border: none;
|
||||
@include clearfix;
|
||||
a {
|
||||
color: var(--primary-medium);
|
||||
margin-left: 0.25em;
|
||||
}
|
||||
}
|
||||
}
|
||||
|
|
|
|||
|
|
@ -3792,7 +3792,8 @@ en:
|
|||
one: "select at least %{count} tag..."
|
||||
other: "select at least %{count} tags..."
|
||||
info: "Info"
|
||||
default_info: "This tag isn't restricted to any categories, and has no synonyms. To add restrictions, put this tag in a <a href=%{basePath}/tag_groups>tag group</a>."
|
||||
default_info: "This tag isn't restricted to any categories, and has no synonyms."
|
||||
staff_info: "To add restrictions, put this tag in a <a href=%{basePath}/tag_groups>tag group</a>."
|
||||
category_restricted: "This tag is restricted to categories you don't have permission to access."
|
||||
synonyms: "Synonyms"
|
||||
synonyms_description: "When the following tags are used, they will be replaced with <b>%{base_tag_name}</b>."
|
||||
|
|
@ -3803,7 +3804,7 @@ en:
|
|||
category_restrictions:
|
||||
one: "It can only be used in this category:"
|
||||
other: "It can only be used in these categories:"
|
||||
edit_synonyms: "Manage Synonyms"
|
||||
edit_synonyms: "Edit Synonyms"
|
||||
add_synonyms_label: "Add synonyms:"
|
||||
add_synonyms: "Add"
|
||||
add_synonyms_explanation:
|
||||
|
|
|
|||
Loading…
Reference in New Issue
Block a user