floating button container WIP

This commit is contained in:
zadam
2022-07-24 14:30:42 +02:00
parent b8a89ee52a
commit 5444cc2009
7 changed files with 49 additions and 53 deletions

View File

@@ -15,6 +15,11 @@ const TPL = `
flex-direction: row;
z-index: 100;
}
.floating-buttons .floating-button {
font-size: 130%;
padding: 5px 10px 4px 10px;
}
</style>
<div class="floating-buttons-children"></div>

View File

@@ -5,25 +5,21 @@ import toastService from "../../services/toast.js";
const TPL = `
<div>
<button class="relation-map-create-child-note btn btn-sm floating-button no-print" type="button"
title="Create new child note and add it into this relation map">
<span class="bx bx-folder-plus"></span>
Create child note
</button>
<button type="button"
class="relation-map-create-child-note floating-button btn bx bx-folder-plus no-print"
title="Create new child note and add it into this relation map"></button>
<button type="button"
class="relation-map-reset-pan-zoom btn icon-button floating-button bx bx-crop no-print"
title="Reset pan & zoom to initial coordinates and magnification"
style="right: 100px;"></button>
class="relation-map-reset-pan-zoom floating-button btn bx bx-crop no-print"
title="Reset pan & zoom to initial coordinates and magnification"></button>
<div class="btn-group floating-button no-print" style="right: 10px;">
<div class="btn-group no-print">
<button type="button"
class="relation-map-zoom-in btn icon-button bx bx-zoom-in"
class="relation-map-zoom-in floating-button btn bx bx-zoom-in"
title="Zoom In"></button>
<button type="button"
class="relation-map-zoom-out btn icon-button bx bx-zoom-out"
class="relation-map-zoom-out floating-button btn bx bx-zoom-out"
title="Zoom Out"></button>
</div>
</div>`;
@@ -47,5 +43,6 @@ export default class RelationMapButtons extends NoteContextAwareWidget {
this.$zoomInButton.on('click', () => this.triggerEvent('relationMapResetZoomIn', {ntxId: this.ntxId}));
this.$zoomOutButton.on('click', () => this.triggerEvent('relationMapResetZoomOut', {ntxId: this.ntxId}));
this.contentSized();
}
}

View File

@@ -23,7 +23,6 @@ const TPL = `
display: flex;
justify-content: space-between;
align-items: center;
z-index: 10;
}
.backlinks-count {

View File

@@ -25,9 +25,9 @@ const TPL = `<div class="note-map-widget" style="position: relative;">
}
</style>
<div class="btn-group btn-group-sm map-type-switcher floating-button" role="group">
<button type="button" class="btn icon-button bx bx-network-chart" title="Link Map" data-type="link"></button>
<button type="button" class="btn icon-button bx bx-sitemap" title="Tree map" data-type="tree"></button>
<div class="btn-group btn-group-sm map-type-switcher" role="group">
<button type="button" class="btn bx bx-network-chart" title="Link Map" data-type="link"></button>
<button type="button" class="btn bx bx-sitemap" title="Tree map" data-type="tree"></button>
</div>
<div class="style-resolver"></div>