Improve crop editor styling.

This commit is contained in:
Aaron van Geffen 2020-11-23 12:22:05 +01:00
parent fd84e1c9f8
commit 2c68b6a798
2 changed files with 7 additions and 6 deletions

View File

@ -150,7 +150,7 @@ body {
left: 0;
height: 100%;
width: 100%;
background: #000;
background: rgba(0, 0, 0, 0.8);
z-index: 100;
color: #fff;
}
@ -163,6 +163,8 @@ body {
position: relative;
}
.crop_position {
background: rgba(0, 0, 0, 1.0);
border: none;
padding: 5px;
text-align: center;
}
@ -176,15 +178,14 @@ body {
max-height: 700px;
}
#crop_boundary {
border: 1px solid rgba(255, 255, 255, 0.75);
background: rgba(255, 255, 255, 0.75);
border: 1px dashed rgb(255, 255, 255);
background: rgba(255, 255, 255, 0.4);
position: absolute;
z-index: 200;
width: 500px;
height: 300px;
top: 400px;
left: 300px;
filter: invert(100%); /* temp */
}

View File

@ -18,7 +18,7 @@ class CropEditor {
this.container = document.createElement("div");
this.container.id = "crop_editor";
this.position = document.createElement("div");
this.position = document.createElement("fieldset");
this.position.className = "crop_position";
this.container.appendChild(this.position);
@ -217,4 +217,4 @@ class CropEditor {
crop_boundary.style.width = (this.crop_width.value) * width_scale + "px";
crop_boundary.style.height = (this.crop_height.value) * height_scale + "px";
}
}
}