From 326e3ac1a884f000f57b3fb6e30cd32f5ec4622c Mon Sep 17 00:00:00 2001
From: SvetlanaMuravlova <83700465+SvetlanaMuravlova@users.noreply.github.com>
Date: Fri, 3 Sep 2021 15:12:02 +0300
Subject: [PATCH] feat(version): added npm versions (#1183)

* feat(version): added npm versions

* feat(version): added npm versions
---
 apps/demo/src/app/app.component.ts | 16 +++++++++++++---
 apps/demo/src/assets/css/style.css | 18 ++++++++++++++++++
 2 files changed, 31 insertions(+), 3 deletions(-)

diff --git a/apps/demo/src/app/app.component.ts b/apps/demo/src/app/app.component.ts
index fce058d..5c95d2a 100644
--- a/apps/demo/src/app/app.component.ts
+++ b/apps/demo/src/app/app.component.ts
@@ -10,9 +10,19 @@ const gettingStarted = require('html-loader!markdown-loader!../getting-started.m
       <h1>ng2-file-upload</h1>
       <p>The Angular2 File Upload directives</p>
       <a class="btn btn-primary" href="https://github.com/valor-software/ng2-file-upload">View on GitHub</a>
-      <div class="row">
-        <div class="col-lg-1"><iframe src="https://ghbtns.com/github-btn.html?user=valor-software&repo=ng2-file-upload&type=star&count=true" frameborder="0" scrolling="0" width="170px" height="20px"></iframe></div>
-        <div class="col-lg-1"><iframe src="https://ghbtns.com/github-btn.html?user=valor-software&repo=ng2-file-upload&type=fork&count=true" frameborder="0" scrolling="0" width="170px" height="20px"></iframe></div>
+      <div class="row d-flex" style="padding-top: 15px">
+        <div class="col-lg-1 block_links">
+          <a href="https://npmjs.org/ng2-file-upload" style="display: flex">
+            <img src="https://img.shields.io/npm/v/ng2-file-upload/latest.svg" alt="npm latest version" >
+          </a>
+        </div>
+        <div class="col-lg-1 block_links">
+          <a href="https://npmjs.org/ng2-file-upload" style="display: flex">
+            <img src="https://img.shields.io/npm/v/ng2-file-upload/next.svg" alt="npm next version" >
+          </a>
+        </div>
+        <div class="col-lg-1 block_links"><iframe src="https://ghbtns.com/github-btn.html?user=valor-software&repo=ng2-file-upload&type=star&count=true" frameborder="0" scrolling="0" width="100px" height="20px"></iframe></div>
+        <div class="col-lg-1 block_links"><iframe src="https://ghbtns.com/github-btn.html?user=valor-software&repo=ng2-file-upload&type=fork&count=true" frameborder="0" scrolling="0" width="100px" height="20px"></iframe></div>
       </div>
     </div>
   </main>
diff --git a/apps/demo/src/assets/css/style.css b/apps/demo/src/assets/css/style.css
index ed872f8..459bfcb 100644
--- a/apps/demo/src/assets/css/style.css
+++ b/apps/demo/src/assets/css/style.css
@@ -131,6 +131,24 @@ simple-demo >.container {
   max-width: 100%;
 }
 
+.block_links {
+  display: flex;
+  align-items: center;
+  width: auto;
+  padding: 0 0 0 15px;
+  margin-bottom: 10px;
+}
+
+.block_links:first-child {
+  padding-left: 15px;
+}
+
+.d-flex {
+  display: flex;
+  flex-wrap: wrap;
+}
+
+
 @media (min-width: 992px) {
   .bd-pageheader h1, .bd-pageheader p {
     margin-right: 380px;