CodeMirror/ntfy
1
0
Fork 0
mirror of https://github.com/binwiederhier/ntfy.git synced 2024-06-01 18:21:00 +12:00
Code Issues Projects Releases Wiki Activity

Update colors

Browse source
This commit is contained in:
nimbleghost 2023-06-28 17:20:01 +02:00
parent 4f39c7c155
commit e607944ad1
2 changed files with 15 additions and 7 deletions
Show stats Download patch file Download diff file Expand all files Collapse all files

5
web/src/components/ActionBar.jsx
View file

@ -1,4 +1,4 @@
import { AppBar, Toolbar, IconButton, Typography, Box, MenuItem, Button, Divider, ListItemIcon } from "@mui/material";
import { AppBar, Toolbar, IconButton, Typography, Box, MenuItem, Button, Divider, ListItemIcon, useTheme } from "@mui/material";
import MenuIcon from "@mui/icons-material/Menu";
import * as React from "react";
import { useState } from "react";
@ -21,6 +21,7 @@ import PopupMenu from "./PopupMenu";
import { SubscriptionPopup } from "./SubscriptionPopup";
const ActionBar = (props) => {
const theme = useTheme();
const { t } = useTranslation();
const location = useLocation();
let title = "ntfy";
@ -43,7 +44,7 @@ const ActionBar = (props) => {
<Toolbar
sx={{
pr: "24px",
background: "linear-gradient(150deg, rgba(51,133,116,1) 0%, rgba(86,189,168,1) 100%)",
background: theme.palette.actionBarBackground,
}}
>
<IconButton

17
web/src/components/theme.js
View file

@ -1,5 +1,3 @@
import { grey, red } from "@mui/material/colors";
/** @type {import("@mui/material").ThemeOptions} */
const themeOptions = {
components: {
@ -22,6 +20,8 @@ const themeOptions = {
},
};
// https://github.com/binwiederhier/ntfy-android/blob/main/app/src/main/res/values/colors.xml
/** @type {import("@mui/material").ThemeOptions['palette']} */
export const lightPalette = {
mode: "light",
@ -32,20 +32,27 @@ export const lightPalette = {
main: "#6cead0",
},
error: {
main: red.A400,
main: "#c30000",
},
actionBarBackground: "linear-gradient(150deg, #338574 0%, #56bda8 100%)",
};
/** @type {import("@mui/material").ThemeOptions['palette']} */
export const darkPalette = {
...lightPalette,
mode: "dark",
background: {
paper: grey["800"],
paper: "#1b2124",
},
primary: {
main: "#65b5a3",
},
secondary: {
main: "#6cead0",
},
error: {
main: "#fe4d2e",
},
actionBarBackground: "linear-gradient(150deg, #203631 0%, #2a6e60 100%)",
};
export default themeOptions;