SUP-2901, [Edit Profile]: Add skill field should have full length even if there is no/few skills

-- Reverted changes to make list items for skills, external accounts and external account data tiles to be distributed equally in the available space because when the number of elements are less than the full row, the elements appears to be placed on corners instead of starting from the left.

Author: vikasrohit

assets/css/directives/external-account.scss

@@ -4,7 +4,7 @@
   display: flex;
   flex-direction: column;
   align-items: center;
-  margin: 5px 0px 15px 0;
+  margin: 5px 20px 15px 0;
   cursor: pointer;
 
   &.connected {

assets/css/directives/external-link-data.scss

@@ -3,7 +3,6 @@
 external-accounts {
   display: flex;
   flex-flow: row wrap;
-  justify-content: space-between;
 }
 
 .ext-link-tile_edit-header {
@@ -208,14 +207,18 @@ external-accounts {
     display: flex;
     flex-direction: row;
     flex-wrap: wrap;
-    justify-content: space-between;
+    justify-content: flex-start;
     padding: 0px 60px;
 
     .external-link-tile {
       border: 1px solid #f0f0f0;
       background-color: $gray-lightest;
+      margin-left: 15px;
       margin-top: 30px;
       margin-bottom: 0px;
+      // &:nth-child(3n+1) {
+      //   margin-left: 0px;
+      // }
       width: 218px;
       height: 240px;
       display: flex;

assets/css/settings/settings.scss

@@ -320,12 +320,12 @@
         flex-direction: row;
         flex-wrap: wrap;
         margin-top: 20px;
-        justify-content: space-between;
 
         .skill {
           margin: 0 20px 10px;
           @media only screen and (min-width: 768px) {
             margin: 0;
+            margin-right: 30px;
             margin-bottom: 60px;
           }
         }