Initial Preview release
Signed-off-by: mctaylors <cantsendmails@mctaylors.ru>
This commit is contained in:
commit
d11b1d633f
GPG key ID:
68BA5E8A5D6D8744
9 changed files with 152 additions and 0 deletions
2
.gitignore
vendored
Normal file
2
.gitignore
vendored
Normal file
|
|
@ -0,0 +1,2 @@
|
||||||
|
/*/
|
||||||
|
!/assets
|
||||||
55
assets/common.css
Normal file
55
assets/common.css
Normal file
|
|
@ -0,0 +1,55 @@
|
||||||
|
@import url(fonts.css);
|
||||||
|
|
||||||
|
:root {
|
||||||
|
--background-color: black;
|
||||||
|
--selection-color: #111;
|
||||||
|
--font-color: #eee;
|
||||||
|
color: var(--font-color);
|
||||||
|
background-color: var(--background-color);
|
||||||
|
font-family: "Inter Tight", sans-serif;
|
||||||
|
}
|
||||||
|
|
||||||
|
body {
|
||||||
|
justify-content: center;
|
||||||
|
margin-bottom: 48px;
|
||||||
|
}
|
||||||
|
|
||||||
|
.card {
|
||||||
|
background-color: var(--background-color);
|
||||||
|
margin: 4px;
|
||||||
|
border: 1px solid #444;
|
||||||
|
border-radius: 16px;
|
||||||
|
transition: 200ms;
|
||||||
|
}
|
||||||
|
|
||||||
|
.card:hover {
|
||||||
|
background-color: var(--selection-color);
|
||||||
|
cursor: pointer;
|
||||||
|
}
|
||||||
|
|
||||||
|
.content {
|
||||||
|
margin: 8px;
|
||||||
|
}
|
||||||
|
|
||||||
|
a {
|
||||||
|
color: var(--font-color);
|
||||||
|
}
|
||||||
|
|
||||||
|
a.card {
|
||||||
|
text-decoration: none;
|
||||||
|
}
|
||||||
|
|
||||||
|
.footer > a {
|
||||||
|
font-weight: bold;
|
||||||
|
}
|
||||||
|
|
||||||
|
.footer {
|
||||||
|
position: fixed;
|
||||||
|
left: 0;
|
||||||
|
bottom: 0;
|
||||||
|
width: 100%;
|
||||||
|
padding: 14px 0;
|
||||||
|
text-align: center;
|
||||||
|
background-color: #000a;
|
||||||
|
backdrop-filter: blur(8px);
|
||||||
|
}
|
||||||
11
assets/fonts.css
Normal file
11
assets/fonts.css
Normal file
|
|
@ -0,0 +1,11 @@
|
||||||
|
@font-face {
|
||||||
|
font-family: 'Inter Tight';
|
||||||
|
font-style: normal;
|
||||||
|
src: url(fonts/InterTight-VariableFont_wght.woff2);
|
||||||
|
}
|
||||||
|
|
||||||
|
@font-face {
|
||||||
|
font-family: 'Inter Tight';
|
||||||
|
font-style: italic;
|
||||||
|
src: url(fonts/InterTight-Italic-VariableFont_wght.woff2);
|
||||||
|
}
|
||||||
BIN
assets/fonts/InterTight-Italic-VariableFont_wght.woff2
Normal file
BIN
assets/fonts/InterTight-Italic-VariableFont_wght.woff2
Normal file
Binary file not shown.
BIN
assets/fonts/InterTight-VariableFont_wght.woff2
Normal file
BIN
assets/fonts/InterTight-VariableFont_wght.woff2
Normal file
Binary file not shown.
24
assets/index.css
Normal file
24
assets/index.css
Normal file
|
|
@ -0,0 +1,24 @@
|
||||||
|
body {
|
||||||
|
display: grid;
|
||||||
|
}
|
||||||
|
|
||||||
|
.card {
|
||||||
|
display: flex;
|
||||||
|
width: 600px;
|
||||||
|
max-width: 95vw;
|
||||||
|
}
|
||||||
|
|
||||||
|
.card > img {
|
||||||
|
margin: 4px;
|
||||||
|
width: 48px;
|
||||||
|
height: 48px;
|
||||||
|
border-radius: 12px;
|
||||||
|
}
|
||||||
|
|
||||||
|
.content > .title {
|
||||||
|
font-weight: bold;
|
||||||
|
}
|
||||||
|
|
||||||
|
.content > .duration {
|
||||||
|
color: #aaa;
|
||||||
|
}
|
||||||
16
assets/root.css
Normal file
16
assets/root.css
Normal file
|
|
@ -0,0 +1,16 @@
|
||||||
|
body {
|
||||||
|
display: flex;
|
||||||
|
flex-wrap: wrap;
|
||||||
|
}
|
||||||
|
|
||||||
|
.card > img {
|
||||||
|
margin: 8px 8px 0 8px;
|
||||||
|
width: 192px;
|
||||||
|
height: 192px;
|
||||||
|
border-radius: 8px;
|
||||||
|
}
|
||||||
|
|
||||||
|
.content {
|
||||||
|
text-align: center;
|
||||||
|
font-weight: bold;
|
||||||
|
}
|
||||||
24
index.php
Normal file
24
index.php
Normal file
|
|
@ -0,0 +1,24 @@
|
||||||
|
<!DOCTYPE html>
|
||||||
|
<html lang="">
|
||||||
|
<head>
|
||||||
|
<link rel="stylesheet" href="/assets/common.css" />
|
||||||
|
<link rel="stylesheet" href="/assets/index.css" />
|
||||||
|
<title>SplatunesNetwork Preview</title>
|
||||||
|
<meta name="viewport" content="initial-scale=0.75 user-scalable=no" />
|
||||||
|
</head>
|
||||||
|
<body>
|
||||||
|
<?php
|
||||||
|
$request_uri = $_SERVER['REQUEST_URI'];
|
||||||
|
$filtered_request = urldecode(strtok(substr($request_uri, 1), '?'));
|
||||||
|
foreach(glob($filtered_request . '*.mp3') as $file) {
|
||||||
|
echo '<a class="card" href="/' . $file . '">
|
||||||
|
<img src="artwork.jpg" alt="" />
|
||||||
|
<div class="content">
|
||||||
|
<span class="title">' . $file . '</span>
|
||||||
|
</div>
|
||||||
|
</a>';
|
||||||
|
}
|
||||||
|
?>
|
||||||
|
<div class="footer"><a href="https://git.mctaylors.ru/mctaylors/SplatunesNetwork">SplatunesNetwork</a> Preview, exists because it wants to. ©</div>
|
||||||
|
</body>
|
||||||
|
</html>
|
||||||
20
root.php
Normal file
20
root.php
Normal file
|
|
@ -0,0 +1,20 @@
|
||||||
|
<!DOCTYPE html>
|
||||||
|
<html lang="">
|
||||||
|
<head>
|
||||||
|
<link rel="stylesheet" href="/assets/common.css" />
|
||||||
|
<link rel="stylesheet" href="/assets/root.css" />
|
||||||
|
<title>SplatunesNetwork Preview</title>
|
||||||
|
<meta name="viewport" content="initial-scale=0.75 user-scalable=no" />
|
||||||
|
</head>
|
||||||
|
<body>
|
||||||
|
<?php
|
||||||
|
foreach(glob('[!assets]*', GLOB_ONLYDIR) as $dir) {
|
||||||
|
echo '<a class="card" href="'. $dir .'">
|
||||||
|
<img src="/'. $dir .'/artwork.jpg" alt="" />
|
||||||
|
<div class="content">'. $dir .'</div>
|
||||||
|
</a>';
|
||||||
|
}
|
||||||
|
?>
|
||||||
|
<div class="footer"><a href="https://git.mctaylors.ru/mctaylors/SplatunesNetwork">SplatunesNetwork</a> Preview, exists because it wants to. ©</div>
|
||||||
|
</body>
|
||||||
|
</html>
|
||||||
Loading…
Reference in a new issue