mirror
/
auto-archiver
kopia lustrzana https://github.com/bellingcat/auto-archiver
1
0
Forkuj 0
Kod Zgłoszenia Packages Projekty Wydania Wiki Aktywność

Hook in to RTD theme to set react theme

pull/217/head
Patrick Robertson 2025-03-03 11:56:23 +00:00
rodzic 9845804277
commit a88a37d0a5
7 zmienionych plików z 48282 dodań i 236 usunięć
Pokaż statystyki Ściągnij plik aktualizacji Ściągnij plik porównania Expand all files Collapse all files

48438
docs/source/installation/settings.html
Wyświetl plik

File diff suppressed because one or more lines are too long

14
scripts/settings/index.html
Wyświetl plik

@ -1,8 +1,9 @@
<!-- <!doctype html>
<!doctype html>
<html lang="en">
<head>
<meta charset="utf-8" />
<meta name="viewport" content="initial-scale=1, width=device-width" />
<!-- Fonts to support Material Design -->
<link rel="preconnect" href="https://fonts.googleapis.com" />
<link rel="preconnect" href="https://fonts.gstatic.com" crossorigin />
<link
@ -11,13 +12,8 @@
/>
<title>Auto Archiver Settings</title>
</head>
<body> -->
<!-- No need for html/head markup, this page is designed to be included in a RTD page.
See `settings_page.md` for where this is included. -->
<body>
<div id="root"></div>
<script type="module" src="/src/main.tsx"></script>
<!-- </body>
</html> -->
</body>
</html>

2
scripts/settings/src/App.tsx
Wyświetl plik

@ -154,7 +154,7 @@ function ModuleTypes({ stepType, setEnabledModules, enabledModules, configValues
{stepType}
</Typography>
<Typography variant="body1" >
Select the {stepType} you wish to enable. Drag to re-order.
Select the {stepType} you wish to enable. Drag to.
Learn more about {stepType} <a href={`https://auto-archiver.readthedocs.io/en/latest/modules/${stepType.slice(0,-1)}.html`} target="_blank">here</a>.
</Typography>
</Box>

1
scripts/settings/src/StepCard.tsx
Wyświetl plik

@ -64,6 +64,7 @@ const StepCard = ({
const style = {
...Card.style,
transform: CSS.Transform.toString(transform),
transition,
zIndex: isDragging ? "100" : "auto",

39
scripts/settings/src/main.tsx
Wyświetl plik

@ -2,14 +2,43 @@ import * as React from 'react';
import * as ReactDOM from 'react-dom/client';
import { ThemeProvider } from '@mui/material/styles';
import { CssBaseline } from '@mui/material';
import theme from './theme';
import App from './App';
import { createTheme } from '@mui/material/styles';
import { red } from '@mui/material/colors';
import { useState, useEffect } from 'react';
function RootApp() {
const [mode, setMode] = useState('light');
useEffect(() => {
setMode(window.localStorage.getItem('theme') || 'light');
}, []);
var observer = new MutationObserver(function(mutations) {
setMode(window.localStorage.getItem('theme') || 'light');
})
observer.observe(document.documentElement, {attributes: true, attributeFilter: ['data-theme']});
// A custom theme for this app
const theme = createTheme({
palette: {
mode: mode == 'light' ? 'light' : 'dark',
},
cssVariables: true
});
return (
<ThemeProvider theme={theme}>
<CssBaseline />
<App />
</ThemeProvider>
);
}
ReactDOM.createRoot(document.getElementById('root')!).render(
<React.StrictMode>
<ThemeProvider theme={theme}>
<CssBaseline />
<App />
</ThemeProvider>
<RootApp />
</React.StrictMode>,
);

20
scripts/settings/src/theme.tsx
Wyświetl plik

@ -1,20 +0,0 @@
import { createTheme } from '@mui/material/styles';
import { red } from '@mui/material/colors';
// A custom theme for this app
const theme = createTheme({
cssVariables: true,
palette: {
primary: {
main: '#556cd6',
},
secondary: {
main: '#19857b',
},
error: {
main: red.A400,
},
},
});
export default theme;

4
scripts/settings/vite.config.ts
Wyświetl plik

@ -5,4 +5,8 @@ import { viteSingleFile } from "vite-plugin-singlefile"
// https://vite.dev/config/
export default defineConfig({
plugins: [react(), viteSingleFile()],
build: {
minify: false,
sourcemap: true,
}
});