Remove flex shorthand

sass/components/card.sass

@@ -8,7 +8,7 @@
   align-items: flex-start
   color: $text-strong
   display: flex
-  flex: 1
+  flex-grow: 1
   font-weight: bold
   padding: 10px
 
@@ -36,7 +36,7 @@
 .card-footer-item
   align-items: center
   display: flex
-  flex: 1
+  flex-grow: 1
   justify-content: center
   padding: 10px
   &:not(:last-child)

sass/components/grid.sass

@@ -1,5 +1,7 @@
 .column
-  flex: 1 1 auto
+  flex-basis: 0
+  flex-grow: 1
+  flex-shrink: 1
   padding: 10px
   .columns.is-mobile > &.is-narrow
     flex: none
@@ -227,7 +229,6 @@
     +tablet
       flex-wrap: wrap
       & > .column
-        flex-basis: 33.3333%
         max-width: 33.3333%
         padding: 10px
         width: 33.3333%
@@ -250,7 +251,9 @@
 
 .tile
   align-items: stretch
-  flex: 1 1 auto
+  flex-basis: 0
+  flex-grow: 1
+  flex-shrink: 1
   min-height: min-content
   // Modifiers
   &.is-ancestor

sass/components/level.sass

@@ -14,7 +14,7 @@
       margin-right: 10px
     // Modifiers
     &.is-flexible
-      flex: 1
+      flex-grow: 1
 
 .level-left
   // Responsiveness
@@ -48,10 +48,10 @@
       &:not(:last-child)
         margin-bottom: 0
       &:not(.is-narrow)
-        flex: 1
+        flex-grow: 1
   // Responsiveness
   +tablet
     display: flex
     & > .level-item
       &:not(.is-narrow)
-        flex: 1
+        flex-grow: 1

sass/components/media.sass

@@ -22,7 +22,7 @@
   margin-left: 10px
 
 .media-content
-  flex: 1
+  flex-grow: 1
   text-align: left
 
 .media

sass/components/modal.sass

@@ -47,7 +47,7 @@
 
 .modal-card-title
   color: $text-strong
-  flex: 1
+  flex-grow: 1
   font-size: $size-4
   line-height: 1
 
@@ -58,7 +58,7 @@
       margin-right: 10px
 
 .modal-card-body
-  flex: 1
+  flex-grow: 1
   overflow: auto
   padding: 20px
 

sass/components/nav.sass

@@ -68,7 +68,8 @@ a.nav-item
 .nav-left
   align-items: stretch
   display: flex
-  flex: 1
+  flex-basis: 0
+  flex-grow: 1
   justify-content: flex-start
   overflow: hidden
   overflow-x: auto
@@ -78,13 +79,16 @@ a.nav-item
   align-items: stretch
   display: flex
   justify-content: center
+  margin-left: auto
+  margin-right: auto
 
 .nav-right
   // Responsiveness
   +tablet
     align-items: stretch
     display: flex
-    flex: 1
+    flex-basis: 0
+    flex-grow: 1
     justify-content: flex-end
 
 // Main container

sass/components/navbar.sass

@@ -14,7 +14,7 @@
       margin-right: 10px
     // Modifiers
     &.is-flexible
-      flex: 1
+      flex-grow: 1
 
 .navbar-left
   // Responsiveness
@@ -48,10 +48,10 @@
       &:not(:last-child)
         margin-bottom: 0
       &:not(.is-narrow)
-        flex: 1
+        flex-grow: 1
   // Responsiveness
   +tablet
     display: flex
     & > .navbar-item
       &:not(.is-narrow)
-        flex: 1
+        flex-grow: 1

sass/components/pagination.sass

@@ -16,7 +16,7 @@
   ul
     align-items: center
     display: flex
-    flex: 1
+    flex-grow: 1
     justify-content: center
   // Responsiveness
   +mobile
@@ -26,7 +26,7 @@
       &:not(:first-child)
         margin-left: 10px
     li
-      flex: 1
+      flex-grow: 1
     ul
       margin-top: 10px
   +tablet

sass/components/tabs.sass

@@ -30,7 +30,7 @@
     align-items: center
     border-bottom: 1px solid $border
     display: flex
-    flex: 1
+    flex-grow: 1
     justify-content: flex-start
     &.is-left
       padding-right: 10px
@@ -72,7 +72,7 @@
           border-bottom-color: transparent !important
   &.is-fullwidth
     li
-      flex: 1
+      flex-grow: 1
   &.is-toggle
     a
       border: 1px solid $border