+
+ 
+
+
+
+
+
+ 
+
+
+
+
+
+
+
+
+ Community
+
+
+ Enterprise
+
+
+ Odoo.sh
+
+ Jazzy Backend Theme
+Clean &Minimal Backend Theme for Odoo 16
+ +
+
+
+
+
+ 
+
+
+ Explore This + Module
+
+
+
+
+
+
+
+
+
+
+
+
+ 
+
+
+ Overview +
+
+
+
+
+
+
+ he app provides a user friendly backend
+ theme for Odoo 15.0 community edition.
+
+
+
+
+ 
+
+
+ Features +
+
+
+
+
+
+
+
+
+ 
+ Well-Crafted.
+
+
+ Well-Crafted.
+
+
+ Efficent Design.
+
+
+ Efficent Design.
+
+
+ Clearer insight.
+
+
+ Clearer insight.
+
+
+
+ 
+
+
+ Screenshots +
+
+
+
+
+
+
+
+
+
+ 
+ 
+
+
+
+ App Menu
+The App Menu is the main attraction of the Jazzy backend theme. It has a fully responsive layout with a new highlighted color combination and a more modern interface for all applications. Moreover, the Jazzy backend theme improves your experience with Odoo, providing you with a fully customizable background image, Navbar color, and many more.
+
+
+
+
+ 
+
+
+ Theme Settings
+Jazzy Backend Theme Settings
+To improve your experience with Odoo the Jazzy backend theme provides a fully + configurable theme settings menu.
+
+
+ 
+
+ Custom AppBar
+AppBar
+Easly accessible side bar where it reveals the side bar menu on just a click. Moreover, its also + fully customisable with Jazzy backend theme.
+
+
+
+ Responsive Layout
+Truly Responsive
+One of the critical highlights of the Jazzy backend theme is that it was genuinely responsive; moreover, it provides an efficient interface to manage a mobile device.
+ +
+ 
+
+ Custom Kanban View
+Kanban view
+Jazzy Backend Theme gives a colorful & elegant kanban view, and it's fully customizable with this theme.
+
+
+ 
+
+ Search Option
+Advanced Searching for App Menus
+Jazzy Backend Theme gives a more complex and powerful search than standard search, providing search options like enterprise edition.
+
+
+
+
+ 
+
+ Form View
+Custom Form view
+Jazzy Backend theme provides a fully modified and colorful form view with the full view + experience.
+
+
+ 
+
+ Vibrent ui
+Attractive Customizable User Interface
+It provides fully attractive, and a elgant User Interface with completely customizability.
+
+
+
+
+
+
+ Mobile
+Kanban View
+
+ 
+
+ Responsive kanban view
+It gives a fully responsive kanban view in Mobile view, which is also fully customizable in the Jazzy Backend theme.
+
+
+ 
+
+ Form View
+Visualized form view
+It puts forward a fully visualized form view with colorful and attractive aspects which the user can customize.
+
+
+ 
+
+ List view
+Modified Tree view
+Jazzy Backend Theme provides fully modified list view and amazing table designs with stunning look outputs.
+
+
+ 
+
+ settings
+Fully Redesigned Settings
+Mobile friendly and Redesigned settings with stylish view.
+
+
+ 
+
+ Employe module
+Modified Form view for employees
+It provides the Employees with a form view with redesigned and various modified features.
+
+
+ 
+
+ Search View
+Ultra Modern Search view
+It has an advanced search view with a highly modified search option for easy usage and an improved experience with Odoo.
+
+
+
+
+ 
+
+
+ Related + Products +
+
+
+
+
+
+
+
+
+ 
+ 
+ 
+ 
+ 
+
+
+
+
+ 
+
+
+ Our Services +
+
+
+
+
+
+
+
+
+
+
+
+
+
+
+ 
+
+
+ + Odoo + Customization
+
+
+
+
+ 
+
+
+ + Odoo + Implementation
+
+
+
+
+
+ 
+
+
+ + Odoo + Support
+
+
+
+
+ 
+
+
+ + Hire + Odoo + Developer
+
+
+
+
+ 
+
+
+ + Odoo + Integration
+
+
+
+
+
+ 
+
+
+ + Odoo + Migration
+
+
+
+
+ 
+
+
+ + Odoo + Consultancy
+
+
+
+
+ 
+
+
+ + Odoo + Implementation
+
+
+
+ 
+
+
+ + Odoo + Licensing Consultancy
+
+
+
+
+ 
+
+
+ Our + Industries +
+
+
+
+
+
+
+
+
+
+
+
+
+ 
+
+
+ + Trading +
++ Easily procure + and + sell your products
+
+
+
+
+ 
+
+
+ + POS +
++ Easy + configuration + and convivial experience
+
+
+
+
+ 
+
+
+ + Education +
++ A platform for + educational management
+
+
+
+
+ 
+
+
+ + Manufacturing +
++ Plan, track and + schedule your operations
+
+
+
+
+ 
+
+
+ + E-commerce & Website +
++ Mobile + friendly, + awe-inspiring product pages
+
+
+
+
+ 
+
+
+ + Service Management +
++ Keep track of + services and invoice
+
+
+
+
+ 
+
+
+ + Restaurant +
++ Run your bar or + restaurant methodically
+
+
+
+ 
+
+
+ + Hotel Management +
++ An + all-inclusive + hotel management application
+
+
+
+ 
+
+
+ Support +
+
+
+
\ No newline at end of file
diff --git a/jazzy_backend_theme/static/description/theme_screenshot.png b/jazzy_backend_theme/static/description/theme_screenshot.png
new file mode 100644
index 000000000..13d3c4707
Binary files /dev/null and b/jazzy_backend_theme/static/description/theme_screenshot.png differ
diff --git a/jazzy_backend_theme/static/src/components/app_menu/menu_order.css b/jazzy_backend_theme/static/src/components/app_menu/menu_order.css
new file mode 100644
index 000000000..0ba06bd62
--- /dev/null
+++ b/jazzy_backend_theme/static/src/components/app_menu/menu_order.css
@@ -0,0 +1,114 @@
+.nav-container {
+
+ float: left;
+ position: relative;
+ width: 99vw;
+ height: 100%;
+ background: #fff;
+ display: flex;
+ justify-content: start;
+ align-items: start;
+ padding: 0px 20rem;
+ margin-top: 2rem;
+
+}
+/*.search-results {*/
+/* float: left;*/
+/* position: relative;*/
+/* width: 100vw;*/
+/* height: 100vh;*/
+/* background: #fff;*/
+/* display: flex;*/
+/* justify-content: center;*/
+/* align-items: center;*/
+/* padding: 0 20rem;*/
+/*}*/
+.o_main_navbar .dropdown-menu .show {
+ max-height: auto !important;
+ min-width: 100%;
+ overflow: auto;
+ margin-top: 0;
+ position: static;
+ top: 0;
+ display: flex;
+ box-shadow: none;
+ border: none;
+ flex-wrap: wrap;
+ flex-direction: row;
+ overflow: unset;
+}
+.dropdown-item.o_app.mt0 {
+ flex-basis: 20%;
+ display: flex;
+ justify-content: center;
+ align-items: center;
+ flex-direction: column;
+ margin-bottom: 23px;
+}
+.o_setting_search {
+ position: relative;
+
+ .searchInput {
+ height: 28px;
+ padding: 0px;
+ border: 0px;
+ border-dropdown-item bottom: 1px solid gray('400');
+ border-color: gray('700');
+ box-shadow: none;
+ font-weight: 500;
+ }
+
+ .searchIcon {
+ @include o-position-absolute(4px, 0);
+ color: gray('700');
+ }
+ }
+ .search-container.has-results {
+ height: 100%;
+
+ .search-input {
+ height: 3em;
+ }
+
+ .search-results {
+ height: calc(100% - 3em);
+ overflow: auto;
+ }
+ }
+
+.app-menu {
+
+ width: 100%;
+ display: flex;
+ flex-wrap: wrap;
+
+}
+.o_main_navbar .dropdown-menu.show {
+ max-height: none !important;
+ min-width: 100vw;
+ min-heigt: 100vh;
+ overflow: auto;
+ margin-top: 0;
+}
+.o-menu-search-result.dropdown-item.col-12.ml-auto.mr-auto {
+
+ background-repeat: no-repeat;
+ background-size: 100%;
+ padding-left: 30%;
+ margin-bottom: 5%;
+
+}
+.form-control {
+ padding: 0 !important;
+}
+@media (max-width: 1371px){
+
+}
+
+@media (max-width:992px) {
+
+}
+
+@media (max-width:400px) {
+
+}
\ No newline at end of file
diff --git a/jazzy_backend_theme/static/src/components/app_menu/search_apps.js b/jazzy_backend_theme/static/src/components/app_menu/search_apps.js
new file mode 100644
index 000000000..1f306c44f
--- /dev/null
+++ b/jazzy_backend_theme/static/src/components/app_menu/search_apps.js
@@ -0,0 +1,122 @@
+/** @odoo-module */
+
+import { NavBar } from "@web/webclient/navbar/navbar";
+import { registry } from "@web/core/registry";
+const { fuzzyLookup } = require('@web/core/utils/search');
+import { computeAppsAndMenuItems } from "@web/webclient/menus/menu_helpers";
+import core from 'web.core';
+
+const commandProviderRegistry = registry.category("command_provider");
+const { onMounted } = owl;
+
+import { patch } from 'web.utils';
+var rpc = require('web.rpc');
+patch(NavBar.prototype, 'jazzy_backend_theme/static/src/js/appMenu.js', {
+
+ //--------------------------------------------------------------------------
+ // Public
+ //--------------------------------------------------------------------------
+
+ /**
+ * @override
+ */
+ setup() {
+ this._super();
+ this._search_def = $.Deferred();
+ let { apps, menuItems } = computeAppsAndMenuItems(this.menuService.getMenuAsTree("root"));
+ this._apps = apps;
+ this._searchableMenus = menuItems;
+ this.colors = this.fetch_data();
+ onMounted(this.onMounted);
+ },
+ fetch_data: function() {
+ var self = this;
+ rpc.query({model: 'res.config.settings',method: 'config_color_settings',args: [0],}).then(function(result){
+ self.colors = result;
+ console.log("$$$",result);
+ if (result.primary_accent !== false){
+ document.documentElement.style.setProperty("--primary-accent",result.primary_accent);
+ }
+ if (result.appbar_color !== false){
+ document.documentElement.style.setProperty("--app-bar-accent",result.appbar_color);}
+ if (result.primary_hover !== false){
+ document.documentElement.style.setProperty("--primary-hover",result.primary_hover);}
+ if (result.secondary_color !== false){
+ document.documentElement.style.setProperty("--primary-accent-border",result.secondary_color);}
+ if (result.full_bg_img !== false){
+ document.documentElement.style.setProperty("--full-screen-bg",'url(data:image/png;base64,'+result.full_bg_img+')');
+
+ }
+ if (result.appbar_text !== false){
+ document.documentElement.style.setProperty("--app-menu-font-color",result.appbar_text);}
+ if (result.secoundary_hover !== false){
+ document.documentElement.style.setProperty("--secoundary-hover",result.secoundary_hover);}
+ if (result.kanban_bg_color !== false){
+ document.documentElement.style.setProperty("--kanban-bg-color",result.kanban_bg_color);}
+ });
+ },
+
+ onMounted() {
+ this.$search_container = $(".search-container");
+ this.$search_input = $(".search-input input");
+ this.$search_results = $(".search-results");
+ this.$app_menu = $(".app-menu");
+ this.$dropdown_menu = $(".dropdown-menu");
+ },
+ _searchMenusSchedule: function () {
+ this.$search_results.removeClass("o_hidden")
+ this.$app_menu.addClass("o_hidden");
+ this._search_def.reject();
+ this._search_def = $.Deferred();
+ setTimeout(this._search_def.resolve.bind(this._search_def), 50);
+
+ this._search_def.done(this._searchMenus.bind(this));
+ },
+
+ _searchMenus: function () {
+ var query = this.$search_input.val();
+ if (query === "") {
+ this.$search_container.removeClass("has-results");
+ this.$app_menu.removeClass("o_hidden");
+ this.$search_results.empty();
+ return;
+ }
+
+ var results = [];
+ fuzzyLookup(query, this._apps, (menu) => menu.label)
+ .forEach((menu) => {
+ results.push({
+ category: "apps",
+ name: menu.label,
+ actionID: menu.actionID,
+ id: menu.id,
+ webIconData: menu.webIconData,
+ });
+ });
+
+ fuzzyLookup(query, this._searchableMenus, (menu) =>
+ (menu.parents + " / " + menu.label).split("/").reverse().join("/")
+ ).forEach((menu) => {
+ results.push({
+ category: "menu_items",
+ name: menu.parents + " / " + menu.label,
+ actionID: menu.actionID,
+ id: menu.id,
+ });
+ });
+
+ this.$search_container.toggleClass(
+ "has-results",
+ Boolean(results.length)
+ );
+ this.$search_results.html(
+ core.qweb.render(
+ "jazzy_backend_theme.SearchResults",
+ {
+ results: results,
+ widget: this,
+ }
+ )
+ );
+ },
+});
\ No newline at end of file
diff --git a/jazzy_backend_theme/static/src/components/app_menu/side_menu.xml b/jazzy_backend_theme/static/src/components/app_menu/side_menu.xml
new file mode 100644
index 000000000..c84926fbf
--- /dev/null
+++ b/jazzy_backend_theme/static/src/components/app_menu/side_menu.xml
@@ -0,0 +1,98 @@
+
+
+
+
+
+
+
+ 
+
+
+
+
+
+
+
+
+ 
+
+
+
+
+
+
+ 
+
+
+
+
+
+
+
+
+
+
+
+
+
+
+
+
+
+
+
+
+
+
+
+ ![]()
+ ![]()
+
+
+
+
+
+
+ -
+
-
+
+
+
+ +
+
jazzy Backend Theme
+
+
+
+
+
+
+
+
+
+
+
+
+
+
+
+
+
+
+
+
+
+
+
+
+
+
+
+
+
+
+
+
+
+
+
+
+
+
+
+
+
+
+
+
+
+
+
+
+
+
+
+
+
+
+
+
+
+
+
+
+
+
+
+
+
+
+
+
+
+
+
+
+
+
+
+
+
+
+
+
+
+
+
+
+
+
+
+
+
+
+
+
+
+
+