jewbird
/
asciibird
3
3
Fork 0
Code Issues Pull Requests Releases Activity

review front end for brushes/library area

This commit is contained in:
Hugh Bord 2021-12-21 20:15:42 +10:00
parent 48cf5be208
commit 45a386863a
3 changed files with 31 additions and 22 deletions
Show Stats Download Patch File Download Diff File Expand all files Collapse all files

8
src/Dashboard.vue
View File

@ -128,9 +128,11 @@
:class="buttonStyle(key)"
@click="changeTab(key, value)"
>
{{ value.title }}
<t-button class="z-40" @click="closeTab(key)"> X </t-button>
<span>
<span class="material-icons relative">insert_drive_file</span>
<span class="bottom-1 relative pl-1 pr-1">{{ value.title }}</span>
<t-button class="relative bottom-1 z-40 rounded-3xl h-5" @click="closeTab(key)"><span class="material-icons" style="font-size:16px">close</span></t-button>
</span>
</t-button>
</span>
</div>

35
src/components/BrushLibrary.vue
View File

@ -15,30 +15,34 @@
ref="brushlibrarypanel"
>
<t-card class="h-full overflow-y-auto overflow-x-auto">
<t-button
type="button"
:class="`block w-full ${
panel.tab === 1
? 'border-gray-900 bg-blue-500'
: 'border-gray-200 bg-gray-500'
}`"
@click="changeTab(1)"
>
Library
</t-button>
<t-button
type="button"
:class="`block w-full ${
:class="`w-1/2 border-gray-200 bg-gray-500 text-sm ${
panel.tab === 0
? 'border-gray-900 bg-blue-500'
: 'border-gray-200 bg-gray-500'
}`"
@click="changeTab(0)"
>
History
<span class="material-icons relative top-2 pb-4">history</span> History
</t-button>
<t-button
type="button"
:class="`w-1/2 border-gray-200 bg-gray-500 text-sm ${
panel.tab === 1
? 'border-gray-900 bg-blue-500'
: 'border-gray-200 bg-gray-500'
}`"
@click="changeTab(1)"
>
<span class="material-icons relative top-2 pb-4">library_books</span> Library {{ libraryCount }}
</t-button>
<div class="flex">
<div v-if="panel.tab === 0">
<div v-for="(brush, key) in brushHistory" :key="key">
@ -86,7 +90,7 @@
class="ab-rounded-button ml-1 mt-1"
@click="removeFromLibrary(decompressBlock(brush.blocks))"
>
<span class="material-icons">trash</span>
<span class="material-icons">delete</span>
</t-button>
<t-button
@ -173,6 +177,9 @@ export default {
brushLibraryState() {
return this.$store.getters.brushLibraryState;
},
libraryCount() {
return this.brushLibrary.length > 0 ? `(${this.brushLibrary.length})` : '';
}
},
watch: {
yOffset(val) {

10
src/components/parts/Layers.vue
View File

@ -3,18 +3,18 @@
<div class="flex">
<t-button
type="button"
class="block w-1/2 border-gray-200 bg-gray-500"
class="block w-1/2 border-gray-200 bg-gray-500 text-sm"
@click="addLayer()"
>
Add Layer
<span class="material-icons relative top-2 pb-4">playlist_add</span> Add Layer
</t-button>
<t-button
type="button"
class="block w-1/2 border-gray-200 bg-gray-500"
class="block w-1/2 border-gray-200 bg-gray-500 text-sm"
@click="mergeLayers()"
>
Merge Layers
<span class="material-icons relative top-2 pb-4">playlist_play</span> Merge Layers
</t-button>
</div>
@ -29,7 +29,7 @@
@click="updateImageOverlay"
>
<span class="material-icons">{{
imageOverlay.visible ? "remove_red_eye" : "panorama_fish_eye"
!imageOverlay.visible ? "remove_red_eye" : "panorama_fish_eye"
}}</span>
</t-button>
<div class="w-full p-1" @click="showOverlayModal">