creating meta data creation component(first tab)

Issue-ID: CCSDK-2014

Signed-off-by: shaaban Altanany <shaaban.eltanany.ext@orange.com>
Change-Id: I35283cbb5b48174606493ecb39c20b9f717a9c06
diff --git a/cds-ui/designer-client/src/styles.css b/cds-ui/designer-client/src/styles.css
index 0e6a7f3..17c49ce 100644
--- a/cds-ui/designer-client/src/styles.css
+++ b/cds-ui/designer-client/src/styles.css
@@ -6,7 +6,8 @@
   /* background-image: linear-gradient(-45deg, #000 10%, #fff 0);
   background-size: 6px 6px; */
   margin: 0;
-  font-family: 'Nunito' !important;
+  /* font-family: 'Nunito' !important; */
+  font-family: Arial, Helvetica, sans-serif !important;
   color: #1B3E6F !important;
 }
 *:focus{
@@ -1449,7 +1450,10 @@
 .btn{
   padding-right: 20px !important;
   padding-left: 20px !important;
-  border-radius: 15px !important;
+
+}
+.btn.border-radius{
+  border-radius: 20px !important;
 }
 .btn-primary{
   background-color: #1273EB !important;
@@ -1592,6 +1596,79 @@
   display: inline-block;
   margin-top: 5px;
 }
+.btn-link:hover, .btn-link:focus{
+  text-decoration: none !important;
+}
+.btn-link::before{
+  content: "\f107";
+  font-family:'FontAwesome';
+  position: relative;
+  margin-right: 20px;
+}
+.btn-link.collapsed::before{
+  content: "\f105";
+  font-family:'FontAwesome';
+  position: relative;
+  margin-right: 30px;
+}
+.btn-link i{
+  margin-right: 10px;
+}
+.ngx-file-drop__content{
+  background: #F4F9FE;
+  padding: 20px;
+  height: auto !important;
+  display: inline-block !important;
+  width: 100%;
+}
+.ngx-file-drop__drop-zone{
+  border: 2px dotted #F4F9FE !important;
+  border-radius: 0px !important;
+  height: auto !important;
+}
+.folder-upload{
+  width: 100%;
+  display: inline-block;
+  text-align: center;
+}
+.folder-upload-text{
+  margin-top: 10px;
+  width: 100%;
+  display: inline-block;
+  text-align: center;
+  color:#242424 ;
+  font-size: 12px;
+}
+.folder-upload-text button{
+  margin-left: 10px;
+  font-size: 12px;
+}
+.folder-upload-type{
+  color:#A4B2C6 ;
+  font-size: 10px;
+  width: 100%;
+  display: inline-block;
+  text-align: center;
+}
+.upload-table .table thead th{
+  border-top: 0px !important;
+  border-bottom: 0px !important;
+}
+.upload-table .table{
+  margin-bottom: 0px !important;
+}
+.nav-tabs .nav-link{
+  position: relative;
+}
+.nav-tabs .nav-link.tab-done::after{
+  content: "\f058";
+  position: absolute;
+  font-family: 'FontAwesome';
+  left: 3px;
+  font-size: 16px;
+  top: 11px;
+  color: #66BB00;
+}
 /* Extra small devices (portrait phones, less than 576px) */
 @media (max-width: 575.98px) {
   .page-title{