dennii/dbgate
1
0
Fork 0
mirror of https://github.com/DeNNiiInc/dbgate.git synced 2026-04-19 07:16:01 +00:00
Code Issues Packages Projects Releases Wiki Activity

web app - basic theme

Browse Source
This commit is contained in:
Jan Prochazka
2019-12-26 22:25:28 +01:00
parent a91853d0cd
commit 43bc6a719c
9 changed files with 225 additions and 244 deletions
Download Patch File Download Diff File Expand all files Collapse all files

62
web/src/Screen.js Normal file
View File

@@ -0,0 +1,62 @@
import React from "react";
import theme from "./theme";
import styled from "styled-components";
import FilesTabsPanel from "./FilesTabsPanel";
const BodyDiv = styled.div`
position: fixed;
top: ${theme.tabsPanel.height}px;
left: ${theme.widgetMenu.iconSize + theme.widgetMenu.panelWidth}px;
bottom: ${theme.statusBar.height}px;
right: 0;
background-color: #eee;
`;
const IconBar = styled.div`
position: fixed;
top: 0;
left: 0;
bottom: ${theme.statusBar.height}px;
width: ${theme.widgetMenu.iconSize}px;
background-color: #222;
`;
const LeftMenu = styled.div`
position: fixed;
top: 0;
left: ${theme.widgetMenu.iconSize}px;
bottom: ${theme.statusBar.height}px;
width: ${theme.widgetMenu.panelWidth}px;
background-color: #ccc;
`;
const TabsPanel = styled.div`
display: flex;
position: fixed;
top: 0;
left: ${theme.widgetMenu.iconSize + theme.widgetMenu.panelWidth}px;
height: ${theme.tabsPanel.height}px;
right: 0;
background-color: #ddd;
`;
const StausBar = styled.div`
position: fixed;
height: ${theme.statusBar.height}px;
left: 0;
right: 0;
bottom: 0;
background-color: #00c;
`;
export default function Screen({ children }) {
return (
<>
<IconBar></IconBar>
<LeftMenu></LeftMenu>
<TabsPanel><FilesTabsPanel></FilesTabsPanel></TabsPanel>
<BodyDiv>{children}</BodyDiv>
<StausBar></StausBar>
</>
);
}