huanld/speckle-server
1
0
Fork 0
Code Issues Pull Requests Actions 1 Packages Projects Releases Wiki Activity

feat(frontend): viewer help styling

Browse Source
This commit is contained in:
Dimitrie Stefanescu
2022-08-04 17:30:30 +03:00
parent 92dba76b88
commit bfcd8a3297
1 changed files with 21 additions and 10 deletions
Download Patch File Download Diff File Expand all files Collapse all files
packages/frontend/src/main/components/viewer/dialogs/ViewerHelp.vue
+21 -10
View File
@@ -1,38 +1,43 @@
<template>
<v-card>
<div>
<v-expansion-panels>
<v-expansion-panels v-model="panel" accordion>
<v-expansion-panel>
<v-expansion-panel-header>Rotation</v-expansion-panel-header>
<v-expansion-panel-content>
<v-expansion-panel-content class="caption">
Simply click and drag with your left mouse button.
<v-img src="@/assets/rotating.gif" max-height="350" contain />
<v-img class="mt-4" src="@/assets/rotating.gif" max-height="350" contain />
</v-expansion-panel-content>
</v-expansion-panel>
<v-expansion-panel>
<v-expansion-panel-header>Panning</v-expansion-panel-header>
<v-expansion-panel-content>
<v-expansion-panel-content class="caption">
Simply click and drag with your right mouse button.
<v-img src="@/assets/panning.gif" max-height="350" contain />
<v-img class="mt-4" src="@/assets/panning.gif" max-height="350" contain />
</v-expansion-panel-content>
</v-expansion-panel>
<v-expansion-panel>
<v-expansion-panel-header>Zooming</v-expansion-panel-header>
<v-expansion-panel-content>
<v-expansion-panel-content class="caption">
Double click on an object to zoom to it.
<br />
Double click anywhere else to zoom to the entire scene.
<br />
Use your mouse's scroll wheel to zooom in and out.
<v-img src="@/assets/zooming.gif" max-height="350" contain />
<v-img class="mt-4" src="@/assets/zooming.gif" max-height="350" contain />
</v-expansion-panel-content>
</v-expansion-panel>
<v-expansion-panel>
<v-expansion-panel-header>Sections</v-expansion-panel-header>
<v-expansion-panel-content>
<v-expansion-panel-content class="caption">
The section box can be moved around as a whole. You can also move individual
faces of the section box by clicking on them.
<v-img src="@/assets/sectionbox.gif" max-height="350" contain />
<v-img
class="mt-4"
src="@/assets/sectionbox.gif"
max-height="350"
contain
/>
</v-expansion-panel-content>
</v-expansion-panel>
</v-expansion-panels>
@@ -49,5 +54,11 @@
</v-card>
</template>
<script>
export default {}
export default {
data() {
return {
panel: 0
}
}
}
</script>