Merge pull request #355 from zanata/ZNTA-2019-nav

fix(ZNTA-1019): nav layout bug

server/zanata-frontend/src/frontend/app/styles/index.less

@@ -1 +1,2 @@
+/* For storybook only */
 @import './style.less';

server/zanata-frontend/src/frontend/app/styles/style.less

@@ -61,7 +61,6 @@ body.templatestyle {
   align-items: flex-start;
   -webkit-align-items: flex-start; /* Safari 7.0+ */
   display: flex;
-  display: -webkit-box;      /* OLD - iOS 6-, Safari 3.1-6 */
   display: -webkit-flex;
   display: -moz-flex;
   display: -ms-flex;
@@ -77,7 +76,6 @@ body.templatestyle {
   align-items: flex-start;
   -webkit-align-items: flex-start; /* Safari 7.0+ */
   display: flex;
-  display: -webkit-box;      /* OLD - iOS 6-, Safari 3.1-6 */
   display: -webkit-flex;
   display: -moz-flex;
   display: -ms-flex;
@@ -96,7 +94,6 @@ body.templatestyle {
   width: 100%;
   height: 100%;
   display: flex;
-  display: -webkit-box;      /* OLD - iOS 6-, Safari 3.1-6 */
   display: -webkit-flex;
   display: -moz-flex;
   display: -ms-flex;
@@ -114,7 +111,6 @@ body.templatestyle {
   align-items: flex-start;
   -webkit-align-items: flex-start; /* Safari 7.0+ */
   display: flex;
-  display: -webkit-box;      /* OLD - iOS 6-, Safari 3.1-6 */
   display: -webkit-flex;
   display: -moz-flex;
   display: -ms-flex;
@@ -234,7 +230,6 @@ body.templatestyle {
   background-color: @color-light;
   box-shadow: inset 0 1px 4px 0 rgba(0, 0, 0, 0.185);
   display: flex !important;
-  display: -webkit-box;      /* OLD - iOS 6-, Safari 3.1-6 */
   display: -webkit-flex;
   display: -moz-flex;
   display: -ms-flex;
@@ -250,6 +245,11 @@ body.templatestyle {
 }
 
 .nav-link {
+  display: flex;
+  display: -webkit-flex;
+  display: -moz-flex;
+  display: -ms-flex;
+  display: -o-flex;
   background-color: '';
   color: rgb(237, 242, 248) !important;
   flex-direction: column;
@@ -285,15 +285,6 @@ body.templatestyle {
   background-color: '';
 }
 
-.nav-link.small {
-  display: flex;
-  display: -webkit-box;      /* OLD - iOS 6-, Safari 3.1-6 */
-  display: -webkit-flex;
-  display: -moz-flex;
-  display: -ms-flex;
-  display: -o-flex;
-}
-
 .nav-link.search {
   margin-top: @spacing-rq;
 }
@@ -306,7 +297,6 @@ body.templatestyle {
   flex-direction: column;
   -webkit-flex-direction: column;
   display: flex;
-  display: -webkit-box;      /* OLD - iOS 6-, Safari 3.1-6 */
   display: -webkit-flex;
   display: -moz-flex;
   display: -ms-flex;
@@ -317,7 +307,6 @@ body.templatestyle {
   flex-direction: row-reverse;
   -webkit-flex-direction: row-reverse;
   display: flex;
-  display: -webkit-box;      /* OLD - iOS 6-, Safari 3.1-6 */
   display: -webkit-flex;
   display: -moz-flex;
   display: -ms-flex;
@@ -328,7 +317,6 @@ body.templatestyle {
   display: flex;
   align-items: center;
   -webkit-align-items: center; /* Safari 7.0+ */
-  display: -webkit-box;      /* OLD - iOS 6-, Safari 3.1-6 */
   display: -webkit-flex;
   display: -moz-flex;
   display: -ms-flex;
@@ -342,7 +330,6 @@ body.templatestyle {
 
 .flex-chart-container {
   display: flex;
-  display: -webkit-box;      /* OLD - iOS 6-, Safari 3.1-6 */
   display: -webkit-flex;
   display: -moz-flex;
   display: -ms-flex;
@@ -450,7 +437,6 @@ body.templatestyle {
   align-items: center;
   -webkit-align-items: center; /* Safari 7.0+ */
   display: flex;
-  display: -webkit-box;      /* OLD - iOS 6-, Safari 3.1-6 */
   display: -webkit-flex;
   display: -moz-flex;
   display: -ms-flex;
@@ -1366,7 +1352,6 @@ table td {
 
 .locale-options {
   display: flex;
-  display: -webkit-box;      /* OLD - iOS 6-, Safari 3.1-6 */
   display: -webkit-flex;
   display: -moz-flex;
   display: -ms-flex;
@@ -4100,7 +4085,6 @@ td.lang-select .row span svg {
 
 .entry-row, .glossary-paging {
   display: flex !important;
-  display: -webkit-box;      /* OLD - iOS 6-, Safari 3.1-6 */
   display: -webkit-flex;
   display: -moz-flex;
   display: -ms-flex;
@@ -4487,7 +4471,6 @@ img.avatar-round {
 
 .user-profile {
   display: flex;
-  display: -webkit-box;      /* OLD - iOS 6-, Safari 3.1-6 */
   display: -webkit-flex;
   display: -moz-flex;
   display: -ms-flex;
@@ -4541,7 +4524,6 @@ h2.matrix-heading {
 
 .user-profile {
   display: flex;
-  display: -webkit-box;      /* OLD - iOS 6-, Safari 3.1-6 */
   display: -webkit-flex;
   display: -moz-flex;
   display: -ms-flex;
@@ -4726,7 +4708,6 @@ h2.recent-contrib {
 
 .activity-table-inner {
   display: flex;
-  display: -webkit-box;      /* OLD - iOS 6-, Safari 3.1-6 */
   display: -webkit-flex;
   display: -moz-flex;
   display: -ms-flex;
@@ -5268,7 +5249,6 @@ button.list-group-item {
   margin-left: @spacing-rh;
   color: @color-light;
   display: flex;
-  display: -webkit-box;      /* OLD - iOS 6-, Safari 3.1-6 */
   display: -webkit-flex;
   display: -moz-flex;
   display: -ms-flex;
@@ -5325,7 +5305,6 @@ a.lineclamp:after {
 
 .flex-row {
   display: flex;
-  display: -webkit-box;      /* OLD - iOS 6-, Safari 3.1-6 */
   display: -webkit-flex;
   display: -moz-flex;
   display: -ms-flex;
@@ -5336,7 +5315,6 @@ a.lineclamp:after {
 
 .flex-row-center {
   display: flex;
-  display: -webkit-box;      /* OLD - iOS 6-, Safari 3.1-6 */
   display: -webkit-flex;
   display: -moz-flex;
   display: -ms-flex;
@@ -6658,7 +6636,6 @@ table .projectWideSearchResultsDocumentBody {
 @media (min-width: 29.376rem) {
   .view {
     display: flex;
-    display: -webkit-box;      /* OLD - iOS 6-, Safari 3.1-6 */
     display: -webkit-flex;
     display: -moz-flex;
     display: -ms-flex;
@@ -6726,7 +6703,6 @@ table .projectWideSearchResultsDocumentBody {
 
   .nav-link {
     display: flex;
-    display: -webkit-box;      /* OLD - iOS 6-, Safari 3.1-6 */
     display: -webkit-flex;
     display: -moz-flex;
     display: -ms-flex;
@@ -7289,7 +7265,6 @@ table .projectWideSearchResultsDocumentBody {
 
   .matrix-table {
     display: flex;
-    display: -webkit-box;      /* OLD - iOS 6-, Safari 3.1-6 */
     display: -webkit-flex;
     display: -moz-flex;
     display: -ms-flex;