CardBoard: Support for Regions: Creation, Moving, Resizing, Editing and Deleting.

This commit is contained in:
2018-03-24 16:44:32 +01:00
parent 5c9864209b
commit 5c0fbafdb1
6 changed files with 861 additions and 40 deletions

View File

@@ -87,12 +87,32 @@
box-sizing: content-box;
}
.divCard .txtTitle {
width: 100%;
font-family: "Segoe UI",Tahoma,Geneva,Verdana,sans-serif;
font-size: 12px;
background-color: transparent;
border: none;
font-weight: bold;
text-align: center;
}
.divCard .divBody {
font-family: "Segoe UI",Tahoma,Geneva,Verdana,sans-serif;
font-size: 12px;
height: calc(100% - 17px);
}
.divCard .txtBody {
height: 100%;
width: 100%;
font-family: "Segoe UI",Tahoma,Geneva,Verdana,sans-serif;
font-size: 12px;
background-color: transparent;
border: none;
resize: none;
}
.divCard .divOverlay {
opacity: 0;
background-color: rgb(255,255,0);
@@ -157,24 +177,100 @@
right: 4px;
}
.divCard .txtTitle {
width: 100%;
.divRegion {
position: absolute;
background-color: rgba(0,0,0,0.5);
box-shadow: 0 0 0 5px rgba(0,0,0,0.5);
padding: 5px;
border-radius: 10px;
border: dashed 5px rgba(255, 255, 255, 0.5);
overflow: auto;
}
.divRegion .divTitle {
padding-bottom: 5px;
padding-right: 44px;
font-family: "Segoe UI",Tahoma,Geneva,Verdana,sans-serif;
font-size: 12px;
font-weight: bold;
text-align: center;
height: 17px;
box-sizing: content-box;
}
.divRegion .txtTitle {
width: 100%;
font-family: "Segoe UI",Tahoma,Geneva,Verdana,sans-serif;
font-size: 30px;
color: rgba(255, 255, 255, 0.5);
background-color: transparent;
border: none;
font-weight: bold;
text-align: center;
}
.divCard .txtBody {
height: 100%;
width: 100%;
.divRegion .divOverlay {
opacity: 0;
background-color: rgb(255,255,0);
position: absolute;
top: 0;
bottom: 0;
left: 0;
right: 0;
-ms-touch-action: none;
touch-action: none;
}
.divRegion .divResize {
opacity: 0;
background-color: rgb(255,0,255);
position: absolute;
width: 30px;
height: 30px;
bottom: 0;
right: 0;
-ms-touch-action: none;
touch-action: none;
cursor: se-resize;
}
.divRegion .btnRegion {
margin-top: 5px;
margin-right: 5px;
padding: 2px;
border: none;
border-radius: 3px;
box-shadow: 0 -2px 4px rgba(0,0,0,0.4) inset, 0 2px 3px rgba(255,255,255,1) inset;
color: black;
background-color: transparent;
font-family: "Segoe UI",Tahoma,Geneva,Verdana,sans-serif;
font-size: 12px;
background-color: transparent;
border: none;
resize: none;
cursor: pointer;
}
.divRegion .btnRegion:hover {
color: yellow;
background-color: black;
}
.divRegion .btnRegion:active {
box-shadow: 0 2px 4px rgba(0,0,0,0.4) inset, 0 -2px 3px rgba(255,255,255,1) inset;
}
.divRegion .btnEdit {
margin: 0;
top: 4px;
position: absolute;
width: 16px;
right: 24px;
}
.divRegion .btnDelete {
margin: 0;
top: 4px;
position: absolute;
width: 16px;
right: 4px;
}
.divEditBackground {