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>
|
||||
<meta charset="utf-8">
|
||||
<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/ -->
|
||||
---
|
||||
---
|
||||
<h1 style="text-align: center">Page Not Found</h1>
|
||||
<p style="text-align: center">Sorry, but the page you were trying to view does not exist.</p>
|
||||
|
|
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 {
|
||||
background-color: #003239;
|
||||
color: aqua;
|
||||
}
|
||||
|
||||
.bg-image {
|
||||
/*background-image: url("../HS.png");*/
|
||||
background-image: url("../bg.png"), linear-gradient(to bottom, black, black, #3a3a3a, #009a9a,
|
||||
#727272);
|
||||
background-image: url("../bg.png"), linear-gradient(to bottom, #1d1d1d, #1d1d1d, #243537, #009a9a);
|
||||
/*#727272);*/
|
||||
background-size: cover;
|
||||
filter: blur(8px);
|
||||
filter: blur(16px);
|
||||
height: 100%;
|
||||
position: absolute;
|
||||
top: 0;
|
||||
|
@ -17,3 +18,27 @@ body {
|
|||
margin: 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="">
|
||||
|
||||
<head>
|
||||
<meta charset="utf-8">
|
||||
<title></title>
|
||||
<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">
|
||||
---
|
||||
layout: default
|
||||
title: Hidden Sounds
|
||||
---
|
||||
<h1>Hidden Sounds Unofficial (Fan) Website</h1>
|
||||
<div id="popularSongs">
|
||||
<h2>Popular Songs</h2>
|
||||
<div id="popularContainer">
|
||||
<div class="song">
|
||||
<p><a href="https://spotify.com/">Artist - Title</a></p>
|
||||
</div>
|
||||
{% 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">
|
||||
</div>
|
||||
<div id="hiddenSongs">
|
||||
<h2>Hidden Songs</h2>
|
||||
<div id="hiddenContainer">
|
||||
|
||||
{% for song in site.data.songs %}
|
||||
<div class="song">
|
||||
<p><a href="https://spotify.com/">Artist - Title</a></p>
|
||||
</div>
|
||||
{% endfor %}
|
||||
</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>
|
||||
</div>
|
Loading…
Reference in a new issue