puzzle/views/project.ejs
2023-06-30 01:57:12 +05:00

153 lines
4.2 KiB
Plaintext

<style>
.drag{
height: 50px;
width: 50px;
position: absolute;
text-align: center;
margin: auto;
}
.dropzone {
background-color: #bfe4ff;
border: dashed 4px transparent;
border-radius: 4px;
height: 140px;
margin: 10px auto 30px;
padding: 10px;
width: 80%;
transition: background-color 0.3s;
}
body {
height: 100%;
overflow-y: hidden;
}
.createzone {
background-color: #bfe4ff;
border: dashed 4px transparent;
border-radius: 4px;
height: 10px;
margin: 10px;
padding: 10px;
width: 10px;
transition: background-color 0.3s;
}
.trash {
background-color: #bfe4ff;
border: dashed 4px transparent;
border-radius: 4px;
margin: 10px auto 30px;
padding: 10px;
height: 50px;
width: 50px;
transition: background-color 0.3s;
z-index: -1;
}
.czones{
display: flex;
margin: auto;
/* justify-content: space-around; */
flex-wrap: wrap;
width: 80%;
}
.drop-active {
border-color: #aaa;
}
.drop-target {
background-color: #29e;
border-color: #fff;
border-style: solid;
}
#proj_top{
margin: auto;
width: 90%;
display: flex;
justify-content: space-around;
}
#proj_name{
background-color: #aaa;
border: 0px;
text-align: center;
}
</style>
<%- include('./static/start.ejs',{name:proj_name,async: true}) %>
<%- include('./header.ejs') %>
<script src="/lib/interact.min.js"></script>
<div id="drags">
<!-- <div class="cube drag spawn" id="cube_0" style="transform: translate(197.7px, 57.8667px);" data-x="197.6999969482422" data-y="57.866668701171875" >cube</div> -->
</div>
<section class="main">
<div id="proj_top">
<button onclick="save()">save</button>
<input id="proj_name"></input>
</div>
</section>
<div class="dropzone"></div>
<div class="trash"></div>
<div class="czones">
<div class="cube createzone"></div>
<div class="buble createzone"></div>
<div class="buble createzone"></div>
<div class="buble createzone"></div>
<div class="buble createzone"></div>
<div class="buble createzone"></div>
<div class="buble createzone"></div>
<div class="buble createzone"></div>
<div class="buble createzone"></div>
<div class="buble createzone"></div>
<div class="buble createzone"></div>
<div class="buble createzone"></div>
<div class="buble createzone"></div>
<div class="buble createzone"></div>
<div class="buble createzone"></div>
<div class="buble createzone"></div>
<div class="buble createzone"></div>
<div class="buble createzone"></div>
<div class="buble createzone"></div>
<div class="buble createzone"></div>
<div class="buble createzone"></div>
<div class="buble createzone"></div>
<div class="buble createzone"></div>
<div class="buble createzone"></div>
<div class="buble createzone"></div>
<div class="buble createzone"></div>
<div class="buble createzone"></div>
<div class="buble createzone"></div>
<div class="buble createzone"></div>
<div class="buble createzone"></div>
<div class="buble createzone"></div>
<div class="buble createzone"></div>
<div class="buble createzone"></div>
<div class="buble createzone"></div>
<div class="buble createzone"></div>
<div class="buble createzone"></div>
<div class="buble createzone"></div>
<div class="buble createzone"></div>
<div class="buble createzone"></div>
<div class="buble createzone"></div>
<div class="buble createzone"></div>
<div class="buble createzone"></div>
<div class="buble createzone"></div>
<div class="buble createzone"></div>
<div class="buble createzone"></div>
<div class="buble createzone"></div>
</div>
<script src="/lib/inter.js"></script>
<script>
let proj_name = "<%= proj_name %>";
// console.log(proj_name);
document.getElementById("proj_name").value = proj_name;
// drag_start();
load_proj();
</script>
<%- include('./static/end.ejs') %>