599 lines
16 KiB
CSS
599 lines
16 KiB
CSS
/* ========================================
|
|
ODOO THEME COLOR VARIABLES
|
|
Primary Color: #ec0000 (Dine360 Red)
|
|
Secondary Color: #000000 (Black)
|
|
======================================== */
|
|
|
|
:root {
|
|
/* Primary Brand Colors */
|
|
--primary-color: #d6111e;
|
|
--primary-dark: #8B0A0E;
|
|
--primary-light: #E57373;
|
|
--primary-lighter: #FFCDD2;
|
|
|
|
/* Secondary/Accent Color */
|
|
--secondary-color: #171422;
|
|
--secondary-dark: #000000;
|
|
--secondary-light: #2d293d;
|
|
|
|
/* Gradient Combinations Removed - Using Solid Colors */
|
|
--gradient-primary: #d6111e;
|
|
--gradient-primary-hover: #8B0A0E;
|
|
|
|
/* Home Page Background */
|
|
--bg-gradient-main: #ffffff;
|
|
|
|
/* UI Element Colors */
|
|
--btn-primary-bg: #d6111e;
|
|
--link-color: #171422;
|
|
--link-hover: #d6111e;
|
|
|
|
/* Status Colors */
|
|
--success-color: #171422;
|
|
--warning-color: #FECD4F;
|
|
--danger-color: #d6111e;
|
|
--info-color: #2d293d;
|
|
|
|
/* Shadows */
|
|
--shadow-primary: 0 4px 15px rgba(214, 17, 30, 0.2);
|
|
--shadow-primary-hover: 0 8px 20px rgba(214, 17, 30, 0.3);
|
|
--shadow-card: 0 10px 30px rgba(23, 20, 34, 0.08);
|
|
}
|
|
|
|
/* ::selection - Text Selection Color */
|
|
::selection {
|
|
background: var(--primary-color) !important;
|
|
color: #fff !important;
|
|
}
|
|
|
|
/* Scrollbar Styling (Webkit) */
|
|
::-webkit-scrollbar-thumb {
|
|
background: var(--secondary-color) !important;
|
|
border-radius: 10px;
|
|
}
|
|
|
|
::-webkit-scrollbar-track {
|
|
background: #f1f1f1;
|
|
}
|
|
|
|
/* ---------------------------------------------------------
|
|
GLOBAL UI OVERRIDES (HOME PAGE STYLE)
|
|
--------------------------------------------------------- */
|
|
|
|
/* Global Background & Font */
|
|
body,
|
|
.o_web_client {
|
|
background: var(--bg-gradient-main) !important;
|
|
font-family: 'Inter', 'Segoe UI', Roboto, sans-serif !important;
|
|
font-size: 15px !important;
|
|
/* Increased Font Size for Readability */
|
|
background-attachment: fixed !important;
|
|
background-size: cover !important;
|
|
}
|
|
|
|
/*
|
|
REMOVED AGGRESSIVE LAYOUT OVERRIDES
|
|
(o_action_manager, o_view_controller overrides deleted to restore Odoo default structural behavior)
|
|
*/
|
|
|
|
/* ---------------------------------------------------------
|
|
NAVBAR & SIDEBAR (CONTROL PANEL)
|
|
--------------------------------------------------------- */
|
|
|
|
/* Top Navbar - Glassmorphism */
|
|
.o_main_navbar {
|
|
background: #ffffff !important;
|
|
border-bottom: 2px solid var(--primary-color) !important;
|
|
box-shadow: 0 4px 15px rgba(0, 0, 0, 0.03) !important;
|
|
color: #2c3e50 !important;
|
|
}
|
|
|
|
.o_main_navbar .o_menu_brand {
|
|
color: var(--secondary-color) !important;
|
|
font-weight: 800 !important;
|
|
font-size: 1.4rem !important;
|
|
letter-spacing: -0.5px;
|
|
}
|
|
|
|
.o_main_navbar .o_menu_sections .o_nav_entry,
|
|
.o_main_navbar .o_menu_systray .o_nav_entry {
|
|
color: white !important;
|
|
font-size: 14px !important;
|
|
font-weight: 600 !important;
|
|
}
|
|
|
|
.o_main_navbar .o_menu_sections .o_nav_entry:hover,
|
|
.o_main_navbar .o_menu_systray .o_nav_entry:hover {
|
|
background: var(--primary-color) !important;
|
|
}
|
|
|
|
/* Control Panel (Search, Filter Bar) */
|
|
.o_control_panel {
|
|
background: #fdfdfd !important;
|
|
border-bottom: 1px solid rgba(0, 0, 0, 0.05) !important;
|
|
}
|
|
|
|
/* Breadcrumbs */
|
|
.breadcrumb-item a {
|
|
color: #d6111e !important;
|
|
font-weight: 700 !important;
|
|
font-size: 18px !important;
|
|
/* Larger headers */
|
|
}
|
|
|
|
.breadcrumb-item.active {
|
|
color: #718096 !important;
|
|
font-weight: 600 !important;
|
|
font-size: 18px !important;
|
|
}
|
|
|
|
/* Search Bar Input */
|
|
.o_searchview {
|
|
background: #f8f9fa !important;
|
|
border: 1px solid #e2e8f0 !important;
|
|
border-radius: 10px !important;
|
|
padding: 6px 15px !important;
|
|
}
|
|
|
|
.o_searchview .o_searchview_input {
|
|
background: transparent !important;
|
|
font-size: 14px !important;
|
|
}
|
|
|
|
/* ---------------------------------------------------------
|
|
TABLES (LIST VIEW)
|
|
--------------------------------------------------------- */
|
|
|
|
.o_list_view .o_list_table {
|
|
background: transparent !important;
|
|
}
|
|
|
|
/* Table Header */
|
|
.o_list_view .o_list_table thead {
|
|
background: rgba(248, 249, 250, 0.8) !important;
|
|
color: #4a5568 !important;
|
|
border-bottom: 2px solid var(--secondary-color) !important;
|
|
}
|
|
|
|
.o_list_view .o_list_table thead th {
|
|
border: none !important;
|
|
text-transform: uppercase;
|
|
font-size: 0.75rem;
|
|
letter-spacing: 0.05em;
|
|
font-weight: 700 !important;
|
|
padding: 12px 10px !important;
|
|
}
|
|
|
|
/* Table Rows */
|
|
.o_list_view .o_list_table tbody tr.o_data_row {
|
|
transition: all 0.2s ease !important;
|
|
border-bottom: 1px solid rgba(0, 0, 0, 0.03) !important;
|
|
}
|
|
|
|
.o_list_view .o_list_table tbody tr.o_data_row:hover {
|
|
background-color: rgba(214, 17, 30, 0.05) !important;
|
|
/* Light Red Hover */
|
|
transform: scale(1.002);
|
|
box-shadow: 0 4px 10px rgba(0, 0, 0, 0.02);
|
|
}
|
|
|
|
/* ---------------------------------------------------------
|
|
KANBAN CARDS
|
|
--------------------------------------------------------- */
|
|
|
|
.o_kanban_view .o_kanban_record {
|
|
background: #fff !important;
|
|
border: 1px solid rgba(0, 0, 0, 0.04) !important;
|
|
border-radius: 16px !important;
|
|
box-shadow: 0 4px 6px rgba(0, 0, 0, 0.02) !important;
|
|
margin-bottom: 10px !important;
|
|
transition: all 0.3s cubic-bezier(0.4, 0, 0.2, 1) !important;
|
|
overflow: hidden;
|
|
}
|
|
|
|
/* Hover Effect for Cards */
|
|
.o_kanban_view .o_kanban_record:hover {
|
|
transform: translateY(-5px) !important;
|
|
box-shadow: 0 15px 30px rgba(0, 0, 0, 0.08) !important;
|
|
border-color: var(--primary-color) !important;
|
|
}
|
|
|
|
/* Card Header/Title */
|
|
.o_kanban_record .o_kanban_record_title,
|
|
.o_kanban_record strong {
|
|
color: #2d3748 !important;
|
|
font-weight: 700 !important;
|
|
font-size: 1.05rem !important;
|
|
}
|
|
|
|
/* Kanban Group Headers */
|
|
.o_kanban_view .o_kanban_group_header {
|
|
background: transparent !important;
|
|
}
|
|
|
|
/* ---------------------------------------------------------
|
|
BUTTONS & FORM ELEMENTS
|
|
--------------------------------------------------------- */
|
|
|
|
/* Gradient Buttons */
|
|
.btn-primary,
|
|
.o_form_button_save,
|
|
.o_form_button_create {
|
|
background: var(--gradient-primary) !important;
|
|
border: none !important;
|
|
border-radius: 10px !important;
|
|
padding: 8px 20px !important;
|
|
font-weight: 600 !important;
|
|
letter-spacing: 0.3px;
|
|
box-shadow: 0 4px 12px rgba(214, 17, 30, 0.3) !important;
|
|
color: #fff !important;
|
|
}
|
|
|
|
.btn-primary:hover,
|
|
.o_form_button_save:hover,
|
|
.o_form_button_create:hover {
|
|
background: var(--gradient-primary-hover) !important;
|
|
transform: translateY(-2px);
|
|
box-shadow: 0 8px 15px rgba(214, 17, 30, 0.4) !important;
|
|
}
|
|
|
|
/* Secondary Buttons */
|
|
.btn-secondary {
|
|
background: #fff !important;
|
|
border: 1px solid #e2e8f0 !important;
|
|
color: #4a5568 !important;
|
|
border-radius: 10px !important;
|
|
}
|
|
|
|
.btn-secondary:hover {
|
|
background: #f7fafc !important;
|
|
color: var(--secondary-color) !important;
|
|
border-color: var(--secondary-color) !important;
|
|
}
|
|
|
|
/* Form Inputs */
|
|
.o_form_view .o_input {
|
|
border-radius: 8px !important;
|
|
border: 1px solid #e2e8f0 !important;
|
|
padding: 8px 12px !important;
|
|
background-color: #fcfcfc !important;
|
|
}
|
|
|
|
.o_form_view .o_input:focus {
|
|
border-color: var(--secondary-color) !important;
|
|
background-color: #fff !important;
|
|
box-shadow: 0 0 0 3px rgba(214, 17, 30, 0.15) !important;
|
|
}
|
|
|
|
/* ---------------------------------------------------------
|
|
COMPONENT OVERRIDES
|
|
--------------------------------------------------------- */
|
|
|
|
/* Primary Buttons */
|
|
.btn-primary,
|
|
.o_form_button_save,
|
|
.o_form_button_create,
|
|
.o_button_import {
|
|
background: var(--gradient-primary) !important;
|
|
border: none !important;
|
|
border-radius: 10px !important;
|
|
padding: 8px 20px !important;
|
|
font-weight: 600 !important;
|
|
letter-spacing: 0.3px;
|
|
box-shadow: 0 4px 12px rgba(214, 17, 30, 0.3) !important;
|
|
}
|
|
|
|
.btn-primary:hover,
|
|
.o_form_button_save:hover,
|
|
.o_form_button_create:hover,
|
|
.o_button_import:hover {
|
|
background: var(--gradient-primary-hover) !important;
|
|
transform: translateY(-2px);
|
|
box-shadow: 0 8px 15px rgba(214, 17, 30, 0.4) !important;
|
|
}
|
|
|
|
/* ---------------------------------------------------------
|
|
DASHBOARD SPECIFIC UI UPDATES (But safer for global)
|
|
--------------------------------------------------------- */
|
|
|
|
/* Top Menu Tabs */
|
|
.o_main_navbar .o_menu_sections .dropdown-item,
|
|
.o_main_navbar .o_menu_sections .o_nav_entry {
|
|
background: transparent !important;
|
|
color: var(--primary-color) !important;
|
|
font-weight: 600 !important;
|
|
border-radius: 8px !important;
|
|
margin: 0 4px !important;
|
|
}
|
|
|
|
/* Active Tab / Hover State */
|
|
.o_main_navbar .o_menu_sections .o_nav_entry:hover,
|
|
.o_main_navbar .o_menu_sections .show .dropdown-toggle {
|
|
background-color: #ffffff !important;
|
|
/* Yellow Active Background */
|
|
color: #d6111e !important;
|
|
border-bottom: 2px solid #d6111e !important;
|
|
}
|
|
|
|
/* Dashboard Sidebar (Finance/Logistics) */
|
|
.o_notebook .nav.nav-tabs,
|
|
.o_dashboard_view .o_group_selector {
|
|
background: rgba(255, 255, 255, 0.6) !important;
|
|
backdrop-filter: blur(10px);
|
|
border-right: 1px solid rgba(0, 0, 0, 0.05);
|
|
padding: 15px !important;
|
|
}
|
|
|
|
.o_notebook .nav-link,
|
|
.o_dashboard_view .o_group_selector li {
|
|
color: var(--secondary-color) !important;
|
|
/* Teal Text */
|
|
border: none !important;
|
|
border-radius: 10px !important;
|
|
margin-bottom: 8px !important;
|
|
padding: 10px 15px !important;
|
|
font-weight: 500 !important;
|
|
transition: all 0.2s ease;
|
|
}
|
|
|
|
.o_notebook .nav-link.active,
|
|
.o_dashboard_view .o_group_selector li.selected {
|
|
background: var(--gradient-primary) !important;
|
|
color: #fff !important;
|
|
box-shadow: 0 4px 10px rgba(214, 17, 30, 0.3) !important;
|
|
}
|
|
|
|
/* Dashboard KPI Cards (Invoiced, Average Invoice, DSO) */
|
|
.o_dashboard_view .o_group .o_aggregate,
|
|
.o_group .o_group_col_6 {
|
|
background: #fff !important;
|
|
border-radius: 15px !important;
|
|
padding: 20px !important;
|
|
box-shadow: 0 5px 20px rgba(0, 0, 0, 0.05) !important;
|
|
border: 1px solid rgba(0, 0, 0, 0.02) !important;
|
|
transition: transform 0.3s ease !important;
|
|
margin-bottom: 20px !important;
|
|
}
|
|
|
|
.o_dashboard_view .o_group .o_aggregate:hover {
|
|
transform: translateY(-5px) !important;
|
|
box-shadow: 0 10px 25px rgba(214, 17, 30, 0.15) !important;
|
|
border-color: var(--secondary-color) !important;
|
|
}
|
|
|
|
/* Value Text in Cards */
|
|
.o_dashboard_view .o_group .o_aggregate .o_value {
|
|
color: var(--secondary-color) !important;
|
|
font-weight: 800 !important;
|
|
font-size: 2rem !important;
|
|
}
|
|
|
|
.o_dashboard_view .o_group .o_aggregate label {
|
|
color: #718096 !important;
|
|
font-size: 0.9rem !important;
|
|
text-transform: uppercase;
|
|
letter-spacing: 1px;
|
|
}
|
|
|
|
/* Charts Background */
|
|
.o_graph_view {
|
|
background: transparent !important;
|
|
}
|
|
|
|
.o_graph_canvas_container canvas {
|
|
background: rgba(255, 255, 255, 0.5) !important;
|
|
border-radius: 15px;
|
|
padding: 10px;
|
|
}
|
|
|
|
/* Links */
|
|
a,
|
|
.o_form_uri,
|
|
.oe_link,
|
|
.btn-link {
|
|
color: var(--secondary-color) !important;
|
|
/* Switched to teal for better readibility on white */
|
|
}
|
|
|
|
a:hover,
|
|
.o_form_uri:hover,
|
|
.oe_link:hover,
|
|
.btn-link:hover {
|
|
color: var(--primary-dark) !important;
|
|
}
|
|
|
|
/* Nav & Menu Active States */
|
|
.nav-link.active,
|
|
.o_menu_sections .dropdown-item.active,
|
|
.o_menu_brand:hover {
|
|
color: var(--secondary-color) !important;
|
|
border-bottom-color: var(--secondary-color) !important;
|
|
}
|
|
|
|
/* Badges */
|
|
.badge-primary,
|
|
.o_tag {
|
|
background-color: var(--primary-color) !important;
|
|
color: #fff !important;
|
|
}
|
|
|
|
/* Progress bars */
|
|
.progress-bar {
|
|
background-color: var(--secondary-color) !important;
|
|
}
|
|
|
|
/* Checkboxes and Radios */
|
|
.custom-control-input:checked~.custom-control-label::before,
|
|
.o_checkbox input:checked+label::before {
|
|
background-color: var(--secondary-color) !important;
|
|
border-color: var(--secondary-color) !important;
|
|
}
|
|
|
|
/* Form Controls - Focus using Secondary (Teal) like Login Page */
|
|
.form-control:focus,
|
|
.o_input:focus,
|
|
.o_searchview_input:focus {
|
|
border-color: var(--secondary-color) !important;
|
|
box-shadow: 0 0 0 0.2rem rgba(214, 17, 30, 0.25) !important;
|
|
}
|
|
|
|
/* Loading Bar */
|
|
.o_loading {
|
|
background-color: var(--primary-color) !important;
|
|
}
|
|
|
|
/* Backend View Headers */
|
|
.o_list_view .o_list_table thead,
|
|
.o_kanban_view .o_kanban_group_header {
|
|
background-color: #f8f9fa;
|
|
border-bottom: 2px solid var(--primary-color) !important;
|
|
color: #4a5568 !important;
|
|
font-weight: 600 !important;
|
|
padding: 10px !important;
|
|
}
|
|
|
|
/* Kanban Records Selected */
|
|
.o_kanban_record.o_kanban_record_selected {
|
|
box-shadow: 0 0 0 2px var(--primary-color) !important;
|
|
}
|
|
|
|
/* Pagination */
|
|
.page-item.active .page-link {
|
|
background-color: var(--secondary-color) !important;
|
|
border-color: var(--secondary-color) !important;
|
|
}
|
|
|
|
/* Switcher/Toggle */
|
|
.o_switch.custom-switch .custom-control-input:checked~.custom-control-label::before {
|
|
background-color: var(--secondary-color) !important;
|
|
}
|
|
|
|
/* Calendar Today */
|
|
.fc-day-today {
|
|
background-color: rgba(254, 205, 79, 0.1) !important;
|
|
}
|
|
|
|
/* ---------------------------------------------------------
|
|
HEADER SUBMENU DROPDOWN NAVIGATION
|
|
--------------------------------------------------------- */
|
|
|
|
/* Dropdown Container */
|
|
.dropdown-menu {
|
|
background: #ffffff !important;
|
|
border: 1px solid #e2e8f0 !important;
|
|
border-radius: 12px !important;
|
|
box-shadow: 0 20px 50px rgba(0, 0, 0, 0.15) !important;
|
|
padding: 8px !important;
|
|
margin-top: 5px !important;
|
|
z-index: 10000 !important;
|
|
/* Raised to be above most backend elements */
|
|
}
|
|
|
|
/* Fix for Dropdowns being hidden in List Views (Editable rows) */
|
|
.o_list_view .o_list_table {
|
|
overflow: visible !important;
|
|
}
|
|
|
|
.o_list_view .o_list_table tbody tr,
|
|
.o_list_view .o_list_table tbody td {
|
|
overflow: visible !important;
|
|
}
|
|
|
|
/* Ensure Autocomplete stays in front */
|
|
.ui-autocomplete,
|
|
.o_autocomplete_dropdown,
|
|
.dropdown-menu.show {
|
|
z-index: 10001 !important;
|
|
}
|
|
|
|
|
|
.o_main_navbar .o_menu_sections .o_nav_entry.active,
|
|
.o_main_navbar .o_menu_sections .dropdown-toggle {
|
|
background-color: none !important;
|
|
}
|
|
|
|
|
|
.o_main_navbar .o_menu_sections .o_nav_entry.active,
|
|
.o_main_navbar .o_menu_sections .dropdown-toggle.active {
|
|
background-color: var(--primary-color) !important;
|
|
}
|
|
|
|
.o_main_navbar .o_menu_brand,
|
|
.o_main_navbar .o_navbar_apps_menu .dropdown-toggle,
|
|
.o_main_navbar .o_nav_entry,
|
|
.o_main_navbar .dropdown-toggle {
|
|
color: var(--secondary-color) !important;
|
|
font-size: 1.1rem !important;
|
|
transition: all 0.2s ease !important;
|
|
}
|
|
|
|
/* Navbar Icons */
|
|
.o_main_navbar .o_menu_systray .o_nav_entry i,
|
|
.o_main_navbar .o_menu_apps .o_app_drawer i,
|
|
.o_main_navbar .o_menu_sections .fa {
|
|
color: var(--secondary-color) !important;
|
|
font-size: 1.1rem !important;
|
|
transition: all 0.2s ease !important;
|
|
}
|
|
|
|
.o_main_navbar .o_menu_systray .o_nav_entry:hover i,
|
|
.o_main_navbar .o_menu_apps .o_app_drawer:hover i {
|
|
color: var(--primary-dark) !important;
|
|
transform: scale(1.1);
|
|
text-shadow: 0 2px 10px rgba(214, 17, 30, 0.5);
|
|
}
|
|
|
|
/* Dropdown Items */
|
|
.dropdown-item {
|
|
color: #4a5568 !important;
|
|
padding: 10px 15px !important;
|
|
border-radius: 8px !important;
|
|
font-weight: 500 !important;
|
|
transition: all 0.2s ease !important;
|
|
margin-bottom: 2px !important;
|
|
background: transparent;
|
|
}
|
|
|
|
/* Dropdown Item Hover */
|
|
.dropdown-item:hover,
|
|
.dropdown-item:focus {
|
|
background: var(--gradient-primary) !important;
|
|
color: #fff !important;
|
|
box-shadow: 0 4px 10px rgba(214, 17, 30, 0.2);
|
|
}
|
|
|
|
/* Dropdown Header/Divider */
|
|
.dropdown-divider {
|
|
border-top: 1px solid rgba(0, 0, 0, 0.06) !important;
|
|
margin: 8px 0 !important;
|
|
}
|
|
|
|
.dropdown-header {
|
|
color: var(--secondary-color) !important;
|
|
font-weight: 700 !important;
|
|
text-transform: uppercase;
|
|
font-size: 0.75rem !important;
|
|
letter-spacing: 0.05em;
|
|
padding: 8px 15px !important;
|
|
background: transparent !important;
|
|
}
|
|
|
|
/* Active Dropdown Item */
|
|
.dropdown-item.active,
|
|
.dropdown-item:active {
|
|
background: var(--gradient-primary) !important;
|
|
color: #fff !important;
|
|
}
|
|
|
|
.o_main_navbar .o_menu_sections .o_nav_entry,
|
|
.o_main_navbar .o_menu_sections .dropdown-toggle {
|
|
background: #ffffff;
|
|
border-bottom: 2px solid #d6111e;
|
|
}
|
|
|
|
.list-group-item.active {
|
|
z-index: 2;
|
|
color: #fff;
|
|
background-color: #d6111e;
|
|
border-color: #d6111e;
|
|
} |