From b2aa37d35bc2b7b119f10b0cb6d834442807e68d Mon Sep 17 00:00:00 2001
From: Colin Kallemein <cakallemein@gmail.com>
Date: Sun, 23 Jun 2024 15:04:07 +0200
Subject: [PATCH] Clean up stylesheet, small fixes
---
.../utilities/assetManager/AssetManager.vue | 23 +++++++++----------
1 file changed, 11 insertions(+), 12 deletions(-)
diff --git a/src/components/utilities/assetManager/AssetManager.vue b/src/components/utilities/assetManager/AssetManager.vue
index 0985c09..a5f5eee 100644
--- a/src/components/utilities/assetManager/AssetManager.vue
+++ b/src/components/utilities/assetManager/AssetManager.vue
@@ -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;