heliox/old-monorepo
Archived
1
0
Fork 0
Code Issues Pull requests Projects Releases Packages Wiki Activity

Use styled-components for window border

Browse source
This commit is contained in:
GHOSCHT 2021-07-10 16:19:37 +02:00
parent ac05fbcb91
commit e89d12f13b
2 changed files with 31 additions and 35 deletions
Show stats Download patch file Download diff file Expand all files Collapse all files

53
Dashboard/src/App.tsx
View file

@ -1,32 +1,40 @@
import React from "react"; import React from "react";
// import SerialPort from "serialport"; import SerialPort from "serialport";
import { remote } from "electron"; import { createGlobalStyle } from "styled-components";
import Knob from "./Components/Knob"; import Knob from "./Components/Knob";
const App = () => { const GlobalStyle = createGlobalStyle`
// https://www.electronjs.org/docs/api/system-preferences#systempreferencesgetcolorcolor-windows-macos html {
console.log(remote.systemPreferences.getColor("active-border")); // border border-style: solid;
// https://www.electronjs.org/docs/api/system-preferences#systempreferencesgetaccentcolor-windows-macos border-color: #363636;
console.log(remote.systemPreferences.getAccentColor()); // accent color border-width: 1px;
box-sizing: border-box;
height: 100%;
border-bottom-style: hidden;
border-right-style: hidden;
}
`;
// const port = new SerialPort("COM5", { const App = () => {
// baudRate: 9600, const port = new SerialPort("COM5", {
// autoOpen: false, baudRate: 9600,
// }); autoOpen: false,
// const handler = () => { });
// // eslint-disable-next-line const handler = () => {
// port.write("off", (err) => { // eslint-disable-next-line
// if (err) { port.write("off", (err) => {
// return console.log("Error on write: ", err.message); if (err) {
// } return console.log("Error on write: ", err.message);
// console.log("message written"); }
// }); console.log("message written");
// }; });
};
return ( return (
<div> <div>
<GlobalStyle />
<Knob increase={() => { console.log("inc"); }} decrease={() => { console.log("dec"); }} toggle={() => { console.log("togg"); }} /> <Knob increase={() => { console.log("inc"); }} decrease={() => { console.log("dec"); }} toggle={() => { console.log("togg"); }} />
{/* <button <button
type="button" type="button"
onClick={() => { onClick={() => {
port.open(); port.open();
@ -55,9 +63,8 @@ const App = () => {
}} }}
> >
list list
</button> */} </button>
</div> </div>
); );
}; };
export default App; export default App;

13
Dashboard/src/index.html
View file

@ -1,16 +1,5 @@
<!DOCTYPE html> <!DOCTYPE html>
<html <html lang="en">
lang="en"
style="
border-style: solid;
border-color: #363636;
border-width: 1px;
box-sizing: border-box;
height: 100%;
border-bottom-style: hidden;
border-right-style: hidden;
"
>
<head> <head>
<meta charset="UTF-8" /> <meta charset="UTF-8" />
<title>Light Control</title> <title>Light Control</title>