Begin building views
This commit is contained in:
parent
8a5666c4e9
commit
f1f1072a18
12 changed files with 69 additions and 28 deletions
|
|
@ -3,8 +3,23 @@
|
||||||
* <link rel="stylesheet" href="/styles.css" />
|
* <link rel="stylesheet" href="/styles.css" />
|
||||||
*
|
*
|
||||||
*/
|
*/
|
||||||
|
@import url('https://fonts.googleapis.com/css2?family=Roboto:ital,wght@0,100;0,300;0,400;0,500;0,700;0,900;1,100;1,300;1,400;1,500;1,700;1,900&display=swap');
|
||||||
|
|
||||||
.message {
|
.title {
|
||||||
font-weight: bold;
|
font-family: 'Roboto';
|
||||||
font-size: 3rem;
|
font-size: 3rem;
|
||||||
|
font-weight: 500;
|
||||||
|
margin-left: 20px;
|
||||||
|
margin-right: 40px;
|
||||||
|
margin-top: 20px;
|
||||||
|
}
|
||||||
|
|
||||||
|
.header-link{
|
||||||
|
font-family: 'Roboto';
|
||||||
|
font-size: 1.5rem;
|
||||||
|
margin-right: 20px;
|
||||||
|
}
|
||||||
|
|
||||||
|
#replaceMe{
|
||||||
|
font-family:'Courier New';
|
||||||
}
|
}
|
||||||
|
|
|
||||||
|
|
@ -1,18 +0,0 @@
|
||||||
// Renders the `message` response data value.
|
|
||||||
<h3 class="message text-[#39b54a]">{.message}</h3>
|
|
||||||
|
|
||||||
<div><img class="p-3 mx-auto" src="/jetzig.png" /></div>
|
|
||||||
|
|
||||||
<div>
|
|
||||||
<a href="https://github.com/jetzig-framework/zmpl">
|
|
||||||
<img class="p-3 m-3 mx-auto" src="/zmpl.png" />
|
|
||||||
</a>
|
|
||||||
|
|
||||||
</div>
|
|
||||||
|
|
||||||
<div>Visit <a class="font-bold text-[#39b54a]" href="https://jetzig.dev/">jetzig.dev</a> to get started.
|
|
||||||
<div>Join our Discord server and introduce yourself:</div>
|
|
||||||
<div>
|
|
||||||
<a class="font-bold text-[#39b54a]" href="https://discord.gg/eufqssz7X6">https://discord.gg/eufqssz7X6</a>
|
|
||||||
</div>
|
|
||||||
</div>
|
|
||||||
0
src/app/views/root/_graph.zmpl
Normal file
0
src/app/views/root/_graph.zmpl
Normal file
6
src/app/views/root/_header.zmpl
Normal file
6
src/app/views/root/_header.zmpl
Normal file
|
|
@ -0,0 +1,6 @@
|
||||||
|
<b class="title text-[#123456]">Zuletzt</b>
|
||||||
|
<a class="header-link" href="/artists">Artists</a>
|
||||||
|
<a class="header-link" href="/albums">Albums</a>
|
||||||
|
<a class="header-link" href="/tracks">Tracks</a>
|
||||||
|
<a class="header-link" href="/stats">Stats</a>
|
||||||
|
<hr>
|
||||||
0
src/app/views/root/_history.zmpl
Normal file
0
src/app/views/root/_history.zmpl
Normal file
0
src/app/views/root/_random.zmpl
Normal file
0
src/app/views/root/_random.zmpl
Normal file
0
src/app/views/root/_recent.zmpl
Normal file
0
src/app/views/root/_recent.zmpl
Normal file
31
src/app/views/root/_top.zmpl
Normal file
31
src/app/views/root/_top.zmpl
Normal file
|
|
@ -0,0 +1,31 @@
|
||||||
|
@html {
|
||||||
|
<style>
|
||||||
|
#myHeader { background-color: lightblue; color: black; padding: 40px; text-align: center;}
|
||||||
|
</style>
|
||||||
|
}
|
||||||
|
<div>
|
||||||
|
<fieldset>
|
||||||
|
Top:
|
||||||
|
<input type="radio" label="Artist" name="q" value="artist" hx-get="/stats" hx-target="#update" hx-include="[name='t']" hx-swap="outerHTML" hx-trigger="click" checked>Artist</input>
|
||||||
|
<input type="radio" label="Album" name="q" value="album">Album</input>
|
||||||
|
<input type="radio" label="Track" name="q" value="track">Track</input>
|
||||||
|
</fieldset>
|
||||||
|
|
||||||
|
<fieldset>
|
||||||
|
of:
|
||||||
|
<input type="radio" label="Day" name="t" value="day" checked>Day</input>
|
||||||
|
<input type="radio" label="Week" name="t" value="week">Week</input>
|
||||||
|
<input type="radio" label="Month" name="t" value="month">Month</input>
|
||||||
|
<input type="radio" label="3 Months" name="t" value="quarter">3 Months</input>
|
||||||
|
<input type="radio" label="6 Months" name="t" value="half">6 Months</input>
|
||||||
|
<input type="radio" label="Current Year" name="t" value="begin">Current Year</input>
|
||||||
|
<input type="radio" label="365 Days" name="t" value="year">365 days</input>
|
||||||
|
<input type="radio" label="All Time" name="t" value="all">All Time</input>
|
||||||
|
</fieldset>
|
||||||
|
|
||||||
|
<tr>
|
||||||
|
<td colspan="3">
|
||||||
|
<b id="myHeader">hyello</b>
|
||||||
|
</td>
|
||||||
|
</tr>
|
||||||
|
</div>
|
||||||
|
|
@ -8,13 +8,7 @@
|
||||||
</head>
|
</head>
|
||||||
|
|
||||||
<body>
|
<body>
|
||||||
<div class="text-center pt-10 m-auto">
|
@partial root/header
|
||||||
// If present, renders the `message_param` response data value, add `?message=hello` to the
|
@partial root/top
|
||||||
// URL to see the output:
|
|
||||||
<h2 class="param text-3xl text-[#f7931e]">{.message_param}</h2>
|
|
||||||
|
|
||||||
// Renders `src/app/views/root/_content.zmpl` with the same template data available:
|
|
||||||
<div>{^root/content}</div>
|
|
||||||
</div>
|
|
||||||
</body>
|
</body>
|
||||||
</html>
|
</html>
|
||||||
|
|
|
||||||
3
src/app/views/search/index.zmpl
Normal file
3
src/app/views/search/index.zmpl
Normal file
|
|
@ -0,0 +1,3 @@
|
||||||
|
<div>
|
||||||
|
<span>Content goes here</span>
|
||||||
|
</div>
|
||||||
7
src/app/views/stats.zig
Normal file
7
src/app/views/stats.zig
Normal file
|
|
@ -0,0 +1,7 @@
|
||||||
|
const std = @import("std");
|
||||||
|
const jetzig = @import("jetzig");
|
||||||
|
|
||||||
|
pub fn index(request: *jetzig.Request, data: *jetzig.Data) !jetzig.View {
|
||||||
|
_ = data;
|
||||||
|
return request.render(.ok);
|
||||||
|
}
|
||||||
3
src/app/views/stats/index.zmpl
Normal file
3
src/app/views/stats/index.zmpl
Normal file
|
|
@ -0,0 +1,3 @@
|
||||||
|
<div>
|
||||||
|
<span>Content goes here</span>
|
||||||
|
</div>
|
||||||
Loading…
Add table
Add a link
Reference in a new issue