Clean up stylesheet, small fixes

This commit is contained in:
Colin Kallemein 2024-06-23 15:04:07 +02:00
parent 7a45145921
commit b2aa37d35b

View File

@ -23,7 +23,7 @@
<div class="asset">
<input class="input-cyan search-field" placeholder="Search..." />
</div>
<div class="asset">
<div class="asset add-new">
<span class="asset-name">Upload new</span>
<label for="upload-asset" class="file-upload">
<input id="upload-asset" ref="tileUploadField" type="file" accept="image/png" multiple @change="handleFileUpload" />
@ -244,17 +244,8 @@ onMounted(() => {
.asset-categories, .assets, .asset-info {
flex-direction: column;
position: relative;
// &::after {
// content: '';
// position: absolute;
// right: 0;
// width: 1px;
// height: 100%;
// top: 0;
// background-color: $dark-cyan;
// }
.category, .asset, .image-container {
.category, .asset, .image-container {
position: relative;
padding: 10px;
&::after {
@ -269,6 +260,15 @@ onMounted(() => {
&.selected {
background-color: rgba($cyan, 0.8);
}
&.add-new {
display: flex;
align-items: center;
gap: 10px 20px;
flex-wrap: wrap;
.asset-name {
flex-shrink: 0;
}
}
.search-field {
border-radius: 5px;
padding: 8px 10px;
@ -281,7 +281,6 @@ onMounted(() => {
text-shadow: 0 3px 6px rgba($black, 0.2);
padding: 6px 15px;
display: inline-flex;
margin-left: 20px;
&:hover {
background-color: $cyan;