diff --git a/CREDITS.md b/CREDITS.md index 1d1f12cb2..910c67368 100644 --- a/CREDITS.md +++ b/CREDITS.md @@ -336,3 +336,4 @@ * [Fork-Awesome](https://github.com/ForkAwesome/Fork-Awesome) * `playlist add` by Material UI * `language` by Aaron Jin + * `npm` by Boboss74 diff --git a/client/src/app/+admin/plugins/plugin-list-installed/plugin-list-installed.component.html b/client/src/app/+admin/plugins/plugin-list-installed/plugin-list-installed.component.html index 1a177de72..a2d0fde08 100644 --- a/client/src/app/+admin/plugins/plugin-list-installed/plugin-list-installed.component.html +++ b/client/src/app/+admin/plugins/plugin-list-installed/plugin-list-installed.component.html @@ -10,22 +10,19 @@
- {{ plugin.name }} + {{ plugin.name }} {{ plugin.version }} -
-
-
{{ plugin.description }}
+ + + + + + +
+ +
+
{{ plugin.description }}
+
diff --git a/client/src/app/+admin/plugins/plugin-search/plugin-search.component.html b/client/src/app/+admin/plugins/plugin-search/plugin-search.component.html index 5f18028c9..fac81bd26 100644 --- a/client/src/app/+admin/plugins/plugin-search/plugin-search.component.html +++ b/client/src/app/+admin/plugins/plugin-search/plugin-search.component.html @@ -37,25 +37,26 @@ {{ plugin.latestVersion }} - Installed - + + + -
-
{{ plugin.description }}
+ + + + + Installed
- - - Homepage - -
+ +
+
{{ plugin.description }}
+
diff --git a/client/src/app/+admin/plugins/plugin-search/plugin-search.component.scss b/client/src/app/+admin/plugins/plugin-search/plugin-search.component.scss index ed06825c8..20f169e13 100644 --- a/client/src/app/+admin/plugins/plugin-search/plugin-search.component.scss +++ b/client/src/app/+admin/plugins/plugin-search/plugin-search.component.scss @@ -25,5 +25,5 @@ .badge { font-size: 13px; font-weight: $font-semibold; - margin-left: 5px; + margin-left: 15px; } diff --git a/client/src/app/+admin/plugins/shared/plugin-list.component.scss b/client/src/app/+admin/plugins/shared/plugin-list.component.scss index 87a709b00..3f4fad7b9 100644 --- a/client/src/app/+admin/plugins/shared/plugin-list.component.scss +++ b/client/src/app/+admin/plugins/shared/plugin-list.component.scss @@ -7,6 +7,8 @@ } .first-row { + display: flex; + align-items: center; margin-bottom: 10px; .plugin-name { @@ -18,6 +20,26 @@ .plugin-version { opacity: 0.6; } + + .plugin-icon { + margin-left: 10px; + + my-global-icon { + @include apply-svg-color($grey-foreground-color); + + &[iconName="npm"] { + @include fill-svg-color($grey-foreground-color); + } + } + } + + .buttons { + margin-left: auto; + width: max-content; + > *:not(:last-child) { + margin-right: 10px; + } + } } .second-row { @@ -29,13 +51,6 @@ .description { opacity: 0.8 } - - .buttons { - margin-left: 10px; - > *:not(:last-child) { - margin-right: 10px; - } - } } .action-button { diff --git a/client/src/app/shared/images/global-icon.component.ts b/client/src/app/shared/images/global-icon.component.ts index e83daf077..a2e2b719d 100644 --- a/client/src/app/shared/images/global-icon.component.ts +++ b/client/src/app/shared/images/global-icon.component.ts @@ -53,7 +53,8 @@ const icons = { 'p2p': require('!!raw-loader?!../../../assets/images/menu/p2p.svg'), 'users': require('!!raw-loader?!../../../assets/images/global/users.svg'), 'search': require('!!raw-loader?!../../../assets/images/global/search.svg'), - 'refresh': require('!!raw-loader?!../../../assets/images/global/refresh.svg') + 'refresh': require('!!raw-loader?!../../../assets/images/global/refresh.svg'), + 'npm': require('!!raw-loader?!../../../assets/images/global/npm.svg') } export type GlobalIconName = keyof typeof icons diff --git a/client/src/assets/images/global/npm.svg b/client/src/assets/images/global/npm.svg new file mode 100644 index 000000000..ec8f41243 --- /dev/null +++ b/client/src/assets/images/global/npm.svg @@ -0,0 +1,6 @@ + + + + + +