add backend_theme from openworx.nl

backend_theme_v12/static/description/index.html

@@ -0,0 +1,51 @@
+<section class="oe_container">
+    <div class="oe_row oe_spaced">
+		<div class="oe_span12">
+			<h1 class="oe_slogan" style="color:#337ab7;">Openworx Material Backend Theme</h1>
+			<h2 class="oe_slogan">The first Odoo 12.0 community backend theme</h2>
+			<div class="oe_screenshot" style="text-align: center;">
+				<h3 class="oe_slogan" style="color:#337ab7;">Enterprise look'n'feel and App Sidebar</h3>
+				<img style="max-width: 100%;" src="sidebar.png"/><br><br>
+				<h3 class="oe_slogan" style="color:#337ab7;">App Dashboard</h3>
+				<img style="max-width: 100%;" src="desktop.png"/><br><br>
+				<h3 class="oe_slogan" style="color:#337ab7;">Quick search in App Dashboard</h3>
+				<img style="max-width: 100%;" src="search.png"/><br><br>
+				<h3 class="oe_slogan" style="color:#337ab7;">Side Chatter on widescreen</h3>
+				<img style="max-width: 100%;" src="crm.png"/><br><br>
+				<h3 class="oe_slogan" style="color:#337ab7;">Fully responsive</h3>
+				<img style="max-width: 100%;" src="crm_mobile.png"/><br><br>
+				<img style="max-width: 100%;" src="mobile.png"/><br><br>
+			</div>
+		</div>
+	</div>
+</section>
+
+<section class="oe_container oe_separator">
+</section>
+
+<section class="oe_container" style="background-color:#E8E8E8; padding:20px 0px 90px 0px">
+    <div class="oe_row">
+        <div class="oe_span12">
+            <div class="oe_centeralign">
+                <p>Remark: It is possible that the Odoo service needs to be restarted after install.</p>
+            </div>
+        </div>	
+    </div>
+</section>
+
+<section class="oe_container oe_separator">
+</section>
+
+<section class="oe_container oe_dark">	
+    <div class="oe_row">	
+        <div class="oe_span12 oe_centeralign">	
+            <br/>	
+            <h3>Help & Support</h3>	
+            <br/>	
+                Website: <a href="https://www.openworx.nl" target="_blank">Openworx</a><br/>	
+                Contact: <a href="mailto:info@openworx.nl" subject="Material Backend Theme v12">Email Support</a><br/>	
+            <br/>	
+        </div>	
+    </div>	
+</section>
+

backend_theme_v12/static/src/img/checked.svg

@@ -0,0 +1,14 @@
+<?xml version="1.0" encoding="utf-8"?>
+<!-- Generator: Adobe Illustrator 16.0.0, SVG Export Plug-In . SVG Version: 6.00 Build 0)  -->
+<!DOCTYPE svg PUBLIC "-//W3C//DTD SVG 1.1//EN" "http://www.w3.org/Graphics/SVG/1.1/DTD/svg11.dtd">
+<svg version="1.1" id="Layer_1" xmlns="http://www.w3.org/2000/svg" xmlns:xlink="http://www.w3.org/1999/xlink" x="0px" y="0px"
+	 width="15px" height="15px" viewBox="0 0 15 15" enable-background="new 0 0 15 15" xml:space="preserve">
+<g>
+	<path fill="#666766" d="M12.385,5.578L7.65,10.313l-0.89,0.888c-0.119,0.119-0.281,0.184-0.444,0.184
+		c-0.162,0-0.328-0.064-0.445-0.184l-0.89-0.888L2.615,7.944C2.497,7.828,2.432,7.664,2.432,7.5c0-0.163,0.065-0.325,0.183-0.444
+		l0.89-0.89c0.118-0.117,0.281-0.183,0.444-0.183c0.164,0,0.327,0.065,0.445,0.183l1.923,1.929l4.289-4.296
+		c0.119-0.118,0.282-0.183,0.445-0.183c0.164,0,0.327,0.065,0.445,0.183l0.889,0.89c0.118,0.118,0.184,0.281,0.184,0.445
+		C12.568,5.296,12.503,5.46,12.385,5.578z"/>
+</g>
+</svg>
+

