mirror of
https://github.com/wallabag/wallabag.git
synced 2024-12-23 08:06:33 +00:00
Merge pull request #3077 from wallabag/add-tags-list-view
Added tags on list view
This commit is contained in:
commit
757ec837be
6 changed files with 90 additions and 19 deletions
|
@ -132,6 +132,7 @@
|
||||||
background-color: $blueAccentColor;
|
background-color: $blueAccentColor;
|
||||||
padding: 0 15px 0 10px;
|
padding: 0 15px 0 10px;
|
||||||
margin: auto 2px;
|
margin: auto 2px;
|
||||||
|
border-radius: 6px;
|
||||||
|
|
||||||
a,
|
a,
|
||||||
i {
|
i {
|
||||||
|
|
|
@ -175,15 +175,66 @@ a.original:not(.waves-effect) {
|
||||||
}
|
}
|
||||||
|
|
||||||
.card-stacked {
|
.card-stacked {
|
||||||
|
display: flex;
|
||||||
|
flex-flow: row wrap;
|
||||||
|
|
||||||
&:hover ul.tools-list {
|
&:hover ul.tools-list {
|
||||||
display: block;
|
display: inline;
|
||||||
|
text-align: right;
|
||||||
|
}
|
||||||
|
|
||||||
|
.preview {
|
||||||
|
max-width: 100px;
|
||||||
|
height: auto;
|
||||||
|
margin-right: 10px;
|
||||||
|
flex: 1;
|
||||||
|
|
||||||
|
img {
|
||||||
|
max-width: 100%;
|
||||||
|
max-height: 100%;
|
||||||
|
}
|
||||||
|
}
|
||||||
|
|
||||||
|
div.metadata {
|
||||||
|
.chip {
|
||||||
|
background-color: $blueAccentColor;
|
||||||
|
padding: 0 15px 0 10px;
|
||||||
|
margin: auto 2px;
|
||||||
|
border-radius: 6px;
|
||||||
|
|
||||||
|
a,
|
||||||
|
i {
|
||||||
|
color: #fff;
|
||||||
|
}
|
||||||
|
|
||||||
|
i.material-icons {
|
||||||
|
float: right;
|
||||||
|
font-size: 20px;
|
||||||
|
line-height: 32px;
|
||||||
|
padding-left: 8px;
|
||||||
|
}
|
||||||
|
}
|
||||||
|
}
|
||||||
|
|
||||||
|
div.card-content {
|
||||||
|
flex: 4;
|
||||||
}
|
}
|
||||||
|
|
||||||
ul.tools-list {
|
ul.tools-list {
|
||||||
|
flex: 1;
|
||||||
display: none;
|
display: none;
|
||||||
|
flex-basis: 5em;
|
||||||
|
align-self: flex-end;
|
||||||
|
float: right;
|
||||||
|
max-width: 6em;
|
||||||
}
|
}
|
||||||
}
|
}
|
||||||
|
|
||||||
|
#content .collection .collection-item {
|
||||||
|
min-height: 65px;
|
||||||
|
height: auto;
|
||||||
|
}
|
||||||
|
|
||||||
.quickstart .card .card-action a,
|
.quickstart .card .card-action a,
|
||||||
.quickstart .card .card-action a:hover {
|
.quickstart .card .card-action a:hover {
|
||||||
color: #fff !important;
|
color: #fff !important;
|
||||||
|
|
|
@ -2,6 +2,15 @@
|
||||||
* Entries
|
* Entries
|
||||||
* ========================================================================== */
|
* ========================================================================== */
|
||||||
|
|
||||||
|
.collection {
|
||||||
|
margin: 15px 15px 0;
|
||||||
|
|
||||||
|
.collection-item {
|
||||||
|
padding: 7px;
|
||||||
|
height: 65px;
|
||||||
|
}
|
||||||
|
}
|
||||||
|
|
||||||
.results {
|
.results {
|
||||||
height: 1em;
|
height: 1em;
|
||||||
|
|
||||||
|
|
|
@ -1,18 +1,28 @@
|
||||||
<div class="card">
|
<div class="card-stacked">
|
||||||
<div class="card-stacked">
|
<div class="preview">{% if entry.previewPicture is not null %}<img src="{{ entry.previewPicture }}" />{% endif %}</div>
|
||||||
<div class="card-content">
|
<div class="card-content">
|
||||||
<span class="card-title dot-ellipsis dot-resize-update">
|
<span class="card-title dot-ellipsis dot-resize-update">
|
||||||
<a href="{{ path('view', { 'id': entry.id }) }}" title="{{ entry.title | striptags | e('html_attr') }}">
|
<a href="{{ path('view', { 'id': entry.id }) }}" title="{{ entry.title | striptags | e('html_attr') }}">
|
||||||
{{ entry.title| striptags | truncate(120, true, '…') | raw }}
|
{{ entry.title| striptags | truncate(120, true, '…') | raw }}
|
||||||
</a>
|
</a>
|
||||||
</span>
|
</span>
|
||||||
<ul class="tools-list right">
|
|
||||||
<li>
|
<div class="metadata">
|
||||||
<a title="{{ 'entry.list.toogle_as_read'|trans }}" class="tool grey-text" href="{{ path('archive_entry', { 'id': entry.id }) }}"><i class="material-icons">{% if entry.isArchived == 0 %}done{% else %}redo{% endif %}</i></a>
|
<a href="{{ entry.url|e }}" class="grey-text domain" target="_blank" title="{{ entry.domainName|removeWww }}">
|
||||||
<a title="{{ 'entry.list.toogle_as_star'|trans }}" class="tool grey-text" href="{{ path('star_entry', { 'id': entry.id }) }}"><i class="material-icons">{% if entry.isStarred == 0 %}star_border{% else %}star{% endif %}</i></a>
|
<span>{{ entry.domainName|removeWww }}</span>
|
||||||
<a title="{{ 'entry.list.delete'|trans }}" onclick="return confirm('{{ 'entry.confirm.delete'|trans|escape('js') }}')" class="tool grey-text delete" href="{{ path('delete_entry', { 'id': entry.id }) }}"><i class="material-icons">delete</i></a>
|
</a>
|
||||||
</li>
|
{% for tag in entry.tags | slice(0, 3) %}
|
||||||
</ul>
|
<span class="chip hide-on-med-and-down">
|
||||||
|
<a href="{{ path('tag_entries', {'slug': tag.slug}) }}">{{ tag.label }}</a>
|
||||||
|
</span>
|
||||||
|
{% endfor %}
|
||||||
</div>
|
</div>
|
||||||
</div>
|
</div>
|
||||||
|
<ul class="tools-list hide-on-small-only">
|
||||||
|
<li>
|
||||||
|
<a title="{{ 'entry.list.toogle_as_read'|trans }}" class="tool grey-text" href="{{ path('archive_entry', { 'id': entry.id }) }}"><i class="material-icons">{% if entry.isArchived == 0 %}done{% else %}redo{% endif %}</i></a>
|
||||||
|
<a title="{{ 'entry.list.toogle_as_star'|trans }}" class="tool grey-text" href="{{ path('star_entry', { 'id': entry.id }) }}"><i class="material-icons">{% if entry.isStarred == 0 %}star_border{% else %}star{% endif %}</i></a>
|
||||||
|
<a title="{{ 'entry.list.delete'|trans }}" onclick="return confirm('{{ 'entry.confirm.delete'|trans|escape('js') }}')" class="tool grey-text delete" href="{{ path('delete_entry', { 'id': entry.id }) }}"><i class="material-icons">delete</i></a>
|
||||||
|
</li>
|
||||||
|
</ul>
|
||||||
</div>
|
</div>
|
||||||
|
|
|
@ -24,9 +24,9 @@
|
||||||
</div>
|
</div>
|
||||||
|
|
||||||
<br />
|
<br />
|
||||||
<ul class="row data">
|
<ul class="{% if listMode == 1 %}collection{% else %}row data{% endif %}">
|
||||||
{% for entry in entries %}
|
{% for entry in entries %}
|
||||||
<li id="entry-{{ entry.id|e }}" class="col {% if listMode == 0 %}l3 m6{% endif %} s12">
|
<li id="entry-{{ entry.id|e }}" class="col {% if listMode == 0 %}l3 m6{% else %}collection-item{% endif %} s12">
|
||||||
{% if listMode == 1 %}
|
{% if listMode == 1 %}
|
||||||
{% include "@WallabagCore/themes/material/Entry/_card_list.html.twig" with {'entry': entry} only %}
|
{% include "@WallabagCore/themes/material/Entry/_card_list.html.twig" with {'entry': entry} only %}
|
||||||
{% elseif entry.previewPicture is null %}
|
{% elseif entry.previewPicture is null %}
|
||||||
|
|
File diff suppressed because one or more lines are too long
Loading…
Reference in a new issue