Skip to content

add 14 albums, sort by artist, add artist label #3

New issue

Have a question about this project? Sign up for a free GitHub account to open an issue and contact its maintainers and the community.

Sign up for GitHub

By clicking “Sign up for GitHub”, you agree to our terms of service and privacy statement. We’ll occasionally send you account related emails.

Already on GitHub? Sign in to your account

Merged
jxherc merged 1 commit into from
May 6, 2026
Merged

add 14 albums, sort by artist, add artist label #3

Show file tree
Hide file tree
Changes from all commits
Commits
Show all changes
1 commit
Select commit
File filter

Filter by extension

Filter by extension
Conversations
Failed to load comments.
Loading
Jump to
Jump to file
Failed to load files.
Loading
Diff view
Diff view
2 changes: 1 addition & 1 deletion index.html
View file
Open in desktop
Original file line number Diff line number Diff line change
Expand Up @@ -8,7 +8,7 @@
<link rel="preconnect" href="https://fonts.googleapis.com">
<link rel="preconnect" href="https://fonts.gstatic.com" crossorigin>
<link href="https://fonts.googleapis.com/css2?family=Inter:wght@300;400;500;600&display=swap" rel="stylesheet">
<link rel="stylesheet" href="style.css?v=18">
<link rel="stylesheet" href="style.css?v=19">
<script>const t=localStorage.getItem('theme');if(t)document.documentElement.dataset.theme=t;</script>
<meta property="og:title" content="jxherc">
<meta property="og:description" content="a website">
Expand Down
2 changes: 1 addition & 1 deletion intro.html
View file
Open in desktop
Original file line number Diff line number Diff line change
Expand Up @@ -8,7 +8,7 @@
<link rel="preconnect" href="https://fonts.googleapis.com">
<link rel="preconnect" href="https://fonts.gstatic.com" crossorigin>
<link href="https://fonts.googleapis.com/css2?family=Inter:wght@300;400;500;600&display=swap" rel="stylesheet">
<link rel="stylesheet" href="style.css?v=18">
<link rel="stylesheet" href="style.css?v=19">
<script>const t=localStorage.getItem('theme');if(t)document.documentElement.dataset.theme=t;</script>
<meta property="og:title" content="intro — jxherc">
<meta property="og:description" content="some intro">
Expand Down
50 changes: 37 additions & 13 deletions music.html
View file
Open in desktop
Original file line number Diff line number Diff line change
Expand Up @@ -8,7 +8,7 @@
<link rel="preconnect" href="https://fonts.googleapis.com">
<link rel="preconnect" href="https://fonts.gstatic.com" crossorigin>
<link href="https://fonts.googleapis.com/css2?family=Inter:wght@300;400;500;600&display=swap" rel="stylesheet">
<link rel="stylesheet" href="style.css?v=18">
<link rel="stylesheet" href="style.css?v=19">
<script>const t=localStorage.getItem('theme');if(t)document.documentElement.dataset.theme=t;</script>
<meta property="og:title" content="music — jxherc">
<meta property="og:description" content="some music stats">
Expand Down Expand Up @@ -580,18 +580,41 @@
).join('');

