Using Jekyll, bg, songs, artists
This commit is contained in:
parent
a4e2f23b8a
commit
023eb802f6
12 changed files with 154 additions and 141 deletions
64
404.html
64
404.html
|
|
@ -1,60 +1,4 @@
|
||||||
<!doctype html>
|
---
|
||||||
<html lang="en">
|
---
|
||||||
<head>
|
<h1 style="text-align: center">Page Not Found</h1>
|
||||||
<meta charset="utf-8">
|
<p style="text-align: center">Sorry, but the page you were trying to view does not exist.</p>
|
||||||
<title>Page Not Found</title>
|
|
||||||
<meta name="viewport" content="width=device-width, initial-scale=1">
|
|
||||||
<style>
|
|
||||||
|
|
||||||
* {
|
|
||||||
line-height: 1.2;
|
|
||||||
margin: 0;
|
|
||||||
}
|
|
||||||
|
|
||||||
html {
|
|
||||||
color: #888;
|
|
||||||
display: table;
|
|
||||||
font-family: sans-serif;
|
|
||||||
height: 100%;
|
|
||||||
text-align: center;
|
|
||||||
width: 100%;
|
|
||||||
}
|
|
||||||
|
|
||||||
body {
|
|
||||||
display: table-cell;
|
|
||||||
vertical-align: middle;
|
|
||||||
margin: 2em auto;
|
|
||||||
}
|
|
||||||
|
|
||||||
h1 {
|
|
||||||
color: #555;
|
|
||||||
font-size: 2em;
|
|
||||||
font-weight: 400;
|
|
||||||
}
|
|
||||||
|
|
||||||
p {
|
|
||||||
margin: 0 auto;
|
|
||||||
width: 280px;
|
|
||||||
}
|
|
||||||
|
|
||||||
@media only screen and (max-width: 280px) {
|
|
||||||
|
|
||||||
body, p {
|
|
||||||
width: 95%;
|
|
||||||
}
|
|
||||||
|
|
||||||
h1 {
|
|
||||||
font-size: 1.5em;
|
|
||||||
margin: 0 0 0.3em;
|
|
||||||
}
|
|
||||||
|
|
||||||
}
|
|
||||||
|
|
||||||
</style>
|
|
||||||
</head>
|
|
||||||
<body>
|
|
||||||
<h1>Page Not Found</h1>
|
|
||||||
<p>Sorry, but the page you were trying to view does not exist.</p>
|
|
||||||
</body>
|
|
||||||
</html>
|
|
||||||
<!-- IE needs 512+ bytes: https://blogs.msdn.microsoft.com/ieinternals/2010/08/18/friendly-http-error-pages/ -->
|
|
||||||
|
|
|
||||||
5
_artists/Artist1.md
Normal file
5
_artists/Artist1.md
Normal file
|
|
@ -0,0 +1,5 @@
|
||||||
|
---
|
||||||
|
name: Artist1
|
||||||
|
position: Singer
|
||||||
|
---
|
||||||
|
Test artist
|
||||||
6
_artists/test.md
Normal file
6
_artists/test.md
Normal file
|
|
@ -0,0 +1,6 @@
|
||||||
|
---
|
||||||
|
short_name: test
|
||||||
|
name: Test
|
||||||
|
position: Producer
|
||||||
|
---
|
||||||
|
Test artist
|
||||||
14
_config.yml
Normal file
14
_config.yml
Normal file
|
|
@ -0,0 +1,14 @@
|
||||||
|
collections:
|
||||||
|
artists:
|
||||||
|
output: true
|
||||||
|
|
||||||
|
defaults:
|
||||||
|
- scope:
|
||||||
|
path: ""
|
||||||
|
type: "artists"
|
||||||
|
values:
|
||||||
|
layout: "artist"
|
||||||
|
- scope:
|
||||||
|
path: ""
|
||||||
|
values:
|
||||||
|
layout: "default"
|
||||||
12
_data/songs.json
Normal file
12
_data/songs.json
Normal file
|
|
@ -0,0 +1,12 @@
|
||||||
|
[
|
||||||
|
{
|
||||||
|
"artist": "Artist1",
|
||||||
|
"title": "Title1",
|
||||||
|
"url": "https://spotify.com/"
|
||||||
|
},
|
||||||
|
{
|
||||||
|
"artist": "Artist2",
|
||||||
|
"title": "Title2",
|
||||||
|
"url": "https://spotify.com/"
|
||||||
|
}
|
||||||
|
]
|
||||||
16
_layouts/artist.html
Normal file
16
_layouts/artist.html
Normal file
|
|
@ -0,0 +1,16 @@
|
||||||
|
---
|
||||||
|
layout: default
|
||||||
|
title: page.name
|
||||||
|
---
|
||||||
|
<h1>{{ page.name }}</h1>
|
||||||
|
<h2>{{ page.position }}</h2>
|
||||||
|
|
||||||
|
{{ content }}
|
||||||
|
|
||||||
|
<h2>Songs</h2>
|
||||||
|
<ul>
|
||||||
|
{% assign filtered_songs = site.data.songs | where: 'artist', page.name %}
|
||||||
|
{% for song in filtered_songs %}
|
||||||
|
<li><a href="{{ song.url }}">{{ song.artist }} - {{ song.title }}</a></li>
|
||||||
|
{% endfor %}
|
||||||
|
</ul>
|
||||||
27
_layouts/default.html
Normal file
27
_layouts/default.html
Normal file
|
|
@ -0,0 +1,27 @@
|
||||||
|
<!doctype html>
|
||||||
|
<html class="no-js" lang="">
|
||||||
|
|
||||||
|
<head>
|
||||||
|
<meta charset="utf-8">
|
||||||
|
<title>{{ page.title }} - HS Fanpage</title>
|
||||||
|
<meta name="description" content="">
|
||||||
|
<meta name="viewport" content="width=device-width, initial-scale=1">
|
||||||
|
|
||||||
|
<link rel="apple-touch-icon" href="icon.png">
|
||||||
|
<!-- Place favicon.ico in the root directory -->
|
||||||
|
|
||||||
|
<link rel="stylesheet" href="../css/main.css">
|
||||||
|
|
||||||
|
<meta name="theme-color" content="#fafafa">
|
||||||
|
</head>
|
||||||
|
|
||||||
|
<body>
|
||||||
|
<div class="bg-image"></div>
|
||||||
|
<!--[if IE]>
|
||||||
|
<p class="browserupgrade">You are using an <strong>outdated</strong> browser. Please <a href="https://browsehappy.com/">upgrade your browser</a> to improve your experience and security.</p>
|
||||||
|
<![endif]-->
|
||||||
|
|
||||||
|
{{ content }}
|
||||||
|
</body>
|
||||||
|
|
||||||
|
</html>
|
||||||
14
artists.html
Normal file
14
artists.html
Normal file
|
|
@ -0,0 +1,14 @@
|
||||||
|
---
|
||||||
|
title: Artists
|
||||||
|
---
|
||||||
|
<h1>Artists</h1>
|
||||||
|
|
||||||
|
<ul>
|
||||||
|
{% for artist in site.artists %}
|
||||||
|
<li>
|
||||||
|
<h2>{{ artist.name }}</h2>
|
||||||
|
<h3>{{ artist.position }}</h3>
|
||||||
|
<p>{{ artist.content | markdownify }}</p>
|
||||||
|
</li>
|
||||||
|
{% endfor %}
|
||||||
|
</ul>
|
||||||
BIN
bg.png
Normal file
BIN
bg.png
Normal file
Binary file not shown.
|
After Width: | Height: | Size: 1 MiB |
31
css/main.css
31
css/main.css
|
|
@ -1,13 +1,14 @@
|
||||||
body {
|
body {
|
||||||
background-color: #003239;
|
background-color: #003239;
|
||||||
|
color: aqua;
|
||||||
}
|
}
|
||||||
|
|
||||||
.bg-image {
|
.bg-image {
|
||||||
/*background-image: url("../HS.png");*/
|
/*background-image: url("../HS.png");*/
|
||||||
background-image: url("../bg.png"), linear-gradient(to bottom, black, black, #3a3a3a, #009a9a,
|
background-image: url("../bg.png"), linear-gradient(to bottom, #1d1d1d, #1d1d1d, #243537, #009a9a);
|
||||||
#727272);
|
/*#727272);*/
|
||||||
background-size: cover;
|
background-size: cover;
|
||||||
filter: blur(8px);
|
filter: blur(16px);
|
||||||
height: 100%;
|
height: 100%;
|
||||||
position: absolute;
|
position: absolute;
|
||||||
top: 0;
|
top: 0;
|
||||||
|
|
@ -17,3 +18,27 @@ body {
|
||||||
margin: 0;
|
margin: 0;
|
||||||
padding: 0;
|
padding: 0;
|
||||||
}
|
}
|
||||||
|
|
||||||
|
|
||||||
|
#popularSongs, #hiddenSongs {
|
||||||
|
width: 40%;
|
||||||
|
margin: 4%;
|
||||||
|
border: 1px #78ffee solid;
|
||||||
|
}
|
||||||
|
|
||||||
|
#popularSongs h2, #hiddenSongs h2 {
|
||||||
|
text-align: center;
|
||||||
|
color: aqua;
|
||||||
|
}
|
||||||
|
|
||||||
|
#popularSongs {
|
||||||
|
float: left;
|
||||||
|
}
|
||||||
|
|
||||||
|
#hiddenSongs {
|
||||||
|
float: right;
|
||||||
|
}
|
||||||
|
|
||||||
|
h1 {
|
||||||
|
text-align: center;
|
||||||
|
}
|
||||||
|
|
|
||||||
BIN
icon.png
Normal file
BIN
icon.png
Normal file
Binary file not shown.
|
After Width: | Height: | Size: 9.4 KiB |
104
index.html
104
index.html
|
|
@ -1,83 +1,33 @@
|
||||||
<!doctype html>
|
---
|
||||||
<html class="no-js" lang="">
|
layout: default
|
||||||
|
title: Hidden Sounds
|
||||||
<head>
|
---
|
||||||
<meta charset="utf-8">
|
<h1>Hidden Sounds Unofficial (Fan) Website</h1>
|
||||||
<title></title>
|
<div id="popularSongs">
|
||||||
<meta name="description" content="">
|
|
||||||
<meta name="viewport" content="width=device-width, initial-scale=1">
|
|
||||||
|
|
||||||
<link rel="manifest" href="src/site.webmanifest">
|
|
||||||
<link rel="apple-touch-icon" href="src/icon.png">
|
|
||||||
<!-- Place favicon.ico in the root directory -->
|
|
||||||
|
|
||||||
<link rel="stylesheet" href="css/main.css">
|
|
||||||
|
|
||||||
<meta name="theme-color" content="#fafafa">
|
|
||||||
|
|
||||||
<style>
|
|
||||||
#popularSongs, #hiddenSongs {
|
|
||||||
width: 40%;
|
|
||||||
margin: 4%;
|
|
||||||
border: 1px #78ffee solid;
|
|
||||||
}
|
|
||||||
|
|
||||||
#popularSongs h2, #hiddenSongs h2 {
|
|
||||||
text-align: center;
|
|
||||||
color: aqua;
|
|
||||||
}
|
|
||||||
|
|
||||||
#popularSongs {
|
|
||||||
float: left;
|
|
||||||
}
|
|
||||||
|
|
||||||
#hiddenSongs {
|
|
||||||
float: right;
|
|
||||||
}
|
|
||||||
|
|
||||||
h1 {
|
|
||||||
text-align: center;
|
|
||||||
color: aqua;
|
|
||||||
}
|
|
||||||
</style>
|
|
||||||
</head>
|
|
||||||
|
|
||||||
<body>
|
|
||||||
<div class="bg-image"></div>
|
|
||||||
<!--[if IE]>
|
|
||||||
<p class="browserupgrade">You are using an <strong>outdated</strong> browser. Please <a href="https://browsehappy.com/">upgrade your browser</a> to improve your experience and security.</p>
|
|
||||||
<![endif]-->
|
|
||||||
|
|
||||||
<!-- Add your site or application content here -->
|
|
||||||
<h1>Hidden Sounds Unofficial (Fan) Website</h1>
|
|
||||||
<div id="popularSongs">
|
|
||||||
<h2>Popular Songs</h2>
|
<h2>Popular Songs</h2>
|
||||||
<div id="popularContainer">
|
<div id="popularContainer">
|
||||||
|
{% for song in site.data.songs %}
|
||||||
|
<div class="song">
|
||||||
|
<p>
|
||||||
|
{% assign artist = site.artists | where: 'name', song.artist | first %}
|
||||||
|
{% if artist %}
|
||||||
|
<a href="{{ artist.url }}">{{ artist.name }}</a>
|
||||||
|
{% else %}
|
||||||
|
{{ song.artist }}
|
||||||
|
{% endif %}
|
||||||
|
- <a href="https://spotify.com/">{{ song.title }}</a>
|
||||||
|
</p>
|
||||||
|
</div>
|
||||||
|
{% endfor %}
|
||||||
|
</div>
|
||||||
|
</div>
|
||||||
|
<div id="hiddenSongs">
|
||||||
|
<h2>Hidden Songs</h2>
|
||||||
|
<div id="hiddenContainer">
|
||||||
|
{% for song in site.data.songs %}
|
||||||
<div class="song">
|
<div class="song">
|
||||||
<p><a href="https://spotify.com/">Artist - Title</a></p>
|
<p><a href="https://spotify.com/">Artist - Title</a></p>
|
||||||
</div>
|
</div>
|
||||||
|
{% endfor %}
|
||||||
</div>
|
</div>
|
||||||
</div>
|
</div>
|
||||||
<div id="hiddenSongs">
|
|
||||||
<h2>Hidden Songs</h2>
|
|
||||||
<div id="hiddenContainer">
|
|
||||||
|
|
||||||
</div>
|
|
||||||
</div>
|
|
||||||
<!--
|
|
||||||
<script src="js/vendor/modernizr-{{MODERNIZR_VERSION}}.min.js"></script>
|
|
||||||
<script src="https://code.jquery.com/jquery-{{JQUERY_VERSION}}.min.js" integrity="{{JQUERY_SRI_HASH}}" crossorigin="anonymous"></script>
|
|
||||||
<script>window.jQuery || document.write('<script src="js/vendor/jquery-{{JQUERY_VERSION}}.min.js"><\/script>')</script>
|
|
||||||
<script src="js/plugins.js"></script>
|
|
||||||
<script src="js/main.js"></script>
|
|
||||||
-->
|
|
||||||
|
|
||||||
<!-- Google Analytics: change UA-XXXXX-Y to be your site's ID. -->
|
|
||||||
<script>
|
|
||||||
window.ga = function () { ga.q.push(arguments) }; ga.q = []; ga.l = +new Date;
|
|
||||||
ga('create', 'UA-XXXXX-Y', 'auto'); ga('set','transport','beacon'); ga('send', 'pageview')
|
|
||||||
</script>
|
|
||||||
<script src="https://www.google-analytics.com/analytics.js" async defer></script>
|
|
||||||
</body>
|
|
||||||
|
|
||||||
</html>
|
|
||||||
Loading…
Reference in a new issue