mirror of
https://github.com/freedombox/FreedomBox.git
synced 2026-01-21 07:55:00 +00:00
templates: Use SVG icons for apps page and shortcuts
Signed-off-by: Sunil Mohan Adapa <sunil@medhas.org> Reviewed-by: James Valleroy <jvalleroy@mailbox.org>
This commit is contained in:
parent
a931bf3fc5
commit
b6325073c5
@ -42,7 +42,7 @@
|
||||
{% if 'fa-' in item.icon %}
|
||||
<span class="fa {{ item.icon }}"></span>
|
||||
{% else %}
|
||||
<img src="{% static 'theme/icons/' %}{{ item.icon }}.png"/>
|
||||
<img src="{% static 'theme/icons/' %}{{ item.icon }}.svg"/>
|
||||
{% endif %}
|
||||
</div>
|
||||
<div class="card-description">{{ item.short_description}}</div>
|
||||
@ -68,7 +68,7 @@
|
||||
{% if 'fa-' in item.icon %}
|
||||
<span class="fa {{ item.icon }}"></span>
|
||||
{% else %}
|
||||
<img src="{% static 'theme/icons/' %}{{ item.icon }}.png"/>
|
||||
<img src="{% static 'theme/icons/' %}{{ item.icon }}.svg"/>
|
||||
{% endif %}
|
||||
</div>
|
||||
<div class="card-description">{{ item.short_description}}</div>
|
||||
|
||||
@ -83,7 +83,7 @@
|
||||
{% if "custom" in shortcut.icon %}
|
||||
<img src="{{ shortcut.icon }}"/>
|
||||
{% else %}
|
||||
<img src="{% static 'theme/icons/' %}{{ shortcut.icon }}.png"/>
|
||||
<img src="{% static 'theme/icons/' %}{{ shortcut.icon }}.svg"/>
|
||||
{% endif %}
|
||||
</div>
|
||||
<div class="card-description">
|
||||
|
||||
@ -290,12 +290,12 @@ footer {
|
||||
|
||||
/* Enabled app icons */
|
||||
.apps-page .card-list-primary .card-icon img {
|
||||
transition: filter 0.3s;
|
||||
filter: contrast(0.2) sepia(1) hue-rotate(171deg) contrast(2);
|
||||
transition: filter 0.3s;
|
||||
filter: contrast(0.2) sepia(1) hue-rotate(171deg) contrast(2);
|
||||
}
|
||||
|
||||
.apps-page .card-list-primary .card:hover .card-icon img {
|
||||
filter: none;
|
||||
filter: none;
|
||||
}
|
||||
|
||||
/* Disabled app icons */
|
||||
@ -378,7 +378,7 @@ a.menu_link_active {
|
||||
|
||||
/* Enable apps - green glow */
|
||||
.card-list-primary .card-icon {
|
||||
background: radial-gradient(farthest-side at bottom,#eefff0, white);
|
||||
background: radial-gradient(farthest-side at bottom, #eefff0, white);
|
||||
background-position: 50% 100%;
|
||||
background-repeat: no-repeat;
|
||||
background-size: 150% 25%;
|
||||
@ -386,12 +386,17 @@ a.menu_link_active {
|
||||
|
||||
/* Disabled apps - grey glow */
|
||||
.card-list-secondary .card-icon {
|
||||
background: radial-gradient(farthest-side at bottom,#f0f0f0, white);
|
||||
background: radial-gradient(farthest-side at bottom, #f0f0f0, white);
|
||||
background-position: 50% 100%;
|
||||
background-repeat: no-repeat;
|
||||
background-size: 150% 25%;
|
||||
}
|
||||
|
||||
.card-icon img {
|
||||
width: 128px;
|
||||
height: 128px;
|
||||
}
|
||||
|
||||
.card-icon span {
|
||||
width: 100px;
|
||||
height: 100px;
|
||||
|
||||
Loading…
x
Reference in New Issue
Block a user