nerdcult
/
nemu-old
Archived
4
0
Fork 0
Code Issues Pull Requests Packages Projects Releases Wiki Activity

First configurator pane

This commit is contained in:
Eric-Paul I 2023-03-19 05:51:20 +01:00
parent 0d92060296
commit 95506a7700
2 changed files with 221 additions and 0 deletions
Show Stats Download Patch File Download Diff File Expand all files Collapse all files

166
frontend/configurator.css Executable file
View File

@ -0,0 +1,166 @@
* {
padding: 0px;
margin: 0px;
}
html, body, main {
width: 100%;
height: 100%;
}
#configurator {
display: flex;
flex-direction: row;
flex-wrap: nowrap;
justify-content: space-around;
align-items: center;
width: 85vw;
height: 85vw;
max-width: 85vh;
max-height: 85vh;
}
.config-step > .header {
position: relative;
z-index: 4;
top: -32px;
height: 32px;
background-color: #161819;
color: #fff;
text-align: center;
font-size: 20px;
font-weight: 650;
}
.config-step > .content {
position: relative;
z-index: 3;
top: -32px;
width: 100%;
height: 100%;
}
.config-step > .content > .inner-pane {
width: 100%;
height: 100%;
}
#pane-choose-configurator {
width: 80%;
height: 80%;
background-color: #1e2122;
}
#configurator-chooser-background {
width: 100%;
height: 100%;
overflow: hidden;
}
#configurator-chooser-preset-background {
position: relative;
bottom: 0%;
right: 0%;
z-index: 2;
width: 99%;
height: 99%;
clip-path: polygon(0% 0%, 0% 100%, 100% 0%);
background-color: #242728;
}
#configurator-chooser-preset-background:hover {
background-color: #2f3436;
}
#configurator-chooser-own-systems-background {
position: relative;
bottom: 98%;
right: -1%;
width: 99%;
height: 99%;
clip-path: polygon(100% 100%, 0% 100%, 100% 0%);
background-color: #242728;
}
#configurator-chooser-own-systems-background:hover {
background-color: #2f3436;
}
#button-choose-preset-configurator {
z-index: 2;
position: relative;
top: -70%;
left: 22.5%;
color: #fff;
font-size: 40px;
font-weight: 1000;
}
#button-choose-own-systems-configurator {
z-index: 2;
position: relative;
top: -40%;
left: 60%;
color: #fff;
font-size: 40px;
font-weight: 1000;
}
#main-desktop-container {
display: flex;
flex-direction: row;
flex-wrap: nowrap;
justify-content: space-around;
align-items: center;
background-color: #373939;
}
#control-bar {
position: fixed;
left: 0px;
top: 0px;
z-index: 16;
width: 48px;
height: 100%;
background-color: #1e2122;
}

55
frontend/index.html Executable file
View File

@ -0,0 +1,55 @@
<!DOCTYPE html>
<html>
<head>
<meta charset="UTF-8">
<title>NEMU | nerdcult.net emulator</title>
<link rel="stylesheet" href="configurator.css">
</head>
<body>
<main id="main-desktop-container">
<aside id="control-bar">
</aside>
<section id="configurator">
<div class="config-step" id="pane-choose-configurator">
<div class="header">
System Type
</div>
<div class="content">
<div class="inner-pane">
<div id="configurator-chooser-background">
<div id="configurator-chooser-preset-background"></div>
<div id="configurator-chooser-own-systems-background"></div>
</div>
<div id="button-choose-preset-configurator"> <p>Preset</p> </div>
<div id="button-choose-own-systems-configurator"> <p>Own</p> </div>
</div>
</div>
<div>
</section>
</main>
<footer>
</footer>
</body>
</html>