rahix/openflexure-microscope-server
1
0
Fork 0
Code Issues Pull requests Projects Releases Packages Wiki Activity Actions

Improved settings layout

Browse source
This commit is contained in:
Joel Collins 2020-03-17 17:39:11 +00:00
parent a9506c4abc
commit d8626b7e13
3 changed files with 38 additions and 32 deletions
Download patch file Download diff file Expand all files Collapse all files

6
src/components/viewComponents/settingsComponents/microscopeSettings.vue
View file

@ -1,8 +1,6 @@
<template> <template>
<div v-if="settings" id="microscopeSettings"> <div v-if="settings" id="microscopeSettings">
<form @submit.prevent="applyConfigRequest"> <form @submit.prevent="applyConfigRequest">
<h4>Stage</h4>
<label class="uk-form-label" for="form-stacked-text" <label class="uk-form-label" for="form-stacked-text"
>Backlash compensation</label >Backlash compensation</label
> >
@ -41,7 +39,7 @@
</div> </div>
</div> </div>
<h4>Microscope</h4> <br />
<div> <div>
<label class="uk-form-label" for="form-stacked-text" <label class="uk-form-label" for="form-stacked-text"
@ -55,6 +53,8 @@
/> />
</div> </div>
<br />
<button <button
type="submit" type="submit"
class="uk-button uk-button-primary uk-form-small uk-float-right uk-margin-small uk-width-1-1" class="uk-button uk-button-primary uk-form-small uk-float-right uk-margin-small uk-width-1-1"

32
src/components/viewComponents/settingsComponents/streamSettings.vue
View file

@ -7,24 +7,20 @@
> >
</p> </p>
<div class="uk-child-width-1-2" uk-grid> <hr />
<p>
<label :class="[{ 'uk-disabled': !this.$store.getters.ready }]" <p>
><input <label :class="[{ 'uk-disabled': !this.$store.getters.ready }]"
v-model="autoGpuPreview" ><input v-model="autoGpuPreview" class="uk-checkbox" type="checkbox" />
class="uk-checkbox" GPU preview</label
type="checkbox" >
/> </p>
GPU preview</label <p>
> <label :class="[{ 'uk-disabled': !this.$store.getters.ready }]"
</p> ><input v-model="trackWindow" class="uk-checkbox" type="checkbox" />
<p> Track window</label
<label :class="[{ 'uk-disabled': !this.$store.getters.ready }]" >
><input v-model="trackWindow" class="uk-checkbox" type="checkbox" /> </p>
Track window</label
>
</p>
</div>
</div> </div>
</template> </template>

32
src/components/viewComponents/settingsDisplay.vue
View file

@ -1,19 +1,22 @@
<template> <template>
<div id="settingsDisplay" class="uk-padding"> <div id="settingsDisplay" class="uk-padding uk-height-1-1">
<div class="uk-child-width-expand@m" uk-grid> <div class="uk-height-1-1 uk-child-width-expand@m" uk-grid>
<div> <div class="uk-padding-remove">
<h3>System settings</h3> <div class="settings-pane uk-padding-small">
<appSettings /> <h3>System settings</h3>
<streamSettings /> <appSettings />
<hr />
<streamSettings />
</div>
</div> </div>
<div> <div class="uk-padding-remove">
<div v-if="$store.getters.ready"> <div v-if="$store.getters.ready" class="settings-pane uk-padding-small">
<h3>Camera settings</h3> <h3>Camera settings</h3>
<cameraSettings /> <cameraSettings />
</div> </div>
</div> </div>
<div> <div class="uk-padding-remove">
<div v-if="$store.getters.ready"> <div v-if="$store.getters.ready" class="settings-pane uk-padding-small">
<h3>Microscope settings</h3> <h3>Microscope settings</h3>
<microscopeSettings /> <microscopeSettings />
</div> </div>
@ -41,4 +44,11 @@ export default {
}; };
</script> </script>
<style lang="less"></style> <style lang="less">
.settings-pane {
border-width: 0 1px 0 0;
border-style: solid;
border-color: rgba(180, 180, 180, 0.25);
min-height: 100%;
}
</style>