empty_feed_notice: Style empty message feed similar to other views.

This commit is contained in:
Aman Agrawal 2023-10-20 11:39:47 +00:00 committed by Tim Abbott
parent 8e7265fbb4
commit 61bf72d30e
3 changed files with 49 additions and 38 deletions

View File

@ -2738,6 +2738,15 @@ select.invite-as {
text-align: center;
}
.empty-feed-notice-title {
font-size: 1.5em;
font-weight: 400;
}
.empty-feed-notice-description {
font-size: 1.1em;
}
.message-fade,
.user_sidebar_entry.user-fade {
opacity: 0.4;

View File

@ -1,23 +1,23 @@
<div class="empty_feed_notice">
<h4> {{ title }} </h4>
{{#if search_data}}
<div>
{{#if search_data.has_stop_word}}{{t "Some common words were excluded from your search." }} <br/>{{/if}}{{t "You searched for:" }}
{{#if search_data.stream_query}}
<span>stream: {{search_data.stream_query}}</span>
{{/if}}
{{#if search_data.topic_query}}
<span>topic: {{search_data.topic_query}}</span>
{{/if}}
{{#each search_data.query_words}}
{{#if is_stop_word}}
<del>{{query_word}}</del>
{{else}}
<span>{{query_word}}</span>
<h4 class="empty-feed-notice-title"> {{ title }} </h4>
<div class="empty-feed-notice-description">
{{#if search_data}}
{{#if search_data.has_stop_word}}{{t "Some common words were excluded from your search." }} <br/>{{/if}}{{t "You searched for:" }}
{{#if search_data.stream_query}}
<span>stream: {{search_data.stream_query}}</span>
{{/if}}
{{/each}}
{{#if search_data.topic_query}}
<span>topic: {{search_data.topic_query}}</span>
{{/if}}
{{#each search_data.query_words}}
{{#if is_stop_word}}
<del>{{query_word}}</del>
{{else}}
<span>{{query_word}}</span>
{{/if}}
{{/each}}
{{else}}
{{{ html }}}
{{/if}}
</div>
{{else}}
{{{ html }}}
{{/if}}
</div>

View File

@ -75,8 +75,10 @@ run_test("empty_narrow_html", ({mock_template}) => {
assert.equal(
actual_html,
`<div class="empty_feed_notice">
<h4> This is a title </h4>
<h1> This is the html </h1>
<h4 class="empty-feed-notice-title"> This is a title </h4>
<div class="empty-feed-notice-description">
<h1> This is the html </h1>
</div>
</div>
`,
);
@ -98,13 +100,13 @@ run_test("empty_narrow_html", ({mock_template}) => {
assert.equal(
actual_html,
`<div class="empty_feed_notice">
<h4> This is a title </h4>
<div>
Some common words were excluded from your search. <br/>You searched for:
<span>stream: new</span>
<span>topic: test</span>
<span>search</span>
<del>a</del>
<h4 class="empty-feed-notice-title"> This is a title </h4>
<div class="empty-feed-notice-description">
Some common words were excluded from your search. <br/>You searched for:
<span>stream: new</span>
<span>topic: test</span>
<span>search</span>
<del>a</del>
</div>
</div>
`,
@ -123,11 +125,11 @@ run_test("empty_narrow_html", ({mock_template}) => {
assert.equal(
actual_html,
`<div class="empty_feed_notice">
<h4> This is a title </h4>
<div>
You searched for:
<span>stream: hello world</span>
<span>searchA</span>
<h4 class="empty-feed-notice-title"> This is a title </h4>
<div class="empty-feed-notice-description">
You searched for:
<span>stream: hello world</span>
<span>searchA</span>
</div>
</div>
`,
@ -146,11 +148,11 @@ run_test("empty_narrow_html", ({mock_template}) => {
assert.equal(
actual_html,
`<div class="empty_feed_notice">
<h4> This is a title </h4>
<div>
You searched for:
<span>topic: hello</span>
<span>searchB</span>
<h4 class="empty-feed-notice-title"> This is a title </h4>
<div class="empty-feed-notice-description">
You searched for:
<span>topic: hello</span>
<span>searchB</span>
</div>
</div>
`,