ntr/mnml
1
0
Fork 0
Code Issues Pull Requests Packages Projects Releases Wiki Activity

move stuff for main

Browse Source
This commit is contained in:
ntr 2019-05-16 21:38:43 +10:00
parent fb9e947c9c
commit 3732e5414f
9 changed files with 33 additions and 33 deletions
Show Stats Download Patch File Download Diff File Expand all files Collapse all files

4
client/assets/normalize.css vendored
View File

@ -41,7 +41,7 @@ hgroup,
main,
menu,
nav,
section,
main,
summary {
display: block;
}
@ -128,7 +128,7 @@ dfn {
}
/**
* Address variable `h1` font-size and margin within `section` and `article`
* Address variable `h1` font-size and margin within `main` and `article`
* contexts in Firefox 4+, Safari, and Chrome.
*/

2
client/assets/skeleton.css vendored
View File

@ -398,7 +398,7 @@ hr {
/*
Note: The best way to structure the use of media queries is to create the queries
near the relevant code. For example, if you wanted to change the styles for buttons
on small devices, paste the mobile query code up in the buttons section and style it
on small devices, paste the mobile query code up in the buttons main and style it
there.
*/

2
client/index.js
View File

@ -3,4 +3,4 @@ require('./instance.css');
require('./game.css');
// kick it off
require('./src/main');
require('./src/app');

12
client/src/main.jsx → client/src/app.jsx
View File

@ -11,7 +11,7 @@ const createSocket = require('./socket');
const registerEvents = require('./events');
const Header = require('./components/header.container');
const Body = require('./components/body.component');
const Main = require('./components/main');
const Nav = require('./components/nav');
// Redux Store
@ -50,19 +50,19 @@ document.fonts.load('16pt "Jura"').then(() => {
ws.connect();
const Cryps = () => (
<main className="cryps" >
<div id="cryps" >
<Header />
<Nav />
<Body />
</main>
<Main />
</div>
);
const Main = () => (
const App = () => (
<Provider store={store}>
<Cryps />
</Provider>
);
// eslint-disable-next-line
preact.render(<Main />, document.body);
preact.render(<App />, document.body);
});

8
client/src/components/game.component.jsx
View File

@ -28,7 +28,7 @@ function GamePanel(props) {
if (showLog) {
const logs = game.log.map((l, i) => (<div key={i}>{l}</div>)).reverse();
return (
<section className="game">
<main className="game">
<div className="instance-hdr">
<button
className="game-btn instance-btn instance-ui-btn left"
@ -42,7 +42,7 @@ function GamePanel(props) {
<div className="logs">
{logs}
</div>
</section>
</main>
);
}
@ -165,12 +165,12 @@ function GamePanel(props) {
const gameClasses = `game ${resolution ? 'resolving': ''}`;
return (
<section className={gameClasses} onClick={() => setActiveCryp(null)} >
<main className={gameClasses} onClick={() => setActiveCryp(null)} >
{header}
{timer}
{otherTeams.map(OpponentTeam)}
{PlayerTeam(playerTeam, setActiveSkill)}
</section>
</main>
);
}

4
client/src/components/instance.component.jsx
View File

@ -48,7 +48,7 @@ function InstanceComponent(args) {
);
return (
<section className="instance" >
<main className="instance" >
<div className="top">
{actionBtn}
{timer}
@ -57,7 +57,7 @@ function InstanceComponent(args) {
<InfoContainer />
<EquipmentContainer />
<InstanceCrypsContainer />
</section>
</main>
);
}

16
client/src/components/body.component.jsx → client/src/components/main.jsx
View File

@ -19,15 +19,9 @@ function renderBody(props) {
if (!account) {
return (
<section>
<main>
<LoginContainer />
</section>
);
}
if (game) {
return (
<GameContainer />
</main>
);
}
@ -37,6 +31,12 @@ function renderBody(props) {
);
}
if (game) {
return (
<GameContainer />
);
}
return (
<MenuContainer />
);

4
client/src/components/menu.component.jsx
View File

@ -145,9 +145,9 @@ function Menu(args) {
}
return (
<section className="menu">
<main className="menu">
{instanceList()}
</section>
</main>
);
}

14
client/styles.css
View File

@ -2,7 +2,7 @@
GLOBAL
*/
html, body, main {
html, body, #cryps {
/*width: 100%;*/
margin: 0;
@ -60,7 +60,7 @@ figure {
margin: 0;
}
main {
#cryps {
padding: 0 2em;
display: grid;
grid-template-columns: 1fr 8fr;
@ -115,7 +115,7 @@ nav button:hover {
color: whitesmoke;
}
section {
main {
grid-area: main;
}
@ -276,13 +276,13 @@ button[disabled] {
flex-flow: column;
}
.cryps input, .cryps select {
#cryps input, #cryps select {
border-color: #444;
background-color: #333;
border-radius: 0;
}
.cryps input:focus {
#cryps input:focus {
border-color: whitesmoke;
}
@ -457,7 +457,7 @@ figure.gray {
fill: none;
}
section .top {
main .top {
display: flex;
flex-flow: column;
flex: 1;
@ -502,7 +502,7 @@ section .top {
}
@media (max-height: 900px), (max-width: 1500px) {
.cryps {
#cryps {
font-size: 75%;
}