mobile
This commit is contained in:
		@ -1,11 +1,6 @@
 | 
				
			|||||||
<script>
 | 
					<script>
 | 
				
			||||||
  import { onMount } from "svelte";
 | 
					  import { onMount } from "svelte";
 | 
				
			||||||
  import {
 | 
					  import { selectedFilter, nodes, inputs, previewCommand } from "./stores.js";
 | 
				
			||||||
    selectedFilter,
 | 
					 | 
				
			||||||
    nodes,
 | 
					 | 
				
			||||||
    inputs,
 | 
					 | 
				
			||||||
    previewCommand,
 | 
					 | 
				
			||||||
  } from "./stores.js";
 | 
					 | 
				
			||||||
  import Filter from "./Filter.svelte";
 | 
					  import Filter from "./Filter.svelte";
 | 
				
			||||||
  import FilterPicker from "./FilterPicker.svelte";
 | 
					  import FilterPicker from "./FilterPicker.svelte";
 | 
				
			||||||
  import Graph from "./Graph.svelte";
 | 
					  import Graph from "./Graph.svelte";
 | 
				
			||||||
@ -26,7 +21,6 @@
 | 
				
			|||||||
  let logbox;
 | 
					  let logbox;
 | 
				
			||||||
  let commandRef;
 | 
					  let commandRef;
 | 
				
			||||||
 | 
					
 | 
				
			||||||
 | 
					 | 
				
			||||||
  function render() {
 | 
					  function render() {
 | 
				
			||||||
    transcode();
 | 
					    transcode();
 | 
				
			||||||
  }
 | 
					  }
 | 
				
			||||||
@ -115,7 +109,12 @@
 | 
				
			|||||||
  <section class="command">
 | 
					  <section class="command">
 | 
				
			||||||
    <h3>Output Command</h3>
 | 
					    <h3>Output Command</h3>
 | 
				
			||||||
    <div class="inner-command">
 | 
					    <div class="inner-command">
 | 
				
			||||||
      <textarea readonly class="actual-command" bind:this={commandRef} on:click={() => commandRef.select()}>{$previewCommand}</textarea>
 | 
					      <textarea
 | 
				
			||||||
 | 
					        readonly
 | 
				
			||||||
 | 
					        class="actual-command"
 | 
				
			||||||
 | 
					        bind:this={commandRef}
 | 
				
			||||||
 | 
					        on:click={() => commandRef.select()}>{$previewCommand}</textarea
 | 
				
			||||||
 | 
					      >
 | 
				
			||||||
      <div>
 | 
					      <div>
 | 
				
			||||||
        <button on:click={copyCommand}>Copy Command</button>
 | 
					        <button on:click={copyCommand}>Copy Command</button>
 | 
				
			||||||
      </div>
 | 
					      </div>
 | 
				
			||||||
@ -180,7 +179,6 @@
 | 
				
			|||||||
    padding: 10px;
 | 
					    padding: 10px;
 | 
				
			||||||
    grid-gap: 20px;
 | 
					    grid-gap: 20px;
 | 
				
			||||||
    height: 100vh;
 | 
					    height: 100vh;
 | 
				
			||||||
    border: 1px solid blue;
 | 
					 | 
				
			||||||
    align-items: stretch;
 | 
					    align-items: stretch;
 | 
				
			||||||
  }
 | 
					  }
 | 
				
			||||||
 | 
					
 | 
				
			||||||
@ -333,13 +331,19 @@
 | 
				
			|||||||
      grid-template-areas:
 | 
					      grid-template-areas:
 | 
				
			||||||
        "hdr hdr hdr"
 | 
					        "hdr hdr hdr"
 | 
				
			||||||
        "cmd cmd cmd"
 | 
					        "cmd cmd cmd"
 | 
				
			||||||
        "inp inp inp"
 | 
					 | 
				
			||||||
        "out out out"
 | 
					 | 
				
			||||||
        "prv prv prv"
 | 
					        "prv prv prv"
 | 
				
			||||||
        "log log log"
 | 
					        "log log log"
 | 
				
			||||||
        "flt flt flt";
 | 
					        "flt flt flt"
 | 
				
			||||||
      grid-gap: 0px;
 | 
					        "gra gra gra"
 | 
				
			||||||
      padding: 0px;
 | 
					        "edt edt edt";
 | 
				
			||||||
 | 
					      grid-gap: 5px;
 | 
				
			||||||
 | 
					      padding: 10px;
 | 
				
			||||||
 | 
					      height: auto;
 | 
				
			||||||
 | 
					      grid-template-columns: repeat(3, 1fr);
 | 
				
			||||||
 | 
					      grid-template-rows: auto;
 | 
				
			||||||
 | 
					    }
 | 
				
			||||||
 | 
					    .graph {
 | 
				
			||||||
 | 
					      height: 50vh;
 | 
				
			||||||
    }
 | 
					    }
 | 
				
			||||||
    .command {
 | 
					    .command {
 | 
				
			||||||
      margin: 0;
 | 
					      margin: 0;
 | 
				
			||||||
@ -349,7 +353,7 @@
 | 
				
			|||||||
      box-shadow: none;
 | 
					      box-shadow: none;
 | 
				
			||||||
      margin-bottom: 10px;
 | 
					      margin-bottom: 10px;
 | 
				
			||||||
      padding: 10px;
 | 
					      padding: 10px;
 | 
				
			||||||
      box-shadow: 2px 2px 0px #000;
 | 
					      box-shadow: 2px 2px 0px var(--b2);
 | 
				
			||||||
    }
 | 
					    }
 | 
				
			||||||
    .filter-picker {
 | 
					    .filter-picker {
 | 
				
			||||||
      width: 100%;
 | 
					      width: 100%;
 | 
				
			||||||
 | 
				
			|||||||
		Reference in New Issue
	
	Block a user