Commit fd53f669 authored by Sascha Herzinger's avatar Sascha Herzinger
Browse files

small style improvements for volcanoplot

parent de002b4f
Pipeline #5378 passed with stages
in 5 minutes and 39 seconds
...@@ -7,40 +7,42 @@ ...@@ -7,40 +7,42 @@
v-on:update="update_arrays"> v-on:update="update_arrays">
</data-box> </data-box>
<hr class="fjs-seperator"/> <hr class="fjs-seperator"/>
<fieldset class="fjs-fieldset"> <div class="fjs-settings">
<legend>Differential Expression Analysis</legend> <fieldset class="fjs-fieldset">
<div v-for="method in rankingMethods"> <legend>Differential Expression Analysis</legend>
<div v-for="method in rankingMethods">
<label>
<input type="radio" :value="method" v-model="rankingMethod">
{{ method }}
</label>
</div>
</fieldset>
<div class="fjs-axis-params">
<label> <label>
<input type="radio" :value="method" v-model="rankingMethod"> X-Axis
{{ method }} <select v-model="xAxisTransform">
<option :value="d" v-for="d in Object.keys(transformations)">{{ d }}</option>
</select>
<select v-model="xAxisStatistic">
<option :value="d" v-for="d in statistics">{{ d }}</option>
</select>
</label>
<label>
Y-Axis
<select v-model="yAxisTransform">
<option :value="d" v-for="d in Object.keys(transformations)">{{ d }}</option>
</select>
<select v-model="yAxisStatistic">
<option :value="d" v-for="d in statistics">{{ d }}</option>
</select>
</label>
</div>
<div v-if="rankingMethod === 'DESeq2'">
<label>
Minimal total reads:
<input type="number" v-model.number="params.min_total_row_count"/>
</label> </label>
</div> </div>
</fieldset>
<div class="fjs-axis-params">
<label>
X-Axis
<select v-model="xAxisTransform">
<option :value="d" v-for="d in Object.keys(transformations)">{{ d }}</option>
</select>
<select v-model="xAxisStatistic">
<option :value="d" v-for="d in statistics">{{ d }}</option>
</select>
</label>
<label>
Y-Axis
<select v-model="yAxisTransform">
<option :value="d" v-for="d in Object.keys(transformations)">{{ d }}</option>
</select>
<select v-model="yAxisStatistic">
<option :value="d" v-for="d in statistics">{{ d }}</option>
</select>
</label>
</div>
<div v-if="rankingMethod === 'DESeq2'">
<label>
Minimal total reads:
<input type="number" v-model.number="params.min_total_row_count"/>
</label>
</div> </div>
</control-panel> </control-panel>
<svg :height="height" :width="width"> <svg :height="height" :width="width">
...@@ -157,7 +159,7 @@ ...@@ -157,7 +159,7 @@
args () { args () {
return { return {
numerical_arrays: this.arrays, numerical_arrays: this.arrays,
id_filter: store.getters.filter('ids'), id_filter: store.getters.filter('ids').value,
params: this.params, params: this.params,
ranking_method: this.rankingMethod, ranking_method: this.rankingMethod,
subsets: store.getters.subsets subsets: store.getters.subsets
...@@ -381,17 +383,20 @@ ...@@ -381,17 +383,20 @@
@import '~assets/base.sass' @import '~assets/base.sass'
.fjs-control-panel .fjs-control-panel
.fjs-axis-params .fjs-settings
display: flex > *
flex-direction: column margin-bottom: 1vh
.fjs-axis-params
display: flex
flex-direction: column
svg svg
.fjs-axis-label .fjs-axis-label
text-anchor: middle text-anchor: middle
.fjs-selection-table .fjs-selection-table
border-collapse: collapse background: #97d8ff
background: rgb(216, 217, 216)
color: #000 color: #000
margin: 0 margin: 0
text-align: center
#table-colnames #table-colnames
border-top: 1px solid black border-top: 1px solid black
border-bottom: 1px solid black border-bottom: 1px solid black
...@@ -399,7 +404,7 @@ ...@@ -399,7 +404,7 @@
border: none border: none
tr tr
&:hover:not(#table-colnames) &:hover:not(#table-colnames)
background: aqua background: #ff6c6c
</style> </style>
<!--CSS for dynamically created components--> <!--CSS for dynamically created components-->
......
Markdown is supported
0% or .
You are about to add 0 people to the discussion. Proceed with caution.
Finish editing this message first!
Please register or to comment