feat(demo): Configured demo styles and append empathy logo into demo

empathyco · Oct 2, 2019 · 846eb17 · 846eb17
1 parent 28fb8ea
commit 846eb17
Show file tree

Hide file tree

Showing 4 changed files with 20 additions and 4 deletions.
diff --git a/public/assets/empathy.svg b/public/assets/empathy.svg
diff --git a/public/favicon.ico → public/assets/favicon.ico b/public/favicon.ico → public/assets/favicon.ico
diff --git a/public/index.html b/public/index.html
@@ -4,15 +4,16 @@
     <meta charset="utf-8">
     <meta http-equiv="X-UA-Compatible" content="IE=edge">
     <meta name="viewport" content="width=device-width,initial-scale=1.0">
-    <link rel="icon" href="<%= BASE_URL %>favicon.ico">
+    <link rel="icon" href="<%= BASE_URL %>assets/favicon.ico">
     <link rel="stylesheet" type="text/css" href="style.css">
     <title>Empathy Vue Carousel Demo</title>
   </head>
   <body>
+    <img src="assets/empathy.svg" class="empathy-icon"/>
+    <h1 class="demo-title">Vue Carousel Demo</h1>
     <noscript>
       <strong>We're sorry but empathy-vue-carousel doesn't work properly without JavaScript enabled. Please enable it to continue.</strong>
     </noscript>
-    <h1>Empathy Vue Carousel Demo</h1>
     <div id="carouselDemo"></div>
   </body>
 </html>
diff --git a/public/style.css b/public/style.css
@@ -16,11 +16,16 @@ body {
   background-color: azure;
 }
 
-h1 {
+.empathy-icon {
+  display: block;
+  margin: auto;
+}
+
+.demo-title {
   text-align: center;
 }
 
 .eco-carousel {
-  width: 50%;
+  width: 70%;
   margin: auto;
 }