ahtlon/deck
1
0
Fork 0
Code Issues Pull Requests Actions Packages Projects Releases 1 Wiki Activity

Fix color picker positioning

Browse Source 
Signed-off-by: Julius Härtl <jus@bitgrid.net>
This commit is contained in:
Julius Härtl
2020-01-28 13:32:23 +01:00
parent a15a00ab6b
commit 1ef22524ec
1 changed files with 15 additions and 9 deletions
Download Patch File Download Diff File Expand all files Collapse all files

22
src/components/navigation/AppNavigationBoard.vue
View File

@@ -61,6 +61,9 @@
<!-- edit entry --> <!-- edit entry -->
<div v-if="editing" class="app-navigation-entry-edit"> <div v-if="editing" class="app-navigation-entry-edit">
<ColorPicker class="app-navigation-entry-bullet-wrapper" :value="`#${board.color}`" @input="updateColor">
<div :style="{ backgroundColor: getColor }" class="color0 icon-colorpicker app-navigation-entry-bullet"></div>
</ColorPicker>
<form @submit.prevent.stop="applyEdit"> <form @submit.prevent.stop="applyEdit">
<input v-model="editTitle" type="text" required> <input v-model="editTitle" type="text" required>
<input type="submit" value="" class="icon-confirm"> <input type="submit" value="" class="icon-confirm">
@@ -69,12 +72,6 @@
class="icon-close" class="icon-close"
@click.stop.prevent="cancelEdit"> @click.stop.prevent="cancelEdit">
</form> </form>
<!-- <ColorPicker v-model="editColor" /> -->
<ColorPicker :value="`#${board.color}`" @input="updateColor">
<div :style="{ backgroundColor: getColor }" class="color0">
Click to choose color
</div>
</ColorPicker>
</div> </div>
</router-link> </router-link>
</template> </template>
@@ -279,8 +276,17 @@ export default {
#app-navigation #deck-navigation .editing { #app-navigation #deck-navigation .editing {
height: auto !important; height: auto !important;
} }
.app-navigation-entry-bullet-wrapper {
position: absolute;
left: 33px;
width: 44px !important;
margin: 6px;
height: 44px;
.color0 { .color0 {
border-radius: 6px; width: 30px !important;
height: 25px; height: 30px;
border-radius: 50%;
background-size: 14px;
}
} }
</style> </style>