basta basta chiudi

db
km0 2 years ago
parent ed08dee35c
commit 44702f846f

@ -1,13 +1,24 @@
h2,
h3 {
font-weight: normal;
font-size: 32px;
margin: 0;
}
.instrument {
max-height: 100vh;
max-width: 100vw;
width: 100%;
object-fit: contain;
margin: 0 auto;
margin-top: 32px;
display: block;
position: relative;
}
.new-snippet {
display: flex;
}
.snippets {
width: 100%;
padding: 0;
@ -80,16 +91,21 @@ main {
line-height: 1.2;
}
.meta {
display: inline-block;
.meta > * {
border: 1px solid currentColor;
padding: 16px;
margin: 32px 0;
max-width: 40ch;
}
.meta h2 {
margin: 0;
}
.meta > * + * {
margin-top: 16px;
}
.meta .date {
margin-top: 8px;
margin-top: 16px;
opacity: 0.5;
}
@ -102,3 +118,15 @@ main {
background-color: rgba(200, 200, 200, 0.5);
max-width: 60ch;
}
.grid {
display: grid;
grid-template-columns: 1fr 1fr 1fr;
gap: 16px;
align-items: flex-start;
}
.grid .instrument {
grid-column: 2 / span 2;
border: 1px solid currentColor;
}

@ -45,7 +45,24 @@
<main>
<div>
<div class="grid">
<div class="meta">
<div class="title">
<h2>{{patch['name']}}</h2>
</div>
<div class="description">
{{patch['description']}}
<div class="date">
{{ patch['created']}}
</div>
</div>
</div>
<div class="instrument">
<div id="panel-container">{{panel|safe}}</div>
@ -57,25 +74,22 @@
{% endif %}
</div>
<div class="meta">
<div class="description">
{{patch['description']}}
</div>
<div class="date">
{{ patch['created']}}
</div>
</div>
<div class="new-snippet">
<h3>Snippets</h3>
<span>Add new <button>+</button></span>
<form method="POST" enctype="multipart/form-data">
<input type="text" class="description" name="description" />
<input type="file" name="snippet" accept="audio/*" />
<input type="submit" value="Upload" />
</form>
<form method="POST" enctype="multipart/form-data">
<input type="text" class="description" name="description" />
<input type="file" name="snippet" accept="audio/*" />
<input type="submit" value="Upload" />
</form>
</div>
<ul class="snippets">
{% for snippet in snippets %}
@ -100,24 +114,10 @@
/>
</svg>
</a>
<!-- <button class="play">
<svg
width="24"
height="27"
viewBox="0 0 24 27"
fill="none"
xmlns="http://www.w3.org/2000/svg"
>
<path
d="M24 13.5L0.749999 26.9234L0.75 0.0766048L24 13.5Z"
fill="currentColor"
/>
</svg>
</button> -->
</li>
{% endfor %}
</ul>
</div>
<pre class="patch-text">
{{patch['name']}}

Loading…
Cancel
Save