diff --git a/myojana/apis/myojana_theme.py b/myojana/apis/myojana_theme.py new file mode 100644 index 0000000..7785ca9 --- /dev/null +++ b/myojana/apis/myojana_theme.py @@ -0,0 +1,28 @@ +import frappe +from frappe import _ + +@frappe.whitelist() +def get_theme(theme): + try: + myojna_theme_options = frappe.db.exists("Property Setter", 'User-desk_theme-options') + if not myojna_theme_options: + try: + new_doc = frappe.get_doc({ + "doctype": "Property Setter", + "doctype_or_field": "DocField", + "field_name":"desk_theme", + "property": "options", + "doc_type": "User", + "value": "Light\nDark\nAutomatic\nMyojana" + }) + new_doc.insert(ignore_permissions=True) + except frappe.DuplicateEntryError: + frappe.log_error(frappe.get_traceback(), _("Duplicate entry error in get_theme")) + + user = frappe.get_doc("User", frappe.session.user) + user.set("desk_theme", theme) + user.save() + frappe.clear_cache(user.name) + except Exception as e: + frappe.log_error(frappe.get_traceback(), _("Error in get_theme")) + frappe.throw(_("An error occurred while fetching the theme. Please try again later.")) \ No newline at end of file diff --git a/myojana/hooks.py b/myojana/hooks.py index 833cb06..b267190 100644 --- a/myojana/hooks.py +++ b/myojana/hooks.py @@ -52,9 +52,13 @@ } # include js, css files in header of desk.html -app_include_css = "/assets/myojana/css/main.css" +app_include_css = [ + "/assets/myojana/css/main.css", + "/assets/myojana/css/myojana_theme.css", + ] app_include_js = [ "/assets/myojana/js/main.js", + "/assets/myojana/js/utils/theme.js", "https://cdnjs.cloudflare.com/ajax/libs/html2canvas/1.4.1/html2canvas.min.js" ] @@ -225,9 +229,9 @@ # Overriding Methods # ------------------------------ # -# override_whitelisted_methods = { -# "frappe.desk.doctype.event.event.get_events": "myojana.event.get_events" -# } +override_whitelisted_methods = { + "frappe.core.doctype.user.user.switch_theme": "myojana.apis.myojana_theme.get_theme", +} # # each overriding function accepts a `data` argument; # generated from the base implementation of the doctype dashboard, diff --git a/myojana/public/css/myojana_theme.css b/myojana/public/css/myojana_theme.css new file mode 100644 index 0000000..8e7487c --- /dev/null +++ b/myojana/public/css/myojana_theme.css @@ -0,0 +1,121 @@ +[data-theme="myojana"] { + --main-color: #F44A24; + --primary: var(--main-color); + --dt-primary-color: var(--main-color); + --blue-avatar-bg: var(--main-color); + --blue-avatar-color: var(--main-color); + --blue: var(--main-color); + --heading-color: #c6281f; + --text-color: #3e2723; + --background-color: #fff7f4; + --sidebar-bg: #ffede6; + --card-bg: #ffffff; + --hover-bg: #fbc4b8; + --border-color: #f6a38f; +} + +/* Body and Global Text */ +[data-theme="myojana"] body { + background-color: var(--background-color); + color: var(--text-color); +} + +/* Navigation Bar */ +[data-theme="myojana"] .navbar, +[data-theme="myojana"] .navbar .navbar-collapse { + background-color: var(--main-color); + color: #fff; +} + +[data-theme="myojana"] .navbar .navbar-brand, +[data-theme="myojana"] .navbar .nav-link, +[data-theme="myojana"] .navbar .dropdown-toggle { + color: #fff !important; +} + +/* Primary Buttons */ +[data-theme="myojana"] .btn-primary { + background-color: var(--main-color); + border-color: var(--main-color); + color: #fff; +} + +[data-theme="myojana"] .btn-primary:hover { + background-color: #d63c1f; + border-color: #d63c1f; +} + +/* Sidebar */ +[data-theme="myojana"] .layout-side-section { + background-color: var(--sidebar-bg); + border-right: 1px solid var(--border-color); +} + +[data-theme="myojana"] .sidebar-item { + color: var(--text-color); +} + +[data-theme="myojana"] .sidebar-item:hover { + background-color: var(--hover-bg); +} + +/* Desk Module Icons */ +[data-theme="myojana"] .module-section { + background-color: var(--card-bg); + border-radius: 8px; +} + +[data-theme="myojana"] .module-icon { + background-color: var(--main-color); + color: #fff; +} + +/* Card Headers */ +[data-theme="myojana"] .form-section .section-head, +[data-theme="myojana"] .form-dashboard-section .section-head { + color: var(--heading-color); +} + +/* Page Headings */ +[data-theme="myojana"] .page-head, +[data-theme="myojana"] .page-title { + color: var(--heading-color); +} + +/* Forms and Inputs */ +[data-theme="myojana"] input, +[data-theme="myojana"] select, +[data-theme="myojana"] textarea { + border: 1px solid var(--border-color); + background-color: #fff2ed; +} + +/* Grid View / List View / Report View */ +[data-theme="myojana"] .list-row, +[data-theme="myojana"] .list-row-container { + background-color: var(--card-bg); + border-bottom: 1px solid var(--border-color); +} + +[data-theme="myojana"] .list-row:hover { + background-color: var(--hover-bg); +} + +/* Avatars */ +[data-theme="myojana"] .avatar-frame, +[data-theme="myojana"] .avatar { + background-color: var(--blue-avatar-bg); + color: #fff; +} + +/* Modal Headers */ +[data-theme="myojana"] .modal-header { + background-color: var(--main-color); + color: #fff; +} + +/* Timeline / Activity */ +[data-theme="myojana"] .timeline-item .timeline-content { + background-color: #fff2ed; + border-left: 4px solid var(--main-color); +} diff --git a/myojana/public/js/utils/theme.js b/myojana/public/js/utils/theme.js new file mode 100644 index 0000000..4559655 --- /dev/null +++ b/myojana/public/js/utils/theme.js @@ -0,0 +1,34 @@ +frappe.ui.ThemeSwitcher = class CustomThemeSwitcher extends frappe.ui.ThemeSwitcher { + constructor() { + super() + } + + fetch_themes() { + return new Promise((resolve) => { + this.themes = [ + { + name: "light", + label: ("Frappe Light"), + info: ("Light Theme"), + }, + { + name: "dark", + label: "Timeless Night", + info: "Dark Theme", + }, + { + name: "automatic", + label: "Automatic", + info: "Uses system's theme to switch between light and dark mode", + }, + { + name: "myojana", + label: "Myojna Theme", + info: "Myojna Theme", + } + ]; + + resolve(this.themes); + }); + } +} \ No newline at end of file