Compare commits

...
This repository has been archived on 2023-03-18. You can view files and clone it, but cannot push or open issues or pull requests.

1 Commits

Author SHA1 Message Date
David Taylor
0938fb0a11
DEV: Merge mobile and desktop component templates 2023-02-14 14:53:08 +00:00
17 changed files with 429 additions and 408 deletions

View File

@ -1,49 +1,56 @@
{{#if this.categories}}
{{#if this.filteredCategories}}
<table class="category-list {{if this.showTopics 'with-topics'}}">
<thead>
<tr>
<th class="category"><span
role="heading"
aria-level="2"
id="categories-only-category"
>{{i18n "categories.category"}}</span></th>
<th class="topics">{{i18n "categories.topics"}}</th>
{{#if this.showTopics}}
<th class="latest">{{i18n "categories.latest"}}</th>
{{/if}}
</tr>
</thead>
<tbody aria-labelledby="categories-only-category">
{{#each this.categories as |category|}}
<ParentCategoryRow
@category={{category}}
@showTopics={{this.showTopics}}
/>
{{/each}}
</tbody>
</table>
{{/if}}
{{#if this.site.mobileView}}
{{#if this.categories}}
{{#if this.filteredCategories}}
<div class="category-list {{if this.showTopics 'with-topics'}}">
{{#each this.filteredCategories as |c|}}
<ParentCategoryRow
@category={{c}}
@showTopics={{this.showTopics}}
/>
{{/each}}
</div>
{{/if}}
{{#if this.mutedCategories}}
<div class="muted-categories">
<a href class="muted-categories-link" {{on "click" this.toggleShowMuted}}>
<h3 class="muted-categories-heading">{{i18n "categories.muted"}}</h3>
{{#if this.mutedToggleIcon}}
{{d-icon this.mutedToggleIcon}}
{{/if}}
</a>
<table
class="category-list
{{if this.showTopics 'with-topics'}}
{{unless this.showMutedCategories 'hidden'}}"
>
{{#if this.mutedCategories}}
<div class="muted-categories">
<a
href
class="muted-categories-link"
{{on "click" this.toggleShowMuted}}
>
<h3 class="muted-categories-heading">{{i18n
"categories.muted"
}}</h3>
{{#if this.mutedToggleIcon}}
{{d-icon this.mutedToggleIcon}}
{{/if}}
</a>
<div
class="category-list
{{if this.showTopics 'with-topics'}}
{{unless this.showMutedCategories 'hidden'}}"
>
{{#each this.mutedCategories as |c|}}
<ParentCategoryRow
@category={{c}}
@showTopics={{this.showTopics}}
@listType="muted"
/>
{{/each}}
</div>
</div>
{{/if}}
{{/if}}
{{else}}
{{#if this.filteredCategories}}
<table class="category-list {{if this.showTopics 'with-topics'}}">
<thead>
<tr>
<th class="category"><span
role="heading"
aria-level="2"
id="categories-only-category-muted"
id="categories-only-category"
>{{i18n "categories.category"}}</span></th>
<th class="topics">{{i18n "categories.topics"}}</th>
{{#if this.showTopics}}
@ -51,17 +58,59 @@
{{/if}}
</tr>
</thead>
<tbody aria-labelledby="categories-only-category-muted">
<tbody aria-labelledby="categories-only-category">
{{#each this.categories as |category|}}
<ParentCategoryRow
@category={{category}}
@showTopics={{this.showTopics}}
@listType="muted"
/>
{{/each}}
</tbody>
</table>
</div>
{{/if}}
{{#if this.mutedCategories}}
<div class="muted-categories">
<a
href
class="muted-categories-link"
{{on "click" this.toggleShowMuted}}
>
<h3 class="muted-categories-heading">{{i18n "categories.muted"}}</h3>
{{#if this.mutedToggleIcon}}
{{d-icon this.mutedToggleIcon}}
{{/if}}
</a>
<table
class="category-list
{{if this.showTopics 'with-topics'}}
{{unless this.showMutedCategories 'hidden'}}"
>
<thead>
<tr>
<th class="category"><span
role="heading"
aria-level="2"
id="categories-only-category-muted"
>{{i18n "categories.category"}}</span></th>
<th class="topics">{{i18n "categories.topics"}}</th>
{{#if this.showTopics}}
<th class="latest">{{i18n "categories.latest"}}</th>
{{/if}}
</tr>
</thead>
<tbody aria-labelledby="categories-only-category-muted">
{{#each this.categories as |category|}}
<ParentCategoryRow
@category={{category}}
@showTopics={{this.showTopics}}
@listType="muted"
/>
{{/each}}
</tbody>
</table>
</div>
{{/if}}
{{/if}}
{{/if}}

View File

@ -1,16 +1,56 @@
<td><UserInfo @user={{this.item.user}} /></td>
{{#each this.columns as |column|}}
<td>
{{#if (directory-column-is-user-field column=column)}}
{{directory-item-user-field-value item=this.item column=column}}
{{else}}
{{directory-item-value item=this.item column=column}}
{{/if}}
</td>
{{/each}}
{{#if this.site.mobileView}}
<td><UserInfo @user={{this.item.user}} /></td>
{{#each this.columns as |column|}}
<td>
{{#if (directory-column-is-user-field column=column)}}
{{directory-item-user-field-value item=this.item column=column}}
{{else}}
{{directory-item-value item=this.item column=column}}
{{/if}}
</td>
{{/each}}
{{#if this.showTimeRead}}
<td><span class="time-read">{{format-duration
this.item.time_read
}}</span></td>
{{#if this.showTimeRead}}
<td><span class="time-read">{{format-duration
this.item.time_read
}}</span></td>
{{/if}}
{{else}}
<UserInfo @user={{this.item.user}} />
{{#each this.columns as |column|}}
{{#if (directory-column-is-user-field column=column)}}
{{#if (get this.item.user.user_fields column.user_field_id)}}
<div class="user-stat">
<span class="value user-field">
{{directory-item-user-field-value item=this.item column=column}}
</span>
<span class="label">
{{column.name}}
</span>
</div>
{{/if}}
{{else}}
<div class="user-stat">
<span class="value">
{{directory-item-value item=this.item column=column}}
</span>
<span class="label">
{{#if column.icon}}
{{d-icon column.icon}}
{{/if}}
{{mobile-directory-item-label item=this.item column=column}}
</span>
</div>
{{/if}}
{{/each}}
{{#if this.showTimeRead}}
<UserStat
@value={{this.item.time_read}}
@label="directory.time_read"
@type="duration"
/>
{{/if}}
{{/if}}

View File

@ -1,13 +1,39 @@
{{#each this.navItems as |navItem|}}
<NavigationItem
@content={{navItem}}
@filterMode={{this.filterMode}}
@category={{this.category}}
@class={{concat "nav-item_" navItem.name}}
{{#if this.site.mobileView}}
<li class="navigation-toggle">
<a href {{on "click" this.toggleDrop}} class="toggle-link">
{{this.selectedNavItem.displayName}}
{{d-icon "caret-down"}}
</a>
</li>
{{#if this.expanded}}
<ul class="drop">
{{#each this.navItems as |navItem|}}
<NavigationItem
@content={{navItem}}
@filterMode={{this.filterMode}}
@category={{this.category}}
@class={{concat "nav-item_" navItem.name}}
/>
{{/each}}
<PluginOutlet
@name="extra-nav-item"
@connectorTagName="li"
@outletArgs={{hash category=this.category filterMode=this.filterMode}}
/>
</ul>
{{/if}}
{{else}}
{{#each this.navItems as |navItem|}}
<NavigationItem
@content={{navItem}}
@filterMode={{this.filterMode}}
@category={{this.category}}
@class={{concat "nav-item_" navItem.name}}
/>
{{/each}}
<PluginOutlet
@name="extra-nav-item"
@connectorTagName="li"
@outletArgs={{hash category=this.category filterMode=this.filterMode}}
/>
{{/each}}
<PluginOutlet
@name="extra-nav-item"
@connectorTagName="li"
@outletArgs={{hash category=this.category filterMode=this.filterMode}}
/>
{{/if}}

View File

@ -4,85 +4,153 @@
@outletArgs={{hash category=this.category}}
/>
<tr
data-category-id={{this.category.id}}
data-notification-level={{this.category.notificationLevelString}}
class="{{if
this.category.description_excerpt
'has-description'
'no-description'
}}
{{if this.category.uploaded_logo.url 'has-logo' 'no-logo'}}"
>
<td
class="category
{{if this.isMuted 'muted'}}
{{if this.noCategoryStyle 'no-category-style'}}"
style={{unless
this.noCategoryStyle
(html-safe
(concat
(border-color this.category.color)
(category-color-variable this.category.color)
)
)
}}
{{#if this.site.mobileView}}
<div
data-category-id={{this.category.id}}
data-notification-level={{this.category.notificationLevelString}}
style={{border-color this.category.color}}
class="category-list-item category {{if this.isMuted 'muted'}}"
>
<CategoryTitleLink @category={{this.category}} />
<PluginOutlet
@name="below-category-title-link"
@connectorTagName="div"
@outletArgs={{hash category=this.category}}
/>
{{#if this.category.description_excerpt}}
<div class="category-description">
{{dir-span this.category.description_excerpt htmlSafe="true"}}
</div>
{{/if}}
{{#if this.category.isGrandParent}}
<table class="category-list subcategories-with-subcategories">
<tbody>
<table class="topic-list">
<tbody>
<tr>
<th class="main-link">
<CategoryTitleLink @category={{this.category}} />
</th>
</tr>
{{#if this.category.description_excerpt}}
<tr class="category-description">
<td colspan="3">
{{html-safe this.category.description_excerpt}}
</td>
</tr>
{{/if}}
{{#unless this.isMuted}}
{{#if this.showTopics}}
{{#each this.category.topics as |t|}}
<MobileCategoryTopic @topic={{t}} />
{{/each}}
{{/if}}
{{/unless}}
{{#if this.category.isGrandParent}}
{{#each this.category.subcategories as |subcategory|}}
<SubCategoryRow
@category={{subcategory}}
@listType={{this.listType}}
/>
{{/each}}
</tbody>
</table>
{{else if this.category.subcategories}}
<div class="subcategories">
{{#each this.category.subcategories as |subcategory|}}
<SubCategoryItem
@category={{subcategory}}
@listType={{this.listType}}
/>
{{/each}}
{{else if this.category.subcategories}}
<tr class="subcategories-list">
<td>
<div class="subcategories">
{{#each this.category.subcategories as |subcategory|}}
<SubCategoryItem
@category={{subcategory}}
@listType={{this.listType}}
/>
{{/each}}
</div>
</td>
</tr>
{{/if}}
</tbody>
</table>
<footer class="clearfix category-topics-count">
<div class="category-stat">
<a href={{this.category.url}}>
{{html-safe this.category.statTotal}}
</a>
</div>
{{/if}}
</td>
{{#unless this.category.pickAll}}
<div class="category-stat">
<a href={{this.category.url}}>
{{html-safe this.category.stat}}
</a>
</div>
{{/unless}}
</footer>
</div>
{{else}}
<tr
data-category-id={{this.category.id}}
data-notification-level={{this.category.notificationLevelString}}
class="{{if
this.category.description_excerpt
'has-description'
'no-description'
}}
{{if this.category.uploaded_logo.url 'has-logo' 'no-logo'}}"
>
<td
class="category
{{if this.isMuted 'muted'}}
{{if this.noCategoryStyle 'no-category-style'}}"
style={{unless
this.noCategoryStyle
(html-safe
(concat
(border-color this.category.color)
(category-color-variable this.category.color)
)
)
}}
>
<CategoryTitleLink @category={{this.category}} />
<PluginOutlet
@name="below-category-title-link"
@connectorTagName="div"
@outletArgs={{hash category=this.category}}
/>
<td class="topics">
<div title={{this.category.statTitle}}>{{html-safe
this.category.stat
}}</div>
<CategoryUnread
@category={{this.category}}
@tagName="div"
@class="unread-new"
/>
</td>
{{#if this.category.description_excerpt}}
<div class="category-description">
{{dir-span this.category.description_excerpt htmlSafe="true"}}
</div>
{{/if}}
{{#unless this.isMuted}}
{{#if this.showTopics}}
<td class="latest">
{{#each this.category.featuredTopics as |t|}}
<FeaturedTopic @topic={{t}} />
{{/each}}
</td>
{{/if}}
{{/unless}}
</tr>
{{#if this.category.isGrandParent}}
<table class="category-list subcategories-with-subcategories">
<tbody>
{{#each this.category.subcategories as |subcategory|}}
<SubCategoryRow
@category={{subcategory}}
@listType={{this.listType}}
/>
{{/each}}
</tbody>
</table>
{{else if this.category.subcategories}}
<div class="subcategories">
{{#each this.category.subcategories as |subcategory|}}
<SubCategoryItem
@category={{subcategory}}
@listType={{this.listType}}
/>
{{/each}}
</div>
{{/if}}
</td>
<td class="topics">
<div title={{this.category.statTitle}}>{{html-safe
this.category.stat
}}</div>
<CategoryUnread
@category={{this.category}}
@tagName="div"
@class="unread-new"
/>
</td>
{{#unless this.isMuted}}
{{#if this.showTopics}}
<td class="latest">
{{#each this.category.featuredTopics as |t|}}
<FeaturedTopic @topic={{t}} />
{{/each}}
</td>
{{/if}}
{{/unless}}
</tr>
{{/if}}
{{/unless}}

View File

@ -1,9 +1,13 @@
{{#unless this.isMuted}}
<span class="subcategory">
<CategoryTitleBefore @category={{this.category}} />
{{category-link this.category hideParent="true"}}
{{#unless this.hideUnread}}
<CategoryUnread @category={{this.category}} />
{{/unless}}
</span>
{{#if this.site.mobileView}}
{{category-link this.category}}
{{else}}
<span class="subcategory">
<CategoryTitleBefore @category={{this.category}} />
{{category-link this.category hideParent="true"}}
{{#unless this.hideUnread}}
<CategoryUnread @category={{this.category}} />
{{/unless}}
</span>
{{/if}}
{{/unless}}

View File

@ -1,35 +1,59 @@
{{#unless this.isHidden}}
<tr
data-category-id={{this.category.id}}
data-notification-level={{this.category.notificationLevelString}}
class="{{if
this.category.description_excerpt
'has-description'
'no-description'
}}
{{if this.category.uploaded_logo.url 'has-logo' 'no-logo'}}"
>
<td
class="category {{if this.isMuted 'muted'}}"
style={{border-color this.category.color}}
{{#if this.site.mobileView}}
<tr
data-category-id={{this.category.id}}
data-notification-level={{this.category.notificationLevelString}}
class="{{if
this.category.description_excerpt
'has-description'
'no-description'
}}
{{if this.category.uploaded_logo.url 'has-logo' 'no-logo'}}"
>
<CategoryTitleLink @tagName="h4" @category={{this.category}} />
{{#if this.category.description_excerpt}}
<div class="category-description subcategory-description">
{{dir-span this.category.description_excerpt htmlSafe="true"}}
<td
class="category {{if this.isMuted 'muted'}}"
style={{border-color this.category.color}}
>
<CategoryTitleLink @tagName="h4" @category={{this.category}} />
{{#if this.category.description_excerpt}}
<div class="category-description subcategory-description">
{{dir-span this.category.description_excerpt htmlSafe="true"}}
</div>
{{/if}}
{{#if this.category.subcategories}}
<div class="subcategories">
{{#each this.category.subcategories as |subsubcategory|}}
<SubCategoryItem
@category={{subsubcategory}}
@hideUnread="true"
@listType={{this.listType}}
/>
{{/each}}
</div>
{{/if}}
</td>
</tr>
{{else}}
<tr
data-category-id={{this.category.id}}
style={{border-color this.category.color}}
class="subcategory-list-item category {{if this.isMuted 'muted'}}"
>
<td>
<CategoryTitleLink @tagName="h4" @category={{this.category}} />
<div class="subcategories-list">
{{#if this.category.subcategories}}
<div class="subcategories">
{{#each this.category.subcategories as |subcategory|}}
<SubCategoryItem
@category={{subcategory}}
@listType={{this.listType}}
/>
{{/each}}
</div>
{{/if}}
</div>
{{/if}}
{{#if this.category.subcategories}}
<div class="subcategories">
{{#each this.category.subcategories as |subsubcategory|}}
<SubCategoryItem
@category={{subsubcategory}}
@hideUnread="true"
@listType={{this.listType}}
/>
{{/each}}
</div>
{{/if}}
</td>
</tr>
</td>
</tr>
{{/if}}
{{/unless}}

View File

@ -1,24 +1,43 @@
{{#each this.categories as |category|}}
<table class="category-list subcategory-list with-topics">
<thead>
<tr>
<th class="parent-category">
<CategoryTitleLink @category={{category}} />
<span class="stat" title={{category.statTitle}}>{{html-safe
category.stat
}}</span>
</th>
<th class="topics">{{i18n "categories.topics"}}</th>
<th class="latest">{{i18n "categories.latest"}}</th>
</tr>
</thead>
<tbody aria-labelledby="categories-only-category">
{{#each category.subcategories as |subCategory|}}
<ParentCategoryRow @category={{subCategory}} @showTopics={{true}} />
{{else}}
{{! No subcategories... so just show the parent to avoid confusion }}
<ParentCategoryRow @category={{category}} @showTopics={{true}} />
{{/each}}
</tbody>
</table>
{{#if this.site.mobileView}}
<div class="category-list subcategory-list with-topics">
<div class="parent-category">
<CategoryTitleLink @category={{category}} />
<span class="stat" title={{category.statTitle}}>{{html-safe
category.stat
}}</span>
</div>
<div class="subcategories">
{{#each category.subcategories as |subCategory|}}
<ParentCategoryRow @category={{subCategory}} @showTopics={{true}} />
{{else}}
{{! No subcategories... so just show the parent to avoid confusion }}
<ParentCategoryRow @category={{category}} @showTopics={{true}} />
{{/each}}
</div>
</div>
{{else}}
<table class="category-list subcategory-list with-topics">
<thead>
<tr>
<th class="parent-category">
<CategoryTitleLink @category={{category}} />
<span class="stat" title={{category.statTitle}}>{{html-safe
category.stat
}}</span>
</th>
<th class="topics">{{i18n "categories.topics"}}</th>
<th class="latest">{{i18n "categories.latest"}}</th>
</tr>
</thead>
<tbody aria-labelledby="categories-only-category">
{{#each category.subcategories as |subCategory|}}
<ParentCategoryRow @category={{subCategory}} @showTopics={{true}} />
{{else}}
{{! No subcategories... so just show the parent to avoid confusion }}
<ParentCategoryRow @category={{category}} @showTopics={{true}} />
{{/each}}
</tbody>
</table>
{{/if}}
{{/each}}

View File

@ -1,33 +0,0 @@
{{#if this.categories}}
{{#if this.filteredCategories}}
<div class="category-list {{if this.showTopics 'with-topics'}}">
{{#each this.filteredCategories as |c|}}
<ParentCategoryRow @category={{c}} @showTopics={{this.showTopics}} />
{{/each}}
</div>
{{/if}}
{{#if this.mutedCategories}}
<div class="muted-categories">
<a href class="muted-categories-link" {{on "click" this.toggleShowMuted}}>
<h3 class="muted-categories-heading">{{i18n "categories.muted"}}</h3>
{{#if this.mutedToggleIcon}}
{{d-icon this.mutedToggleIcon}}
{{/if}}
</a>
<div
class="category-list
{{if this.showTopics 'with-topics'}}
{{unless this.showMutedCategories 'hidden'}}"
>
{{#each this.mutedCategories as |c|}}
<ParentCategoryRow
@category={{c}}
@showTopics={{this.showTopics}}
@listType="muted"
/>
{{/each}}
</div>
</div>
{{/if}}
{{/if}}

View File

@ -1 +0,0 @@
<CategoriesOnly @categories={{this.categories}} @showTopics="true" />

View File

@ -1,37 +0,0 @@
<UserInfo @user={{this.item.user}} />
{{#each this.columns as |column|}}
{{#if (directory-column-is-user-field column=column)}}
{{#if (get this.item.user.user_fields column.user_field_id)}}
<div class="user-stat">
<span class="value user-field">
{{directory-item-user-field-value item=this.item column=column}}
</span>
<span class="label">
{{column.name}}
</span>
</div>
{{/if}}
{{else}}
<div class="user-stat">
<span class="value">
{{directory-item-value item=this.item column=column}}
</span>
<span class="label">
{{#if column.icon}}
{{d-icon column.icon}}
{{/if}}
{{mobile-directory-item-label item=this.item column=column}}
</span>
</div>
{{/if}}
{{/each}}
{{#if this.showTimeRead}}
<UserStat
@value={{this.item.time_read}}
@label="directory.time_read"
@type="duration"
/>
{{/if}}

View File

@ -1,23 +0,0 @@
<li class="navigation-toggle">
<a href {{on "click" this.toggleDrop}} class="toggle-link">
{{this.selectedNavItem.displayName}}
{{d-icon "caret-down"}}
</a>
</li>
{{#if this.expanded}}
<ul class="drop">
{{#each this.navItems as |navItem|}}
<NavigationItem
@content={{navItem}}
@filterMode={{this.filterMode}}
@category={{this.category}}
@class={{concat "nav-item_" navItem.name}}
/>
{{/each}}
<PluginOutlet
@name="extra-nav-item"
@connectorTagName="li"
@outletArgs={{hash category=this.category filterMode=this.filterMode}}
/>
</ul>
{{/if}}

View File

@ -1,71 +0,0 @@
{{#unless this.isHidden}}
<PluginOutlet
@name="category-list-above-each-category"
@outletArgs={{hash category=this.category}}
/>
<div
data-category-id={{this.category.id}}
data-notification-level={{this.category.notificationLevelString}}
style={{border-color this.category.color}}
class="category-list-item category {{if this.isMuted 'muted'}}"
>
<table class="topic-list">
<tbody>
<tr>
<th class="main-link">
<CategoryTitleLink @category={{this.category}} />
</th>
</tr>
{{#if this.category.description_excerpt}}
<tr class="category-description">
<td colspan="3">
{{html-safe this.category.description_excerpt}}
</td>
</tr>
{{/if}}
{{#unless this.isMuted}}
{{#if this.showTopics}}
{{#each this.category.topics as |t|}}
<MobileCategoryTopic @topic={{t}} />
{{/each}}
{{/if}}
{{/unless}}
{{#if this.category.isGrandParent}}
{{#each this.category.subcategories as |subcategory|}}
<SubCategoryRow
@category={{subcategory}}
@listType={{this.listType}}
/>
{{/each}}
{{else if this.category.subcategories}}
<tr class="subcategories-list">
<td>
<div class="subcategories">
{{#each this.category.subcategories as |subcategory|}}
<SubCategoryItem
@category={{subcategory}}
@listType={{this.listType}}
/>
{{/each}}
</div>
</td>
</tr>
{{/if}}
</tbody>
</table>
<footer class="clearfix category-topics-count">
<div class="category-stat">
<a href={{this.category.url}}>
{{html-safe this.category.statTotal}}
</a>
</div>
{{#unless this.category.pickAll}}
<div class="category-stat">
<a href={{this.category.url}}>
{{html-safe this.category.stat}}
</a>
</div>
{{/unless}}
</footer>
</div>
{{/unless}}

View File

@ -1,3 +0,0 @@
{{#unless this.isMuted}}
{{category-link this.category}}
{{/unless}}

View File

@ -1,23 +0,0 @@
{{#unless this.isHidden}}
<tr
data-category-id={{this.category.id}}
style={{border-color this.category.color}}
class="subcategory-list-item category {{if this.isMuted 'muted'}}"
>
<td>
<CategoryTitleLink @tagName="h4" @category={{this.category}} />
<div class="subcategories-list">
{{#if this.category.subcategories}}
<div class="subcategories">
{{#each this.category.subcategories as |subcategory|}}
<SubCategoryItem
@category={{subcategory}}
@listType={{this.listType}}
/>
{{/each}}
</div>
{{/if}}
</div>
</td>
</tr>
{{/unless}}

View File

@ -1,18 +0,0 @@
{{#each this.categories as |category|}}
<div class="category-list subcategory-list with-topics">
<div class="parent-category">
<CategoryTitleLink @category={{category}} />
<span class="stat" title={{category.statTitle}}>{{html-safe
category.stat
}}</span>
</div>
<div class="subcategories">
{{#each category.subcategories as |subCategory|}}
<ParentCategoryRow @category={{subCategory}} @showTopics={{true}} />
{{else}}
{{! No subcategories... so just show the parent to avoid confusion }}
<ParentCategoryRow @category={{category}} @showTopics={{true}} />
{{/each}}
</div>
</div>
{{/each}}