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