beta styles + popup

This commit is contained in:
Seth Burkart
2023-09-15 15:03:26 +10:00
parent f8c84494ba
commit 8022fdd62b
10 changed files with 118 additions and 13 deletions
+1 -1
View File
@@ -7,7 +7,7 @@
<title>Vite + React + TS</title> <title>Vite + React + TS</title>
</head> </head>
<body class=""> <body class="">
<div id="ExtensionPopup" class=""></div> <div id="ExtensionPopup"></div>
<script type="module" src="/src/main.tsx"></script> <script type="module" src="/src/main.tsx"></script>
</body> </body>
</html> </html>
+7 -10
View File
@@ -57,19 +57,16 @@ const App: React.FC = () => {
} }
]; ];
{/* <div className="flex justify-center w-screen h-screen pt-4 overflow-hidden" style={{ background: settingsState.customThemeColor }}> */}
return ( return (
<div className="flex justify-center w-screen h-screen pt-4 overflow-hidden" style={{ background: settingsState.customThemeColor }}> <div className="flex flex-col w-[24rem] shadow-2xl gap-2 bg-white rounded-xl h-[590px] dark:bg-zinc-800 dark:text-white">
<div className="grid border-b border-b-zinc-200/40 place-items-center">
<div className="flex flex-col w-[24rem] shadow-2xl gap-2 bg-white rounded-xl h-4/6 dark:bg-zinc-800 dark:text-white"> <img src={logo} className="w-4/5 dark:hidden" />
<div className="grid border-b border-b-zinc-200/40 place-items-center"> <img src={logoDark} className="hidden w-4/5 dark:block" />
<img src={logo} className="w-4/5 dark:hidden" />
<img src={logoDark} className="hidden w-4/5 dark:block" />
</div>
<TabbedContainer themeColor={settingsState.customThemeColor} tabs={tabs} />
</div> </div>
<TabbedContainer themeColor={settingsState.customThemeColor} tabs={tabs} />
</div> </div>
); );
} };
export default App; export default App;
+17 -1
View File
File diff suppressed because one or more lines are too long
+1
View File
@@ -4,6 +4,7 @@ export default {
"./index.html", "./index.html",
"./src/**/*.{js,ts,jsx,tsx}", "./src/**/*.{js,ts,jsx,tsx}",
], ],
important: true,
darkMode: "class", darkMode: "class",
theme: { theme: {
fontSize: { fontSize: {
+1 -1
View File
@@ -10,7 +10,7 @@ export default defineConfig({
output: { output: {
assetFileNames: 'client/rsc/[ext]/[name][extname]', assetFileNames: 'client/rsc/[ext]/[name][extname]',
chunkFileNames: 'client/rsc/[chunks]/[name].[hash].js', chunkFileNames: 'client/rsc/[chunks]/[name].[hash].js',
entryFileNames: 'client/rsc/js/client.js' entryFileNames: 'client/public/client.js'
} }
} }
} }
+79
View File
File diff suppressed because one or more lines are too long
+4
View File
@@ -50,6 +50,10 @@
{ {
"resources": ["popup/*"], "resources": ["popup/*"],
"matches": ["*://*/*"] "matches": ["*://*/*"]
},
{
"resources": ["client.js"],
"matches": ["*://*/*"]
} }
] ]
} }
+6
View File
@@ -1583,6 +1583,12 @@ function CallExtensionSettings() {
</div></div>`); </div></div>`);
document.body.append(Settings.firstChild); document.body.append(Settings.firstChild);
// override old popup with new (experimental)
const script = document.createElement("script");
script.type = "module";
script.src = chrome.runtime.getURL("client.js");
(document.head||document.documentElement).appendChild(script);
var container = document.getElementById("container"); var container = document.getElementById("container");
var extensionsettings = document.getElementById("ExtensionPopup"); var extensionsettings = document.getElementById("ExtensionPopup");
container.onclick = function () { container.onclick = function () {
+1
View File
@@ -25,6 +25,7 @@
@import url("https://fonts.googleapis.com/css?family=Rubik:300,400,500,600"); @import url("https://fonts.googleapis.com/css?family=Rubik:300,400,500,600");
@import "./injected/popup.css"; @import "./injected/popup.css";
@import "./popup.css";
:root { :root {
background-color: var(--better-main) !important; background-color: var(--better-main) !important;
File diff suppressed because one or more lines are too long