mirror of
https://github.com/ayabusa/Rusty-slicer.git
synced 2025-06-14 02:14:10 +00:00
changed main page layout and fixed some bugs
This commit is contained in:
@ -9,7 +9,7 @@
|
||||
|
||||
<body>
|
||||
<div class="about_main">
|
||||
<h1> Rusty Slicer V0.0.1 </h1>
|
||||
<h1> Rusty Slicer V1.0.0 </h1>
|
||||
<h2 class="credit"> Credit </h2>
|
||||
<p class="credit">
|
||||
<b>
|
||||
|
12
src/done.html
Normal file
12
src/done.html
Normal file
@ -0,0 +1,12 @@
|
||||
<!doctype html>
|
||||
<html lang="en">
|
||||
<head>
|
||||
<meta charset="UTF-8" />
|
||||
<link rel="stylesheet" href="styles.css" />
|
||||
<meta name="viewport" content="width=device-width, initial-scale=1.0" />
|
||||
<title>Rusty Slicer</title>
|
||||
</head>
|
||||
|
||||
<body>
|
||||
<p class="credit" id="progress_label"> Finished slicing :D </p>
|
||||
</body>
|
@ -16,47 +16,52 @@
|
||||
<div class="main-container">
|
||||
<div>
|
||||
<h3>Welcome to the Rusty slicer! <img src="assets/cat-vibe-vibe-cat.gif"></h1>
|
||||
<div class="select-file">
|
||||
<div>
|
||||
<h4><b> Input file </b></h4>
|
||||
<p id="fileLocation"> no location choosen </p>
|
||||
</div>
|
||||
<button id="fileButton">choose file 📂</button>
|
||||
</div>
|
||||
|
||||
<div>
|
||||
<h4><b> Chapter list (timecode - song name) </b></h4>
|
||||
<textarea id="chapterList" rows="30" cols="10000" placeholder="0:00 - my first song
|
||||
<div class="action-container">
|
||||
<div>
|
||||
<h4><b> Chapter list (timecode - song name) </b></h4>
|
||||
<textarea id="chapterList" rows="30" cols="10000" placeholder="0:00 - my first song
|
||||
3:30 - another one
|
||||
13:37 - one more time - Daft punk"></textarea>
|
||||
<p id="errorLabel" style="color: red;"></p>
|
||||
</div>
|
||||
|
||||
<div class="select-file">
|
||||
<div>
|
||||
<p><b> Output folder </b> </p>
|
||||
<p id="folderLocation"> no location choosen </p>
|
||||
<p id="errorLabel" style="color: red;"></p>
|
||||
</div>
|
||||
<button id="folderButton">choose folder 📂</button>
|
||||
</div>
|
||||
|
||||
<div class="select-file">
|
||||
<p><b> output type </b></p>
|
||||
<select id="fileFormatSelect">
|
||||
<option value="mp3">mp3 (recommended)</option>
|
||||
<option value="ogg">ogg</option>
|
||||
<option value="flac">flac (really long)</option>
|
||||
<option value="m4a">m4a</option>
|
||||
</select>
|
||||
</div>
|
||||
<div>
|
||||
<div class="select-file">
|
||||
<div>
|
||||
<h4><b> Input file </b></h4>
|
||||
<p id="fileLocation"> no location choosen </p>
|
||||
</div>
|
||||
<button id="fileButton">choose file 📂</button>
|
||||
</div>
|
||||
|
||||
<button class="slice-button" id="sliceButton"> Slice 🔪</button>
|
||||
<div class="select-file">
|
||||
<div>
|
||||
<p><b> Output folder </b> </p>
|
||||
<p id="folderLocation"> no location choosen </p>
|
||||
</div>
|
||||
<button id="folderButton">choose folder 📂</button>
|
||||
</div>
|
||||
|
||||
<div class="select-file">
|
||||
<p><b> output type </b></p>
|
||||
<select id="fileFormatSelect">
|
||||
<option value="mp3">mp3 (recommended)</option>
|
||||
<option value="ogg">ogg</option>
|
||||
<option value="flac">flac (really long)</option>
|
||||
<option value="m4a">m4a</option>
|
||||
</select>
|
||||
</div>
|
||||
<br> <br>
|
||||
<button class="slice-button" id="sliceButton"> Slice 🔪</button>
|
||||
</div>
|
||||
</div>
|
||||
</div>
|
||||
|
||||
<footer>
|
||||
<br>
|
||||
<div class="select-file">
|
||||
<div>
|
||||
<div class="credit_main">
|
||||
made by <a target="_blank" href="https://www.ayabusa.dev">
|
||||
ayabusa
|
||||
</a> ;D
|
||||
|
@ -17,7 +17,8 @@
|
||||
}
|
||||
|
||||
textarea {
|
||||
width: 100%;
|
||||
width: 95%;
|
||||
flex: 1;
|
||||
}
|
||||
|
||||
img{
|
||||
@ -42,6 +43,13 @@ img{
|
||||
height: 97vh;
|
||||
}
|
||||
|
||||
.action-container{
|
||||
display: grid;
|
||||
grid-auto-flow: column;
|
||||
grid-auto-columns: 1fr;
|
||||
|
||||
}
|
||||
|
||||
::-moz-selection { /* Code for Firefox */
|
||||
color: #ffffff;
|
||||
background: #d88939;
|
||||
@ -56,6 +64,10 @@ a {
|
||||
color: #d88939;
|
||||
}
|
||||
|
||||
.credit_main {
|
||||
margin-left: auto;
|
||||
margin-right: auto;
|
||||
}
|
||||
.credit {
|
||||
text-align: center;
|
||||
}
|
||||
@ -107,6 +119,7 @@ button {
|
||||
border-color: #292829;
|
||||
color: #292829;
|
||||
background-color: #d88939;
|
||||
float: right;
|
||||
}
|
||||
|
||||
.slice-button:hover{
|
||||
|
Reference in New Issue
Block a user