Merge pull request #31 from shubhadip/css-fix

prevent unrelated css to bundle in library

.eslintcache

@@ -1 +1 @@
-[{"/Users/shubhadipmaity/projects/vue3-datepicker/src/components/datepicker/DateInput.vue":"1"},{"size":7086,"mtime":1605525174834}]
+[{"/Users/shubhadipmaity/projects/vuejs3-datepicker/src/App.vue":"1","/Users/shubhadipmaity/projects/vuejs3-datepicker/src/components/wrapper/Wrapper.vue":"2"},{"size":3930,"mtime":1641549258180,"results":"3","hashOfConfig":"4"},{"size":1341,"mtime":1641549258181,"results":"5","hashOfConfig":"4"},{"filePath":"6","messages":"7","errorCount":0,"warningCount":0,"fixableErrorCount":0,"fixableWarningCount":0},"1g6avd8",{"filePath":"8","messages":"9","errorCount":0,"warningCount":0,"fixableErrorCount":0,"fixableWarningCount":0},"/Users/shubhadipmaity/projects/vuejs3-datepicker/src/App.vue",[],"/Users/shubhadipmaity/projects/vuejs3-datepicker/src/components/wrapper/Wrapper.vue",[]]

src/App.vue

@@ -119,6 +119,6 @@ export default defineComponent({
   }),
 });
 </script>
-<style scoped lang="postcss">
+<style lang="postcss">
 @import '@css/app.css';
 </style>

src/assets/styles/css/app.css

@@ -1,7 +1,20 @@
 @import '@css/_settings.css';
 
 *{
-    box-sizing: border-box;
+  box-sizing: border-box;
+}
+
+body {
+  font-family: 'Open Sans', sans-serif;
+  color: $black;
+  margin: 0px;
+  padding: 0px;
+  input {
+  outline: none;
+    &:focus{
+      outline: none;
+    }
+  }
 }
 
 .flex-block{
@@ -112,6 +125,8 @@
       a {
         padding: 10px;
         display: block;
+        color: $white;
+        text-decoration: none;
       }
       &:hover {
         transform: translateX(5px);

src/components/datepicker/datepicker.css

@@ -1,4 +1,3 @@
-@import "@css/app.css";
 @import "@css/_settings.css";
 
 .rtl {

src/components/datepicker/locale/index.ts

@@ -212,5 +212,5 @@ export const data = {
   de: de(),
   en: en(),
   fr: fr(),
-  nl: nl()
+  nl: nl(),
 };

src/components/wrapper/Wrapper.vue

@@ -1,6 +1,6 @@
 <template>
   <div class="container">
-    <label>
+    <label class="slot-label">
       <slot name="label"></slot>
     </label>
     <div class="code-block">