sundog
/
ffmpeg-explorer
1
0
Fork 0
Code Issues Pull Requests Packages Projects Releases Wiki Activity

mobile

This commit is contained in:
Sam Lavigne 2023-08-25 14:10:55 -04:00
parent f32b46a7c5
commit f044175986
1 changed files with 19 additions and 15 deletions
Show Stats Download Patch File Download Diff File Expand all files Collapse all files

34
src/App.svelte
View File

@ -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%;