Sam's personal "minimal" topic list design

Ah I see. Just scrolled up and found your temporary fix.

@Steven can you tell me what part in that header code to adjust to bring back the excerpt of pinned topics again?

1 Like

There already is a excerpt reference, so you might want to delete line 16 first

  {{raw "list/topic-excerpt" topic=model}}

Then, I would add this

  {{#if expandPinned}}
    {{raw "list/topic-excerpt" topic=topic}}
  {{/if}}

Right after this

{{raw "list/action-list" topic=topic postNumbers=topic.liked_post_numbers className="likes" icon="heart"}}
   </div>

So just before the </td>

If you use the old header code, that should look like this

<script type='text/x-handlebars' data-template-name='list/topic-list-item.raw'>

{{#if bulkSelectEnabled}}
<td class='star'>
  <input type='checkbox' class='bulk-select'>
</td>
{{/if}}

<td class='main-link clearfix'>
  {{raw "topic-status" topic=topic}}
  {{topic-link topic}}
  {{#if controller.showTopicPostBadges}}
    {{raw "topic-post-badges" unread=topic.unread newPosts=topic.displayNewPosts unseen=topic.unseen url=topic.lastUnreadUrl}}
  {{/if}}
  {{discourse-tags topic mode="list"}}
  <div class='creator'>
  {{#if showCategory}}
     {{category-link topic.category}}
   {{/if}}
  {{~#if topic.creator ~}}
  <a href="/users/{{topic.creator.username}}" data-auto-route="true" data-user-card="{{topic.creator.username}}">{{topic.creator.username}}</a> <a href={{topic.url}}>{{format-date topic.createdAt format="tiny"}}</a>
  {{~/if ~}}
   {{raw "list/action-list" topic=topic postNumbers=topic.liked_post_numbers className="likes" icon="heart"}}
   </div>
  {{#if expandPinned}}
    {{raw "list/topic-excerpt" topic=topic}}
  {{/if}}
</td>

{{#if controller.showLikes}}
<td class="num likes">
  {{number topic.like_count}} <i class='fa fa-heart'></i>
</td>
{{/if}}

{{#if controller.showOpLikes}}
<td class="num likes">
  {{number topic.op_like_count}} <i class='fa fa-heart'></i>
</td>
{{/if}}

{{raw "list/posts-count-column" topic=topic}}

<td class="last-post">
<div class='poster-avatar'>
<a href="{{topic.lastPostUr}}" data-user-card="{{topic.last_poster_username}}">{{avatar topic.lastPoster usernamePath="username" imageSize="medium"}}</a>
</div>
<div class='poster-info'>
<a href="{{topic.lastPostUrl}}">
{{format-date topic.bumpedAt format="tiny"}}
</a>
<span class='editor'><a href="/users/{{topic.last_poster_username}}" data-auto-route="true" data-user-card="{{topic.last_poster_username}}">{{topic.last_poster_username}}</a></span>
</div>
</td>
</script>

<script type='text/x-handlebars' data-template-name='topic-list-header.raw'>
  {{#if bulkSelectEnabled}}
  <th class='star'>
    {{#if canBulkSelect}}
        <button class='btn bulk-select' title='{{i18n "topics.bulk.toggle"}}'><i class='fa fa-list'></i></button>
    {{/if}}
  </th>
  {{/if}}
  {{raw "topic-list-header-column" order='default' name='topic.title' bulkSelectEnabled=bulkSelectEnabled showBulkToggle=toggleInTitle canBulkSelect=canBulkSelect}}

  {{#if showLikes}}
     {{raw "topic-list-header-column" sortable='true' order='likes' number='true' forceName=(theme-i18n 'likes')}}
  {{/if}}
  {{#if showOpLikes}}
     {{raw "topic-list-header-column" sortable='true' order='op_likes' number='true' forceName=(theme-i18n 'likes')}}
  {{/if}}
  {{raw "topic-list-header-column" sortable='true' number='true' order='posts' forceName=(theme-i18n 'replies') }}
  {{raw "topic-list-header-column" sortable='true' order='activity' forceName=(theme-i18n 'last_post')}}
</script>

<script>

(function(){

var TopicListItemView = require('discourse/components/topic-list-item').default;


TopicListItemView.reopen({
    showCategory: function(){
        return !this.get('controller.hideCategory') &&
                this.get('topic.creator') &&
                this.get('topic.category.name') !== 'uncategorized';
    }.property()
});

})();

</script>
1 Like

I just added this code to the theme’s Header part, yet avatars still don’t show up. Am I missing something?

Tried this code as well, avatars not showing up. Even tried safe mode and disabled all plugins

FYI: the conflict with Topic List Previews prevented the excerpts to be displayed even with the code provided

1 Like

I edited my previous post, I got confused with all the different versions.

The code you added was for the newest version of Discourse. If I understand correctly, you need a to edit the header for a old version of Discourse, so I changed my last post with a version for a version previous than 2.5.0 b2

It would be easier to upgrade Discourse tho, lots of cool new features :grin:

1 Like

Which I am looking forward to :wink:

yet I prefer to stay on stable :wink:

Thx for the update!

2 Likes

@sam Are there any plans to make the theme component compatible with Topic List Previews plugin anytime soon?

No specific plans to do so

1 Like

How would I add a “users” column between the thread title and reply count with the name and/or avatar of the user who started each respective thread? Could it be done using the the customize function or the theme creator?

1 Like

I was usually using “Sam’s simple theme” (which I like very much) here on meta. Seems to bug since yesterday on my end !? I tried on a fresh install of a different browser (firefox instead of chrome), and the problem seems identical. I don’t have the upper banner, only a few topics appearing, and clicking on one doesn’t work. Everything seems fine with another theme.

1 Like

It should be fixed now. Thanks for reporting the issue @Mevo :+1:

3 Likes

Is there any way one could put in the username of the topic starter below the topic title on mobile as it is on desktop on mobile?

Mobile:

Desktop:

desktop

1 Like

Looks like the theme is not compatible with Dark schemes :frowning: and thus with Automatic Dark Mode color scheme switching

3 Likes

I have updated the theme to improve dark mode compatibility, you should see an improvement after pulling the latest changes.

8 Likes

Thanks :slight_smile:

But the category names are still broken.

image
image

2 Likes

The category badges should be fixed now, too.

2 Likes

The color of unread topics is a bit hard to read:

Default theme:
image

This theme:
image

Probably need to un-hardcode this:
https://github.com/discourse/discourse-simple-theme/blob/ce745784e99f57d19cdff7411f102260f3add303/desktop/desktop.scss#L10

1 Like

hm, looks like something is broken after recent update.

Now openning a topic from the list results in loading completely new page instead of just loading the topic with loading indicator etc. So it is a bit confusing because for a second it is unclear whether the click worked, and the editor window is lost, so it is difficult to add quotes from other topics etc.

1 Like

There was a bug related to this introduced a few days ago, but has since been fixed.

Can you please check if your site is on the latest?

/admin/upgrade

2 Likes

oh, cool :slight_smile:

Yeah, it is not latest
2.7.0.beta8 ( f002c58a30 )

2 Likes

The fix for the bug I mentioned was added a couple of days after your most recent upgrade. Can you please try upgrading again and let me know if the issue persists?

1 Like