[FIX] fix display issue in safari

safari needs to use css rules prefixed with -webkit-

2 files changed, 28 insertions, 0 deletions

diff --git a/addons/web/static/src/css/base.css b/addons/web/static/src/css/base.css
index e7442d1dad5..495d95ed3b7 100644
--- a/addons/web/static/src/css/base.css
+++ b/addons/web/static/src/css/base.css
@@ -84,6 +84,7 @@
 .openerp.openerp_webclient_container {
   height: calc(100% - 34px);
   display: -ms-flexbox;
+  display: -webkit-flex;
   display: flex;
 }
 @media (max-width: 768px) {
@@ -800,12 +801,17 @@
 }
 .openerp .oe_leftbar {
   display: -ms-flexbox;
+  display: -webkit-flex;
   display: flex;
   -ms-flex-direction: column;
+  -webkit-flex-direction: column;
   flex-direction: column;
+  -webkit-justify-content: space-between;
   justify-content: space-between;
   -ms-flex: 0 0 auto;
+  -webkit-flex-shrink: 0;
   flex-shrink: 0;
+  -webkit-flex-grow: 0;
   flex-grow: 0;
   width: 220px;
   height: 100%;
@@ -817,6 +823,7 @@
 }
 .openerp .oe_leftbar a.oe_logo {
   text-align: center;
+  -webkit-flex-shrink: 0;
   flex-shrink: 0;
 }
 .openerp .oe_leftbar a.oe_logo img {
@@ -842,12 +849,14 @@
   display: block;
 }
 .openerp .oe_leftbar .oe_secondary_menus_container {
+  -webkit-flex-grow: 1;
   flex-grow: 1;
   overflow-y: auto;
 }
 .openerp .oe_leftbar .oe_footer {
   background: #f0eeee;
   text-align: center;
+  -webkit-flex-shrink: 0;
   flex-shrink: 0;
 }
 .openerp .oe_leftbar .oe_footer a {
@@ -979,6 +988,7 @@
 }
 .openerp .oe_application {
   height: 100%;
+  -webkit-flex-grow: 1;
   flex-grow: 1;
   -ms-flex-negative: 1;
   display: inline-block\9;
@@ -991,11 +1001,14 @@
 .openerp .oe-view-manager {
   width: 100%;
   height: 100%;
+  display: -webkit-flex;
   display: flex;
+  -webkit-flex-direction: column;
   flex-direction: column;
 }
 .openerp .oe-view-manager .oe-view-manager-content {
   overflow: auto;
+  -webkit-flex-grow: 1;
   flex-grow: 1;
   position: relative;
 }
@@ -1021,6 +1034,7 @@
 .openerp .oe-view-manager-header {
   background-color: #f0eeee;
   border-bottom: 1px solid #afafb6;
+  -webkit-flex-shrink: 0;
   flex-shrink: 0;
   width: 100%;
   -webkit-user-select: none;
diff --git a/addons/web/static/src/css/base.sass b/addons/web/static/src/css/base.sass
index ff1dfba9fa1..f97d404219d 100644
--- a/addons/web/static/src/css/base.sass
+++ b/addons/web/static/src/css/base.sass
@@ -200,6 +200,7 @@ $sheet-padding: 16px
     &.openerp_webclient_container
         height: calc(100% - 34px)
         display: -ms-flexbox
+        display: -webkit-flex
         display: flex
     @media (max-width: 768px)
         &.openerp_webclient_container
@@ -707,12 +708,17 @@ $sheet-padding: 16px
     // Webclient.leftbar {{{
     .oe_leftbar
         display: -ms-flexbox
+        display: -webkit-flex
         display: flex
         -ms-flex-direction: column
+        -webkit-flex-direction: column
         flex-direction: column
+        -webkit-justify-content: space-between
         justify-content: space-between
         -ms-flex: 0 0 auto
+        -webkit-flex-shrink: 0
         flex-shrink: 0
+        -webkit-flex-grow: 0
         flex-grow: 0
         width: 220px
         height: 100%
@@ -723,6 +729,7 @@ $sheet-padding: 16px
         vertical-align: top\9
         a.oe_logo
             text-align: center
+            -webkit-flex-shrink: 0
             flex-shrink: 0
             img
                 margin: 14px 0
@@ -741,11 +748,13 @@ $sheet-padding: 16px
             &:hover .oe_logo_edit_admin
                 display: block
         .oe_secondary_menus_container
+            -webkit-flex-grow: 1
             flex-grow: 1
             overflow-y: auto
         .oe_footer
             background: #f0eeee
             text-align: center
+            -webkit-flex-shrink: 0
             flex-shrink: 0
             a
                 font-weight: bold
@@ -854,6 +863,7 @@ $sheet-padding: 16px
         text-decoration: underline
     .oe_application
         height: 100%
+        -webkit-flex-grow: 1
         flex-grow: 1
         -ms-flex-negative: 1
         display: inline-block\9
@@ -866,10 +876,13 @@ $sheet-padding: 16px
     .oe-view-manager
         width: 100%
         height: 100%
+        display: -webkit-flex
         display: flex
+        -webkit-flex-direction: column
         flex-direction: column
         .oe-view-manager-content
             overflow: auto
+            -webkit-flex-grow: 1
             flex-grow: 1
             position: relative
             a
@@ -891,6 +904,7 @@ $sheet-padding: 16px
     .oe-view-manager-header
         background-color: rgb(240, 238, 238)
         border-bottom: 1px solid #afafb6
+        -webkit-flex-shrink: 0
         flex-shrink: 0
         width: 100%
         -webkit-user-select: none