Lanmikeman/openvk
Lanmikeman/openvk
1
1
Fork 0
mirror of https://github.com/openvk/openvk synced 2024-12-23 09:01:15 +03:00
Code Issues Projects Releases Packages Wiki Activity

Admin: Add dark more toggle

Browse source 
yay dark mode

The switch can be turned off after a page reload even if the dark theme
is enabled. But hey, at least it works!

After updating the code, go to the "Web/static/js" folder and run the
`yarn install` command.
This commit is contained in:
Österreich Luminota 2023-06-11 14:02:59 +07:00
parent 1da9ff312c
commit a5c1db0106
No known key found for this signature in database
GPG key ID: 1141A28608EC3217
3 changed files with 83 additions and 45 deletions
Show stats Download patch file Download diff file Expand all files Collapse all files

42
Web/Presenters/templates/Admin/@layout.xml
View file

@ -6,6 +6,7 @@
<style> <style>
{var $css = file_get_contents(OPENVK_ROOT . "/Web/static/js/node_modules/@atlassian/aui/dist/aui/aui-prototyping.css")} {var $css = file_get_contents(OPENVK_ROOT . "/Web/static/js/node_modules/@atlassian/aui/dist/aui/aui-prototyping.css")}
{str_replace("fonts/", "/assets/packages/static/openvk/js/node_modules/@atlassian/aui/dist/aui/fonts/", $css)|noescape} {str_replace("fonts/", "/assets/packages/static/openvk/js/node_modules/@atlassian/aui/dist/aui/fonts/", $css)|noescape}
{file_get_contents(OPENVK_ROOT . "/Web/static/js/node_modules/@atlassian/aui/dist/aui/aui-prototyping-darkmode.css")|noescape}
</style> </style>
<title>{include title} - {_admin} {$instance_name}</title> <title>{include title} - {_admin} {$instance_name}</title>
</head> </head>
@ -21,12 +22,49 @@
</a> </a>
</h1> </h1>
</div> </div>
<div n:if="$search ?? false" class="aui-header-secondary"> <div class="aui-header-secondary">
<ul class="aui-nav"> <ul class="aui-nav">
<li n:if="$search ?? false">
<form class="aui-quicksearch dont-default-focus ajs-dirty-warning-exempt"> <form class="aui-quicksearch dont-default-focus ajs-dirty-warning-exempt">
<input id="quickSearchInput" autocomplete="off" class="search" type="text" placeholder="{include searchTitle}" value="{$_GET['q'] ?? ''}" name="q" accesskey="Q" /> <input id="quickSearchInput" autocomplete="off" class="search" type="text" placeholder="{include searchTitle}" value="{$_GET['q'] ?? ''}" name="q" accesskey="Q" />
<input type="hidden" value=1 name=p /> <input type="hidden" value=1 name=p />
</form> </form>
</li>
<li>
<aui-toggle id="switch-theme" label="Toggle dark mode"></aui-toggle>
<script>
const toggle = document.getElementById("switch-theme");
let currentTheme = localStorage.getItem("ovkadmin-theme");
if (currentTheme == null) {
const preferDarkScheme = window.matchMedia("(prefers-color-scheme: dark)");
let theme = "light";
if (preferDarkScheme.matches) {
theme = "dark";
document.body.classList.add("aui-theme-dark");
}
localStorage.setItem("ovkadmin-theme", theme);
}
if (currentTheme == "dark") {
document.body.classList.add("aui-theme-dark");
}
toggle.addEventListener("click", function() {
document.body.classList.toggle("aui-theme-dark");
let theme = "light";
if (document.body.classList.contains("aui-theme-dark")) {
theme = "dark";
}
localStorage.setItem("ovkadmin-theme", theme);
});
</script>
</li>
</ul> </ul>
</div> </div>
</div> </div>
@ -34,7 +72,7 @@
</header> </header>
<div class="aui-page-panel"> <div class="aui-page-panel">
<div class="aui-page-panel-inner"> <div class="aui-page-panel-inner">
<div class="aui-page-panel-nav" style="background-color: #fff;"> <div class="aui-page-panel-nav">
<nav class="aui-navgroup aui-navgroup-vertical"> <nav class="aui-navgroup aui-navgroup-vertical">
<div class="aui-navgroup-inner"> <div class="aui-navgroup-inner">
<div class="aui-navgroup-primary"> <div class="aui-navgroup-primary">

2
Web/static/js/package.json
View file

