Merge pull request #12537 from surajshetty3416/fix-dark-mode
This commit is contained in:
commit
ae360132bc
10 changed files with 76 additions and 96 deletions
|
|
@ -7,7 +7,7 @@ addons:
|
|||
- test_site_producer
|
||||
mariadb: 10.3
|
||||
postgresql: 9.5
|
||||
chrome: stable
|
||||
firefox: latest
|
||||
|
||||
services:
|
||||
- xvfb
|
||||
|
|
|
|||
|
|
@ -578,7 +578,7 @@ def run_ui_tests(context, app, headless=False):
|
|||
frappe.commands.popen("yarn add cypress@^6 cypress-file-upload@^5 --no-lockfile")
|
||||
|
||||
# run for headless mode
|
||||
run_or_open = 'run --browser chrome --record --key 4a48f41c-11b3-425b-aa88-c58048fa69eb' if headless else 'open'
|
||||
run_or_open = 'run --browser firefox --record --key 4a48f41c-11b3-425b-aa88-c58048fa69eb' if headless else 'open'
|
||||
command = '{site_env} {password_env} {cypress} {run_or_open}'
|
||||
formatted_command = command.format(site_env=site_env, password_env=password_env, cypress=cypress_path, run_or_open=run_or_open)
|
||||
|
||||
|
|
|
|||
|
|
@ -14,7 +14,7 @@ frappe.ui.ThemeSwitcher = class ThemeSwitcher {
|
|||
}
|
||||
|
||||
refresh() {
|
||||
this.current_theme = document.body.dataset.theme;
|
||||
this.current_theme = document.documentElement.getAttribute("data-theme") || "light";
|
||||
this.fetch_themes().then(() => {
|
||||
this.render();
|
||||
});
|
||||
|
|
@ -45,7 +45,6 @@ frappe.ui.ThemeSwitcher = class ThemeSwitcher {
|
|||
});
|
||||
}
|
||||
|
||||
|
||||
get_preview_html(theme) {
|
||||
const preview = $(`<div class="${this.current_theme == theme.name ? "selected" : "" }">
|
||||
<div data-theme=${theme.name}>
|
||||
|
|
@ -69,15 +68,9 @@ frappe.ui.ThemeSwitcher = class ThemeSwitcher {
|
|||
</div>
|
||||
</div>`);
|
||||
|
||||
// preview.on('mouseover', () => {
|
||||
// this.toggle_theme(theme.name, true)
|
||||
// })
|
||||
|
||||
// preview.on('mouseleave', () => {
|
||||
// this.toggle_theme(this.current_theme, true)
|
||||
// })
|
||||
|
||||
preview.on('click', () => {
|
||||
if (this.current_theme === theme.name) return;
|
||||
|
||||
this.themes.forEach((th) => {
|
||||
th.$html.removeClass("selected");
|
||||
});
|
||||
|
|
@ -89,19 +82,15 @@ frappe.ui.ThemeSwitcher = class ThemeSwitcher {
|
|||
return preview;
|
||||
}
|
||||
|
||||
toggle_theme(theme, preview=false) {
|
||||
if (!preview) {
|
||||
document.body.dataset.theme = theme.toLowerCase();
|
||||
frappe.show_alert("Theme Changed", 3);
|
||||
toggle_theme(theme) {
|
||||
this.current_theme = theme.toLowerCase();
|
||||
document.documentElement.setAttribute("data-theme", this.current_theme);
|
||||
frappe.show_alert("Theme Changed", 3);
|
||||
|
||||
frappe.call('frappe.core.doctype.user.user.switch_theme', {
|
||||
theme: toTitle(theme)
|
||||
});
|
||||
} else {
|
||||
document.body.dataset.theme = theme.toLowerCase();
|
||||
}
|
||||
frappe.xcall("frappe.core.doctype.user.user.switch_theme", {
|
||||
theme: toTitle(theme)
|
||||
});
|
||||
}
|
||||
|
||||
show() {
|
||||
this.dialog.show();
|
||||
}
|
||||
|
|
@ -109,4 +98,4 @@ frappe.ui.ThemeSwitcher = class ThemeSwitcher {
|
|||
hide() {
|
||||
this.dialog.hide();
|
||||
}
|
||||
};
|
||||
};
|
||||
|
|
|
|||
|
|
@ -8,7 +8,6 @@
|
|||
--checkbox-right-margin: 8px;
|
||||
|
||||
.label-area {
|
||||
line-height: 1;
|
||||
font-size: var(--text-sm);
|
||||
}
|
||||
|
||||
|
|
|
|||
|
|
@ -3,19 +3,6 @@ html {
|
|||
background-color: var(--bg-color);
|
||||
}
|
||||
|
||||
// transition
|
||||
* {
|
||||
transition: background-color 0.5s, background 0.5s;
|
||||
}
|
||||
|
||||
a,
|
||||
.badge {
|
||||
transition: 0.2s;
|
||||
}
|
||||
|
||||
.btn {
|
||||
transition: background-color 0.2s, background 0.2s;
|
||||
}
|
||||
|
||||
|
||||
body {
|
||||
|
|
|
|||
|
|
@ -1,5 +1,4 @@
|
|||
@import "variables";
|
||||
@import "css_variables";
|
||||
@import "../common/mixins.scss";
|
||||
@import "../common/global.scss";
|
||||
@import "../common/icons.scss";
|
||||
|
|
|
|||
|
|
@ -95,6 +95,10 @@ $btn-active-box-shadow: var(--shadow-inset);
|
|||
$mark-bg: #FDF9AF;
|
||||
$mark-padding: 0;
|
||||
|
||||
// transitions
|
||||
$btn-transition: none;
|
||||
$input-transition: none;
|
||||
|
||||
// popover
|
||||
$enable-shadows: true;
|
||||
$popover-border-radius: var(--border-radius);
|
||||
|
|
|
|||
|
|
@ -1,6 +1,5 @@
|
|||
@import '~quill/dist/quill.core';
|
||||
@import 'variables';
|
||||
@import 'css_variables';
|
||||
@import '~bootstrap/scss/bootstrap';
|
||||
@import "../common/mixins";
|
||||
@import "../common/global";
|
||||
|
|
|
|||
|
|
@ -131,5 +131,6 @@ $spacers: (
|
|||
@import "~bootstrap/scss/functions";
|
||||
@import "~bootstrap/scss/variables";
|
||||
@import "~bootstrap/scss/mixins";
|
||||
@import 'css_variables';
|
||||
|
||||
$code-color: $purple;
|
||||
|
|
|
|||
|
|
@ -1,65 +1,67 @@
|
|||
<!DOCTYPE html>
|
||||
<head>
|
||||
<!-- Chrome, Firefox OS and Opera -->
|
||||
<meta name="theme-color" content="#0089FF">
|
||||
<!-- Windows Phone -->
|
||||
<meta name="msapplication-navbutton-color" content="#0089FF">
|
||||
<!-- iOS Safari -->
|
||||
<meta name="apple-mobile-web-app-status-bar-style" content="#0089FF">
|
||||
<meta content="text/html;charset=utf-8" http-equiv="Content-Type">
|
||||
<meta content="utf-8" http-equiv="encoding">
|
||||
<meta name="author" content="">
|
||||
<meta name="viewport" content="width=device-width, initial-scale=1.0,
|
||||
maximum-scale=1.0, minimum-scale=1.0, user-scalable=no, minimal-ui">
|
||||
<meta name="apple-mobile-web-app-capable" content="yes">
|
||||
<meta name="apple-mobile-web-app-status-bar-style" content="white">
|
||||
<meta name="mobile-web-app-capable" content="yes">
|
||||
<title>Frappe</title>
|
||||
<link rel="shortcut icon"
|
||||
href="{{ favicon or "/assets/frappe/images/frappe-favicon.svg" }}" type="image/x-icon">
|
||||
<link rel="icon"
|
||||
href="{{ favicon or "/assets/frappe/images/frappe-favicon.svg" }}" type="image/x-icon">
|
||||
{% for include in include_css -%}
|
||||
<link type="text/css" rel="stylesheet" href="{{ include }}?ver={{ build_version }}">
|
||||
{%- endfor -%}
|
||||
</head>
|
||||
<body data-theme="{{ desk_theme.lower() }}">
|
||||
{% include "public/icons/timeless/symbol-defs.svg" %}
|
||||
<div class="centered splash">
|
||||
<img src="{{ splash_image or "/assets/frappe/images/frappe-framework-logo.png" }}"
|
||||
style="max-width: 100px; max-height: 100px;">
|
||||
</div>
|
||||
<div class="main-section">
|
||||
<header></header>
|
||||
<div id="body"></div>
|
||||
<footer></footer>
|
||||
</div>
|
||||
<html data-theme="{{ desk_theme.lower() }}">
|
||||
<head>
|
||||
<!-- Chrome, Firefox OS and Opera -->
|
||||
<meta name="theme-color" content="#0089FF">
|
||||
<!-- Windows Phone -->
|
||||
<meta name="msapplication-navbutton-color" content="#0089FF">
|
||||
<!-- iOS Safari -->
|
||||
<meta name="apple-mobile-web-app-status-bar-style" content="#0089FF">
|
||||
<meta content="text/html;charset=utf-8" http-equiv="Content-Type">
|
||||
<meta content="utf-8" http-equiv="encoding">
|
||||
<meta name="author" content="">
|
||||
<meta name="viewport" content="width=device-width, initial-scale=1.0,
|
||||
maximum-scale=1.0, minimum-scale=1.0, user-scalable=no, minimal-ui">
|
||||
<meta name="apple-mobile-web-app-capable" content="yes">
|
||||
<meta name="apple-mobile-web-app-status-bar-style" content="white">
|
||||
<meta name="mobile-web-app-capable" content="yes">
|
||||
<title>Frappe</title>
|
||||
<link rel="shortcut icon"
|
||||
href="{{ favicon or "/assets/frappe/images/frappe-favicon.svg" }}" type="image/x-icon">
|
||||
<link rel="icon"
|
||||
href="{{ favicon or "/assets/frappe/images/frappe-favicon.svg" }}" type="image/x-icon">
|
||||
{% for include in include_css -%}
|
||||
<link type="text/css" rel="stylesheet" href="{{ include }}?ver={{ build_version }}">
|
||||
{%- endfor -%}
|
||||
</head>
|
||||
<body>
|
||||
{% include "public/icons/timeless/symbol-defs.svg" %}
|
||||
<div class="centered splash">
|
||||
<img src="{{ splash_image or "/assets/frappe/images/frappe-framework-logo.png" }}"
|
||||
style="max-width: 100px; max-height: 100px;">
|
||||
</div>
|
||||
<div class="main-section">
|
||||
<header></header>
|
||||
<div id="body"></div>
|
||||
<footer></footer>
|
||||
</div>
|
||||
|
||||
<script type="text/javascript" src="/assets/frappe/js/lib/jquery/jquery.min.js"></script>
|
||||
<script type="text/javascript" src="/assets/frappe/js/lib/jquery/jquery.min.js"></script>
|
||||
|
||||
<script type="text/javascript">
|
||||
window._version_number = "{{ build_version }}";
|
||||
// browser support
|
||||
window.app = true;
|
||||
window.dev_server = {{ dev_server }};
|
||||
<script type="text/javascript">
|
||||
window._version_number = "{{ build_version }}";
|
||||
// browser support
|
||||
window.app = true;
|
||||
window.dev_server = {{ dev_server }};
|
||||
|
||||
if(!window.frappe) window.frappe = {};
|
||||
if(!window.frappe) window.frappe = {};
|
||||
|
||||
frappe.boot = {{ boot }};
|
||||
frappe.boot = {{ boot }};
|
||||
|
||||
frappe.csrf_token = "{{ csrf_token }}";
|
||||
frappe.csrf_token = "{{ csrf_token }}";
|
||||
|
||||
</script>
|
||||
</script>
|
||||
|
||||
{% for include in include_js %}
|
||||
<script type="text/javascript" src="{{ include }}?ver={{ build_version }}"></script>
|
||||
{% endfor %}
|
||||
{% include "templates/includes/app_analytics/google_analytics.html" %}
|
||||
{% include "templates/includes/app_analytics/mixpanel_analytics.html" %}
|
||||
{% for include in include_js %}
|
||||
<script type="text/javascript" src="{{ include }}?ver={{ build_version }}"></script>
|
||||
{% endfor %}
|
||||
{% include "templates/includes/app_analytics/google_analytics.html" %}
|
||||
{% include "templates/includes/app_analytics/mixpanel_analytics.html" %}
|
||||
|
||||
{% for sound in (sounds or []) %}
|
||||
<audio preload="auto" id="sound-{{ sound.name }}" volume={{ sound.volume or 1 }}>
|
||||
<source src="{{ sound.src }}"></source>
|
||||
</audio>
|
||||
{% endfor %}
|
||||
</body>
|
||||
{% for sound in (sounds or []) %}
|
||||
<audio preload="auto" id="sound-{{ sound.name }}" volume={{ sound.volume or 1 }}>
|
||||
<source src="{{ sound.src }}"></source>
|
||||
</audio>
|
||||
{% endfor %}
|
||||
</body>
|
||||
</html>
|
||||
|
|
|
|||
Loading…
Add table
Reference in a new issue