backend_theme_v12/static/src/js/sidebar-toggle.js

@@ -0,0 +1,25 @@
+/* Copyright 2017 Openworx.
+ * License LGPL-3.0 or later (http://www.gnu.org/licenses/lgpl). */
+
+odoo.define('backend_theme_v12.sidebar-toggle', function (require) {
+    "use strict";
+    
+    var session = require('web.session');
+    var rpc = require('web.rpc');
+    var id = session.uid;
+    rpc.query({
+                model: 'res.users',
+                method: 'read',
+                args: [[id], ['sidebar_visible']],
+            }).then(function(res) {
+                var dbfield = res[0];
+                var toggle = dbfield.sidebar_visible;
+                if (toggle === true) {
+                    $("#app-sidebar").removeClass("toggle-sidebar");
+                } else {
+                    $("#app-sidebar").addClass("toggle-sidebar");
+                };
+    });
+                             
+});
+    

backend_theme_v12/static/src/js/sidebar.js

@@ -0,0 +1,33 @@
+/* Copyright 2016, 2019 Openworx.
+ * License LGPL-3.0 or later (http://www.gnu.org/licenses/lgpl). */
+
+// Check if debug mode is active and then add debug into URL when clicking on the App sidebar
+odoo.define('backend_theme_v12.Sidebar', function(require) {
+    "use strict";
+    var core = require('web.core');
+    var session = require('web.session');
+    var Widget = require('web.Widget');
+    $(function() {
+	(function($) {
+	    $.addDebug = function(url) {
+		url = url.replace(/(.{4})/, "$1?debug");
+		return url;
+	    }
+	    $.addDebugWithAssets = function(url) {
+		url = url.replace(/(.{4})/, "$1?debug=assets");
+		return url;
+	    }
+	    $.delDebug = function(url) {
+		var str = url.match(/web(\S*)#/);
+		url = url.replace("str/g", "");
+		return url;
+	    }
+	}) (jQuery);
+        $("#sidebar a").each(function() {
+            var url = $(this).attr('href');
+            if (session.debug == 1) $(this).attr('href', $.addDebug(url));
+            if (session.debug == 'assets') $(this).attr('href', $.addDebugWithAssets(url));
+            if (session.debug == false) $(this).attr('href', $.delDebug(url));
+        });
+    });
+});

backend_theme_v12/static/src/scss/sidebar.scss

@@ -0,0 +1,69 @@
+/* Copyright 2016, 2018 Openworx.
+ * License LGPL-3.0 or later (http://www.gnu.org/licenses/lgpl). */
+
+/* App Sidebar Panel */
+
+$odoo-sidebar-width: 180px;
+
+.app-sidebar-panel {
+	flex: 0 0 $odoo-sidebar-width;	
+    background-color: $gray-base;
+    height: 100% !important;
+    overflow-y: auto;
+    @media (max-width: 768px) {
+      display: none;
+    }
+}
+
+/* @media (min-width: 768px) {
+	.o_menu_apps {
+		display: none !important;
+	}
+} */
+
+//.app-sidebar-panel:hover {
+//    @include o-flex(0, 0, $odoo-sidebar-width);
+//}
+
+.app-sidebar {
+    white-space: nowrap;
+    padding: 0;
+    .app-sidebar-menu {
+    list-style: none;
+    margin: 0;
+    padding: 0;
+    >li {
+        display: block;
+        margin: 0;
+        padding: 0;
+        border: 0px;
+        >a {
+            display: block;
+            position: relative;
+            margin: 0;
+            border: 0px;
+            padding: 8px 15px;
+            text-decoration: none;
+            font-size: 13px;
+            font-weight: 300;
+            color: $gray-lighter;
+            overflow: hidden;
+            text-overflow: ellipsis;
+        }
+    }
+        > li:hover > a{
+	    background: darken(#0099ff, 15%);
+	    color: #fff;
+        }
+    }
+}
+
+.app-sidebar-menuitem {
+    width: 23px;
+    height: 22px;
+    margin-right: 5px;
+}
+
+.toggle-sidebar {
+    margin-left: 0px - $odoo-sidebar-width;
+}

backend_theme_v12/static/src/scss/style.scss

@@ -0,0 +1,492 @@
+/* Copyright 2016, 2019 Openworx.
+ * License LGPL-3.0 or later (http://www.gnu.org/licenses/lgpl). */
+
+
+@font-face {
+    font-family: Roboto;
+    src: url(/backend_theme_v12/static/src/font/Roboto-Regular.ttf)
+}
+
+
+$gray-base:              #000;
+$gray-darker:            lighten($gray-base, 13.5%);
+$gray-dark:              #666;
+$gray:                   #777;
+$gray-light:             #AEA79F;
+$gray-lighter: lighten($gray-base, 93.5%);
+
+
+// Change colors here
+
+// Odoo EE colors
+//$brand-primary: #875a7b;
+//$brand-secondary: #00A09D;
+//------------------------
+$brand-primary: #008DCA;
+$brand-secondary: #5EC269;
+//------------------------
+
+
+$brand-primary-dark: darken($brand-primary, 10%);
+$brand-secondary-dark: darken($brand-secondary, 10%);
+
+body {
+
+    font-family: "Roboto";
+}
+
+.o_loading {
+    background-color: $brand-primary;
+}
+
+.o_main_navbar {
+    background-color : $brand-primary;
+}
+
+.o_main_navbar > a:hover, .o_main_navbar > a:focus, .o_main_navbar > button:hover, .o_main_navbar > button:focus {
+
+    background-color: $brand-primary-dark;
+    color: inherit;
+
+}
+
+.o_main_navbar > ul > li > a:hover, .o_main_navbar > ul > li > label:hover {
+    background-color: $brand-primary-dark;
+}
+
+.o_main_navbar .show .dropdown-toggle {
+
+    background-color: $brand-primary-dark;
+
+}
+
+// Fix color Add file button
+.o_control_panel .o_cp_sidebar .o_hidden_input_file .o_form_binary_form span {
+    color: $gray-dark !important;
+}
+
+// Buttons
+
+.btn {
+    border-radius: 0px;
+}
+
+.btn-primary {
+
+    color: #fff;
+    background-color: $brand-secondary;
+    border-color: $brand-secondary;
+
+}
+
+.btn-primary:hover {
+
+    color: #fff;
+    background-color: $brand-secondary-dark;
+    border-color: $brand-secondary-dark;
+}
+
+.btn-secondary {
+    border: none;
+}
+
+.btn:active, .btn.active {
+    -webkit-box-shadow: none;
+    box-shadow: none;
+    background-color: #eee !important;
+}
+
+.btn-group.open .dropdown-toggle {
+    -webkit-box-shadow: none;
+    box-shadow: none;
+    background-color: #eee !important;
+}
+
+
+.btn-link {
+    color: $brand-secondary;
+}
+
+.o_form_view .o_form_statusbar > .o_statusbar_status > .o_arrow_button.btn-primary.disabled {
+    color: $brand-primary;
+}
+
+.o_form_view .o_form_statusbar > .o_statusbar_status > .o_arrow_button:not(.disabled):hover {
+    color: $brand-primary;
+}
+
+.o_dropdown_toggler_btn, .o_dropdown_toggler_btn:hover, .o_dropdown_toggler_btn:focus, .o_dropdown_toggler_btn:hover, .o_dropdown_toggler_btn:focus, .btn-icon, .o_graph_button {
+    text-transform: none !important;
+    color: $gray-dark !important;
+    background-color: transparent !important;
+    border: none !important;
+}
+
+.dropdown-menu {
+    border-radius: 0px;
+}
+
+oe_highlight {
+    color: #ffffff !important;
+    background-color: $brand-primary !important;
+}
+
+.o_external_button {
+    color: $brand-primary !important;
+    background: #ffffff;
+}
+
+.o_button_icon {
+    color: $brand-primary !important;
+}
+
+
+// Calendar
+
+.o_calendar_container .o_calendar_sidebar_container .ui-datepicker table .ui-state-active {
+    background: none;
+    background-color: $brand-primary !important;
+    color: #ffffff !important;
+}
+.o_calendar_container .o_calendar_sidebar_container .ui-datepicker table .ui-state-default {
+    color: $brand-primary;
+}
+
+.datepicker {
+    .table-sm {
+        > thead {
+            color: white;
+            background-color: $brand-primary;
+
+            > tr {
+                &:first-child {
+                    th:hover {
+                        color: white;
+                        background-color: darken($brand-primary, 10%);
+                    }
+                }
+
+                &:last-child {
+                    color: $o-datepicker-week-color;
+                    background-color: $o-datepicker-week-bg-color;
+                }
+                > th {
+                    border-radius: 0;
+                }
+            }
+        }
+
+        > tbody {
+            > tr {
+                > td {
+                    &.active, .active {
+                        background-color: $o-brand-primary;
+                        border-radius: 100px;
+                    }
+
+                    &.today:before {
+                        border-bottom-color: $o-brand-primary;
+                    }
+                }
+            }
+        }
+    }
+}
+
+.datepicker .table-sm > tbody > tr > td.active, .datepicker .table-sm > tbody > tr > td .active {
+    background-color: $brand-primary;
+        border-radius: 0;
+}
+
+// Filter search label
+
+.o_searchview {
+    .o_searchview_facet {
+
+         background-color: #ffffff;
+
+        .o_searchview_facet_label {
+            background-color: $brand-primary;
+        }
+    }
+}
+
+a {
+
+    color: $brand-secondary;
+    text-decoration: none;
+    background-color: transparent;
+    -webkit-text-decoration-skip: objects;
+
+}
+
+a:hover {
+
+    color: $brand-secondary-dark;
+    text-decoration: none;
+
+}
+
+
+.o_control_panel {
+    background-color: #ffffff;
+}
+
+.breadcrumb {
+    background-color: inherit;
+}
+
+// Input
+
+input[type="text"], input[type="password"], input[type="number"],
+textarea, select, .o_form_view.o_form_editable .o_form_field_many2manytags,
+.o_searchview
+{
+    border: 0;
+    border-radius: 0;
+    border-bottom: 1px solid #ccc;
+}
+
+.o_web_client input:focus, .o_web_client textarea:focus, .o_web_client select:focus {
+    outline: none;
+    border-bottom: 2px solid $brand-primary;
+}
+
+.o_input {
+    border: 1px solid #ccc;
+    border-top-style: none;
+    border-right-style: none;
+    border-left-style: none;
+    color: $gray;
+}
+
+.o_field_widget {
+    &.o_field_many2one .o_external_button {
+        color: $brand-secondary
+    }
+}
+
+.o_required_modifier {
+    &.o_input, .o_input {
+        background-color: lighten($brand-primary, 35%) ! important;
+    }
+}
+
+.input-group-text {
+        background-color: transparent;
+        color: #fff;
+        border: 0px;
+}
+
+// Listview
+
+.o_list_view.table {
+    border: none;
+}
+.o_list_view.table thead, .o_list_view.table tfoot, .o_list_view.table td,.o_list_view.table th {
+    border: none;
+}
+
+.o_list_view.table thead {
+    background-color: #e2e2e0;
+}
+
+.o_list_view.table thead > tr > th.o_column_sortable:hover {
+    background-color: #D6D6D3;
+}
+
+.o_list_view.table tbody tr.o_group_header {
+    background-color: #dfdfdf;
+    background-image: none;
+    border-top: 1px solid #e2e2e0;
+}
+
+.table-striped > tbody > tr:nth-of-type(2n+1) {
+    background-color: #eef0f0;
+}
+
+.o_list_view tfoot tr:nth-child(1) td {
+    background-color: $brand-primary !important;
+    color: #fff !important;
+}
+
+
+.ui-autocomplete .ui-menu-item.ui-state-focus {
+    background-color: #dee2e6;
+}
+
+.ui-menu-item a:hover,.ui-menu-item a:focus {
+    color: #666666 !important;
+}
+.ui-autocomplete .ui-menu-item.ui-state-focus a{
+    color: #666666 !important;
+}
+
+.o_form_view .oe_button_box .oe_stat_button .o_stat_info .o_stat_value {
+    color: $brand-primary;
+}
+
+.o_form_view .o_horizontal_separator {
+    color: #666666;
+    font-weight: bold;
+}
+
+// Forms
+
+.o_form_view {
+
+     .o_form_sheet_bg {
+        background: none !important;
+        background-color: #F9F9F9 !important;
+        padding: 0px;
+        .o_form_sheet {
+            border: 1px solid #d9d7d7;
+            box-shadow: 0 5px 20px -15px black;
+        }
+    }
+
+    .o_form_statusbar {
+        //margin: -16px;
+
+        .o_statusbar_status {
+            > .o_arrow_button {
+                background: #ffffff;
+            }
+        }
+    }
+}
+
+// App Dashboard
+
+/* .o_menu_apps .dropdown-menu.show {
+        background: transparent url('/dashboard') no-repeat scroll center center / cover;
+
+} */
+
+.o_menu_apps .dropdown-menu.show {
+    background: url(/dashboard);
+    background-origin: border-box;
+    background-size: cover;
+    height: calc(100vh);
+    max-height: calc(100vh);
+    border-top: $o-navbar-height solid transparent;
+    top: 0 !important;
+}
+
+.o_main_navbar > ul.o_menu_systray {
+    float: right;
+    position: relative;
+    z-index: 200;
+}
+
+.fa-th-large::before {
+    content: "\f00a";
+}
+
+.o_menu_apps .full {
+    width: 46px;
+    font-size: 18px;
+    text-align: center;
+    position: relative;
+    z-index: 200;
+}
+
+.o-app-name {
+        color: #fff;
+    font-size: 15px;
+    font-weight: 400;
+    text-overflow: ellipsis;
+    white-space: nowrap;
+        text-shadow: 0 1px 1px rgba(0, 0, 0, 0.45);
+}
+
+.o_menu_apps .dropdown-menu.show .o-app-icon {
+        padding: 20px 0 0;
+}
+
+.o_menu_apps .dropdown-menu.show .o-app-icon:hover {
+        box-shadow: 0 8px 15px -10px black;
+    transform: translateY(-1px);
+}
+
+.dropdown-item.o_app {
+    background: transparent;
+}
+
+.o-menu-search-result {
+        color: #fff;
+}
+
+// Chat window
+
+.o_thread_window .o_thread_window_header {
+        background-color: $brand-primary;
+}
+
+// Formview
+
+
+$gray-lighter-darker: #d9d7d7;
+$o-statbutton-height: 40px;
+$o-statbutton-spacing: 6px;
+
+.o_form_view {
+    @mixin o-form-sheet-negative-margin() {
+        margin-left: -$o-horizontal-padding;
+        margin-right: -$o-horizontal-padding;
+        margin-top: -#{$o-horizontal-padding +1};
+    }
+
+    .o_form_uri {
+        display: inline-block;
+
+        color: $gray;
+
+        &:first-line {
+            color: $link-color;
+        }
+
+        &:hover {
+            color: darken($link-color, 15%); // hack required on chrome
+
+            &:first-line {
+                color: darken($link-color, 15%);
+            }
+        }
+    }
+
+    .oe_avatar {
+        float: right;
+
+        >img {
+            max-height: 90px;
+            max-width: 90px;
+            margin-bottom: 10px;
+            box-shadow: 0 1px 4px rgba(0, 0, 0, 0.4);
+            border: none;
+        }
+
+        +.oe_title {
+            padding-right: 0px;
+            padding-left: 0px;
+        }
+    }
+
+}
+
+// Override `@include media-breakpoint-up` in module `web_responsive`
+@include media-breakpoint-up(md) {
+    .o_form_view .oe_button_box + .oe_avatar + .oe_title {
+      /* Add 110px in the calculation for the avatar space */
+      width: calc(100% - 400px - 110px);
+      min-width: 400px;
+      max-width: 650px;
+    }
+    /* Same correction for res.users .oe_title div */
+    .o_form_view .o_field_integer + .oe_button_box + .o_form_header + .o_field_boolean +
+    .o_form_header + .oe_avatar + .oe_title {
+      width: calc(100% - 400px - 110px);
+      min-width: 400px;
+      max-width: 650px;
+    }    
+}