162 lines
2.2 KiB
CSS
162 lines
2.2 KiB
CSS
div {
|
|
display: flex;
|
|
align-items: center;
|
|
justify-content: center;
|
|
}
|
|
|
|
body {
|
|
background-color: #FFFFCC;
|
|
margin: 0;
|
|
}
|
|
|
|
.container {
|
|
width: 100vw;
|
|
height: 100vh;
|
|
}
|
|
|
|
.left {
|
|
width: 20vw;
|
|
height: 90vh;
|
|
padding-top: 10vh;
|
|
background-color: #CCFFFF;
|
|
justify-content: flex-start;
|
|
flex-direction: column;
|
|
position: relative;
|
|
}
|
|
|
|
.row {
|
|
width: 20vw;
|
|
margin: 5px 5px;
|
|
flex-direction: column;
|
|
}
|
|
|
|
.row_Text {
|
|
margin-top: 2px;
|
|
width: 15vw;
|
|
font-size: large;
|
|
justify-content: flex-start;
|
|
}
|
|
|
|
.title {
|
|
border-bottom: 1px solid black;
|
|
|
|
margin-bottom: 5px;
|
|
font-weight: bold;
|
|
}
|
|
|
|
.down {
|
|
position: relative;
|
|
margin-top: auto;
|
|
margin-bottom: 5vh;
|
|
justify-self: flex-end;
|
|
width: 8vw;
|
|
cursor: pointer;
|
|
border: 1px solid black;
|
|
}
|
|
|
|
.right {
|
|
width: 80vw;
|
|
height: 100vh;
|
|
}
|
|
|
|
.drop {
|
|
margin: 2vh;
|
|
width: 70vw;
|
|
height: 90vh;
|
|
}
|
|
|
|
.pic {
|
|
display: none;
|
|
margin: 2vh;
|
|
width: 70vw;
|
|
height: 90vh;
|
|
}
|
|
|
|
.imgCol {
|
|
justify-content: flex-start;
|
|
width: 21vw;
|
|
margin: 10vh 1vw 10vh 1vw;
|
|
flex-direction: column;
|
|
height: 90vh;
|
|
overflow-y: scroll;
|
|
}
|
|
|
|
.imgCol::-webkit-scrollbar {
|
|
display: none;
|
|
}
|
|
|
|
#canvasList {
|
|
width: 100%;
|
|
height: 100%;
|
|
overflow-y: scroll;
|
|
}
|
|
|
|
#canvasList::-webkit-scrollbar {
|
|
display: none;
|
|
}
|
|
|
|
.imgcard {
|
|
margin: 5px 0;
|
|
border: 3px dotted gray;
|
|
box-shadow: 1px black;
|
|
flex-direction: column;
|
|
}
|
|
|
|
.imgdesp {
|
|
font-size: large;
|
|
}
|
|
|
|
.inputs {
|
|
justify-content: flex-start;
|
|
}
|
|
|
|
.scale_size {
|
|
display: flex;
|
|
font-size: medium;
|
|
margin: 0 3px;
|
|
width: 4vw;
|
|
}
|
|
|
|
.scale_size_but {
|
|
width: 7vw;
|
|
height: 5vh;
|
|
background-color: white;
|
|
border-radius: 2px;
|
|
cursor: pointer;
|
|
}
|
|
|
|
#imgList {
|
|
width: 100%;
|
|
height: 100%;
|
|
}
|
|
|
|
#dropbox {
|
|
width: 100%;
|
|
height: 100%;
|
|
border: 5px dashed gray;
|
|
border-radius: 8px;
|
|
background: #FFFFCC;
|
|
background-size: 100%;
|
|
background-repeat: no-repeat;
|
|
text-align: center;
|
|
cursor: pointer;
|
|
font-size: xx-large;
|
|
}
|
|
|
|
#canvasList,
|
|
#fileInput {
|
|
display: none;
|
|
}
|
|
|
|
#pic_scale_size,
|
|
#pic_scale_sc,
|
|
#pic_scale_fun,
|
|
#pic_scale_mode {
|
|
display: none;
|
|
}
|
|
|
|
#scale_size_ani,
|
|
#scale_size_sc_ani,
|
|
#ani_but {
|
|
display: none;
|
|
} |