[MERGE] Forward-port of 8.0 up to d32d120

3 files changed, 199 insertions, 58 deletions

diff --git a/addons/web/static/src/css/base.css b/addons/web/static/src/css/base.css
index de3ed514eff..2cd8b4b2ad1 100644
--- a/addons/web/static/src/css/base.css
+++ b/addons/web/static/src/css/base.css
@@ -1,4 +1,4 @@
-@charset "UTF-8";
+@charset "utf-8";
 @font-face {
   font-family: "mnmliconsRegular";
   src: url("/web/static/src/font/mnmliconsv21-webfont.eot") format("eot");
@@ -977,42 +977,82 @@
 .openerp .oe_secondary_submenu .oe_secondary_submenu li {
   margin-left: 20px;
 }
-.openerp .oe_about {
-  background-color: white;
-  background-image: url(data:image/png;base64,iVBORw0KGgoAAAANSUhEUgAAAAYAAAAGCAYAAADgzO9IAAAAKUlEQVQIHWO8e/fufwYsgAUkJigoiCIF5DMyoYggcUiXgNnBiGQKmAkARpcEQeriln4AAAAASUVORK5CYII=);
-  -moz-border-radius: 0 0 2px 2px;
-  -webkit-border-radius: 0 0 2px 2px;
-  border-radius: 0 0 2px 2px;
+.openerp .oe_about .label {
+  background-color: #a24689;
 }
 .openerp .oe_about a {
-  color: #7c7bad;
+  color: #a24689;
 }
-.openerp .oe_about a:hover {
-  text-decoration: underline;
+.openerp .oe_about .user-details {
+  position: relative;
+  padding: 0;
+  margin-bottom: 275px;
 }
-.openerp .oe_about a:focus {
-  outline: none;
+.openerp .oe_about .user-details .user-image {
+  width: 100%;
+  text-align: center;
 }
-.openerp .oe_about .oe_logo {
-  margin-left: -6px;
-}
-.openerp .oe_about .oe_bottom {
-  text-shadow: 0 1px 1px #999999;
-  background-color: #8a0e0e;
-  background-image: -webkit-gradient(linear, left top, left bottom, from(#b41616), to(#600606));
-  background-image: -webkit-linear-gradient(top, #b41616, #600606);
-  background-image: -moz-linear-gradient(top, #b41616, #600606);
-  background-image: -ms-linear-gradient(top, #b41616, #600606);
-  background-image: -o-linear-gradient(top, #b41616, #600606);
-  background-image: linear-gradient(to bottom, #b41616, #600606);
-  color: #eeeeee;
-  padding: 0 16px;
-  -moz-border-radius: 0 0 2px 2px;
-  -webkit-border-radius: 0 0 2px 2px;
-  border-radius: 0 0 2px 2px;
+.openerp .oe_about .user-details .user-info-block {
+  width: 100%;
+  position: absolute;
+  top: 55px;
+  padding-top: 35px;
 }
-.openerp .oe_about .oe_bottom a {
-  color: #eeeeee;
+.openerp .oe_about .user-details .user-info-block .user-heading {
+  text-align: center;
+  margin: 10px 0 0;
+}
+.openerp .oe_about .user-details .user-info-block .navigation {
+  float: left;
+  width: auto;
+  padding: 0;
+  margin-left: 25%;
+  list-style: none;
+  border: 1px solid #a24689;
+}
+.openerp .oe_about .user-details .user-info-block .navigation li {
+  float: left;
+}
+.openerp .oe_about .user-details .user-info-block .navigation li a {
+  padding: 20px 30px;
+  float: left;
+}
+.openerp .oe_about .user-details .user-info-block .navigation li.active a {
+  background: #a24689;
+  color: white;
+}
+.openerp .oe_about .user-details .user-info-block .user-body {
+  text-align: center;
+}
+.openerp .oe_about .user-details .user-info-block .user-body .tab-content > div {
+  float: left;
+  width: 100%;
+}
+.openerp .oe_about a.oe_activate_debug_mode {
+  color: white !important;
+  font-size: 100%;
+}
+.openerp .oe_about #social i {
+  margin: 10px;
+}
+.openerp .oe_about #social i:hover {
+  -webkit-transform: scale(1.3);
+  -moz-transform: scale(1.3);
+  -ms-transform: scale(1.3);
+  -o-transform: scale(1.3);
+  transform: scale(1.3);
+}
+.openerp .oe_about #social .social-fb:hover {
+  color: #3b5998;
+}
+.openerp .oe_about #social .social-tw:hover {
+  color: #4099ff;
+}
+.openerp .oe_about #social .social-gp:hover {
+  color: #d34836;
+}
+.openerp .oe_about #social .social-lk:hover {
+  color: #007bb6;
 }
 .openerp a.oe_form_uri:hover {
   text-decoration: underline;
diff --git a/addons/web/static/src/css/base.sass b/addons/web/static/src/css/base.sass
index fde8811476c..5ba6f747a5a 100644
--- a/addons/web/static/src/css/base.sass
+++ b/addons/web/static/src/css/base.sass
@@ -846,26 +846,64 @@ $sheet-padding: 16px
             margin-left: 20px
     // }}}
     // About openerp {{{
+    $link-color-odoo: #a24689
     .oe_about
-        background-color: white
-        background-image: url(data:image/png;base64,iVBORw0KGgoAAAANSUhEUgAAAAYAAAAGCAYAAADgzO9IAAAAKUlEQVQIHWO8e/fufwYsgAUkJigoiCIF5DMyoYggcUiXgNnBiGQKmAkARpcEQeriln4AAAAASUVORK5CYII=)
-        @include radius(0 0 2px 2px)
+        .label
+            background-color: $link-color-odoo
         a
-            color: $link-color
-            &:hover
-                text-decoration: underline
-            &:focus
-                outline: none
-        .oe_logo
-            margin-left: -6px
-        .oe_bottom
-            text-shadow: 0 1px 1px #999999
-            @include vertical-gradient(#b41616, #600606)
-            color: #eee
-            padding: 0 16px
-            @include radius(0 0 2px 2px)
-            a
-                color: #eee
+            color: $link-color-odoo
+
+        .user-details
+            position: relative
+            padding: 0
+            margin-bottom: 275px
+            .user-image
+                width: 100%
+                text-align: center
+            .user-info-block
+                width: 100%
+                position: absolute
+                top: 55px
+                padding-top: 35px
+                .user-heading
+                    text-align: center
+                    margin: 10px 0 0
+                .navigation
+                    float: left
+                    width: auto
+                    padding: 0
+                    margin-left: 25%
+                    list-style: none
+                    border: 1px solid $link-color-odoo
+                    li
+                        float: left
+                        a
+                            padding: 20px 30px
+                            float: left
+                        &.active a
+                            background: $link-color-odoo
+                            color: #fff
+                .user-body
+                    text-align: center
+                    .tab-content > div
+                        float: left
+                        width: 100%
+        a.oe_activate_debug_mode
+            color: white !important
+            font-size: 100%
+        #social
+            i
+                margin: 10px
+                &:hover
+                    @include transform(scale(1.3))
+            .social-fb:hover
+                color: #3B5998
+            .social-tw:hover
+                color: #4099FF
+            .social-gp:hover
+                color: #d34836
+            .social-lk:hover
+                color: #007bb6
     // }}}
     // ActionManager {{{
     a.oe_form_uri:hover
diff --git a/addons/web/static/src/xml/base.xml b/addons/web/static/src/xml/base.xml
index 47fcca86c1d..eb02390ad17 100644
--- a/addons/web/static/src/xml/base.xml
+++ b/addons/web/static/src/xml/base.xml
@@ -365,16 +365,79 @@
 <t t-name="UserMenu.about">
 
     <div class="oe_about">
-      <a class="oe_activate_debug_mode oe_right" href="?debug" style="background-color: white; padding:2px 6px; border-radius: 10px;">Activate the developer mode</a>
-      <img class="oe_logo" src="/web/static/src/img/logo2.png"/>
-      <h3>Version <t t-esc="version_info.server_version"/></h3>
+      <a class="oe_activate_debug_mode oe_right label label-primary" href="?debug" >Activate the developer mode</a>
 
-      <div class="oe_bottom">
-        <p>Copyright © 2004-TODAY OpenERP SA. All Rights Reserved.<br />
-            Odoo is a trademark of the <a target="_blank" href="https://www.odoo.com" style="text-decoration: underline;">OpenERP SA Company</a>.</p>
-        <p>Licenced under the terms of <a target="_blank" href="http://www.gnu.org/licenses/agpl.html" style="text-decoration: underline;">GNU Affero General Public License</a></p>
-        <p>For more information visit <a target="_blank" href="https://www.odoo.com" style="text-decoration: underline;">Odoo.com</a></p>
-      </div>
+
+
+        <div class="container">
+            <div class="">
+                <div class="col-sm-6 col-md-6 user-details">
+                    <div class="user-image">
+                        <img src="/web/static/src/img/logo2.png" alt="Odoo (Formerly OpenERP)" title="Odoo (Formerly OpenERP)" class="img-circle"/>
+                    </div>
+                    <div class="user-info-block">
+                        <div class="user-heading">
+                            <br/><span class="help-block">(Formerly OpenERP)</span>
+                            <h3>Version <t t-esc="version_info.server_version"/></h3>
+                        </div>
+
+                        <ul class="navigation">
+                            <li class="active">
+                                <a data-toggle="tab" href="#settings">
+                                    <span class="glyphicon glyphicon-cog"></span>
+                                </a>
+                            </li>
+                            <li>
+                                <a data-toggle="tab" href="#email">
+                                    <span class="glyphicon glyphicon-envelope"></span>
+                                </a>
+                            </li>
+                            <li>
+                                <a data-toggle="tab" href="#events">
+                                    <span class="glyphicon glyphicon-calendar"></span>
+                                </a>
+                            </li>
+                             <li>
+                                <a data-toggle="tab" href="#social">
+                                    <span class="glyphicon glyphicon-share"></span>
+                                </a>
+                            </li>
+                        </ul>
+                        <div class="user-body">
+                            <div class="tab-content">
+                                <div id="settings" class="tab-pane active">
+                                    <h4>Copyright © 2004-TODAY OpenERP SA. All Rights Reserved.</h4>
+                                    <p>Odoo is a trademark of the <a target="_blank" href="https://www.odoo.com" style="text-decoration: underline;">OpenERP SA Company</a>.</p>
+                                    <p>Licenced under the terms of <a target="_blank" href="http://www.gnu.org/licenses/agpl.html" style="text-decoration: underline;">GNU Affero General Public License</a></p>
+                                    <p>For more information visit <a target="_blank" href="https://www.odoo.com" style="text-decoration: underline;">Odoo.com</a></p>
+                                </div>
+                                <div id="email" class="tab-pane">
+                                    <h4>OpenERP S.A.</h4>
+                                    <p>
+                                        Chaussée de Namur 40<br/>
+                                        1367 Grand-Rosière <br/>
+                                        Belgium
+                                    </p>
+                                    <!-- TODO - ALIAS contactus -->
+                                    <a class='btn btn-link' href='https://www.odoo.com/web/about/contactus'>Our website</a>
+                                </div>
+                                <div id="events" class="tab-pane">
+                                    <h4>Discover Events of Odoo around the world...</h4>
+                                    <a class='btn btn-link' href='https://www.odoo.com/web/about/event'> Our next Events</a>
+                                </div>
+                                <div id="social" class="tab-pane">
+                                    <h4>Follow Us...</h4>
+                                    <a href="https://www.odoo.com/web/about/facebook"><i class="fa fa-facebook-square fa-3x social-fb"></i></a>
+                                    <a href="https://www.odoo.com/web/about/twitter"><i class="fa fa-twitter-square fa-3x social-tw"></i></a>
+                                    <a href="https://www.odoo.com/web/about/googleplus"><i class="fa fa-google-plus-square fa-3x social-gp"></i></a>
+                                    <a href="https://www.odoo.com/web/about/linkedin"><i class="fa fa-linkedin-square fa-3x social-lk"></i></a>
+                                </div>
+                            </div>
+                        </div>
+                    </div>
+                </div>
+            </div>
+        </div>
     </div>
 
 </t>