const albums = [
{ title: "my beautiful dark twisted fantasy", file: "mbdtf.jpg", search: "kanye west my beautiful dark twisted fantasy" },
{ title: "smithereens", file: "smithereens.jpg", search: "joji smithereens" },
{ title: "piss in the wind", file: "piss-in-the-wind.jpg", search: "piss in the wind" },
{ title: "gnx", file: "gnx.jpg", search: "kendrick lamar gnx" },
{ title: "damn.", file: "damn.jpg", search: "kendrick lamar damn" },
{ title: "starboy", file: "starboy.jpg", search: "the weeknd starboy" },
{ title: "dawn fm", file: "dawn-fm.jpg", search: "the weeknd dawn fm" },
{ title: "chromakopia", file: "chromakopia.jpg", search: "tyler the creator chromakopia" },
{ title: "don't tap the glass", file: "dttg.jpg", search: "tyler the creator don't tap the glass" },
{ title: "sos", file: "sos.jpg", search: "sza sos" },
{ title: "4 your eyez only", file: "4-your-eyez-only.jpg", search: "j cole 4 your eyez only" },
{ title: "can't rush greatness", file: "cant-rush-greatness.jpg", search: "central cee can't rush greatness" }
// central cee
{ artist: "central cee", title: "can't rush greatness", file: "cant-rush-greatness.jpg", search: "central cee can't rush greatness" },
// frank ocean
{ artist: "frank ocean", title: "blonde", file: "blonde.jpg", search: "frank ocean blonde" },
// j. cole
{ artist: "j. cole", title: "4 your eyez only", file: "4-your-eyez-only.jpg", search: "j cole 4 your eyez only" },
// joji
{ artist: "joji", title: "in tongues", file: "in-tongues.jpg", search: "joji in tongues" },
{ artist: "joji", title: "son of spergy", file: "son-of-spergy.jpg", search: "joji son of spergy" },
{ artist: "joji", title: "ballads 1", file: "ballads-1.jpg", search: "joji ballads 1" },
{ artist: "joji", title: "smithereens", file: "smithereens.jpg", search: "joji smithereens" },
{ artist: "joji", title: "piss in the wind", file: "piss-in-the-wind.jpg", search: "piss in the wind" },
// kanye west
{ artist: "kanye west", title: "the college dropout", file: "college-dropout.jpg", search: "kanye west the college dropout" },
{ artist: "kanye west", title: "late registration", file: "late-registration.jpg", search: "kanye west late registration" },
{ artist: "kanye west", title: "graduation", file: "graduation.jpg", search: "kanye west graduation" },
{ artist: "kanye west", title: "808s & heartbreak", file: "808s-and-heartbreak.jpg", search: "kanye west 808s heartbreak" },
{ artist: "kanye west", title: "my beautiful dark twisted fantasy", file: "mbdtf.jpg", search: "kanye west my beautiful dark twisted fantasy" },
{ artist: "kanye west", title: "yeezus", file: "yeezus.jpg", search: "kanye west yeezus" },
{ artist: "kanye west", title: "the life of pablo", file: "life-of-pablo.jpg", search: "kanye west the life of pablo" },
// kendrick lamar
{ artist: "kendrick lamar", title: "damn.", file: "damn.jpg", search: "kendrick lamar damn" },
{ artist: "kendrick lamar", title: "gnx", file: "gnx.jpg", search: "kendrick lamar gnx" },
// sza
{ artist: "sza", title: "sos", file: "sos.jpg", search: "sza sos" },
// the weeknd
{ artist: "the weeknd", title: "starboy", file: "starboy.jpg", search: "the weeknd starboy" },
{ artist: "the weeknd", title: "after hours", file: "after-hours.jpg", search: "the weeknd after hours" },
{ artist: "the weeknd", title: "dawn fm", file: "dawn-fm.jpg", search: "the weeknd dawn fm" },
{ artist: "the weeknd", title: "hurry up tomorrow", file: "hurry-up-tomorrow.jpg", search: "the weeknd hurry up tomorrow" },
// tyler, the creator
{ artist: "tyler, the creator", title: "flower boy", file: "flower-boy.jpg", search: "tyler the creator flower boy" },
{ artist: "tyler, the creator", title: "igor", file: "igor.jpg", search: "tyler the creator igor" },
{ artist: "tyler, the creator", title: "chromakopia", file: "chromakopia.jpg", search: "tyler the creator chromakopia" },
{ artist: "tyler, the creator", title: "don't tap the glass", file: "dttg.jpg", search: "tyler the creator don't tap the glass" },
];
document.getElementById('albums').innerHTML = albums.map(a => `
<a class="album" href="https://music.apple.com/ca/search?term=${encodeURIComponent(a.search)}" target="_blank" rel="noopener">
Expand All @@ -602,6 +625,7 @@
onerror="this.style.display='none';" />
</div>
<div class="title">${a.title}</div>
<div class="artist">${a.artist}</div>
</a>
`).join('');

Expand Down
1 change: 1 addition & 0 deletions style.css
View file
Open in desktop
Original file line number Diff line number Diff line change
Expand Up @@ -411,6 +411,7 @@ a.kv-row:hover .arrow { transform: translate(3px, -3px); color: var(--muted); }
}
.album:hover .cover { transform: translateY(-2px); }
.album .title { font-size: 0.68rem; color: var(--text); line-height: 1.3; }
.album .artist { font-size: 0.62rem; color: var(--muted); line-height: 1.2; margin-top: -0.2rem; }

.note { font-size: 0.75rem; color: var(--muted); font-style: italic; line-height: 1.55; }

Expand Down
Loading