@ -1,6 +1,6 @@
{ {
"dependencies": { "dependencies": {
"@atlassian/aui": "^8.5.1", "@atlassian/aui": "^9.6.0",
"create-react-class": "^15.7.0", "create-react-class": "^15.7.0",
"handlebars": "^4.7.7", "handlebars": "^4.7.7",
"jquery": "^3.0.0", "jquery": "^3.0.0",

76
Web/static/js/yarn.lock
View file

@ -2,34 +2,29 @@
# yarn lockfile v1 # yarn lockfile v1
"@atlassian/aui@^8.5.1": "@atlassian/aui@^9.6.0":
version "8.5.1" version "9.6.0"
resolved "https://registry.yarnpkg.com/@atlassian/aui/-/aui-8.5.1.tgz#6c585674240621a007e59b6ca8c79f45a335738d" resolved "https://registry.yarnpkg.com/@atlassian/aui/-/aui-9.6.0.tgz#9f35e67359022f1e6d5efa2653e79aeec95b9e77"
integrity sha512-u+cWuOTpDyNod5B1SZnDCa57ruad54jQ/4vUd2VGDdp8qqiYLeuEush1deuKejvFFWSS6zd7KhkzmO/m0tm1aw== integrity sha512-o/bCufj0tUU6pRk3AWoXlcyVMTMx4QswB1UY5oJWSjopA+z/QUx0fhc4rRIIbxP0MrJMNRDpgPyuzkoPb7Z7ow==
dependencies: dependencies:
"@atlassian/brand-logos" "^1.2.0" "@atlassian/tipsy" "1.3.3"
"@atlassian/tipsy" "^1.3.1" "@popperjs/core" "2.11.6"
backbone "^1.3.3" backbone "1.4.1"
css.escape "1.5.0" css.escape "1.5.1"
fancy-file-input "~2.0.4" dompurify "2.4.5"
jquery-ui "^1.12.1" fancy-file-input "2.0.4"
popper.js "^1.14.5" jquery-ui "1.13.2"
skatejs "0.13.17" skatejs "0.13.17"
skatejs-template-html "0.0.0" skatejs-template-html "0.0.0"
trim-extra-html-whitespace "1.3.0" trim-extra-html-whitespace "1.3.0"
underscore "^1.9.1" underscore "1.13.6"
"@atlassian/brand-logos@^1.2.0": "@atlassian/tipsy@1.3.3":
version "1.2.0" version "1.3.3"
resolved "https://registry.yarnpkg.com/@atlassian/brand-logos/-/brand-logos-1.2.0.tgz#2110dba6ca49acaf1c51b15420a4567b01b4b4bd" resolved "https://registry.yarnpkg.com/@atlassian/tipsy/-/tipsy-1.3.3.tgz#3f77754c4c70324c5c938e41abaa2ca682f22036"
integrity sha512-rtTIQqvZO6Tr7+oNWvtED7xMpuE1NQoNF5vA1d+8ym3wTANvgbKxyHK2pj5jTW3dMoEE2Qac8YMebtN46B/mQg== integrity sha512-6jd9wdoiPdCbwsNi1Xrn/oMdGz22dKPeCoZ/cCGKqjnh+UYkBKb5W3spW+WNqRSxGvVtfUEEg6TXotRK/FPDaw==
"@atlassian/tipsy@^1.3.1": "@popperjs/core@2.11.6", "@popperjs/core@^2.9.0":
version "1.3.2"
resolved "https://registry.yarnpkg.com/@atlassian/tipsy/-/tipsy-1.3.2.tgz#ab759d461670d712425b2dac7573b79575a10502"
integrity sha512-H7qWMs66bztELt2QpOCLYDU9ZM3VZfE0knbRHHLBukH7v9dMkIS5ZwqcGREjWnVt0KNETaBeXxj0FD88TEOGVw==
"@popperjs/core@^2.9.0":
version "2.11.6" version "2.11.6"
resolved "https://registry.yarnpkg.com/@popperjs/core/-/core-2.11.6.tgz#cee20bd55e68a1720bdab363ecf0c821ded4cd45" resolved "https://registry.yarnpkg.com/@popperjs/core/-/core-2.11.6.tgz#cee20bd55e68a1720bdab363ecf0c821ded4cd45"
integrity sha512-50/17A98tWUfQ176raKiOGXuYpLyyVMkxxG6oylzL3BPOlA6ADGdK7EYunSa4I064xerltq9TGXs8HmOk5E+vw== integrity sha512-50/17A98tWUfQ176raKiOGXuYpLyyVMkxxG6oylzL3BPOlA6ADGdK7EYunSa4I064xerltq9TGXs8HmOk5E+vw==
@ -39,10 +34,10 @@ asap@~2.0.3:
resolved "https://registry.yarnpkg.com/asap/-/asap-2.0.6.tgz#e50347611d7e690943208bbdafebcbc2fb866d46" resolved "https://registry.yarnpkg.com/asap/-/asap-2.0.6.tgz#e50347611d7e690943208bbdafebcbc2fb866d46"
integrity sha1-5QNHYR1+aQlDIIu9r+vLwvuGbUY= integrity sha1-5QNHYR1+aQlDIIu9r+vLwvuGbUY=
backbone@^1.3.3: backbone@1.4.1:
version "1.4.0" version "1.4.1"
resolved "https://registry.yarnpkg.com/backbone/-/backbone-1.4.0.tgz#54db4de9df7c3811c3f032f34749a4cd27f3bd12" resolved "https://registry.yarnpkg.com/backbone/-/backbone-1.4.1.tgz#099a78184bc07b034048a8332229c2ccca1e3e62"
integrity sha512-RLmDrRXkVdouTg38jcgHhyQ/2zjg7a8E6sz2zxfz21Hh17xDJYUHBZimVIt5fUyS8vbfpeSmTL3gUjTEvUV3qQ== integrity sha512-ADy1ztN074YkWbHi8ojJVFe3vAanO/lrzMGZWUClIP7oDD/Pjy2vrASraUP+2EVCfIiTtCW4FChVow01XneivA==
dependencies: dependencies:
underscore ">=1.8.3" underscore ">=1.8.3"
@ -59,10 +54,15 @@ create-react-class@^15.7.0:
loose-envify "^1.3.1" loose-envify "^1.3.1"
object-assign "^4.1.1" object-assign "^4.1.1"
css.escape@1.5.0: css.escape@1.5.1:
version "1.5.0" version "1.5.1"
resolved "https://registry.yarnpkg.com/css.escape/-/css.escape-1.5.0.tgz#95984d7887ce4ca90684e813966f42d1ef87ecea" resolved "https://registry.yarnpkg.com/css.escape/-/css.escape-1.5.1.tgz#42e27d4fa04ae32f931a4b4d4191fa9cddee97cb"
integrity sha1-lZhNeIfOTKkGhOgTlm9C0e+H7Oo= integrity sha512-YUifsXXuknHlUsmlgyY0PKzgPOr7/FjCePfHNt0jxm83wHZi44VDMQ7/fGNkjY3/jV1MC+1CmZbaHzugyeRtpg==
dompurify@2.4.5:
version "2.4.5"
resolved "https://registry.yarnpkg.com/dompurify/-/dompurify-2.4.5.tgz#0e89a27601f0bad978f9a924e7a05d5d2cccdd87"
integrity sha512-jggCCd+8Iqp4Tsz0nIvpcb22InKEBrGz5dw3EQJMs8HPJDsKbFIO3STYtAvCfDx26Muevn1MHVI0XxjgFfmiSA==
encoding@^0.1.11: encoding@^0.1.11:
version "0.1.13" version "0.1.13"
@ -76,7 +76,7 @@ event-lite@^0.1.1:
resolved "https://registry.yarnpkg.com/event-lite/-/event-lite-0.1.2.tgz#838a3e0fdddef8cc90f128006c8e55a4e4e4c11b" resolved "https://registry.yarnpkg.com/event-lite/-/event-lite-0.1.2.tgz#838a3e0fdddef8cc90f128006c8e55a4e4e4c11b"
integrity sha512-HnSYx1BsJ87/p6swwzv+2v6B4X+uxUteoDfRxsAb1S1BePzQqOLevVmkdA15GHJVd9A9Ok6wygUR18Hu0YeV9g== integrity sha512-HnSYx1BsJ87/p6swwzv+2v6B4X+uxUteoDfRxsAb1S1BePzQqOLevVmkdA15GHJVd9A9Ok6wygUR18Hu0YeV9g==
fancy-file-input@~2.0.4: fancy-file-input@2.0.4:
version "2.0.4" version "2.0.4"
resolved "https://registry.yarnpkg.com/fancy-file-input/-/fancy-file-input-2.0.4.tgz#698c216482e07649a827681c4db3054fddc9a32b" resolved "https://registry.yarnpkg.com/fancy-file-input/-/fancy-file-input-2.0.4.tgz#698c216482e07649a827681c4db3054fddc9a32b"
integrity sha512-l+J0WwDl4nM/zMJ/C8qleYnXMUJKsLng7c5uWH/miAiHoTvPDtEoLW1tmVO6Cy2O8i/1VfA+2YOwg/Q3+kgO6w== integrity sha512-l+J0WwDl4nM/zMJ/C8qleYnXMUJKsLng7c5uWH/miAiHoTvPDtEoLW1tmVO6Cy2O8i/1VfA+2YOwg/Q3+kgO6w==
@ -141,7 +141,7 @@ isomorphic-fetch@^2.1.1:
node-fetch "^1.0.1" node-fetch "^1.0.1"
whatwg-fetch ">=0.10.0" whatwg-fetch ">=0.10.0"
jquery-ui@^1.12.1: jquery-ui@1.13.2:
version "1.13.2" version "1.13.2"
resolved "https://registry.yarnpkg.com/jquery-ui/-/jquery-ui-1.13.2.tgz#de03580ae6604773602f8d786ad1abfb75232034" resolved "https://registry.yarnpkg.com/jquery-ui/-/jquery-ui-1.13.2.tgz#de03580ae6604773602f8d786ad1abfb75232034"
integrity sha512-wBZPnqWs5GaYJmo1Jj0k/mrSkzdQzKDwhXNtHKcBdAcKVxMM3KNYFq+iJ2i1rwiG53Z8M4mTn3Qxrm17uH1D4Q== integrity sha512-wBZPnqWs5GaYJmo1Jj0k/mrSkzdQzKDwhXNtHKcBdAcKVxMM3KNYFq+iJ2i1rwiG53Z8M4mTn3Qxrm17uH1D4Q==
@ -230,11 +230,6 @@ plotly.js-dist@^1.52.3:
resolved "https://registry.yarnpkg.com/plotly.js-dist/-/plotly.js-dist-1.52.3.tgz#4c16c6da6adab6cdba169087b5005bdddbf10834" resolved "https://registry.yarnpkg.com/plotly.js-dist/-/plotly.js-dist-1.52.3.tgz#4c16c6da6adab6cdba169087b5005bdddbf10834"
integrity sha512-kpuNwveRk6M/5cCW1ZgJTbMLD0bRZhJlLK0cUHVkTsP/PWKCVJqO3QiiqrypFGE/xEhWfHCY+YKAKjMmEbo4Gw== integrity sha512-kpuNwveRk6M/5cCW1ZgJTbMLD0bRZhJlLK0cUHVkTsP/PWKCVJqO3QiiqrypFGE/xEhWfHCY+YKAKjMmEbo4Gw==
popper.js@^1.14.5:
version "1.16.1"
resolved "https://registry.yarnpkg.com/popper.js/-/popper.js-1.16.1.tgz#2a223cb3dc7b6213d740e40372be40de43e65b1b"
integrity sha512-Wb4p1J4zyFTbM+u6WuO4XstYx4Ky9Cewe4DWrel7B0w6VVICvPwdOpotjzcf6eD8TsckVnIMNONQyPIUFOUbCQ==
promise@^7.1.1: promise@^7.1.1:
version "7.3.1" version "7.3.1"
resolved "https://registry.yarnpkg.com/promise/-/promise-7.3.1.tgz#064b72602b18f90f29192b8b1bc418ffd1ebd3bf" resolved "https://registry.yarnpkg.com/promise/-/promise-7.3.1.tgz#064b72602b18f90f29192b8b1bc418ffd1ebd3bf"
@ -335,7 +330,12 @@ umbrellajs@^3.1.0:
resolved "https://registry.yarnpkg.com/umbrellajs/-/umbrellajs-3.1.0.tgz#a4e6f0f6381f9d93110b5eee962e0e0864b10bd0" resolved "https://registry.yarnpkg.com/umbrellajs/-/umbrellajs-3.1.0.tgz#a4e6f0f6381f9d93110b5eee962e0e0864b10bd0"
integrity sha512-3qichMg1Q6EetLweBAT0L55O2W6CJe9qyiSt1RBnf+bcOqwJ4R7e2PDcoIUrCsg+uRo3DXOvurWdklBu0ia7fg== integrity sha512-3qichMg1Q6EetLweBAT0L55O2W6CJe9qyiSt1RBnf+bcOqwJ4R7e2PDcoIUrCsg+uRo3DXOvurWdklBu0ia7fg==
underscore@>=1.8.3, underscore@^1.9.1: underscore@1.13.6:
version "1.13.6"
resolved "https://registry.yarnpkg.com/underscore/-/underscore-1.13.6.tgz#04786a1f589dc6c09f761fc5f45b89e935136441"
integrity sha512-+A5Sja4HP1M08MaXya7p5LvjuM7K6q/2EaC0+iovj/wOcMsTzMvDFbasi/oSapiwOlt252IqsKqPjCl7huKS0A==
underscore@>=1.8.3:
version "1.13.1" version "1.13.1"
resolved "https://registry.yarnpkg.com/underscore/-/underscore-1.13.1.tgz#0c1c6bd2df54b6b69f2314066d65b6cde6fcf9d1" resolved "https://registry.yarnpkg.com/underscore/-/underscore-1.13.1.tgz#0c1c6bd2df54b6b69f2314066d65b6cde6fcf9d1"
integrity sha512-hzSoAVtJF+3ZtiFX0VgfFPHEDRm7Y/QPjGyNo4TVdnDTdft3tr8hEkD25a1jC+TjTuE7tkHGKkhwCgs9dgBB2g== integrity sha512-hzSoAVtJF+3ZtiFX0VgfFPHEDRm7Y/QPjGyNo4TVdnDTdft3tr8hEkD25a1jC+TjTuE7tkHGKkhwCgs9dgBB2g==