mirrors/jellyfin-web
1
0
Fork 0
mirror of https://github.com/jellyfin/jellyfin-web synced 2025-03-30 19:56:21 +00:00
Code Activity

fix image alignment on plugin cards

Browse source
This commit is contained in:
dkanada 2021-01-25 02:50:15 +09:00
parent d7161f9d65
commit 12c6cf5498
3 changed files with 18 additions and 8 deletions
Download patch file Download diff file Expand all files Collapse all files

1
src/components/cardbuilder/card.css
View file

@ -174,6 +174,7 @@ button::-moz-focus-inner {
.cardScalable .cardImageContainer {
height: 100%;
width: 100%;
contain: strict;
}

7
src/controllers/dashboard/plugins/available/index.js
View file

@ -1,6 +1,7 @@
import loading from '../../../../components/loading/loading';
import libraryMenu from '../../../../scripts/libraryMenu';
import globalize from '../../../../scripts/globalize';
import * as cardBuilder from '../../../../components/cardbuilder/cardBuilder.js';
import '../../../../components/cardbuilder/card.css';
import '../../../../elements/emby-button/emby-button';
import '../../../../elements/emby-checkbox/emby-checkbox';
@ -102,10 +103,12 @@ function getPluginHtml(plugin, options, installedPlugins) {
html += '<div class="cardBox visualCardBox">';
html += '<div class="cardScalable visualCardBox-cardScalable">';
html += '<div class="cardPadder cardPadder-backdrop"></div>';
html += '<a class="cardContent cardImageContainer" is="emby-linkbutton" href="' + href + '"' + target + '>';
html += '<span class="cardImageIcon material-icons folder"></span>';
html += `<div class="cardContent ${cardBuilder.getDefaultBackgroundClass()}">`;
html += `<a class="cardImageContainer" is="emby-linkbutton" href="${href}" ${target}>`;
html += '<span class="cardImageIcon material-icons extension"></span>';
html += '</a>';
html += '</div>';
html += '</div>';
html += '<div class="cardFooter">';
html += "<div class='cardText'>";
html += plugin.name;

18
src/controllers/dashboard/plugins/installed/index.js
View file

@ -2,6 +2,7 @@ import loading from '../../../../components/loading/loading';
import libraryMenu from '../../../../scripts/libraryMenu';
import dom from '../../../../scripts/dom';
import globalize from '../../../../scripts/globalize';
import * as cardBuilder from '../../../../components/cardbuilder/cardBuilder.js';
import '../../../../components/cardbuilder/card.css';
import '../../../../elements/emby-button/emby-button';
import Dashboard, { pageIdOn } from '../../../../scripts/clientUtils';
@ -59,16 +60,21 @@ function getPluginCardHtml(plugin, pluginConfigurationPages) {
html += '<div class="cardBox visualCardBox">';
html += '<div class="cardScalable">';
html += '<div class="cardPadder cardPadder-backdrop"></div>';
html += configPageUrl ? `<a class="cardContent cardImageContainer" is="emby-linkbutton" href="${configPageUrl}">` : '<div class="cardContent noConfigPluginCard noHoverEffect cardImageContainer emby-button">';
html += '<span class="cardImageIcon';
if (plugin.HasImage) {
html += `"><img src="/Plugins/${plugin.Id}/${plugin.Version}/Image" style="width:100%;height:auto"/>`;
html += `<div class="cardContent ${cardBuilder.getDefaultBackgroundClass()}">`;
if (configPageUrl) {
html += `<a class="cardImageContainer" is="emby-linkbutton" href="${configPageUrl}">`;
} else {
html += ' material-icons folder">';
html += '<div class="cardImageContainer noConfigPluginCard noHoverEffect emby-button">';
}
html += '</span> ';
html += `<span class="cardImageIcon ${plugin.HasImage ? 'material-icons extension' : ''}">`;
if (plugin.HasImage) {
html += `<img src="/Plugins/${plugin.Id}/${plugin.Version}/Image" style="width:100%;height:auto" />`;
}
html += '</span>';
html += configPageUrl ? '</a>' : '</div>';
html += '</div>';
html += '</div>';
html += '<div class="cardFooter">';
if (configPage || plugin.CanUninstall) {