Fix active indicator and add proper separation between screenshot and preview

Signed-off-by: Julius Härtl <jus@bitgrid.net>
This commit is contained in:
Julius Härtl 2018-05-29 17:17:00 +02:00
parent 92b31e49a7
commit 1ad8ea75b5
No known key found for this signature in database
GPG Key ID: 4C614C6ED2CDE6DF
4 changed files with 9 additions and 6 deletions

View File

@ -486,7 +486,7 @@ class AppSettingsController extends Controller {
$appStoreData = $manager->getApp($appData['id']);
$appData['appstoreData'] = $appStoreData;
$appData['license'] = $appStoreData['releases'][0]['licenses'];
$appData['preview'] = isset($appStoreData['screenshots'][0]['url']) ? 'https://usercontent.apps.nextcloud.com/'.base64_encode($appStoreData['screenshots'][0]['url']) : '';
$appData['screenshot'] = isset($appStoreData['screenshots'][0]['url']) ? 'https://usercontent.apps.nextcloud.com/'.base64_encode($appStoreData['screenshots'][0]['url']) : '';
return $appData;
}, $apps);

View File

@ -53,7 +53,7 @@
</div>
<div id="apps-list-empty" class="emptycontent emptycontent-search" v-if="!loading && searchApps.length === 0 && apps.length === 0">
<div id="app-list-empty-icon" class="icon-search"></div>
<div id="app-list-empty-icon" class="icon-settings-dark"></div>
<h2>{{ t('settings', 'No apps found for your versoin')}}</h2>
</div>

View File

@ -24,11 +24,14 @@
<div class="section" v-bind:class="{ selected: isSelected }">
<div class="app-image app-image-icon" v-on:click="showAppDetails">
<div v-if="!app.preview" class="icon-settings-dark"></div>
<img v-if="!app.previewAsIcon && app.preview" :src="app.preview" width="100%" />
<svg v-if="app.previewAsIcon && app.preview" width="32" height="32" viewBox="0 0 32 32">
<img v-if="!app.previewAsIcon && app.preview && listView" :src="app.preview" width="100%" />
<svg v-if="listView && app.previewAsIcon && app.preview" width="32" height="32" viewBox="0 0 32 32">
<defs><filter :id="filterId"><feColorMatrix in="SourceGraphic" type="matrix" values="-1 0 0 0 1 0 -1 0 0 1 0 0 -1 0 1 0 0 0 1 0"></feColorMatrix></filter></defs>
<image x="0" y="0" width="32" height="32" preserveAspectRatio="xMinYMin meet" :filter="filterUrl" :xlink:href="app.preview" class="app-icon"></image>
</svg>
<img v-if="!listView && app.screenshot" :src="app.screenshot" width="100%" />
</div>
<div class="app-name" v-on:click="showAppDetails">
{{ app.name }}

View File

@ -122,7 +122,7 @@ export default {
// Map groups
categories = categories.map(category => {
let item = {};
item.id = category.ident;
item.id = 'app-category-' + category.ident;
item.icon = 'icon-category-' + category.ident;
item.classes = []; // empty classes, active will be set later
item.router = { // router link to
@ -188,7 +188,7 @@ export default {
categories = defaultCategories.concat(categories);
// Set current group as active
let activeGroup = categories.findIndex(group => group.id === this.category);
let activeGroup = categories.findIndex(group => group.id === 'app-category-' + this.category);
if (activeGroup >= 0) {
categories[activeGroup].classes.push('active');
} else {