104 lines
3.3 KiB
Plaintext
104 lines
3.3 KiB
Plaintext
<!--
|
|
|
|
This Source Code Form is subject to the terms of the GNU General Public License:
|
|
|
|
Copyright (C) 2021-2025 Poke (https://codeberg.org/ashley/poke)
|
|
|
|
This program is free software: you can redistribute it and/or modify
|
|
it under the terms of the GNU General Public License as published by
|
|
the Free Software Foundation, either version 3 of the License, or
|
|
(at your option) any later version.
|
|
|
|
This program is distributed in the hope that it will be useful,
|
|
but WITHOUT ANY WARRANTY; without even the implied warranty of
|
|
MERCHANTABILITY or FITNESS FOR A PARTICULAR PURPOSE. See the
|
|
GNU General Public License for more details.
|
|
|
|
You should have received a copy of the GNU General Public License
|
|
along with this program. If not, see https://www.gnu.org/licenses/.
|
|
--->
|
|
<!DOCTYPE html>
|
|
<html lang="en">
|
|
<head>
|
|
<meta charset="utf-8">
|
|
<meta name="viewport" content="width=device-width,initial-scale=1">
|
|
<title>Poke Studio</title>
|
|
<meta name="theme-color" content="#111">
|
|
<style>
|
|
:root{
|
|
--bg:#0d0f12;--fg:#f3f5f7;--muted:#9aa4b2;
|
|
--brand:#7a5cff;--accent:#00d3a7;
|
|
--card:#141820;--radius:14px;
|
|
}
|
|
body{
|
|
margin:0;padding:0;
|
|
font-family:system-ui, sans-serif;
|
|
background:linear-gradient(180deg,var(--bg),#11151b);
|
|
color:var(--fg);display:flex;flex-direction:column;align-items:center;gap:20px;
|
|
}
|
|
header{
|
|
display:flex;align-items:center;gap:10px;margin-top:20px;
|
|
}
|
|
.logo{
|
|
width:32px;height:32px;border-radius:10px;
|
|
background:conic-gradient(from 220deg,var(--brand),var(--accent),var(--brand));
|
|
}
|
|
h1{font-size:1.4rem;margin:0}
|
|
.grid{
|
|
display:grid;gap:16px;grid-template-columns:repeat(auto-fit,minmax(260px,1fr));
|
|
width:90%;max-width:900px;
|
|
}
|
|
.card{
|
|
background:var(--card);border-radius:var(--radius);
|
|
border:1px solid #1a2030;padding:16px;box-shadow:0 4px 12px rgba(0,0,0,.3);
|
|
display:flex;align-items:center;gap:14px;
|
|
}
|
|
.card svg{width:48px;height:48px}
|
|
.card h3{margin:0;font-size:1.2rem}
|
|
.card p{margin:4px 0 0;color:var(--muted)}
|
|
.card a button{
|
|
margin-top:8px;padding:6px 10px;border:none;border-radius:8px;
|
|
font-weight:bold;cursor:pointer;background:var(--brand);color:white;
|
|
}
|
|
footer{margin:20px 0;color:var(--muted);font-size:.9rem}
|
|
</style>
|
|
</head>
|
|
<body>
|
|
<header>
|
|
<img src="/css/logo-poke.svg?v=5" style="width: 7em;">
|
|
</header>
|
|
|
|
<section class="grid">
|
|
<div class="card">
|
|
<svg viewBox="0 0 24 24" fill="none">
|
|
<rect x="3" y="5" width="18" height="14" rx="3" stroke="#7a5cff"/>
|
|
<rect x="5" y="7" width="3" height="10" fill="#7a5cff"/>
|
|
<rect x="9" y="7" width="3" height="10" fill="#00d3a7"/>
|
|
<rect x="13" y="7" width="3" height="10" fill="#7a5cff"/>
|
|
<rect x="17" y="7" width="2" height="10" fill="#00d3a7"/>
|
|
</svg>
|
|
<div>
|
|
<h3>Poke Piano</h3>
|
|
<p>Synth piano</p>
|
|
<a href="/studio/piano"><button>Open</button></a>
|
|
</div>
|
|
</div>
|
|
|
|
<div class="card">
|
|
<svg viewBox="0 0 24 24" fill="none">
|
|
<ellipse cx="12" cy="7" rx="8" ry="3" stroke="#00d3a7"/>
|
|
<path d="M4 7v7c0 1.7 3.6 3 8 3s8-1.3 8-3V7" stroke="#7a5cff"/>
|
|
<path d="M4 10c0 1.7 3.6 3 8 3s8-1.3 8-3" stroke="#00d3a7"/>
|
|
</svg>
|
|
<div>
|
|
<h3>Poke Drums</h3>
|
|
<p>8-voice drum synth</p>
|
|
<a href="/studio/drums"><button>Open</button></a>
|
|
</div>
|
|
</div>
|
|
</section>
|
|
|
|
<footer>Poke Studio — all local, private & free</footer>
|
|
</body>
|
|
</html>
|